Daily JavaScript For You

Rayhan Rahat
4 min readMay 6, 2021

--

Did you know?

JavaScript is a High-Level Prototype-Based Object-Oriented Multi-Paradigm Interpreted or Just-In-Time Compiled Dynamic Single-Threaded Gargabe-Collected Programming Language with First-Class Functions and a Non-Blocking Event Loop Concurrency Model.

What is he talking about!!!

I know I know you might be wondering. What the hell is he talking about or maybe he just had too much crack.

But, Let me explain!!! Let’s start with the event loop.

Event Loop

Before that, Let’s learn about the concurrency model. what actually is a concurrency model in JavaScript? Well, it’s just a fancy term that means how the JavaScript engine handles multiple tasks happening at the same time.

No, okay. That’s cool. But why do we need that?

Well, because JavaScript itself runs in one single thread, which means that it can only do one thing at a time and therefore we need a way of handling multiple things happening at the same time. But what if there is a long-running task, like fetching data from a remote server?

Well, it sounds like that would block the single thread where the code is running, right?

But of course, we don’t want that. What we want is so-called non-blocking behavior. and how do we achieve that? Well, by using a so-called event loop.

The event loop takes long-running tasks, executes them in the background, and then puts them back in the main thread once they are finished. And this is, in a nutshell, JavaScript’s event loop concurrency model with a single thread.

Now enough of the behind the scene Event Loop. Let’s Get into something new. How about Error Handling.

Error Handling

Errors! Ah, what would you do without them? I mean seriously is there any programmer who doesn’t have to deal with Errors? I don’t think so.!

But, fortunately, JavaScript recently released try... catch which makes developing and error handling much much easier.

The syntax is simple

try {   
// run this code
} catch (err) {
// if an error happened, then jump here
// err is the error object
} finally {
// do in any case after try/catch
}

Basically what that code means is that you can write a code of perhaps perform something from a function inside the try block. which will run and if there is an error in the process. the function throws an Error, Which you can catch in the catch block with the error object, then handle the error in your style. The finally block simply runs after the try-catch block finishes. you can maybe clean up the workspace after the function runs.

Try Catch is also great for handling network errors or asynchronous errors

const fetchSomeData = async () => {
try {
const data = await fetch(//request to the endpoint)
return data
} catch(err) { //Any kind of network error will he caught here
//Handle them however you please.
}
}

As you can see, Any kind of network errors in here will be caught by the catch block and you can handle them pretty easily.

Now let’s change topics into Caching is JavaScript.

Caching

Caching basically means where the computer stores the commonly accessed data in several places, to ensure better performance and efficiency of running the application. Then that data is served to the commonly used requests to save a lot of time and data generation. This also helps to optimize the requests processing workflow which the browser receives many times every day. Also whenever a user requests a site or data of a file that is static, doesn’t change much, caching helps drastically by saving the data in storage and not having to download this again and again. That is why caching is really important in Javascript. as websites frequently need to load the same over and over and caching really helps by saving the data of the user.

Client Caching

Caching the client-side of a web app helps limit the data cost incurred by the user by keeping commonly referenced data locally in the browser. The client often requests data that may not be large but is indeed continuously needed.

For instance, if an API call for some Image files, instead of requesting the images that make up the page and other things, that content can be stored locally in the browser. If the API calls for a directory to the user, the user can cache this directory locally instead of requesting it from the server, which cuts out the directory lookup stage from the client. All of this helps reduce the data cost in terms of network utilization and processor demand and improves the efficacy of the overall system.

Server Caching

Caching the server helps limit the cost occurred by the server and its underlying process and systems. Many requests made by clients can either be responded to using the same data or responded to using parts of the same requests made by others. In that case, server caching really shines.

For instance, database queries are often used for specific purposes, a client synchronizing locally stored data of a specific resource, That might request a full survey of the resources every 2 hours or so. In this case, the query can be cached on the server, and then for each synchronization request, the server can pass the cached copy to the client, which is checked against the reality on the server. In this way, the database is saved from making a ton of expensive calls and requests that would otherwise be responsible for, rising the data cost and harming the efficiency.

--

--