bundle-dynamic-imports

What problem does it solve?

This Skill helps reduce bundle sizes and improve initial render times by lazily loading heavy components only when needed.

Core Features & Use Cases

• Lazy-load heavy components with next/dynamic to split bundles and reduce initial load.
• Apply to editors, charts, and rich widgets that aren't required on initial render.
• Use Case: Imagine an admin dashboard with a full Monaco editor; load it on demand when the user opens the editor.

Quick Start

Use next/dynamic to wrap a heavy component (e.g., MonacoEditor) and disable SSR, loading it only when the user activates the feature.