Import On Visibility
patternsdev/skills/javascript/import-on-visibilityby patternsdev48bf58a488cdMIT253 starsListed Oct 8, 2026Updated Oct 8, 2026Repository updated 5 months ago
Teaches visibility-based lazy loading using Intersection Observer. Use when you have below-the-fold components or images that don't need to load until the user scrolls to them.
Only the file list is public. File contents are available once the skill is installed in a workspace.
| Path | Size | Type |
|---|---|---|
| SKILL.md | 2.3 KB | text/markdown |
Source and attribution
Source:patternsdev/skillsinjavascript/import-on-visibilityat commit48bf58a
License: MIT
Content belongs to its original authors. SourceWeft indexes it from a public repository.
More from patternsdev/skills
Virtual Lists
patternsdev
Teaches list virtualization (windowing) techniques for rendering large lists and grids efficiently.
View Transitions
patternsdev
Teaches the View Transitions API for animating DOM changes and page navigations in web applications.
Tree Shaking
patternsdev
Explains tree shaking for removing unused JavaScript exports to shrink bundles during the build step.
Third Party
patternsdev
Guides developers in reducing the page-load and Core Web Vitals impact of third-party scripts such as analytics, ads and embeds.
Static Import
patternsdev
Explains ES2015 static import syntax and when to prefer it over dynamic imports for module dependencies.
Singleton Pattern
patternsdev
Teaches the JavaScript singleton pattern for managing one shared instance, with examples and tradeoffs.
More in Software Development
Playground
anthropics
Builds self-contained interactive HTML playgrounds with controls, live preview, and copyable prompt output.
M5 Onboard
anthropics
Provisions M5Stack ESP32 boards by detecting them on USB, flashing UIFlow 2.0 firmware, and installing a MicroPython app bundle.
Cardputer Buddy
anthropics
Guides iterating on a Cardputer-Adv MicroPython app bundle: adding apps, pushing files over USB-serial, tailing logs, and running REPL commands.
Web Design Guidelines
vercel-labs
Reviews UI code against Web Interface Guidelines fetched from a remote source and reports findings as file:line entries.
Vercel React Native Skills
vercel-labs
React Native and Expo best-practice rules covering list performance, animation, navigation, UI patterns, state, and monorepo setup.
Vercel React Best Practices
vercel-labs
Vercel's React and Next.js performance guidelines, organized as 70 rules for writing, reviewing, and refactoring code.