[Solved] How to make Next.js build time slow to faster

Next JS Mohaimen Khalid

Problem:

We build our nextjs project and we face problems like next.js build times are too much slower. Then how can we make them faster?


Solution:

In this article, we will discuss the possible solutions to the problem "nextjs build time issue". Let's start and follow the instruction given below.

First option: If you are using server-side render CSS generation, then it takes much time to build your project. you can remove SSR CSS generation from your project.  then you will get better performance.   

Second option: you can also speed up your build time by removing import all from css library. Like, you have need a icon from a library but you imported all of the items. it really costly. example - 

import * as Icon from "@graywolfai/react-heroicons";

You must have do like this -

import { BellOutline } from "@graywolfai/react-heroicons";

Third option: 

This solution was to change the devtool in next.config.js and it'll give you results, it will fix your low speed issue and speedup hopefully.

module.exports = withSass({
  webpack(config, { dev }) {
    if (dev) {
        config.devtool = 'cheap-module-source-map';
    }
    return config;
}
});

Thanks for reading the article. If you have any problems, please comment below.