Hot reloading extremely slow. Goes through every iteration only when page is viewed.

Bug report

It used to be that when you made a code change, the page would hot-reload in the background and I’d barely be able to switch to my browser before the page was re-rendered.

However with Next: 9.2.0 when I make let’s say 100 keystroke changes. in. my app doesn’t automatically re-render in the background. Instead, it waits till I navigate to my browser and then it will re-render 100 times, 1 at a time and wait for it to finish.

For example, if I’m just changing the text in a <p> tag a few times and I go to my localhost:3000 I will see every keystroke change I did render 1 by 1.

It takes forever to wait for and is extremely inefficient. I get the arguable appeal of not re-rendering in the background. But I have absolutely no need for 99% of these re-renders. I just want to see what the current state it. Not see how it changed with every single keystroke I did editing my app.

I assume this must be a bug???

Additional context

• OS: macOs (2016 Macbook Pro)
• Browser: Google Chrome
• Version of Next.js: 9.2.0

I’m not using Typescript so it’s not due to Typechecking or the Fork typescript provider.

I believe this started happening when I updated form next 8.x to 9.x

[madsfaerch]

@MarkLyck just to confirm, is this the issue you’re describing?

1. Have Next project open in a tab with next dev active
2. Focus a different tab
3. Make several code changes, resulting in recompilations
4. Focus browser
5. Focus tab with Next project
6. Observe all the changes applied sequentially

[timneutkens]

@madsfaerch if those are the definitive steps to reproduce that’s all we’ll need 👍 Will have someone investigate if we can improve it 💯 Thanks for providing really clear what you were seeing, it really helps a lot.