Ah, JavaScript, the mysterious beast. Letâs unpack what it is and isnât, because the front-end can barely exist without it, and the back-end loves it.
JavaScript can run both client- and server-side, which inherently means that the use cases for using JavaScript versus Python will vary. From humble beginnings, JavaScript, with its quirks, strengths, and limitations, is now one of the main pillars of the interactive web as we know it, from powering rich frontend interactions, to web servers. How did it become one of the most important ubiquitous technologies of the web? In order to grasp JavaScript's powerful ability to add functionality to both the front- and backends, we first need an understanding of what the frontend isâand what it isn't. Having an understanding of JavaScript's origins helps to clarify the "why" of JavaScript, so let's take a look.
The following topics will be covered in this chapter:
- The National Center for Supercomputing Applications (NCSA) and the need for interactivity
- Early web browsers and a 10-day prototype
- Enter Ecma International
- HTML, CSS, and JavaScriptâthe best friends of the frontend
- How JavaScript fits into the frontend ecosystem
Technical requirements
You can find the code files present in this chapter on GitHub at https://github.com/PacktPublishing/Hands-on-JavaScript-for-Python-Developers.
NCSA and the need for interactivity
The early internet was a fairly boring place compared with the rich medium we now have in the 21st century. Without graphical browsers and only fairly rudimentary (and esoteric) commands, early adopters were able to do only certain academic tasks for a period of time. Starting from ARPANET (the Advanced Research Projects Agency Network), it was designed to facilitate basic communication and file transfers by being one of the first packet-switching networks. Additionally, it was the first network to implement the Transmission Control Protocol/Internet Protocol (TCP/IP) suite, which we now take for granted as it runs behind the scenes of all modern web applications.
Why is this significant? The early internet was designed for fundamental and simple purposes, but it has grown since then. As a Python developer, you already understand the power of the modern web, so a full history of the web isn't needed. Let's skip to the origins of what we now know as the frontend.
Enter Tim Berners-Lee in 1990: the invention of the World Wide Web. By building the first web browser himself and with the European Organization for Nuclear Research (known as CERN) creating the first website, the floodgates opened and the world was never the same. What started as academic tinkering has now become a global necessity, with millions of people around the globe relying on the web. It goes without saying that today, in the 21st century, we use the web and multiple forms of digital communication to go about our everyday lives.
One of the projects that Berners-Lee created was HTMLâHypertext Markup Language. As the backbone of a website, this basic markup language spawned significant growth and development in the computing community. It only took a few years (the year was 1993, to be precise) for Mosaic, the first iteration of what we now call a browser, to be released. It was developed by the NCSA at the University of Illinois at Urbana-Champaign and was a vital part of the web's development.
Early web browsers and a 10-day prototype
So, why JavaScript? Obviously, the web needed more than just static data to be useful, so, in 1995, Brendan Eich at Netscape Communications came along. Originally, the idea wasn't to create a whole new language but rather to incorporate Scheme into Netscape. That idea was superseded by the work Sun Microsystems did with Java. It was decided that this language that Eich was creating would be somewhat Java-like, and not Scheme at all. The genesis of the idea came from Marc Andreessen, the founder of Netscape Communications. He felt there needed to be a language to combine HTML with a "glue language" that helped with images, plugins, andâyesâinteractivity.
Eich created a prototype of JavaScript (originally called Mocha, and then LiveScript) in 10 days. It's hard to believe that a 10-day prototype has become such a crucial part of the web, but those are the facts as history records them. Once Netscape developed a production-ready version, JavaScript shipped with Netscape Navigator in 1995. Shortly after JavaScript was released, Microsoft created its own version of JavaScript, called (unceremoniously) JScript. JScript shipped with Microsoft's Internet Explorer 3.0 in 1996.
Now, there were two technologies competing for the same space. JScript was reverse-engineered from Netscape's JavaScript, but since the two flavors of the language had their own quirks, the browser wars began, leading sites to often have a label "Best viewed in Netscape Navigator" or "Best viewed in Internet Explorer", due to the technological complexities involved in supporting both technologies on one site. A portent of things to come, the differences in the early versions only increased. Some websites would work flawlessly in one browser and break horrifically in the otherânot to mention the complications caused by other competitors to both Netscape's and Microsoft's browsers! Early developers also found the differences between the two technologies only fueled the arms race. If you experienced such degradation of performance (or, even worse, you were working with JavaScript in the early days, like me), you definitely felt the pain of the competing versions. Each company, as well as other third parties, raced to create the next best JavaScript release. At its core, JavaScript has to be interpreted client-side, and the differences between the browsers led to bedlam. Something had to be done, and Netscape had a solution, though it wouldn't be perfect.
We'll learn about this solution in the next section.
Enter Ecma International
The European Computer Manufacturers Association (ECMA) changed its name in 1994, becoming Ecma International, to reflect its refined purpose. As a standards organization, its purpose is to facilitate modernization and consistency for various technologies. Partly in response to Microsoft's work, Netscape approached Ecma International in 1996 to standardize the language.
JavaScript became documented in the ECMA-262 specification. You may have seen the term ECMAScript or "ECMAScript-based languages". There are more ECMAScript languages than just JavaScript! ActionScript is another ECMAScript-based language that follows similar conventions to JavaScript. With the downfall of Flash as a web technology, we don't see ActionScript much in practice anymore save for a few discrete uses, but the fact remains: Ecma International created standards and they have been used to create different technologies, which helped ease the browser warsâfor a time.
Perhaps the most interesting part of Ecma International with regard to JavaScript is the various versions that have been codified. To date, there are nine versions, all with varying differences. We will be using ECMAScript 2015 (also known as ES6) throughout this book, as it is the most stable baseline for web development work today. Features of the 2016-2018 versions can be used by some browsers and will be introduced.
HTML, CSS, and JavaScript â the best friends of the frontend
Powering every modern website or web application are, at a minimum, three technologies: HTML, Cascading Style Sheets (CSS), and JavaScript. They are the "best friends" of the frontend, and are illu...