Will It Vibe?Heavy client library imported without next/dynamic
Part of Code Quality & Syntax, which counts for 20% of the overall score. When this check fires it deducts 4 points from that category, once per scan, no matter how many places it turns up.
What it detects
A large client-only library (charting, mapping, editor, 3D, PDF) is imported statically at the top of a module, so it is bundled into the initial JavaScript payload. Heuristic: loading it with next/dynamic and ssr:false keeps it off the critical path, but a genuinely server-rendered use may not need that.
Why it matters
Importing a large client-only library (charting, mapping, code editor, 3D, PDF) at the top of a module pulls it into the initial JavaScript bundle, so users download and parse it before the page is interactive even if the feature is below the fold or rarely used. This is a heuristic: a server-rendered use of the library may not ship to the client at all, so confirm the import runs in the browser before changing it.
How to fix it
Load the heavy component with next/dynamic, for example const Chart = dynamic(() => import("./Chart"), { ssr: false }), so its code splits into a separate chunk fetched only when the component actually renders. Add a lightweight loading placeholder for the interim.
The paid report includes a ready-to-paste prompt for your AI coding agent for every check it finds, pointed at the exact findings from your scan. See pricing
Does your repo trip this check?
Paste a GitHub URL or drop a project folder. Scans run in your browser and take seconds.
Scan your repo