CSS Grid Lanes

Original Article ↗ Hacker News Discussion ↗

Native masonry / Grid Lanes reception

  • Many are enthusiastic: this replaces hacky JS masonry libraries (absolute positioning, aspect-ratio pre-calcs, resize recalcs) with a native, performant primitive.
  • Seen as part of a broader move to shift common layout patterns from JS hacks into standardized CSS, giving engines room to optimize.

Browser support, old devices, and progressive enhancement

  • Concern: each new CSS feature accelerates dropping support for older browsers/OSes, excluding users on old machines.
  • Counterpoints:
    • Browsers auto-update far faster now; very old devices are already unsafe/unusable.
    • Developers can use @supports to progressively enhance and keep simpler fallbacks.
    • Catering to 10+ year old browsers is seen by many as an unreasonable drag on quality and developer time.
  • Disagreement over actual share of users on older browser versions and how carefully most devs handle compatibility.

Spec process, naming, and Firefox’s masonry

  • Firefox’s grid-template-rows: masonry existed behind a flag and will keep working, but it’s effectively superseded by Grid Lanes.
  • Discussion recounts years of debate: naming (“masonry” vs more descriptive terms) and whether this is “really grid” or its own thing.
  • Some felt the decision-making process was opaque; others point to multiple public calls for feedback over 18+ months.

Safari/WebKit and interop

  • Multiple comments praise Safari/WebKit’s recent push: strong Interop 2025 scores, many modern CSS/HTML features, WebGPU, etc.
  • Debate over Safari’s non-evergreen model: some criticize slow propagation of fixes due to OS-tied releases; others argue the web platform shouldn’t move as fast as Chromium.
  • Interop scores are clarified as covering a chosen subset of WPT tests, not “100% of the web.”

UX, accessibility, and use cases

  • Strong criticism of masonry/lane layouts for systematic reading: hard to scan in a reliable order, cognitively heavy, especially with infinite scroll.
  • Defenders say lanes are for browse-at-a-glance content (Pinterest-style galleries, newspapers), not linear reading; misuse is a design problem, not a feature problem.
  • Accessibility concerns raised about ordering “jumps”; Grid Lanes’ “tolerance” controls are noted as a mitigation, and tab/screen-reader behavior is mentioned in the article.

Implementation details and open questions

  • Infinite scroll: suggestions include IntersectionObserver on last items per lane, scroll-height thresholds, and eager preloading near the viewport.
  • Animations/drag-and-drop: unclear how well reflow animations are supported; speculation that smooth transitions aren’t fully specified yet.
  • Some ask for related features (e.g., gap decorations) and note that constraint-based layout has been tried elsewhere with mixed ergonomics.

Wider web platform philosophy

  • Ongoing tension:
    • One side wants fewer new CSS features and more stability, viewing constant change as bloat.
    • The other side argues that “developers deserve nice things,” that new CSS reduces JS hacks and improves UX (including for assistive tech).
  • Broader worries about Chromium driving the platform too fast vs. frustration with Safari historically lagging and acting as the “new IE.”