antfu / vitesse

🏕 Opinionated Vite + Vue Starter Template

Home Page:https://vitesse.netlify.app/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Index page flashing before a dynamic route is rendered

kemalcany opened this issue · comments

Hi!

An old issue that was resolved few months ago came back.

The index page is flashing very quickly before a dynamic page is rendered

You can see it here:

https://vitesse.netlify.app/hi/something

More info: #159

It is not back, this page is dynamic and so excluded by default from ssg, I wrote about it on discussions a few months ago.

I am checking how to solve this problem.

See #169

Hi @kemalcany !
Because the content of your landing page is full of content, it will flicker and load the page very quickly. However, when your project has a large number of components, you will find it slows down before the components are rendered.

@kemalcany @thuongtruong1009 You can check this repo https://github.com/userquin/test-pwa-ts-4.5.5, I have included there a sw router for dynamic pages at first level and some server logic to use it on development (also modified the netlifly configuration but not yet tested). On this repo there is no flash on the dynamic route /hi/:name.

The repo contains the pwa plugin package for some internal tests I'm doing, I have also upload the tar.gz but the repo should also work with the npm version: just run pnpm install && pnpm remove -D vite-plugin-pwa && pnpm i -D vite-plugin-pwa (to include the local version of my tests again just run pnpm add -D ./vite-plugin-pwa-0.11.13.tgz from root folder).

The changes are on this commit userquin/test-pwa-ts-4.5.5@6b6368d:

I'll try to add the app to netlify when I have time.

EDIT: I also change the pwa plugin options to use injectManifest strategy, there is no way to make it work with generateSW strategy: GoogleChrome/workbox#2917 (comment)