Your church has been faithfully posting sermons for eight years. That is a witness. It is also, on the archive page, five hundred cards of thumbnails, titles, dates, and short descriptions the browser is asked to lay out the instant someone lands. On a mid-range Android phone, that is where the scroll starts to jitter.
For a long time the only real fix was to paginate, or to reach for a JavaScript virtualization library and hope it stayed maintained. Neither is ideal for a ministry that wants sermons to feel effortless to find. Since September 2024 there has been a simpler option, and it fits on one line.
The property is content-visibility: auto. Applied to each sermon card, it tells the browser: this element exists in the document — findable by search, linkable by anchor, reachable by keyboard — but you do not need to lay it out or paint it until it is near the viewport. Scroll into range, and the browser renders it. Scroll away, and it can skip it again.
For a long archive page, the effect on first paint is not subtle. In one widely cited demo, chunked content areas rendered around seven times faster on initial load. Real church sites we have measured see the largest contentful paint drop by hundreds of milliseconds on lower-end phones — often the exact devices used by the members you most want to reach.
The setup is short. Give each card a class, then:
.sermon-card {
content-visibility: auto;
contain-intrinsic-size: auto 320px;
}
The second line matters. It reserves a rough placeholder height so the scrollbar behaves and the page does not jump as cards render. Pick a number close to your card's real height; it does not need to be exact.
Two caveats worth knowing. content-visibility: auto skips layout, not asset downloads — pair it with loading="lazy" on your card images so the browser also defers the fetches. And test browser find-in-page ("Cmd/Ctrl-F") on your archive; it should still surface matches inside off-screen cards, but confirm on your template rather than assuming.
That is the whole change. No refactor, no new library, no pagination redesign. Just a growing witness that keeps loading like it did on week one.
If your sermon archive has quietly gotten heavier over the years and you want a second set of eyes on the performance work — or a redesign that ages better as the library grows — we would be glad to take a look.