search

lukeed / pwa

(WIP) Universal PWA Builder
https://pwa.cafe
3.13k stars 101 forks source link

[question] can we run critters after export? #42

Open tuananh opened 6 years ago

tuananh commented 6 years ago

From what I observe, pwa export will use chrome to pre-render all pages (default) with css classes and everything. So running critter after this point make more sense right?

lukeed commented 6 years ago

Hey, we can only run Critters within the build process. There's no other place to put it since it's a webpack plugin.

Were you seeing an issue? Why do you think it should be elsewhere?

tatchi commented 6 years ago

Hey,

What about using prerender-loader to produce the HTML files ? Would it be a good idea?

Furthermore, the critters github page says:

Critters' design makes it a good fit when inlining critical CSS for prerendered/SSR'd Single Page Applications. It was developed to be an excellent compliment to prerender-loader, combining to dramatically improve first paint time for most Single Page Applications.

lukeed commented 6 years ago

You can use prerender-loader instead of pwa export, though I don't know why you would since it's the same functionality. You'd have to configure it manually inside your pwa.config.js which would be easy.

Critters already works, as is, with pwa build and pwa export. This is why it's included as an official plugin :) Are you guys having issues with it?

You can verify it's working by viewing the source of your built pages. A lot of CSS will be inlined in the <head> of your page(s).

tuananh commented 6 years ago

@lukeed it seems the css generated by critters is not all the critical css. i will try to make a minimal example to reproduce it.

lukeed commented 6 years ago

Great, thanks! If that's the case, it's likely an issue with Critters itself, but I'm happy to take a look & pass it along to Critters if needed.

tatchi commented 6 years ago

Hey,

Thanks for the answer :) I personally don't have any issue with the pwa export functionality. I just had the impression that the export was done more or less manually (with the chrome-launcher). Since a webpack plugin can achieve the same result, I was just wondering if it would be a good idea to use it instead.