Client-side and server-side are web development terms that describe where application code runs. Web developers will also refer to this distinction as the frontend vs. the backend, although client-side/server-side and frontend/backend aren’t quite the same. In a serverless architecture, the serverless vendor hosts and assigns resources to all server-side processes, and the processes scale up as application usage increases.
What is the client-server model?
Much of the Internet is based on the client-server model. In this model, user devices communicate via a network with centrally located servers to get the needed data, instead of communicating with each other. End-user devices such as laptops, smartphones, and desktop computers are considered ‘clients’ of the servers as if they were customers obtaining services from a company. Client devices send requests to the servers for webpages or applications, and the servers serve up responses.
The client-server model is used because servers are typically more robust and reliable than user devices. They are also constantly maintained and kept in controlled environments to ensure they’re always on and available;. However, individual servers may go down; other servers usually back them up. Meanwhile, users can turn their devices on and off, or lose or break them, which should not impact Internet service for other users.
Servers can serve multiple client devices simultaneously, and each client device sends requests to multiple servers while accessing and browsing the Internet.
Multiple clients and servers interact:
Each client will communicate with multiple servers, and vice versa.
Suppose a user is browsing the Internet and types ‘netflix.com’ into their browser bar. This results in a request to DNS servers for the IP address of netflix.com, and the DNS servers respond to this request by serving the IP address to the browser. Next, the user’s browser makes a request to Netflix servers (using the IP address) for the content that appears on the page, such as the movie thumbnail images, the Netflix logo, and the search bar. Netflix servers deliver this to the browser, which loads the page on the client’s device.
What does the client-side mean?
In web development, ‘client side’ refers to everything in a web application that is displayed or takes place on the client (end-user device). This includes what the user sees, such as text, images, and the rest of the UI, along with any actions an application performs within the user’s browser.
The browser on the client side interprets markup languages like HTML and CSS. In addition, many contemporary developers include client-side processes in their application architecture and move away from doing everything on the server side; business logic for dynamic webpages*, for instance, usually runs the client side in a modern web application. Client-side processes are almost always written in JavaScript.
In the netflix.com example above, the browser on the client side interprets the HTML, CSS, and JavaScript that dictate how the Netflix main page appears to the user. The page can also respond to ‘events’: For instance, if the user’s mouse hovers over one of the movie thumbnail images, the image expands and adjacent thumbnails move slightly to one side to make room for the larger image. This is an example of a client-side process; the code within the webpage itself responds to the user’s mouse and initiates this action without communicating with the server.
The client side is also known as the front end, although these terms do not mean precisely the same thing. Client-side refers solely to the location where processes run, while frontend refers to the kinds of processes that run client-side.
A dynamic webpage is a webpage that does not display the same content for all users and changes based on user input. The Facebook homepage is a dynamic page; the Facebook login page is mostly static.
What does server-side mean?
Much like with client-side, ‘server side’ means everything that happens on the server, instead of on the client. In the past, nearly all business logic ran on the server side, including rendering dynamic webpages, interacting with databases, identity authentication, and push notifications.
The problem with hosting all of these processes on the server side is that each request involving one of them has to travel from the client to the server, every time. This introduces a great deal of latency. For this reason, contemporary applications run more code on the client side; one use case is rendering dynamic webpages in real-time by running scripts within the browser that make changes to the content a user sees.
Like with ‘frontend’ and ‘client-side,’ backend is also a term for the processes on the server, although the backend only refers to the types of processes, and the server-side refers to the location where processes run.
What is client-side scripting? What is server-side scripting?
Client-side scripting means running scripts, such as JavaScript, on the client device, usually within a browser. All kinds of scripts can run on the client side if written in JavaScript because JavaScript is universally supported. Other scripting languages can only be used if the user’s browser supports them.
Server-side scripts run on the server instead of the client, often to deliver dynamic content to web pages in response to user actions. Server-side scripts don’t have to be written in JavaScript, since the server may support a variety of languages.
Scripts run client-side and server-side:
Data passes back and forth between the client and server, and scripts can run on both sides.
How do server-side processes work in a serverless architecture?
In serverless computing, all server-side or backend processes still run on servers instead of client devices, but they are not deployed on any specific server or set of servers. Backend processes are broken up into functions, which run on demand, and scale up automatically. Developers can still build all the server-side functionality within a serverless architecture.
