Skip to main content

クライアントサイドレンダリングとは、ページをインタラクティブ (例えばこのアプリでは、ボタンクリックでカウンターがインクリメントするようになる) にし、SvelteKit がナビゲーション時にフルページリロードなしでページを更新できるようにすることです。

ssr と同じように、クライアントサイドレンダリングも完全に無効にすることができます。

src/routes/+page.server.js
export const csr = false;

これは、JavaScript がクライアントに全く提供されなくなることを意味しますが、それだけでなく、コンポーネントがインタラクティブでなくなることも意味します。これは、なんらかの理由で JavaScript が使用できない方々にとって、あなたのアプリケーションが使いやすいかどうかを確認するのに便利です。

Next: prerender

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script>
	import { browser } from '$app/environment';
 
	let count = 0;
 
	function increment() {
		count += 1;
	}
</script>
 
<h1>Rendered {browser ? 'in the browser' : 'on the server'}</h1>
 
<button on:click={increment}>
	Clicks: {count}
</button>
initialising