Timeout just in the first load with Angular 18 and SSR

Open
#3,551 10 comments 3 reactions 0 assignees View on GitHub

Maintainers usually reply within 3 days

Nobody has claimed this yet.

Assessment

Difficulty
4/5
Estimated time
3-5 days
Newbie friendliness
35/100
Issue type
Bug
Clarity
Mostly clear
Activity status
Stale
Tech stack
angular, firebase, typescript
Domain
cloud, frontend

Research direction

Clone the linked lacomanda-front minimal reproduction and reproduce the first-load timeout for / with the listed Angular, Firebase, and AngularFire versions. Start with the SSR rendering path shown in @angular/build/src/utils/server-rendering/render-page.js and compare the first request with a reload. Done means the initial page load renders without the 30-second timeout locally and on Firebase App Hosting.

Written by the indexing model from the issue text.

Description

Version info

Angular: 18.0.5

Firebase: latest

AngularFire: 18.0.1

How to reproduce these conditions

Clone this minimal reproduction repository containing just a boostraped project that use Firebase to get the SEO data for a page:

https://github.com/quedicesebas/lacomanda-front

Sample data and security rules

I'm just loading the SEO meta tags info form firebase.

You just need to use this two documents:

brandDomains/lafocachera.co
{"brandId": "lafocachera"}

seoConfigs/lafocachera
{
"meta":
"card": "summary",
"description": "FOCACCIA Y PIZZA AL TAGLIO. Para llevar o DIRECTO A TU CASA",
"image": "https://lafocachera.co/assets/lafocachera/meta.jpg",
"type": "website",
"url": "https://lafocachera.co/"
},
"title "La Focachera - Domicilios MOSQUERA FUNZA Y MADRID"
}

Debug output

I got this just the first time. If I press F5, reloads well each consequent time.

Page / did not render in 30 seconds.
    at Timeout.<anonymous> (C:\Users\srrge\source\repos\esaes\alacarta\lacomanda-front\node_modules\@angular\build\src\utils\server-rendering\render-page.js:90:90)
    at Timeout.timer (C:\Users\srrge\source\repos\esaes\alacarta\lacomanda-front\node_modules\zone.js\fesm2015\zone-node.js:2249:37)
    at _ZoneDelegate.invokeTask (C:\Users\srrge\source\repos\esaes\alacarta\lacomanda-front\node_modules\zone.js\fesm2015\zone-node.js:398:33)
    at _ZoneImpl.runTask (C:\Users\srrge\source\repos\esaes\alacarta\lacomanda-front\node_modules\zone.js\fesm2015\zone-node.js:158:47)
    at invokeTask (C:\Users\srrge\source\repos\esaes\alacarta\lacomanda-front\node_modules\zone.js\fesm2015\zone-node.js:479:34)
    at Timeout.ZoneTask.invoke (C:\Users\srrge\source\repos\esaes\alacarta\lacomanda-front\node_modules\zone.js\fesm2015\zone-node.js:468:48)
    at Timeout.data.args.<computed> (C:\Users\srrge\source\repos\esaes\alacarta\lacomanda-front\node_modules\zone.js\fesm2015\zone-node.js:2231:32)
    at listOnTimeout (node:internal/timers:573:17)
    at process.processTimers (node:internal/timers:514:7
Expected behavior

Should load the first-time without timeout

Actual behavior

Timeout the first load (in local and deployed to Firebase App Hosting also)

Dominant language
TypeScript
Stars
7.8k
Forks
2.1k
Avg merge
2d 22h
Merged PRs (30d)
25

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from angular/angularfire

All issues in angular/angularfire

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.