docs: add warning about DOMContentLoaded timing issue with Vite

Add a warning section explaining why using DOMContentLoaded event with top-level Loro imports fails in Vite. The issue occurs due to the timing conflict between DOMContentLoaded and asynchronous ES module/WASM initialization. Provides two solutions: removing the event listener or using dynamic imports.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

Author: zxch3n

pages/docs/tutorial/get_started.md

@@ -44,6 +44,47 @@ export default defineConfig({
 });
 ```
 
+<details>
+<summary>⚠️ Important: Module Loading Timing in Vite</summary>
+
+When using Loro with Vite, be aware of module loading timing issues with DOM events:
+
+**Problem:** The following code will cause nothing to load on the screen:
+
+```ts
+import { LoroDoc } from 'loro-crdt';
+
+document.addEventListener("DOMContentLoaded", () => {
+  const doc = new LoroDoc();
+  // Your code here...
+});
+```
+
+**Reason:** This occurs because Vite loads ES modules asynchronously, and the WASM module initialization within `loro-crdt` also happens asynchronously. When you import at the top level but execute code inside `DOMContentLoaded`, the WASM module may not be fully initialized when the event fires, causing the application to fail silently.
+
+**Solutions:**
+
+1. **Remove the event listener** (recommended for most cases):
+   ```ts
+   import { LoroDoc } from 'loro-crdt';
+   
+   const doc = new LoroDoc();
+   // Your code here...
+   ```
+
+2. **Use dynamic import inside the event listener**:
+   ```ts
+   document.addEventListener("DOMContentLoaded", async () => {
+     const { LoroDoc } = await import('loro-crdt');
+     const doc = new LoroDoc();
+     // Your code here...
+   });
+   ```
+
+The dynamic import ensures the module and its WASM dependencies are fully loaded before use.
+
+</details>
+
 If you're using `Next.js`, you should add the following to your next.config.js:
 
 ```js no-run