Firebase hosting with next.js app router deployment speed

[LorenzoYeKai]

Hi,
we recently deployed a project built in next.js 14 with app router through firebase hosting and we notices extremely elevated deployment time, in the order of 10 to 20 minutes.
We noticed 2 bottlenecks. The first one is the deployment of the SSR cloud function.
The second one is the generation of the service identity for eventarc.googleapis.com.

I want to understant if we are doing something wrong as a deployment this slow is very inconvenient.

This is the firebase.json file

  {
    "hosting": {
      "source": ".",
      "ignore": ["firebase.json", "**/.*", "**/node_modules/**", ".next/**"],
      "frameworksBackend": {
        "region": <region>
      }
    }
  }

This is the deplyment log:

✓ Compiled successfully

   Linting and checking validity of types ...

   Collecting page data ...

(node:34282) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
(Use `node --trace-deprecation ...` to show where the warning was created)

(node:34285) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
(Use `node --trace-deprecation ...` to show where the warning was created)

   Generating static pages (0/7) ...

(node:34283) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
(Use `node --trace-deprecation ...` to show where the warning was created)

   Generating static pages (1/7) 

(node:34286) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
(Use `node --trace-deprecation ...` to show where the warning was created)

   Generating static pages (3/7) 

   Generating static pages (5/7) 

 ✓ Generating static pages (7/7) 

   Finalizing page optimization ...

   Collecting build traces ...



Route (app)                              Size     First Load JS
┌ ○ /                                    23.3 kB         118 kB
├ ○ /_not-found                          885 B          85.6 kB
├ ○ /<page>                               138 B          84.9 kB
├ λ /<page>/[slug]                      18.3 kB         307 kB
└ ○ /<page>                              775 B          95.8 kB
+ First Load JS shared by all            84.7 kB
  ├ chunks/13-051d953b78acf82d.js        29.2 kB
  ├ chunks/c2a6b034-96553f43a0c18584.js  53.4 kB
  └ other shared chunks (total)          2.19 kB



○  (Static)   prerendered as static content
λ  (Dynamic)  server-rendered on demand using Node.js


Building a Cloud Function to run this application. This is needed due to:
 • non-static <component-name>

128 packages are looking for funding
  run `npm fund` for details

=== Deploying to <project-name>...

i  deploying functions, hosting
i  functions: preparing codebase <codebse-name> for deployment
i  functions: ensuring required API cloudfunctions.googleapis.com is enabled...
i  functions: ensuring required API cloudbuild.googleapis.com is enabled...
i  artifactregistry: ensuring required API artifactregistry.googleapis.com is enabled...
✔  functions: required API cloudbuild.googleapis.com is enabled
✔  functions: required API cloudfunctions.googleapis.com is enabled
✔  artifactregistry: required API artifactregistry.googleapis.com is enabled
⚠  functions: package.json indicates an outdated version of firebase-functions. Please upgrade using npm install --save firebase-functions@latest in your functions directory.
i  functions: Loading and analyzing source code for codebase<codebse-name> to determine what to deploy
Serving at port 8231

i  functions: Loaded environment variables from .env.
i  functions: preparing .firebase/<project-name>/functions directory for uploading...
i  functions: packaged <path> (357.07 MB) for uploading
i  functions: ensuring required API run.googleapis.com is enabled...
i  functions: ensuring required API eventarc.googleapis.com is enabled...
i  functions: ensuring required API pubsub.googleapis.com is enabled...
i  functions: ensuring required API storage.googleapis.com is enabled...
✔  functions: required API storage.googleapis.com is enabled
✔  functions: required API eventarc.googleapis.com is enabled
✔  functions: required API run.googleapis.com is enabled
✔  functions: required API pubsub.googleapis.com is enabled
i  functions: generating the service identity for pubsub.googleapis.com...
i  functions: generating the service identity for eventarc.googleapis.com...
✔  functions: <path> folder uploaded successfully
i  hosting[<project-name>]: beginning deploy...
i  hosting[<project-name>]: found 72 files in <path>
✔  hosting[<project-name>]: file upload complete
i  functions: updating Node.js 20 (2nd Gen) function <function-name>...
✔  functions[<function-name>] Successful update operation.
Function URL (<function-name>): <url>
i  functions: cleaning up build files...
i  hosting[<project-name>]: finalizing version...
✔  hosting[<project-name>]: version finalized
i  hosting[<project-name>]: releasing new version...
✔  hosting[<project-name>]: release complete

Any help would be appreciated

[wneel]

Unfortunately, there's not much you can do to speed up the deployment imo. Firebase Hosting was not originally designed for frameworks like Next.js, which is why the deployment process, especially for SSR functions, is quite slow.

However, once Firebase App Hosting moves out of beta, it will be a much better solution for this type of project. App Hosting is specifically designed for modern frameworks and will significantly improve deployment speed. When it's stable, migrating to it should make the process much faster and more efficient :)

Hope it helps !