Why Insigne Slider
Two libraries dominate this space. Swiper is free and everywhere; Slider Revolution is the premium visual tool for WordPress. Insigne Slider was built after hitting the same walls with both.
Where Swiper stops
| Gap | What it means in practice |
|---|---|
| No layer or text animation | Headlines that rise letter by letter, buttons that arrive after the title — you need GSAP or hand-written CSS per slide. Swiper only has data-swiper-parallax. |
| Few effects | slide, fade, cube, coverflow, flip, cards, creative. Shader transitions are sold separately. |
| Loop re-orders the DOM | Loop mode moves slides around. With few slides or several per view you get gaps; frameworks lose track of their nodes. |
| Responsive is manual | Breakpoints default to the window width and every size is written by hand. |
| Backgrounds get cropped | There is no focal point or safe area. object-fit: cover cuts the subject on phones. |
| Height jumps | autoHeight animates after the fact and causes layout shift. |
Where Slider Revolution stops
| Gap | What it means in practice |
|---|---|
| WordPress only, paid per site | No plain HTML, React or Vue projects. |
| Heavy | The demo pages load a ~160 KB core, ~80 KB of GSAP tools and jQuery (uncompressed). |
| Editor-only | Slides live in a proprietary JSON edited in a visual editor; there is no real code API and no version control. |
| Five layouts by hand | Every layer is positioned separately for five device sizes. |
| Backgrounds are CSS | background-image means no alt text, weak lazy loading and cropping by background-position only. |
What Insigne does differently
- One engine, three APIs with the same option names: component,
data-*, JS/JSON. - Zero-config responsive: container-based, height from the image, columns from
minSlideWidth. - Smart fit: focal point + safe area, zoom out with a blurred fill only when needed,
height: "image"for no cropping at all. The WebGL transitions use the same placement. - Layers as data: recipes with split text, stagger and masks, played by the Web Animations API (≈9 KB, loaded on demand).
- WebGL included, with CSS fallback when WebGL or CORS is missing.
- Loop without clones and every effect draggable.
- Accessible by default: roles, live region, inert off-screen slides, keyboard, pause button, reduced motion.
Measured sizes
Gzip, measured on 19 October 2026 from published files.
| Package | Size | Includes |
|---|---|---|
Swiper 14.3.0 swiper-bundle.min.js + CSS | 46.0 KB | all modules |
Swiper 14.3.0 swiper.min.js | 19.9 KB | core only: no navigation, pagination, autoplay or effects |
| Insigne core | 44.6 KB | navigation, pagination, autoplay, a11y, 27 effects, smart fit, component, data-*, JSON, CSS |
+ layers (only with data-in) | +8.8 KB | 22 text + 8 image recipes |
| + WebGL (only with a WebGL effect) | +7.9 KB | 13 shaders |
| Insigne single-file build | 66.5 KB | everything, for a classic <script> |