Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
Articles by Shubham Vora
Page 28 of 80
What is the App Shell Model in JavaScript?
The App Shell Model is a design pattern that keeps a web app's UI and data modules apart. Caching the user interface in this design may load content on the fly. This method is widely utilized in progressive web apps (PWAs) because of its many speed and user experience benefits. Benefits of the App Shell Model in JavaScript Faster Load Times The user experience is enhanced by reducing the time it takes for the program to load for the first time due to caching the app shell. Users have come to anticipate instantaneous response times from online apps, and any ...
Read MoreHow to create a reporting app with Vue 3 and Composition API?
Vue is a JavaScript framework that allows developers to create web applications. It is mainly used to build single-page web applications. There are lots of benefits to using the vue to create web applications, such as easy structure, lightweight, component-based architecture, etc. Before we start with the tutorial, let’s learn about the reporting app and composition API. The reporting app is a single or multiple-page web application that displays useful data in a proper format, such as table format. It is used to show the reports of the data in a particular format. The composition API allows developers to code ...
Read MoreHow to control fps with requestAnimationFrame?
The fps word is generally associated with videos and games where we require to use animations. The fps is an abbreviation of frames per second, and it means how many times it’s rerendering the current screen. For example, a video is a continuous row of images. It means it shows images in very short intervals so that users can’t know it's showing images individually. If we decrease the fps for video, it can look like image animation rather than video. So, with more fps as it gives better results. Basically, fps tells us how many times it should update the ...
Read MoreHow to Configure Socket.IO with Demo-Chat App in Node.js?
Socket.io is a popular JavaScript library that allows us to communicate between the server and the client. We can create an instance of socket.io on the client and server sides and listen to or emit the events from both sides. Also, we can listen to the event emitted from the server on multiple web clients. In real-time, we can use the socket.io library to create chat applications and online games requiring bi-direction communication. For example, if you have observed while playing chess or Ludo, it allows us to talk with our opponent. In this tutorial, we will learn to configure ...
Read MoreHow to Configure Mouse Wheel Speed Across Browsers using JavaScript?
We can use JavaScript to change the behavior of the web page. Every browser has a default scrolling speed when users scroll using the mouse wheel. However, we can control it using JavaScript. We can also use the mouse wheel to zoom in and out of web pages. In such cases, we require to reduce the mouse wheel speed. Furthermore, developers sometimes require a scrolling speed limit, such as on website rules, so that users can read it properly. In this tutorial, we will learn different ways to control the mouse's wheel speed. Syntax Users can follow the syntax below ...
Read MoreWhat is Progressive Rendering?
Introduction Have you ever measured the loading speed of your website? If No, there are lots of tools available on the internet to test the website speed. Search for anyone and measure it. If the website loading speed is more than 3 seconds, it means you are losing a total of 32% of visitors, according to the survey done by Google. So, it helps if you take action to decrease your website's loading speed, and here progressive rendering comes into the picture, which allows developers to increase the loading speed of the website. What is Progressive Rendering? Before discussing ...
Read MoreWhat is greater-than sign (>) selector in CSS?
In CSS, the ‘>’ sign is not used to compare two values like in other programming languages. Here, we use the greater than sign (>) as a selector. In CSS, selectors are used to selecting single or multiple HTML elements. Whenever we use the greater than sign in the selector, it selects the direct children of the parent element but not that are nested at deep. Syntax Users can follow the syntax below to use the greater than sign in the CSS selector. selecter1>selector2 { /* CSS code */ } In the above syntax, ‘selector1’ is ...
Read MoreWhat is Graceful Degradation in CSS?
What is Graceful Degradation? If you are an experienced web developer, you may have heard the graceful degradation word before. Before we learn about the graceful degradation in web development, let’s break down the word. The meaning of graceful is elegant or beautiful, and degradation is breaking or falling down. So, the overall meaning of the graceful degradation word is that it makes the feature elegant while it breaks. Developers use the graceful degradation term in web development. It provides various techniques so that any website or application can work correctly in less capable browsers. For example, modern browsers support ...
Read MoreWhat is font-family -apple-system?
In CSS, the ‘font-family’ property is used to set the fonts for the text content of the HTML element. It takes the multiple font names as a value. If the browser does not support the first font, it sets the next font style for the HTML element. Users can follow the syntax below to use the ‘font-family’ CSS property. font-family: value1, value2, value3, ... The ‘-apple-system’ value of the ‘font-family’ CSS property allows developers to set the same font for the HTML content of the web page, which the Apple operating system has. It means we can set ...
Read MoreWhat is Float Containment in CSS?
First, let’s understand float containment before starting this tutorial. So, Float containment is a technique used in the CSS to control the layout of the web page elements. Whenever we set the ‘float’ property for any HTML element, it automatically gets removed from the original document flow of the web page, but it remains in the viewport. So, developers can face issues like the parent div element not expanding according to the dimensions of the child div element. Let’s understand it via the example below. Example In the example below, we have a ‘parent’ div element containing the text and ...
Read More