fulls1z3 / universal

Seed project for Angular Universal apps featuring Server-Side Rendering (SSR), Webpack, CLI scaffolding, dev/prod modes, AoT compilation, HMR, SCSS compilation, lazy loading, config, cache, i18n, SEO, and TSLint/codelyzer
http://ng-seed.fulls1z3.com
MIT License
704 stars 138 forks source link

page rendering on server side and client side #15

Open Mahmoud-hassan87 opened 7 years ago

Mahmoud-hassan87 commented 7 years ago

When try this example I show the page rendering twice on server side and rendering again on client side, Why this behavior occurs ?

Gbuomprisco commented 7 years ago

Hi @Mahmoud-hassan87,

I have the same issue and looking for a solution, even though I don't think this seed is responsible for the issue, must be a Universal issue instead. They did have an issue for this particular bug but they closed it.

fulls1z3 commented 7 years ago

@Gbuomprisco can you please share the issue url here? Maybe I can catch something from the information there.

Mahmoud-hassan87 commented 7 years ago

Your sample have this issue

Gbuomprisco commented 7 years ago

@fulls1z3 What I experience is exactly what is described in this issue https://github.com/angular/universal-starter/issues/139, and also others. Thing is these might be outdated now as they were using last year's code.

fulls1z3 commented 7 years ago

@Gbuomprisco the info seems outdated, but can be useful. I'll dig into this a little this evening and see what can I do. @Mahmoud-hassan87 thanks for the enlightment 👍

Gbuomprisco commented 7 years ago

Thanks @fulls1z3, I'll try as well

Koslun commented 7 years ago

@Mahmoud-hassan87 Not sure but you might be seeing this issue: https://github.com/angular/angular/issues/15716. Essentially the issue is that the server-rendered CSS is removed from the DOM before the client CSS is applied, causing a flicker regardless of if you transfer the state perfectly or not.

Apparently a fix should be landing in the next angular releases, i.e. 4.1.3 and 4.2.0-beta.2. Where the renderer waits for the client to finish before removing the server CSS.

Gbuomprisco commented 7 years ago

Thanks @Koslun

fulls1z3 commented 7 years ago

@Koslun thank you so much for this information, now I realized the reason that I subscribed to the updates of https://github.com/angular/angular/issues/15716. Seems like we'll get it working soon, and I'm keeping this issue open in order to do not leave it unresolved.

Skillnter commented 7 years ago

Is there any update on flickering issue??

fulls1z3 commented 7 years ago

@Skillnter we're working on this issue, as well as other enhancements to this seed project - so soon I'll be able to share some updates.

smadil997 commented 5 years ago

Is there any update on flickering issue??