var lesson = {
	files: [
		{
			name: "main",
			content: "import { render } from 'solid-js/web';\nimport { createSignal, createMemo } from 'solid-js';\n\nfunction fibonacci(num) {\n  if (num <= 1) return 1;\n\n  return fibonacci(num - 1) + fibonacci(num - 2);\n}\n\nfunction Counter() {\n  const [count, setCount] = createSignal(10);\n  const fib = () => fibonacci(count());\n\n  return (\n    <>\n      <button onClick={() => setCount(count() + 1)}>Count: {count()}</button>\n      <div>1. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>2. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>3. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>4. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>5. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>6. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>7. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>8. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>9. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>10. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n    </>\n  );\n}\n\nrender(() => <Counter />, document.getElementById('app'))\n"
		}
	]
};
var solved = {
	files: [
		{
			name: "main",
			content: "import { render } from 'solid-js/web';\nimport { createSignal, createMemo } from 'solid-js';\n\nfunction fibonacci(num) {\n  if (num <= 1) return 1;\n\n  return fibonacci(num - 1) + fibonacci(num - 2);\n}\n\nfunction Counter() {\n  const [count, setCount] = createSignal(10);\n  const fib = createMemo(() => fibonacci(count()));\n\n  return (\n    <>\n      <button onClick={() => setCount(count() + 1)}>Count: {count()}</button>\n      <div>1. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>2. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>3. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>4. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>5. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>6. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>7. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>8. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>9. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n      <div>10. {fib()} {fib()} {fib()} {fib()} {fib()}</div>\n    </>\n  );\n}\n\nrender(() => <Counter />, document.getElementById('app'))\n"
		}
	]
};
var markdown = "ほとんどの場合、派生 Signal を合成すれば十分です。しかし、重複した作業を減らすために、値をキャッシュすると有益な場合もあります。特別なプリミティブである Memo を使って、最後にキャッシュされた値を保存し、その依存関係が変わるまで再評価せずにアクセスできます。値を読み取る際に再評価を行わないようにすることで、DOM ノードの作成などのコストのかかる操作にアクセスする際に必要な作業を減らすことができます。特に、多くの場所でアクセスされている場合や、複数の依存関係を持つ Effect の一部としてアクセスされている場合に有効です。\n\nMemo は Effect のような追跡計算であると同時に、読み取り専用の Signal でもあります。Memo は依存関係とオブザーバーの両方を認識しているため、どのような変更でも一度しか実行されないことを保証できます。これにより、Signal に書き込む Effect を登録するよりも好ましいものとなります。一般的に、派生できるものは、派生させるべきです。\n\nMemo の作成は、`solid-js` からインポートできる `createMemo` に関数を渡すだけで簡単です。この例では値を再計算していて、クリックするたびにコストが高くなっていきます。createMemo でラップするだけで、1 回のクリックで 1 回の再計算が行われます。\n\n```jsx\nconst fib = createMemo(() => fibonacci(count()));\n```\n確認したい場合は、`fib` 関数内に console.log を設置してください。\n```jsx\nconst fib = createMemo(() => {\n  console.log(\"Calculating Fibonacci\");\n  return fibonacci(count());\n});\n```\n";
var introduction_memos = {
	lesson: lesson,
	solved: solved,
	markdown: markdown
};

export { introduction_memos as default, lesson, markdown, solved };
