Guide
Performance
Bundle size, tree-shaking, virtual lists, and practical guidance for large option/data sets.
Bundle strategy
Nmorph is intentionally very small and supports tree-shaking. Import only the components, icons, and style entrypoints your screen uses so modern bundlers can remove unused exports from the final application bundle.
CSS stays marked as side effects, so component styles remain reliable while JavaScript and icon exports can still be optimized by the bundler.
Virtualization
Nmorph includes `useVirtualList`, used by large-data components to render only the visible slice. It tracks the scroll container, viewport height, item height, overscan, total height, and offset.
Where to use it
Enable virtualization for `NmorphTable`, `NmorphSelect`, and `NmorphAutocomplete` when rows or options are large enough to make DOM size noticeable. Keep item height accurate so keyboard navigation and scroll position stay predictable.
- Use overscan to reduce visible pop-in during fast scroll.
- Keep row and option templates stable in height.
- Disable virtualization for small lists where native rendering is simpler.
SSR notes
Virtualization depends on client-side measurements. In Nuxt, expect the final visible slice to settle after mount when the scroll container size is known.