Use Cases of JavaScript

Mohammed Abdul Basith
9 min readAug 20, 2021

๐–๐ก๐š๐ญ ๐ข๐ฌ ๐‰๐š๐ฏ๐š ๐’๐œ๐ซ๐ข๐ฉ๐ญ ?

JavaScript is a high-level programming language that is used widely in the modern web. It is a client-side as well as a server-side language. It has a vast amount of features like dynamic programming, prototype-based object-orientation, and first-class functions. The majority of the web sites in the modern world are developed using javascript and the major web browsers use the javascript engine to execute it.

Javascript helps in creating interactive web pages. It supports event-driven, functional, object-oriented, and prototype-based programming styles. Javascript greatly helps in DOM manipulation. It has flexible APIs for working with a variety of data types like strings, dates, arrays, regular expressions, etc. Syntax of javascript is also very simple and easy to learn. But donโ€™t mistake javascript for java. Although, their names sound similar and their syntax is also quite similar, but they greatly differ in design.

Many famous javascript frameworks like AngularJS are used for developing single-page websites. Powerful Javascript libraries like ReactJS are useful while developing not only single page websites, but mobile applications also. Javascript has an important part in modern web development.

๐‡๐ข๐ฌ๐ญ๐จ๐ซ๐ฒ ๐จ๐Ÿ ๐‰๐š๐ฏ๐š ๐’๐œ๐ซ๐ข๐ฉ๐ญ

Javascript was created by Brendan Eich in 1995 while he was working at Netscape Communications. The web was young at that time. The mosaic browser came out as the first popular web browser. The same people who worked in the development of NCSAโ€™s Mosaic browser were now working with Netscape communication. They were building their own browser, the Netscape communicator. With more independence and money, they started working on the expansion of the web that gave birth to javascript.

It was realized that the web needed to be more dynamic and the future web should have animations, interactions, and other automation. It could all be done by DOM interaction and for DOM interaction, a scripting language was needed. But java was on the rise at that time. This new scripting language does not need to target big-shot developers. The web was purely static at that time. HTML was also young at that time and it didnโ€™t need big-shot developers. So the people at Netscape decided, a simple scripting language can be helpful for making the web dynamic that even the non-developers could use. Then, the idea of Mocha was born.

๐…๐ž๐š๐ญ๐ฎ๐ซ๐ž๐ฌ ๐จ๐Ÿ ๐‰๐š๐ฏ๐š๐’๐œ๐ซ๐ข๐ฉ๐ญ

There are following features of JavaScript:

  1. All popular web browsers support JavaScript as they provide built-in execution environments.
  2. JavaScript follows the syntax and structure of the C programming language. Thus, it is a structured programming language.
  3. JavaScript is a weakly typed language, where certain types are implicitly cast (depending on the operation).
  4. JavaScript is an object-oriented programming language that uses prototypes rather than using classes for inheritance.
  5. It is a light-weighted and interpreted language.
  6. It is a case-sensitive language.
  7. JavaScript is supportable in several operating systems including, Windows, macOS, etc.
  8. It provides good control to the users over the web browsers.

๐€๐๐ฏ๐š๐ง๐ญ๐š๐ ๐ž๐ฌ ๐จ๐Ÿ ๐‰๐š๐ฏ๐š๐’๐œ๐ซ๐ข๐ฉ๐ญ

The merits of using JavaScript are โˆ’

  • Less server interaction โˆ’ You can validate user input before sending the page off to the server. This saves server traffic, which means less load on your server.
  • Immediate feedback to the visitors โˆ’ They donโ€™t have to wait for a page reload to see if they have forgotten to enter something.
  • Increased interactivity โˆ’ You can create interfaces that react when the user hovers over them with a mouse or activates them via the keyboard.
  • Richer interfaces โˆ’ You can use JavaScript to include such items as drag-and-drop components and sliders to give a Rich Interface to your site visitors.

๐‹๐ข๐ฆ๐ข๐ญ๐š๐ญ๐ข๐จ๐ง๐ฌ ๐จ๐Ÿ ๐‰๐š๐ฏ๐š๐’๐œ๐ซ๐ข๐ฉ๐ญ

We cannot treat JavaScript as a full-fledged programming language. It lacks the following important features โˆ’

  • Client-side JavaScript does not allow the reading or writing of files. This has been kept for security reason.
  • JavaScript cannot be used for networking applications because there is no such support available.
  • JavaScript doesnโ€™t have any multi-threading or multiprocessor capabilities.

Once again, JavaScript is a lightweight, interpreted programming language that allows you to build interactivity into otherwise static HTML pages.

๐‰๐š๐ฏ๐š๐’๐œ๐ซ๐ข๐ฉ๐ญ ๐ƒ๐ž๐ฏ๐ž๐ฅ๐จ๐ฉ๐ฆ๐ž๐ง๐ญ ๐“๐จ๐จ๐ฅ๐ฌ

One of major strengths of JavaScript is that it does not require expensive development tools. You can start with a simple text editor such as Notepad. Since it is an interpreted language inside the context of a web browser, you donโ€™t even need to buy a compiler.

To make our life simpler, various vendors have come up with very nice JavaScript editing tools. Some of them are listed here โˆ’

  • Microsoft FrontPage โˆ’ Microsoft has developed a popular HTML editor called FrontPage. FrontPage also provides web developers with a number of JavaScript tools to assist in the creation of interactive websites.
  • Macromedia Dreamweaver MX โˆ’ Macromedia Dreamweaver MX is a very popular HTML and JavaScript editor in the professional web development crowd. It provides several handy prebuilt JavaScript components, integrates well with databases, and conforms to new standards such as XHTML and XML.
  • Macromedia HomeSite 5 โˆ’ HomeSite 5 is a well-liked HTML and JavaScript editor from Macromedia that can be used to manage personal websites effectively.

CASE STUDY : eBay

Ebay, a multinational e-commerce company, has always been open to new technologies. With about 170 million active users, the company settled on Node.js for two prime reasons: they needed an application as real-time as possible to maintain live connections with the server and a solution that could orchestrate a huge number of eBay-specific services that display information on the page. Here is where JavaScript appeared to be a perfect fit. Now the company is transitioning to full-featured stack on Nodeโ€ค

How eBay Built their First JavaScript Application

For the most part, eBay runs on a Java-based tech stack. Their entire workflow centers around Java and the JVM. Considering the scale of traffic and the stability required by a site like ebay.com, using a proven technology was an obvious choice. But they have always been open to new technologies, and JavaScript has been topping the list of candidates for quite some time.

Scalability

It all started when a bunch of eBay engineers (Steven, Venkat, and Senthil) wanted to bring an eBay Hackathon-winning project called โ€œTalkโ€ to production. When they found that Java did not seem to fit the project requirements (no offense), they began exploring the world of JS. Today, they have a full JavaScript production stack ready to rock.

They had two primary requirements for the project. First was to make the application as real time as possible-i.e., maintain live connections with the server. Second was to orchestrate a huge number of eBay-specific services that display information on the page-i.e., handle I/O-bound operations. They had started with the basic Java infrastructure, but it consumed many more resources than expected, raising questions about scalability for production. These concerns led them to build a new mid-tier orchestrator from scratch, and they found JS to be a perfect fit.

Mindset

Since eBay revolves around Java and since Java is a strongly typed static language, initially it was very difficult to convince folks to use JavaScript on the backend. The numerous questions involved ensuring type safety, handling errors, scaling, etc. In addition, JavaScript itself (being the worldโ€™s most misunderstood language) further fueled the debate. To address concerns, they created an internal wiki and invited engineers to express their questions, concerns, doubts, or anything else about JS.

Within a couple of days, they had an exhaustive list to work on. As expected, the most common questions had centered around the reliability of the stack and the efficiency of JS in handling eBay-specific functionality previously implemented in Java. They answered each one of the questions, providing details with real-world examples. At times this exercise was eye-opening even for them, as they had never considered the angle that some of the questions presented. By the end of the exercise, people understood the core value of JS; indeed, some of the con arguments proved to be part of the beauty of the language. Once they had passed the test of their peersโ€™ scrutiny, and they were all clear to roll.

Startup

They said:- โ€œWe started from a clean slate. Our idea was to build a bare minimum boilerplate Node.js server that scales; we did not want to bloat the application by introducing a proprietary framework. The first four node modules we added as dependencies were express, cluster, request, and async. For data persistence, we decided on MongoDB, to leverage its ease of use as well as its existing infrastructure at eBay. With this basic setup, we were able to get the server up and running on our developer boxes. The server accepted requests, orchestrated a few eBay APIs, and persisted some data.โ€

For end-to-end testing, they configured their frontend servers to point to the Node.js server, and things seemed to work fine. Now it was time for them to get more serious. They started white-boarding all of their use cases, nailed down the REST end points, designed the data model and schema, identified the best node modules for the job, and started implementing each end point. The next few weeks they were heads down โ€” coding, coding, and coding.

Deployment

Once the application reached a stable point, it was time for them to move from a developer instance to a staging environment. This is when they started looking into deployment of the Node.js stack. Their objectives for deployment were simple: Automate the process, build once, and deploy everywhere. This is how Java deployment works, and they wanted JavaScript deployment to be as seamless and easy as possible.

They were able to leverage their existing cloud-based deployment system. All they needed to do was write a shell script and run it through their Hudson CI job. Whenever code is checked in to the master branch, the Hudson CI job kicks off. Using the shell script, this job builds and packages the Node.js bundle, then pushes it to the deployment cloud. The cloud portal provides an easy user interface to choose the environment (QA, staging, or pre-production) and activate the application on the associated machines.

Now they had their Node.js web service running in various stable environments. This whole deployment setup was quicker and simpler than they had expected.

Monitoring

At eBay, they had logging APIs that are well integrated with the Java thread model as well as at the JVM level. An excellent monitoring dashboard built on top of the log data can generate reports, along with real-time alerts if anything goes wrong. Then they had achieved similar monitoring for the JavaScript stack by hooking into the centralized logging system. Fortunately, they had logging APIs to consume. They developed a logger module and implemented three different logging APIs:

  1. Code-level logging: This level includes logging of errors/exceptions, DB queries, HTTP service calls, transaction metadata, etc.
  2. Machine-level logging: This level includes heartbeat data about CPU/memory and other OS statistics. Machine-level logging occurs at the cluster module level; we extended the npm cluster module and created an eBay-specific version.
  3. Logging at the load balancer level: All Node.js production machines are behind a load balancer, which sends periodic signals to the machines and ensures they are in good health. In the case of a machine going down, the load balancer fails-over to a backup machine and sends alerts to the operations and engineering teams.

They made sure the log data formats exactly matched the Java-based logs, thus generating the same dashboards and reports that everyone is familiar with.

One particular logging challenge they faced was due to the โ€œasynchronous natureโ€ of the Node.js event loop. The result was that the logging of transactions was completely crossed. To understand the problem, letโ€™s consider the following use case: The Node process starts a URL transaction and issues a DB query with an async callback. The process will now proceed with the next request, before the DB transaction finishes. This being a normal scenario in any event loop-based model like Node.js, the logs are crossed between multiple URL transactions, and the reporting tool shows scrambled output. And, they had worked out both short-term and long-term resolutions for this issue.

Conclusion

With all of the above work completed, they are ready to go live with their โ€œHackathon projectโ€. This is indeed the first eBay application to have a backend service running on JavaScript. Theyโ€™ve already had an internal employee-only launch, and the feedback was very positive-particularly on the performance side. Exciting times are ahead!

There was a big shout-out to their in-house Node.js expert Cylus Penkar, for his guidance and contributions throughout the project. With the success of the Node.js backend stack, eBayโ€™s platform team is now developing a full-fledged frontend stack running on Node.js. The stack will leverage most of their implementation, in addition to frontend-specific features like L10N, management of resources (JS/CSS/images), and tracking. For frontend engineers, this is a dream come true; and they proudly said, โ€œJavaScript is EVERYWHERE.โ€

Thank you for readingโ€ฆ

#worldrecordholder hashtag#training hashtag#internship hashtag#makingindiafutureready hashtag#summer hashtag#summertraining hashtag#python hashtag#javascript hashtag#docker hashtag#rightmentor hashtag#deepknowledge hashtag#linuxworld hashtag#vimaldaga hashtag#righteducation

--

--