Uses, Applications and Implications of Client-side Scripting

Client-side script is code which runs in the context of the local user, within their browser.

For classification purposes, HTML and CSS are not programming languages, as they do not allow for the use of variables, decisions or iteration.

All modern browsers implement a language called JavaScript. This is an interpreted language, meaning that it requires a JavaScript interpreter. An interpreter reads the instructions in the source language, and converts this into instructions that can be run on the host machine. Use of JavaScript in this page refers to client-side scripting.

This is fundamental to the use of JavaScript: as there are so many different varieties of machine that can access web pages, it would be impractical to have code written for every type of architecture and operating system. The fact that JavaScript is interpreted means that one codebase can be used on any device, supporting JavaScript.

Uses of JavaScript

Broadly speaking, JavaScript is used in two scenarios.

Manipulating the DOM/BOM

The Document Object Model is a hierarchical representation of the webpage. It contains a body, which contains other elements – paragraphs, lists and so on.

Through JavaScript it is possible to manipulate the contents of these elements within the browser. For example, you can alter the coordinates of an element to create a scrolling effect. Or, you can alter the colour of elements depending on the value entered into them – think of validation: when you are asked to enter a password and it must satisfy complexity requirements, these fields often update in real-time to show whether or not the password meets the requirements. This is done without having to submit the data to the web server and await a response.

JavaScript is used in a similar way, on a larger scale, to create dynamic applications that run inside a browser: the interface can react to the user’s input without having to reload a new page, enabling a whole generation of web applications.

Performing HTTP Requests Asynchronously

A synchronous method is one that causes an application to be blocked (frozen) until a response is received. An asynchronous method is one that does not cause an application to freeze whilst it awaits a response: when the response is available, an event is raised allowing the application to deal with the response.

This has given rise to a method of web development called AJAX (Asynchronous JavaScript and XML) which allows web pages to submit data and receive responses without introducing freezes. For example, when you type in your shipping address on a checkout page, some websites start showing you addresses that match what you have typed in, and filter the list as you type more. This is achieved through AJAX – your input is sent asynchronously to the web server where a search for matching addresses is performed, and the data returned is then displayed within the browser, using DOM manipulation as described above.

Advantages of JavaScript

• All supporting browsers can run the same code
• It enables a client to manipulate the contents of the page without the need for lengthy and distracting request-response cycles and complete page refreshes
• It enables slick, responsive websites
• Ideal for calculations performed on the webpage – for example dynamically adjusting the subtotal of a shopping basket

Disadvantages of JavaScript

• In order to ensure security, JavaScript is limited in scope. It can’t access local resources for example
• Client-side processing in unsuitable for security-conscious content, because the source code is visible to all users
• Client-side processing can’t be validated by an external agent, therefore any results obtained can not be relied on as accurate/untampered with