JSK Weekly - August 11, 2021

Popular stories this week include "Exploring Essential JavaScript Spreadsheet Freeze Panes" on Syncfusion, "Why Axios is Preferable to Fetch" by Sumeet Bhalla and Chameera Dulanga's "Secret Behind JavaScript Performance: V8 & Hidden Classes" on Bits and Pieces.


General

WebSocket Communication Patterns for Real-Time Web Apps

WebSockets are used for real-time communication between the browser and a server. These communications are bi-directional. Therefore it fits low latency applications such as chat, real-time multiplayer gaming, in-app notifications. If you are new to WebSockets, I suggest you look at the below article I've written to understand better how it works.

Authored by: Bit

The State Of Web Workers In 2021 - Smashing Magazine

The web is single-threaded. This makes it increasingly hard to write smooth and responsive apps. Workers have a bad rep, but can be an important and useful tool in any web developer's toolbelt for these kinds of problems. Let's get up to speed on Workers on the Web!

Authored by: Smashing Magazine

Always Keep Your Promises

Ever wondered what are JavaScript promises? Are you tired of using callbacks? Here is a guide for you to learn about promises and how they can simplify your life. There are a couple of reasons why promises are better than callbacks: With the callback being passed as a parameter, it can become confusing with what's input and what's the return value if the number of params increase.

Authored by: sumeet bhalla


JavaScript

Exploring Essential JavaScript Spreadsheet Freeze Panes

The Essential JavaScript Spreadsheet, also known as the JavaScript Excel viewer, is a feature-rich control for organizing and analyzing data in tabular format. It supports all the common Excel features, including data binding, selection, editing, formatting, resizing, sorting, importing, and exporting Excel documents. In this blog post, we will look at the freeze panes feature in the JavaScript Spreadsheet.

Authored by: Syncfusion

Shipping Less JavaScript with Astro Static Site Bundler

Astro is a modern static site builder that allows you to deliver applications with less JavaScript. As a developer, I found this very interesting since it reduces the bundle sizes without affecting...

Authored by: Bit

'return await promise' vs 'return promise' in JavaScript

When returning from a promise from an asynchronous function, you can wait for that promise to resolve return await promise, or you can return it directly return promise: You'll see shortly that both expressions do work. However, are there cases when these expressions behave differently? Let's find out!

Authored by: Dmitri Pavlutin

Essential JavaScript Interview Coding Questions

Answer: A function that is passed as an argument to another function is called as callback function. This callback function will be executed after some operation has been completed. Code: Example: Given string - Welcome to Hello World Should become - emocleW ot olleH dlroW Code: Array.isArray(object) tells if an object is an array or not.

Authored by: JavaScript In Plain English

Run Javascript Apps Faster and Safer than Linux Through Open Source Unikernels

Run your Node apps faster and safer than Linux. 2X as fast on GCP and 3X as fast on AWS using open source unikernels. Deploy to the cloud in tens of seconds with no docker, k8s or other complex ops work.

Authored by: NanoVMs

JavaScript For Loop - How to Loop Through an Array in JS

There are various types of loops in JavaScript, and all of them essentially do the same thing: they repeat an action again and again. Loops come in handy if you want to repeat the same block of code for a certain number of times. Basically, they are a fast and

Authored by: Dionysia Lemonaki

Overview: Javascript Memory Leaks and Main Thread Bottleneck

There will come a point at least once in your career as a JavaScript developer where you'll run into a memory leak issue (usually on production) and you'd be surprised to know that such a thing exists (and you've to take care of it). Lol.

Authored by: Vijay Pagare

Secret Behind JavaScript Performance: V8 & Hidden Classes

Today, JavaScript has become one of the most used languages for web development. However, it has to pass so many hurdles to climb up to this stage. One such milestone is behind its execution speed...

Authored by: Bit

How To Build Resilient JavaScript UIs

Resilience is intrinsic to the web and therefore us, web developers. This article explores how graceful degradation, defensive coding, observability, and a healthy attitude towards failures better equips us before, during, and after an error occurs.

Authored by: Smashing Magazine


Angular

Query the DOM in Angular with Decorators

DOM stands for the Document Object Model. The logical structure of documents and the ways of accessing and manipulating documents are defined using DOM elements. In other hand, The DOM is the way JavaScript sees its containing pages' data.

Authored by: JavaScript In Plain English


React

React Hooks: A Simple Introduction

React Hooks are a newly proposed feature that lets you use state and life-cycle methods without writing a class component. React Hooks were released as part of React 16.8.

Authored by: Upmostly

React Children And Iteration Methods

In this article, we'll discuss and learn about the use case of iterating over React `children` and the ways to do it. In particular, we will deep dive into one of the utility methods, `React.Children.toArray`, that React gives us, which helps to iterate over the children in a way which ensures performance and determinism.

Authored by: Smashing Magazine

10 Ways to Style a React Application

React is a library for rendering UI, it doesn't care about styling. It is a nice thing about React, but it also leaves us alone in a big ocean with a lot of options. Usually, choosing the style...

Authored by: Naveen DA

How To Use React useRef Hook (with Examples) - Upmostly

What is the `useRef` hook? How do you use it? When should you use `useRef` vs `useState`? What caveats should you be aware of when using `useRef`? This hook is often a tricky one to get right but can be very powerful. Read on to learn how to `useRef` like a pro!

Authored by: Upmostly


Vue

Vue and Careers with Ari Clark on Web Rush #145

On this episode we talk with Ari Clark about the work / life balance, what a 10x developer is, connecting with peer and networking, dealing with imposter syndrome, and developing with Vue. Direct link to episode.

Authored by: John Papa


Node.js

Set a Default Node Version with nvm

As I've shown you in the past, nvm an excellent utility for switching between Node.js versions. Whether your host machine or CI, building and testing your apps on different Node versions is a necessity. I've recently found a few nvm commands that I found really useful during local development.

Authored by: David Walsh

Create a Product Rating System with MongoDB and Node.js

In this tutorial, you will learn how to make good use of Mongoose schema mixed type, getters and, setters to manipulate data in your MongoDB database Most product rating systems such as that of amazon make use of the weighted average system.

Authored by: JavaScript In Plain English


Testing

Automate Component Testing for Mobile Web Apps with BrowserStack

"One website for every screen size" is undoubtedly a nightmare when it comes to testing for mobile browser compatibility. It's quite challenging to test applications on multiple devices due to various factors like screen size, resolution. But now we have tools like BrowserStack, AWS Device farm to write test scripts once and run them on multiple devices, which is more efficient and time-saving.

Authored by: Bit

Functional Testing using React testing library and Jest - Vijay Thirugnanam

React Testing Library makes functional testing of React components easier. It provides a virtual DOM where we can render components, provides methods to query the DOM for various elements, interact with those elements and make assertions on them.

Authored by: Vijay T

Listen To The Application Events From Cypress Tests

How the Cypress tests can receive the DOM and jQuery events sent by the application. Often the web application uses events that flow from one part of the application to another. You might need to observe these events from the end-to-end tests to confirm the application sends them.

Authored by: Gleb Bahmutov





0 comments