Problem: You have a nested array and you need all elements to be flat, no sub arrays. Ex: [1, 2, [3, [4, 5]]] There are some hurdles to jump over to make this truly efficient. [].concat based solutions: not efficient as they create new arrays and that consumes precious memory …

I’ve been working on a project and want to trim all the dependencies to be smaller. Smaller bundle means faster load time. For easier styling of components we often install popular libraries to help us develop faster. Sometimes there exist faster, smaller alternatives; this is one such case. So an…

Brief Setup Overview First thing first, you need a babel plugin: babel-plugin-syntax-dynamic-import Update your babelrc file to include that. If you have that and the babel loader for webpack, then you’re set. How to Lazy Load The code for lazy loading is that of dynamic imports. // regular import import someModule from '../my/module/path'; // dynamic import import('../my/module/path').then(someModule =>…

At the time of this writing version 6 is still in beta. An update will be made as necessary. Reasons to switch: Smaller footprint/size Simpler API Uses React like Hooks

It can be tricky to figure out what routing solution you need and how to set it up. React-Training provides multiple routers to choose from: BrowserRouter, HashRouter, MemoryRouter, and StaticRouter. Each has their unique use cases. I had the use case where I want my react app to not modify…