How JavaScript Became the Dominant Language of the Web
By: Charles Punchatz
Tags: JavaScript, Front End Development, Javascript Frameworks, Web Development, Coding

JavaScript wasn’t always a popular language. It has been dismissed by developers as amateurish — it was, after all, tailored for designers, content creators, and part-time programmers. It has been lampooned and lambasted — from its spotty and buggy implementation early on to the countless lines of code that have been written to overcome flaws within the language. Yet, according to the StackOverflow’s Developer Survey, JavaScript has been the most commonly used programming language over the last five years. And it’s popularity is growing.

Amongst programmers surveyed, 62.5 percent used JavaScript. That’s up from 55 percent in 2016 and 54.4 percent in 2015. So why has JavaScript surpassed other popular non-query languages such as Java, C#, PHP, and Python, even eclipsing SQL in 2014 with no signs of slowing down? Is its rising popularity only a result of necessity?

New Kid on the Block

Back in the early 90s, animations, interactions, and other forms of small automation were envisioned as part of the “web of the future.” Marc Andreessen, founder of Netscape Communications, believed that, as such, a small scripting language was needed that could interact with the DOM (Document Object Model or computer programming interface for HTML and XML documents), making content more dynamic and interactive. The trick was that this scripting language shouldn’t be targeted to brainy developers and people with experience in software engineering, the scripting language was to cater to a different audience: designers. HTML was still young and simple enough for non-developers to pick up, so whatever was to be part of the browser needed to be simple, flexible, and accessible to people less specialized — a network administrator, for example, tasked to write scripts part time. So, the idea of JavaScript was born.

Contracted by Netscape Communications, Brendan Eich set out to write a prototype of new this language. In May of 1995 — in just 10 days — JavaScript, then known as Moca, was completed. It saw it’s official release in March of 1996, garnering much attention from the development community. With JavaScript, developers now had the ability to go beyond plain HTML. With a bit of code a site could now move or change colors, it could respond to user input, it could even make new windows pop up.

Standardization and Implementation

Following this release, JavaScript was taken to Ecma International, an association formed in 1961 with the purpose of standardization of communication and information systems, to create a standard specification, which could be implemented across all other browsers. This was an important step in the growth of the language, opening the door for a wider audience, giving implementors a voice in its maturation, and keeping implementation in check — early on there was fear that other implementations may stray too far and cause fragmentation. Officially known as ECMAScript — JavaScript could not be used as it is a trademark of Oracle Corporation — the standard (ECMA-262) was adopted in 1997. ECMAScript 3, the basis for modern day JavaScript was released in 1999.

Work on ECMAScript 4 began almost immediately after the release of version 3, ushering in a divisive and combative period for JavaScript. Many new features were proposed, though by 2003, interest had begun to dwindle and work had stopped on version 4. While Macromedia (since acquired by Adobe) and Microsoft had used this newer version of the standard in their implementations — ActionScript (the basis for Flash) and JScript respectively — it wasn’t until 2005, with the introduction of AJAX (see below), that interest was revived and work on ECMAScript 4 resumed in the form of a committee comprising Adobe, Microsoft, Mozilla, and, albeit unofficially, Opera. After many features had been decided, Yahoo joined the committee, sending JavaScript developer Doug Crockford as their representative. Crockford voiced many concerns with the new standards which garnered the support of Microsoft. This lead to Microsoft refusing to accept any part of the ECMAScript 4 standard, even threatening legal action, and prevented it from moving forward.

Eventually Crockford proposed the idea of a simpler standard in the form of ECMAScript 3.1. The JavaScript community followed suit, focusing on the 3.1 standard and scrapping eight years of work on ECMAScript 4. Approved in 2009, ECMAScript 3.1 was renamed ECMAScript 5 — in order to avoid confusion as version 4 had already been implemented in various forms — and became the most supported version of JavaScript seeing implementation in Firefox 4 in 2011, and Chrome 16, Internet Explorer 10, Opera 12.10, and Safari 6 in 2012.

Open Source Resurgence

Determined to push the boundaries of what was possible, several advancements were made within open source and development communities during this tumultuous period. These projects helped shape the landscape of JavaScript within the development communities.

AJAX

In early days of the web, sites relied entirely on complete HTML pages. This meant that any action a user took required a full refresh of content, meaning the HTML for the entire page needed to be reloaded from the server, even for a partial change. Inefficient from a user experience standpoint, Microsoft released the first implementation of the iframe tag, or inline frame in Internet Explorer in 1996 in order to load content asynchronously. An iframe is an HTML document within another HTML document.

In 1999, Microsoft began using its iframe technology to dynamically update news stories and stock quotes on the default page for Internet Explorer. Additionally, Microsoft’s Outlook Web App developers implemented the first XMLHTTP — an application programming interface (API) for transferring data between a web browser and a server — script, which was later implemented by Firefox, Safari, and Opera as the XMLHttpRequest JavaScript object. In short, this allowed HTTP requests, a protocol in which a browser sends a request for information to a server and receives a response from that server, to be performed in the background without requiring a full reload of an already rendered HTML page.

While this technology remained relatively unused, it began to see larger implementation through online applications such as Outlook Web App (2000), Gmail (2004), and Kayak.com’s (2004) public beta release.

This culminated in 2005 with the release of an article entitled “AJAX: A New Approach to Web Applications,” by user experience designer Jesse James Garret. In this article, Garret coined the term AJAX (asynchronous JavaScript and XML) to describe these technologies and laid out techniques for creating web applications, heavily utilizing JavaScript, in which data could now be loaded in the background without the need for full page reloads.

Early Extenders

The increased possibilities as a result of AJAX lead to the newfound interest in JavaScript resulting in the creation of several popular open source frameworks and libraries in order to help facilitate and speed development of these kinds of web applications. These include Prototype, MooTools, Dojo, and jQuery.

So what’s a framework? A framework is a comprehensive piece of reusable software that provides a standard way to build and deploy applications. Thus, with a framework, the control flow of the application is dictated by the framework and not the developer (inversion of control). On the flip-side, a library is simply a collection of related reusable resources — i.e. functions to help perform a specific task, like making an AJAX request — leaving the developer in control.

MooTools

Taking cues from base2, a library built to “iron out” differences in JavaScript implementations, and Prototype, a framework designed to extend many of JavaScript’s native objects, My Object-Oriented Tools or “MooTools” was released in 2006. Developed by Valerio Proietti, MooTools sought to create a framework which allowed for greater control of the DOM and extend JavaScript’s core functionality, while allowing for flexible, reusable code and cross-browser compatability. Whereas jQuery’s (see below) primary concern was with the DOM, MooTools was designed to expand the language, enhancing Array, Element, Function, Number, and String objects as well.

jQuery

Released in 2006 and created by John Resig, the most popular and widely deployed of these libraries, jQuery sought to simplify the development of AJAX applications, as well as ease traversing and manipulation of the DOM, event handling, and the creation of animations, all while eliminating cross-browser incompatibilities and encouraging easier-to-read, shorter code. Additionally, jQuery promotes the separation of concerns design principle by providing a simple syntax to add event handlers to the DOM. This allows developers to use JavaScript, rather than HTML event attributes to call functions, enabling the separation of JavaScript from HTML.

Due to jQuery’s ease of use — jQuery simplifies JavaScript so much so that a developer doesn’t need a solid working knowledge of JavaScript to get the desired results — it quickly rose to prominence and is currently run on 72 percent of all websites. By contrast, the aforementioned MooTools is run only on 3 percent of all sites. This has lead to widespread debate over whether budding developers should forgo learning JavaScript all together and focus instead solely on jQuery.

A Full-Stack Solution

With both the expansion of the language, through frameworks like Prototype and MooTools, and the boom in popularity, thanks to jQuery, came the creation of more and more JavaScript driven projects. This was exacerbated by Google’s release of the Chrome browser in 2008. In this new browser, Google included a faster JavaScript engine called V8, stating that this was in order “to power the next generation of web applications that aren’t even possible in today’s browsers.”

This culminated in Twitter redesigning their site in 2010. As part of the redesign, Twitter overhauled their existing architecture, opting for an almost completely JavaScript solution. Powered by a combination of jQuery, the templating engine Mustache, Twitter’s own JavaScript API, and several other open source solutions working in tandem with their REST API (an API that uses HTTP requests to create, fetch, update, and delete data) were able to render their site almost exclusively in the browser with JavaScript — an unprecedented feat at the time. While this was fraught with performance issues, ultimately resulting in another redesign in 2012 — which, though still utilizing a mainly JavaScript solution moved much of the client side (in the browser) rendering to the server — it broke new ground in what could be done with JavaScript.

Server Side JavaScript

Though not the first server side JavaScript environment — Netscape’s Livewire Pro Web beat it by 13 years — Node.js was created in 2009 by Ryan Dahl. This enabled JavaScript — traditionally a client side language — to be utilized for server side scripting and led to the “JavaScript everywhere” movement, allowing developers to utilize a single programming language to build a web application, rather than rely on a different language for creating server side scripts.

Single Page Applications

Built with Node.js, Airbnb launched a site in 2013 becoming the first to utilize isomorphic JavaScript. This approach allows code to be executed on the server-side and rendered in the browser, with subsequent actions being handled by the exact same code client-side. This differs from a more traditional approach where one language is used to render code server-side (Java, PHP, Python, etc.) with client-side changes being made with JavaScript.

The advantage of this approach being that the browser is provided with all of the necessary code on initial page load, loading any other resources dynamically, without the need reload or navigate to a different page. Because the application is executed the same way both server- and client-side it is more manageable and debuggable as the difference between the server-side and client-side code is not the language or templating system used, but rather what and how data is provided.

Libraries and Frameworks

As with jQuery and MooTools (see above), many open-source solutions came about to aid developers in the creation of these single page applications. Over the course of a few years, these frameworks have lead to heightened interest in single page applications and JavaScript in general. These frameworks include AngularJS (2010) (completely rewritten as Angular in 2016), Backbone.js (2010), Ember.js (2011), React (2013) and Vue.js (2013). It is worth noting that while many of these and previous frameworks and libraries were developed by independently, major internet based corporations have been involved in the advancement of these single page applications through the open source community, with Google developing Angular and Facebook and Instagram creating React.

Where Does That Leave Us?

From its humble roots, JavaScript provided developers with a new way for users to interact with websites. Since its standardization and cross browser implementation, the popularity of the language has grown immensely. Much of its popularity is thanks to circumstance. The web is the most popular platform for application development with JavaScript now playing a vital role in that. Whether it is used as a utility language, simply triggering a pop-up window or navigation menu, or as the dominant language to render a single page application, if something renders in the browser, JavaScript is practically a necessity in a developer’s technology stack.

While much of that popularity is because it’s a utility language, its recent growth is due largely to the fact that its capabilities have exceeded this purpose. With JavaScript developers can now mimic the experience of desktop applications through single page applications while using only one language on both the client- and server-side. Additionally, thanks to its wide implementation, JavaScript is starting to move away from the browser.

While native mobile applications are still the norm, the challenge arises when multiple platforms like iOS and Android need to be supported. iOS development requires a developer to use the Swift programming language, while Android development requires Java. This causes redundant work that can double the cost of development as programmers need to code for both environments. JavaScript has begun to solve this problem, allowing programmers to create applications for both platforms. Though, this is still in its infancy, libraries like React Native are gaining traction. Additionally, JavaScript is being used in desktop applications with things like Apple Music, a component of iTunes, being built using Ember.js.

Thanks to this versatility, JavaScript is being adopted by more and more developers as a solution to more and more problems, causing the language to grow in both popularity and application.