Rendering Modes
Evidence supports two rendering modes:
- Static Site Generation (Default)
- Single Page App (SPA)
Choosing a Rendering Mode
You should generally only use the SPA rendering mode if one of the following is true:
- You have a large number of pages, >1000+ is a good rule of thumb
- You want to update your data frequently, so short build times are desirable
- Your data sources are large (in which case you may want to combine this with Evidence's Cloud Execution Engine)
Comparison
| Rendering Mode | Static Site Generation | Single Page App |
|---|---|---|
| Content Rendering | Pre-rendered at build time | Rendered on the client side |
| Page Generation | Each page generated ahead of time | Only one HTML file generated |
| Built Output | All pages have corresponding HTML files | Pages rendered on the fly using JavaScript |
| Build Duration | Slower due to building all pages | Fast as only one page is built |
| Performance | Fast page loads | Slower page loads |
| SEO | Rich SEO for all pages | Generic SEO for your whole app |
No Results
Enabling SPA Mode
SPA rendering mode is disabled by default.
To enable SPA rendering mode:
- Update the build and preview scripts in
package.json:
"build": "VITE_EVIDENCE_SPA=true evidence build",
"preview": "VITE_EVIDENCE_SPA=true evidence preview",- Add svelte adapter-static as a dev dependency:
npm install --save-dev @sveltejs/adapter-static- Add a
svelte.config.jsfile to the root of your project containing the following:
import adapter from '@sveltejs/adapter-static';
/** @type {import("@sveltejs/kit").Config} */
export default {
kit: {
adapter: adapter({
fallback: 'index.html'
})
},
};