クライアントサイドレンダリングは、ページをインタラクティブにするものです(このアプリでは、ボタンをクリックしたときにカウンターを増やすなど)。SvelteKitは、フルページのリロードなしでナビゲーション時にページを更新できます。
ssr
と同様に、クライアントサイドレンダリングを完全に無効にすることができます。
src/routes/+page.server
export const csr = false;
これは、クライアントにJavaScriptが提供されないことを意味しますが、コンポーネントがインタラクティブではなくなることも意味します。これは、何らかの理由でJavaScriptを使用できないユーザーにとって、アプリケーションが使用可能かどうかを確認するのに便利な方法です。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script>
import { browser } from '$app/environment';
let count = $state(0);
function increment() {
count += 1;
}
</script>
<h1>Rendered {browser ? 'in the browser' : 'on the server'}</h1>
<button onclick={increment}>
Clicks: {count}
</button>