Community

Public Snippets 6

Code shared by the SaveSnippets community — browse, copy, and get inspired.

#dom Clear
Tags #utils #browser #performance #array #async #dom #objects #pattern #events #format #concurrency #http #ui #advanced #fetch #url #string #functional #cache #files #crypto #promise #intl #observer
JavaScript Intersection Observer (Lazy Load / Reveal)
Uses the IntersectionObserver API to trigger a callback when elements enter the viewport. The reveal pattern adds a visible class to animate elements as they scroll into view. The lazyLoad pattern loads images on demand by swapping data-src to src. Much more performant than scroll event listeners.
#dom #observer #lazyload #performance
@admin 9h ago
View
JavaScript Delegate Event Listener
Attaches a single event listener to a parent element and handles events from matching descendant elements via event delegation. More efficient than attaching listeners to many individual elements, and works for elements added dynamically to the DOM after the listener is registered.
#dom #events #delegation #utils
@admin 9h ago
View
JavaScript DOM Ready Helper
Runs a callback when the DOM is fully parsed and ready, without waiting for images or stylesheets. Works whether called before or after DOMContentLoaded has already fired — unlike a bare addEventListener which misses the event if the DOM is already ready when the script runs.
#dom #utils #browser
@admin 9h ago
View
JavaScript Create Element Helper
A concise helper for creating DOM elements with attributes, properties, styles, event listeners, and children in one call — similar to hyperscript or JSX without a build step. Eliminates repetitive createElement / setAttribute / appendChild chains and keeps DOM construction code readable.
#dom #utils #hyperscript
@admin 9h ago
View
JavaScript Animate Counter (Number Roll-Up)
Smoothly animates a number from a start value to an end value over a given duration using requestAnimationFrame. Supports a custom easing function (defaults to ease-out quad). Ideal for dashboard stat widgets, donation counters, and any UI where a bare static number would be less impactful.
#animation #dom #counter #ui
@admin 9h ago
View
JavaScript Scroll to Element Smoothly
Scrolls the page to a target element with an optional pixel offset (useful when a fixed header is present). Uses the native scrollIntoView with smooth behaviour when supported, and falls back to a manual scrollTo with a configurable offset. Pass a CSS selector string or an Element reference.
#dom #scroll #animation #utils
@admin 9h ago
View