So first up, what is Next.js?
Photo by Chris Liverani on Unsplash
Server Side Rendering (SSR)
React components that make up the user-facing part of a website are all initially rendered on the server side. This means that once the HTML has been delivered to the client (the user’s browser), nothing else needs to happen for the user to be able to read the content on the page. This makes page loading times appear much faster to the user.
If you are wondering what the difference is between Server Side Rendering and Client Side Rendering, this is a great article to read.
Rendering the same components on the server side as on the client side (universal rendering) means that development time is reduced as we can build our React components once and Next JS takes care of everything to do with re-rendering those components in the user’s browser. Developers can just concentrate on building components and not have to worry (too much!) about which environment a component is being rendered in.
Automatic code splitting
Hot Module Replacement (HMR)
This is less important for the end users of an application but very important for developers. HMR allows developers to see any changes they have made during development, live in the application as soon as they have been made. However, unlike traditional "live reload" methods, it only reloads the modules that have actually changed, preserving the state the application was in and significantly reducing the amount of time required to see changes in action. Ultimately, the positive impact for our clients is that it takes us less time to develop because there are development efficiencies to be gained.
In summary, the primary benefits of Next.js are:
- Improved development process = cost and time benefit to our clients
- Improved performance = faster applications
- Improved SEO = more indexable, SEO friendly applications
If you want to find out more, or are looking to outsource development of a tailored application, call us on 01923 261166.