var lesson = {
	files: [
		{
			name: "main",
			content: "import { render } from \"solid-js/web\";\nimport { lazy } from \"solid-js\";\n\nimport Greeting from \"./greeting\"\n\nfunction App() {\n  return (\n    <>\n      <h1>Welcome</h1>\n      <Greeting name=\"Jake\" />\n    </>\n  );\n}\n\nrender(() => <App />, document.getElementById(\"app\"));\n"
		},
		{
			name: "greeting",
			content: "export default function Greeting(props) {\n  return <h3>Hi, {props.name}</h3>\n}"
		}
	]
};
var solved = {
	files: [
		{
			name: "main",
			content: "import { render } from \"solid-js/web\";\nimport { lazy } from \"solid-js\";\n\nconst Greeting = lazy(() => import(\"./greeting\"));\n\nfunction App() {\n  return (\n    <>\n      <h1>Welcome</h1>\n      <Greeting name=\"Jake\" />\n    </>\n  );\n}\n\nrender(() => <App />, document.getElementById(\"app\"));\n"
		},
		{
			name: "greeting",
			content: "export default function Greeting(props) {\n  return <h3>Hi, {props.name}</h3>\n}"
		}
	]
};
var markdown = "ほとんどのバンドラー（Webpack, Rollup, Parcel, Vite など）は、動的インポートを使用する際にコード分割を自動的に処理します。Solid の `lazy` メソッドでは、コンポーネントの動的インポートをラップして遅延ロードを行うことができます。出力されるのは、JSX テンプレートで通常どおりに使用できるコンポーネントです。ただし、内部的には、最初にレンダリングされるときに、基となるインポートされたコードを動的にロードし、コードが利用可能になるまでレンダリングのブランチを停止するという例外があります。\n\n`lazy` を使用するには、import 文を置き換えます:\n```js\nimport Greeting from \"./greeting\";\n```\nこのように:\n```js\nconst Greeting = lazy(() => import(\"./greeting\"));\n```\n\nこれでもロードが早すぎて見えないかもしれません。しかし、ローディングをより見やすくしたい場合は、偽の遅延を追加します。\n\n```js\nconst Greeting = lazy(async () => {\n  // 遅延をシミュレート\n  await new Promise(r => setTimeout(r, 1000))\n  return import(\"./greeting\")\n});\n```\n";
var async_lazy = {
	lesson: lesson,
	solved: solved,
	markdown: markdown
};

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