The World Wide Web was created in 1990 by Sir Tim Berners-Lee (Figure 1). This was the first Web browser and worked only on the proprietary software of NeXT computers, which were in limited use then.
Line Mode browser
The Line Mode browser was the second Web browser ever created. It was the first to be portable to several different operating systems. Being operated from a simple command-line interface, it could be widely used on many computers and computer terminals throughout the Internet, as seen in Figure 2.
Mosaic Web browser
The Mosaic Web browser was released in 1993, as the first browser with a graphical user interface accessible to non-technical people (Figure 3). It played a prominent role in the rapid growth of the nascent World Wide Web.
How does a Web browser work?
A Web browser is a client program that allows clients and servers to communicate with each other. When the Web address or uniform resource locator (URL) in your browser is given, the Web browser actually sends an HTTP command to the Web server, directing it to fetch and transmit the requested Web page and display the information needed on the browser.
To display the Web page on the screen of the browser, a group of structured codes (as shown in Figure 4) is needed to work together and perform a series of tasks.
Let us look at a few aspects of the Web browser.
1. User interface: Input given to the browser such as URL, Next, Back, etc.
2. Browser engine: Based on the input from the user interface, it queries and manipulates the rendering engine.
3. Rendering engine: Interprets the HTML, XML documents and images that are formatted using cascading style sheets (CSS), and generates the layout that is displayed in the user interface.
4. Networking: Retrieves the URLs using the common Internet protocols of HTTP or FTP.
6. UI backend: User interface backend is used for drawing basic widgets like combo boxes and windows. This backend exposes a generic interface that is not platform-specific. It uses operating system user interface methods underneath.
7. Data persistence/storage: This is a persistence layer. Browsers support storage mechanisms such as localStorage, IndexedDB, WebSQL and FileSystem. It is a small database created on the local drive of the computer where the browser is installed. It manages user data such as cache, cookies, bookmarks and preferences.
It is important to note that all Web browsers are not created equal; hence, their respective displays will be different.
By 1959, the growing use of computers, built by several different manufacturers, showed the necessity for standardisation in operation techniques, such as programming, and also input and output codes. Such standards would make it possible to use data prepared for a computer made by one manufacturer on a computer made by another with minimum changes. Also, it would avoid duplication of work in the preparation of, for example, programming languages by several manufacturers.
In a meeting held on April 27, 1960, in Brussels, it was decided that an association of manufacturers will be formed, called the European Computer Manufacturers Association or ECMA. A committee was nominated to prepare the formation of the association, and draw up bylaws and rules.
What is a Web server?
We get so much information from the Internet. But who provides this and how? Well, all this work is done by the Web server. These are basically simple computer programs, which handle the requests sent by different clients. The server will respond to each client by fetching details from either one of the following:
- Another server
- File server
- Computation in the Web server – could be a CPU-intensive job
Let’s take an example. We have a server that shows the current state of users affected by Covid-19 in each country. Several users or clients may request for this information at the same time. If these requests are handled serially, the users will have to wait for a very long time. Traditional Web servers like Apache and Tomcat have fork/thread mechanisms, which help to seamlessly handle many requests at the same time. Around 200+ requests can be handled in parallel from a single Web server. The requests can scale up or down based on the server configuration.
What is Node.js?
How does Node.js work?
When we have the Node.js Web server running, we also have to accept multiple clients, right? But Node.js is single-threaded, which means only one request can be handled at a time. So how do we handle multiple requests? To do so, Node.js uses two concepts.
- Non-blocking IO: From the client the request hits the Web server and then reaches the database. To fetch results it takes X amount of time. Rather than waiting idly, Web servers go and accept another client who has sent a request.
- Asynchronous: Once a client completes reading from the database, it makes a call back to the server saying it’s ready, and to send its output to the client. Figure 5 shows how this is done.
libuv is a multi-platform, C++ library that provides support for asynchronous I/O based operations such as file systems, networking and concurrency.
Node.js is best used for IO intensive workloads.
A library offers a function to be called by its parent code, whereas a framework defines the entire application design. A developer does not call a framework; instead, the framework calls and uses the code in some particular way. Example frameworks are AngularJS, Ember.js, Metero.js, Vue.js, etc.
Table 1 compares the features of two popular frameworks backed by giant names.
|Data binding||Two-way data binding||One-way data binding|
|Dependencies||Manages dependencies automatically||Requires additional tools to manage dependencies|
|Suited for||Best for SPAs that update a single view at a time|
Transpilers, or source-to-source compilers, are tools that read source code written in one programming language, and produce the equivalent code in another language.
But now we can write our source in the latest ECMA standards, and let a transpiler translate it to an older version such as vanilla ES5 that works in every browser. If you need to support browsers from the last millennium, you can even compile down to ES3.