Add guide: Prerendering

[JonasKruckenberg]

TODO

SSG is a performance optimization commonly found in traditional web development where static HTML pages are generated at build time and hydrated at runtime. This is done to improve the rendering of a web page.

SSG applies to desktop apps too. An app that renders a blank page and then draws the app's content feels very out of place on the desktop, so optimizing the time-to-first-paint is crucial for desktop apps.

Details

• explain why it is important
  • link to App Shell architecture
• explain how to do it
  • link to relevant sections in Vite, Rollup, Webpack guides
  • link to relevant sections in React, Vue, Svelte guides
• explain problems
  • no access to window during SSG
  • libraries
  • nodejs problems with cjs and esm
• explain @tauri-apps/api/mocks usage in SSG

[chippers]

I am familiar with prerendering with webpack with prerender-spa-plugin. Not with any of the other tools

[JonasKruckenberg]

You can also just throw up a draft on hackmd for this, so we can work on this together

[simonhyll]

We cover this in https://beta.tauri.app/guides/frontend/ and each framework have to provide instructions on setting up SSG one way or another. Closing this as complete since this is more a task for specific frameworks, not a general article.