#NextScript generates render blocking request

14 messages · Page 1 of 1 (latest)

nova kiln
#

In my _document.tsx I have <NextScript /> used in this way

import { Html, Head, Main, NextScript } from "next/document";

export default function Document() {
  return (
    <Html lang="en">
      <Head />
      <body className="selection:bg-transparent">
        <Main />
        <NextScript />
      </body>
    </Html>
  );
}

As far as I understand, the script should be marked as defer
but Chrome DevTools gives me an issue of 1,39 seconds to paint the page, with the messages
Render blocking request
Add an async or defer attribute to the script so that it can be executed later and not delay rendering (see attached image).

Is there something wrong from my side?

immagine.png
ruby bisonBOT
#
Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

merry copper
nova kiln
#

yes, in dev mode.

#

but the UX is really slow even in production mode. this is the reason why I'm profiling

#

the UX is slow when I leave one page to enter another one of my application

merry copper
# nova kiln yes, in dev mode.

Dev mode should never be used for benchmarking because it doesn’t have the necessary optimisations, and pages are only built on demand

#

Always use prod mode to benchmark

nova kiln
#

does Chrom DevTool work in prod mode too?

merry copper
#

Why would it not?

#

Chrome doesn’t know – nor does it need to care – whether the site running on it is in dev or prod mode

nova kiln
#

I'm going to try in prod mode

nova kiln
#

I've been used profiling in dev mode becasue react profile in Chrome dev tools doesn't work in dev, but only in prod

#

and so I took this habit as a general habit