Build Blazing Fast Web Applications

A large number of websites use Lazy Loading Techniques to build user-friendly interfaces, but the big question is that why should we even care about Lazy Loading in our applications. The two significant reasons are:

  • For most cases in web applications, when JavaScript displays the content to provide the functionality, loading the DOM quickly becomes very hard. In JavaScript, it is very common for scripts to wait until the DOM has done loading before they start running. Especially a web application with a large number of images will suffer a bad user experience in such cases.
  • Optimization of assets in…

Work With JavaScript Like a Professional

Most of the time developers relate object-oriented programming with languages like C++ and Java, where you need to create a class even for a simple command-line program. But JavaScript doesn’t use classes which leads to confusion while implementing OOP principles. There are numerous reasons to go for OOP in JavaScript as follows:

  • Encapsulation: Data can be grouped with functionality that operates on that data (In simple words we call them objects).
  • Aggregation: One object can reference another object.
  • Inheritance: When a newly created object has the same characteristics as another object without duplicating its core functionality.
  • Polymorphism: Single interface can…

Refreshing Essential ES6 JavaScript Concepts

1. let vs var vs const

All three keywords are used to declare variables in JavaScript, but there are slight differences that sometimes gets unnoticed by developers. All these three keywords play different roles while declaring variables, but a lot of times people end up having misconceptions about the way we declare variables in JavaScript.

  • Var: While using the Var keyword for declaring variables, you just have to remember one simple concept that, variables declared using the Var keyword have their scope outside of the block, which simply means that a variable is still accessible outside of the block in which they are defined.

For example…


Using an ORM library in Your Next JavaScript Project

Photo by Michael Dziedzic on Unsplash

Object Relational Mapping

This concept seems complex to new developers, but it can make your life easier as a developer. Object Relational Mapping simply helps you to write queries in the language of your choice. In this technique, a database query is converted into an entity(Entity is an object database table that contains attributes that are mapped to columns of a database table) class inheritance.

Most of the time we don't need ORM in the case of smaller projects, where we can use SQL statements to drive our application. …


React Native UI Libraries that You Should Try in 2021

1. Styled Components

This library enables you to write CSS as React Components. Without Styled Components we usually write the styles as JavaScript objects, but writing styles as components is considered a better option, as it allows you to write readable code and create reusable components. Also, you can use your styles multiple times which leads to less code.

For Example:


Good To Know Programming Principles of Clean Code

1. YAGNI

You Aren’t Gonna Need It

This is a principle of Extreme Programming which is generally used in the Agile Software Development process. According to this principle, we shouldn't add any functionality until it’s deemed necessary, or in more simple words, your code should be always relevant to the current situation. Don’t add anything that you will need later in the future, your code should be presenting the current logic of the situation, instead of something that needs to be solved later in the process.

Advantage:

  • Avoids the software from becoming larger and more complicated in the early stage of development.

2. KISS


Work with JavaScript Applications Like a Pro

The Bridge Pattern

This pattern allows 2 components, a client and service to work together with each having its interface. The main goal is to write better code with two levels of abstraction. A good example of Bridge Pattern would be an application (client) and a database driver (service), the application writes to a well-defined database API, but you will find that each driver’s implementation is different for each database vendor (SQL, MySQL, Oracle, etc).

For example

The most practical case of a Bridge is event listener callbacks, let’s say you have an API function called getFoodById, which returns data about a food order based…


Useful Techniques to Build Fast React Applications

1. Chunk Files

While building your React applications, the addition of new features will always end up in a huge production file. In such scenarios, you should consider separating files (Your Application Code & Third-Party Library Code) by using the CommonChunkPlugin for webpack. It provides you with two files, which are vendor.bundle.js and app.bundle.js.

Splitting your code in the right way always affects the way your browser stores cache which directly affects the load time of your applications by downloading resources parallelly

  • For the latest version for webpack, consider the SplitChunksPlugin.

2. Dependency Optimization

Not every time you are utilizing 100% from the dependencies and due…


Essential Concepts To Use in Your Next JavaScript Project

1. Design Patterns

A Pattern is a Reusable Solution That Can be Applied to Commonly Occurring Problems in Software Engineering

Using good Design Patterns resist your codebase from growing weirdly larger. Especially in a situation where you work in a team, everyone must be familiar with a Desing Pattern as it leads to better communication while handling projects in a good manner. In JavaScript, there are a lot of Design Patterns, but you don’t have to learn them all to become someone good with it.

Here are some of the known Design Pattern in JavaScript

  • Constructor Pattern: Very useful pattern while working with

Mohit

I Make Mobile Apps

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store