Bundle Conditional

Name: Bundle Conditional
Author: anubhavg-icpl

ASecurity

Conditional Module Loading. Use when you need help with bundle conditional.

9 stars
0 votes
0 copies
4 views
Added September 8, 2026

developmentgo

Security analysis

A100/100

Scanned September 8, 2026

npx -y skills add anubhavg-icpl/vibe --skill bundle-conditional --agent claude-code

Installs into .claude/skills of the current project.

Are you the author of Bundle Conditional?

Add the live security badge to your README. It updates with every re-scan.

Security grade badge for Bundle Conditional

[![Security: A — Skills Directory](https://www.skillsdirectory.com/api/skills/anubhavg-icpl-bundle-conditional/badge)](https://www.skillsdirectory.com/skills/anubhavg-icpl-bundle-conditional)

More formats (shields.io, HTML) on the badges page. Keep it an A: scan every change in CI with Pro.

Download with Pro

SKILL.md

---
name: bundle-conditional
description: Conditional Module Loading. Use when you need help with bundle conditional.
license: CC-BY-NC-SA-4.0
metadata:
  risk: unknown
  source: community
  kind: mode
  category: rules
---

## Conditional Module Loading

Load large data or modules only when a feature is activated.

**Example (lazy-load animation frames):**

```tsx
function AnimationPlayer({ enabled }: { enabled: boolean }) {
  const [frames, setFrames] = useState<Frame[] | null>(null);

  useEffect(() => {
    if (enabled && !frames && typeof window !== "undefined") {
      import("./animation-frames.js").then((mod) => setFrames(mod.frames)).catch(() => setEnabled(false));
    }
  }, [enabled, frames]);

  if (!frames) return <Skeleton />;
  return <Canvas frames={frames} />;
}
```

The `typeof window !== 'undefined'` check prevents bundling this module for SSR, optimizing server bundle size and build speed.