Slow TTFB on initial document request NextJS on Netlify

We’ve been testing out NextJS on Netlify and in doing so have noticed that the TTFB on the initial document request (not subsequent resources) is quite slow often 1.25s - 1.75s.

One site has a domain attached, while the other is using the default Netlify domain… so can rule out it being a domain thing. For those familiar with Shopify, I’ve seen this happen on their hosted theme environments when there’s a lot of server side rendering going on (excessive liquid loops)… so I’m wondering if maybe that’s somehow the case here too with NextJS? That being said, I’m seeing this on the index pages which is more-or-less all static content.

Wondering if anyone else has run into this using NextJS on Netlify. Know things are evolving rapidly here, but figure performance is why we bother with most of this, right?

Hey there, @daniel :wave:

Welcome to the Netlify Forums :netliconfetti: Sorry to be slow to respond here-- it looks like this thread has been quiet since last week. Are you still encountering this? If so, can you share your most recent build log with us?

We are experiencing a similar issue. TTFB is over 4s for SSG pages.

Is there any workaround for this?

hi there, sorry you are experiencing any slowness. Capturing a HAR file would be super helpful for us to analyze why this might be the case:

https://toolbox.googleapps.com/apps/har_analyzer/

furthermore, if this seems next related, it would be a good idea to look through any issues on this repo:

our next plugin is rapidly evolving, indeed, so sometimes going straight to github will get the attention of the next team faster!

Hey Perry,

Please see the screenshots below. It is constantly varying between 4s and 7s.

Hi there, @Veera_Health

Thanks so much for following up, I appreciate it. Can you link us to the website? Additionally, are there any known large files or images on this website?

Hi @hillary - I’m experiencing a very similar issue to that described in the initial post. Our TTFB times are coming in at a pretty consistent 4-5 seconds.

To answer the questions asked in the thread:

  • The domain is https://uat.dev.dulux.com.au
  • This site id is 8ad36bfc-162f-44c0-bcf9-afdec713bfdb
  • The latest build log is copied below
  • I can’t attach the HAR file captured today but the image of the output is attached
  • We are using the nextjs plugin and webpack 5, I can’t see any open issues which relate to this

We have recently moved our functions geographic location to ap-southeast-1 (ours is an Australian site) but that hasn’t yielded any improvement.

Thanks very much,

James

Latest build log

9:46:18 AM: Build ready to start
9:50:38 AM: build-image version: 2cee85eb7f808bf3b6e87378c5307f9411f0a332
9:50:38 AM: build-image tag: v3.8.0
9:50:38 AM: buildbot version: 50f65aefac6a0b0332883c4b4311845d6395ce2b
9:50:38 AM: Fetching cached dependencies
9:50:38 AM: Starting to download cache of 718.1MB
9:50:43 AM: Finished downloading cache in 4.8640394s
9:50:43 AM: Starting to extract cache
9:51:08 AM: Finished extracting cache in 24.776148766s
9:51:08 AM: Finished fetching cache in 29.68186503s
9:51:08 AM: Starting to prepare the repo for build
9:51:14 AM: Preparing Git Reference refs/heads/main
9:51:20 AM: Parsing package.json dependencies
9:51:21 AM: Different build command detected, going to use the one specified in the Netlify configuration file: 'yarn build' versus 'export AZURE_AD_ACCESS_TOKEN=$(node ./scripts/generateAuthToken.mjs) && yarn build' in the Netlify UI
9:51:21 AM: Starting build script
9:51:21 AM: Installing dependencies
9:51:21 AM: Python version set to 2.7
9:51:22 AM: Started restoring cached node version
9:51:25 AM: Finished restoring cached node version
9:51:25 AM: v15.14.0 is already installed.
9:51:26 AM: Now using node v15.14.0 (npm v7.7.6)
9:51:26 AM: Started restoring cached build plugins
9:51:26 AM: Finished restoring cached build plugins
9:51:26 AM: Attempting ruby version 2.7.1, read from environment
9:51:27 AM: Started restoring cached ruby version
9:51:27 AM: Finished restoring cached ruby version
9:51:29 AM: Using ruby version 2.7.1
9:51:29 AM: Using PHP version 5.6
9:51:29 AM: Started restoring cached yarn cache
9:51:29 AM: Finished restoring cached yarn cache
9:51:30 AM: No yarn workspaces detected
9:51:30 AM: Started restoring cached node modules
9:51:30 AM: Finished restoring cached node modules
9:51:30 AM: Installing NPM modules using Yarn version 1.22.4
9:51:31 AM: yarn install v1.22.4
9:51:31 AM: [1/4] Resolving packages...
9:51:32 AM: success Already up-to-date.
9:51:32 AM: Done in 1.72s.
9:51:32 AM: NPM modules installed using Yarn
9:51:33 AM: Started restoring cached go cache
9:51:33 AM: Finished restoring cached go cache
9:51:33 AM: go version go1.14.4 linux/amd64
9:51:33 AM: go version go1.14.4 linux/amd64
9:51:33 AM: Installing missing commands
9:51:33 AM: Verify run directory
9:51:34 AM: ​
9:51:34 AM: ────────────────────────────────────────────────────────────────
9:51:34 AM:   Netlify Build                                                 
9:51:34 AM: ────────────────────────────────────────────────────────────────
9:51:34 AM: ​
9:51:34 AM: ❯ Version
9:51:34 AM:   @netlify/build 12.4.0
9:51:34 AM: ​
9:51:34 AM: ❯ Flags
9:51:34 AM:   deployId: 60cfd34a0d9f121d289f89a3
9:51:34 AM: ​
9:51:34 AM: ❯ Current directory
9:51:34 AM:   /opt/build/repo
9:51:34 AM: ​
9:51:34 AM: ❯ Config file
9:51:34 AM:   /opt/build/repo/netlify.toml
9:51:34 AM: ​
9:51:34 AM: ❯ Context
9:51:34 AM:   production
9:51:34 AM: ​
9:51:34 AM: ❯ Loading plugins
9:51:34 AM:    - @netlify/plugin-nextjs@3.3.1 from netlify.toml and package.json
9:51:34 AM: ​
9:51:34 AM: ❯ Outdated plugins
9:51:34 AM:    - @netlify/plugin-nextjs@3.3.1: latest version is 3.4.2
9:51:34 AM:      To upgrade this plugin, please update its version in "package.json"
9:51:34 AM: ​
9:51:34 AM: ────────────────────────────────────────────────────────────────
9:51:34 AM:   1. onPreBuild command from @netlify/plugin-nextjs             
9:51:34 AM: ────────────────────────────────────────────────────────────────
9:51:34 AM: ​
9:51:35 AM: info  - Using webpack 5. Reason: future.webpack5 option enabled https://nextjs.org/docs/messages/webpack5
9:51:35 AM: Next.js cache restored.
9:51:35 AM: ​
9:51:35 AM: (@netlify/plugin-nextjs onPreBuild completed in 1.2s)
9:51:35 AM: ​
9:51:35 AM: ────────────────────────────────────────────────────────────────
9:51:35 AM:   2. build.command from netlify.toml                            
9:51:35 AM: ────────────────────────────────────────────────────────────────
9:51:35 AM: ​
9:51:35 AM: $ yarn build
9:51:36 AM: yarn run v1.22.10
9:51:36 AM: $ BUILDTIME=TRUE next build
9:51:37 AM: info  - Using webpack 5. Reason: future.webpack5 option enabled https://nextjs.org/docs/messages/webpack5
9:51:37 AM: info  - Checking validity of types...
9:51:55 AM: info  - Creating an optimized production build...
9:51:56 AM: info  - Using external babel configuration from /opt/build/repo/.babelrc
9:52:17 AM: (node:1583) [DEP_WEBPACK_CHUNK_HAS_ENTRY_MODULE] DeprecationWarning: Chunk.hasEntryModule: Use new ChunkGraph API
9:52:17 AM: (Use `node --trace-deprecation ...` to show where the warning was created)
9:52:17 AM: (node:1583) [DEP_WEBPACK_CHUNK_ADD_MODULE] DeprecationWarning: Chunk.addModule: Use new ChunkGraph API
9:52:18 AM: warn  - Compiled with warnings
9:52:18 AM: ./node_modules/next/dist/next-server/server/load-components.js
9:52:18 AM: Critical dependency: the request of a dependency is an expression
9:52:18 AM: ./node_modules/next/dist/next-server/server/load-components.js
9:52:18 AM: Critical dependency: the request of a dependency is an expression
9:52:18 AM: ./node_modules/next/dist/next-server/server/load-components.js
9:52:18 AM: Critical dependency: the request of a dependency is an expression
9:52:18 AM: ./node_modules/next/dist/next-server/server/require.js
9:52:18 AM: Critical dependency: the request of a dependency is an expression
9:52:18 AM: ./node_modules/next/dist/next-server/server/require.js
9:52:18 AM: Critical dependency: the request of a dependency is an expression
9:52:18 AM: ./node_modules/next/dist/next-server/server/require.js
9:52:18 AM: Critical dependency: the request of a dependency is an expression
9:52:18 AM: info  - Collecting page data...
9:52:21 AM: Use cache to get products
9:52:21 AM: Use cache to get products
9:52:21 AM: Set cache: AU-products
9:52:21 AM: Set cache: AU-products
9:52:23 AM: Set cache: AU-product-images
9:52:24 AM: Set cache: AU-product-images
9:52:26 AM: info  - Generating static pages (0/449)
9:54:14 AM: info  - Generating static pages (449/449)
9:54:14 AM: info  - Finalizing page optimization...
9:54:14 AM: Page                                                      Size     First Load JS
9:54:14 AM: ┌ λ /                                                     1.18 kB         325 kB
9:54:14 AM: ├   /_app                                                 0 B             299 kB
9:54:14 AM: ├ λ /[...slug]                                            1.16 kB         325 kB
9:54:14 AM: ├ ○ /404                                                  643 B           324 kB
9:54:14 AM: ├ λ /api/contact-us                                       0 B             299 kB
9:54:14 AM: ├ λ /api/exit-preview                                     0 B             299 kB
9:54:14 AM: ├ λ /api/preview                                          0 B             299 kB
9:54:14 AM: ├ ● /colours                                              1.12 kB         325 kB
9:54:14 AM: ├ ● /colours/collections/[slug]                           1.06 kB         325 kB
9:54:14 AM: ├   ├ /colours/collections/sample-colour-collection-page
9:54:14 AM: ├   └ /colours/collections/most-loved-whites
9:54:14 AM: ├ ● /colours/colour-atlas                                 5.26 kB         329 kB
9:54:14 AM: ├ ● /colours/details/[slug]                               4.85 kB         338 kB
9:54:14 AM: ├   ├ /colours/details/297124_247064
9:54:14 AM: ├   ├ /colours/details/7287_6722
9:54:14 AM: ├   ├ /colours/details/287428_6794
9:54:14 AM: ├   └ [+47 more paths]
9:54:14 AM: ├ ● /contact-us/thank-you                                 487 B           324 kB
9:54:14 AM: ├ ● /help-and-advice                                      1.33 kB         325 kB
9:54:14 AM: ├ ● /help-and-advice/general                              6.04 kB         351 kB
9:54:14 AM: ├ ● /help-and-advice/specifier                            999 B           351 kB
9:54:14 AM: ├ ● /help-and-advice/trade                                998 B           351 kB
9:54:14 AM: ├ ● /inspiration/inspirationgallery                       1.24 kB         325 kB
9:54:14 AM: ├ ● /products                                             944 B           325 kB
9:54:14 AM: ├ ● /products/collections/[slug]                          1.24 kB         325 kB
9:54:14 AM: ├   ├ /products/collections/design-effects
9:54:14 AM: ├   ├ /products/collections/acratex
9:54:14 AM: ├   ├ /products/collections/professional-fastfinish
9:54:14 AM: ├   └ [+26 more paths]
9:54:14 AM: ├ ● /products/details/[slug]                              2.56 kB         335 kB
9:54:14 AM: ├   ├ /products/details/690D0105
9:54:14 AM: ├   ├ /products/details/69082584
9:54:14 AM: ├   ├ /products/details/19485950
9:54:14 AM: ├   └ [+302 more paths]
9:54:14 AM: ├ ● /store-locator                                        3.88 kB         344 kB
9:54:14 AM: └ ● /stores/[slug]                                        4.22 kB         345 kB
9:54:14 AM:     ├ /stores/bunnings-alexandria
9:54:14 AM:     ├ /stores/bunnings-bankstown
9:54:14 AM:     ├ /stores/bunnings-balgowlah
9:54:14 AM:     └ [+47 more paths]
9:54:14 AM: + First Load JS shared by all                             299 kB
9:54:14 AM:   ├ chunks/framework.a56ca8.js                            47.1 kB
9:54:14 AM:   ├ chunks/main.c9abfc.js                                 19.6 kB
9:54:14 AM:   ├ chunks/pages/_app.2f413c.js                           231 kB
9:54:14 AM:   ├ chunks/webpack.502ba8.js                              1.8 kB
9:54:14 AM:   └ css/4c12301b09c62c839c09.css                          28.2 kB
9:54:14 AM: λ  (Lambda)  server-side renders at runtime (uses getInitialProps or getServerSideProps)
9:54:14 AM: ○  (Static)  automatically rendered as static HTML (uses no initial props)
9:54:14 AM: ●  (SSG)     automatically generated as static HTML + JSON (uses getStaticProps)
9:54:14 AM:    (ISR)     incremental static regeneration (uses revalidate in getStaticProps)
9:54:15 AM: Done in 158.82s.
9:54:15 AM: ​
9:54:15 AM: (build.command completed in 2m 39.1s)
9:54:15 AM: ​
9:54:15 AM: ────────────────────────────────────────────────────────────────
9:54:15 AM:   3. onBuild command from @netlify/plugin-nextjs                
9:54:15 AM: ────────────────────────────────────────────────────────────────
9:54:15 AM: ​
9:54:15 AM: ** Running Next on Netlify package **
9:54:15 AM: 🚀 Next on Netlify 🚀
9:54:15 AM: 🌍️ Copying public/ folder to out_publish
9:54:15 AM: 💼 Copying static NextJS assets to out_publish
9:54:15 AM: 💫 Setting up API endpoints as Netlify Functions in out_functions
9:54:15 AM: 💫 Setting up pages with getInitialProps as Netlify Functions in out_functions
9:54:15 AM: 💫 Setting up pages with getServerSideProps as Netlify Functions in out_functions
9:54:15 AM: 🔥 Copying pre-rendered pages with getStaticProps and JSON data to out_publish
9:54:15 AM: 💫 Setting up pages with getStaticProps and fallback: true as Netlify Functions in out_functions
9:54:15 AM: 💫 Setting up pages with getStaticProps and revalidation interval as Netlify Functions in out_functions
9:54:15 AM: 🔥 Copying pre-rendered pages without props to out_publish
9:54:15 AM: Building 915 pages
9:54:15 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_api_contactus/nextPage
9:54:15 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_api_contactus/nextPage/chunks
9:54:15 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_api_exitpreview/nextPage
9:54:15 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_api_exitpreview/nextPage/chunks
9:54:15 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_api_preview/nextPage
9:54:15 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_api_preview/nextPage/chunks
9:54:15 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_slug/nextPage
9:54:15 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_slug/nextPage/chunks
9:54:15 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_index/nextPage
9:54:15 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_index/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_colours/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_colours/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_contactus_thankyou/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_contactus_thankyou/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_helpandadvice/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_helpandadvice/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_inspiration_inspirationgallery/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_inspiration_inspirationgallery/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_colours_colouratlas/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_colours_colouratlas/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_404/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_404/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_products/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_products/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_helpandadvice_general/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_helpandadvice_general/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_helpandadvice_specifier/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_helpandadvice_specifier/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_helpandadvice_trade/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_helpandadvice_trade/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_colours_collections_slug/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_colours_collections_slug/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_storelocator/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_storelocator/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_products_details_slug/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_products_details_slug/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_colours_details_slug/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_colours_details_slug/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_products_collections_slug/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_products_collections_slug/nextPage/chunks
9:54:17 AM: 💼 Copying WP4 dynamic import chunks to out_functions/next_stores_slug/nextPage
9:54:17 AM: 💼 Copying WB5 dynamic import chunks to out_functions/next_stores_slug/nextPage/chunks
9:54:17 AM: 🔀 Setting up redirects
9:54:17 AM: 🔀 Setting up headers
9:54:17 AM: ✅ Success! All done!
9:54:17 AM: ​
9:54:17 AM: (@netlify/plugin-nextjs onBuild completed in 2.6s)
9:54:17 AM: ​
9:54:17 AM: ────────────────────────────────────────────────────────────────
9:54:17 AM:   4. Functions bundling                                         
9:54:17 AM: ────────────────────────────────────────────────────────────────
9:54:17 AM: ​
9:54:18 AM: Packaging Functions from out_functions directory:
9:54:18 AM:  - next_image.js
9:54:18 AM:  - next_404/next_404.js
9:54:18 AM:  - next_api_contactus/next_api_contactus.js
9:54:18 AM:  - next_api_exitpreview/next_api_exitpreview.js
9:54:18 AM:  - next_api_preview/next_api_preview.js
9:54:18 AM:  - next_colours/next_colours.js
9:54:18 AM:  - next_colours_collections_slug/next_colours_collections_slug.js
9:54:18 AM:  - next_colours_colouratlas/next_colours_colouratlas.js
9:54:18 AM:  - next_colours_details_slug/next_colours_details_slug.js
9:54:18 AM:  - next_contactus_thankyou/next_contactus_thankyou.js
9:54:18 AM:  - next_helpandadvice/next_helpandadvice.js
9:54:18 AM:  - next_helpandadvice_general/next_helpandadvice_general.js
9:54:18 AM:  - next_helpandadvice_specifier/next_helpandadvice_specifier.js
9:54:18 AM:  - next_helpandadvice_trade/next_helpandadvice_trade.js
9:54:18 AM:  - next_index/next_index.js
9:54:18 AM:  - next_inspiration_inspirationgallery/next_inspiration_inspirationgallery.js
9:54:18 AM:  - next_products/next_products.js
9:54:18 AM:  - next_products_collections_slug/next_products_collections_slug.js
9:54:18 AM:  - next_products_details_slug/next_products_details_slug.js
9:54:18 AM:  - next_slug/next_slug.js
9:54:18 AM:  - next_storelocator/next_storelocator.js
9:54:18 AM:  - next_stores_slug/next_stores_slug.js
9:54:18 AM: ​
9:55:46 AM: ​
9:55:46 AM: (Functions bundling completed in 1m 28.9s)
9:55:46 AM: ​
9:55:46 AM: ────────────────────────────────────────────────────────────────
9:55:46 AM:   5. onPostBuild command from @netlify/plugin-nextjs            
9:55:46 AM: ────────────────────────────────────────────────────────────────
9:55:46 AM: ​
9:55:47 AM: Next.js cache saved.
9:55:47 AM: ​
9:55:47 AM: (@netlify/plugin-nextjs onPostBuild completed in 721ms)
9:55:47 AM: ​
9:55:47 AM: ────────────────────────────────────────────────────────────────
9:55:47 AM:   6. Deploy site                                                
9:55:47 AM: ────────────────────────────────────────────────────────────────
9:55:47 AM: ​
9:55:47 AM: Starting to deploy site from 'out_publish'
9:55:49 AM: Creating deploy tree asynchronously
9:55:49 AM: Creating deploy upload records
9:55:51 AM: 894 new files to upload
9:55:51 AM: 22 new functions to upload
9:56:18 AM: Site deploy was successfully initiated
9:56:18 AM: ​
9:56:18 AM: (Deploy site completed in 30.9s)
9:56:18 AM: ​
9:56:18 AM: ────────────────────────────────────────────────────────────────
9:56:18 AM:   Netlify Build Complete                                        
9:56:18 AM: ────────────────────────────────────────────────────────────────
9:56:18 AM: ​
9:56:18 AM: (Netlify Build completed in 4m 44.3s)
9:56:18 AM: Caching artifacts
9:56:18 AM: Started saving node modules
9:56:18 AM: Finished saving node modules
9:56:18 AM: Started saving build plugins
9:56:18 AM: Finished saving build plugins
9:56:18 AM: Started saving yarn cache
9:56:18 AM: Finished saving yarn cache
9:56:18 AM: Started saving pip cache
9:56:18 AM: Starting post processing
9:56:18 AM: Finished saving pip cache
9:56:18 AM: Started saving emacs cask dependencies
9:56:18 AM: Skipping HTML post processing
9:56:18 AM: Finished saving emacs cask dependencies
9:56:18 AM: Started saving maven dependencies
9:56:18 AM: Post processing - header rules
9:56:18 AM: Finished saving maven dependencies
9:56:18 AM: Started saving boot dependencies
9:56:18 AM: Finished saving boot dependencies
9:56:18 AM: Started saving rust rustup cache
9:56:18 AM: Post processing - redirect rules
9:56:18 AM: Finished saving rust rustup cache
9:56:18 AM: Started saving go dependencies
9:56:18 AM: Finished saving go dependencies
9:56:18 AM: Build script success
9:56:19 AM: Post processing done
9:56:19 AM: Site is live ✨
9:58:23 AM: Finished processing build request in 7m45.457546042s

hey! thanks for all of the info so far! this is a tough one to diagnose off that info alone. would be helpful to know:

  1. what you’re doing in your _app.js and index.js files regarding data/props fetching
  2. it’s slow on the deploy preview links as well?
  3. was this always an issue for you or was this introduced in a specific change/iteration of your site or version upgrade?
  4. this one’s the most annoying :smiley_cat: but asking you to prune down your site in a new repo to try to reproduce it for us would either (a) help you identify the root cause or (b) give us a repro to work off of

let us know! apologies for the struggles!!

2 Likes

Still having this, but on a different Next site hosted on Netlify. We’re SSGing most of the pages including the homepage, so it’s a bit odd. Looks like deploying on Vercel w/ the same “yarn build” command eliminates this TTFB issue… so might have to chalk this up to Netlify’s Next plugin. @lindsaylevine

https://ziatile.netlify.app/

https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fziatile.netlify.app%2F

hey there, @daniel :wave:

Thanks for circling back here! Sorry to hear that this issue has cropped up again for you. Can you share answers to any of the questions that @lindsaylevine asked above in the thread? This would help us dig into the situation further.

Thanks again!

Hey @hillary, so the Vercel + Netlify deployments are both going off the master branch from the same repo. If you run a PageSpeed/Lighthouse test for both (or just visit the site and pay attention to initial load), the TTFB issue is only present on the Netlify deployment.

  1. what you’re doing in your _app.js and index.js files regarding data/props fetching. The only thing going on there is configuration related to styled components.
  2. it’s slow on the deploy preview links as well? Yes
  3. was this always an issue for you or was this introduced in a specific change/iteration of your site or version upgrade? It has been an issue on multiple sites using NextJS on Netlify.
  4. this one’s the most annoying :smiley_cat: but asking you to prune down your site in a new repo to try to reproduce it for us would either (a) help you identify the root cause or (b) give us a repro to work off of
    Sorry, can’t publicly post the repo but you’re welcome to look at our Netlify account (linked to my forum account).

@lindsaylevine

I’ve seen slower TTFB’s using Next on SSR routes. That plus the fact it’s only happening on Netlify and not Vercel… has me wondering if it’s how Netlify tries to run NextJS. Perhaps in adding the ability to use SSR on Netlify… SSG pages are also being served by some sort of slower server in front… It’s all kind of odd.

@hillary @lindsaylevine

hey daniel and all! thanks for the answers. i work on the next.js plugin and opened an issue on the repo here Slow TTFB on initial document request · Issue #552 · netlify/next-runtime · GitHub. we have a lot on our plate right now so it may take us a bit to dig into this and investigate, but you can track there and we’ll try to get you answers asap. thanks a bunch again for the info and for your patience!

2 Likes