frontpage.
newsnewestaskshowjobs

Made with ♥ by @iamnishanth

Open Source @Github

fp.

Open in hackernews

CSS Grid Lanes

https://webkit.org/blog/17660/introducing-css-grid-lanes/
159•frizlab•2h ago

Comments

jonah•1h ago
This is exciting to see! I just used Masonry for a project this past week. While it works quite well and is pretty performant, it is pretty hacky using absolute positioning, wanting to know the aspect ratios of objects beforehand for smoother layout, and having to recalculate everything on resize. I'm looking forward to having a generally available native option one of these days.
memonkey•1h ago
Masonry grid layout was one of a few interviewing pair programming tests I would give to frontend engineers. I need to see how this works under the hood!
valleyer•1h ago
Is this increasing complexity in the Web layout world worth it? Anyone who wants to use this is going to drop support for older browsers (and, in so doing, older machines that can't run newer OSes and newer browsers).

Personally, I use an 11-year-old machine and have had to add userscript hacks to certain major Web sites to work around bugs in CSS grid (not the "lanes" described here).

At least new JavaScript features can be "polyfilled" or whatever. Maybe sites could check for CSS feature support too? But they seem not to.

For example, the demo page linked in the article fails pretty unusably for me. All the images take up nearly the full viewport width.

jimvdv•1h ago
Not updating your browser will net you tons of exploitable vulnerabilities.

How do you expect things to ever change if no one ever updates? Certainly even if you decide to lean towards maximum support it’s still a positive these features are being introduced so you can use them in 10 years.

hackyhacky•1h ago
> How do you expect things to ever change if no one ever updates?

Maybe things should stop changing.

We don't really need ten new CSS attributes every year. Things work. The elegant solution is to announce the project is done. That would bring some much-needed stability. Then we can focus on keeping things working.

runarberg•1h ago
11 years ago we had Python 2.7.8 and 3.4.0 so no type hints, no async await, no match syntax, no formatted string literals, large number couldn’t be written like this 13_370_000_000, etc.

Developers deserve nice things.

hackyhacky•23m ago
> Developers deserve nice things.

I agree they do. But Python is a bad counterexample. You can upgrade your Python on your server and no one has to know about it. But if you want to use new CSS features, then every browser has to implement that feature and every user has to upgrade their browser.

The intent of my comment was to express a desire to stabilize the web API in particular, not to freeze all software development in its tracks.

idle_zealot•49m ago
The issue with this is that the browser is the cross-playing operating system, the VM that runs webapps. But we treat the platform like an evolving document format. If we want to declare it complete, we need to make it extensible so we can have a stable core without freezing capabilities. I foresee all of this CSS/HTML stuff as eventually being declared a sort of legacy format and adding a standard way to ship pluggable rendering engines/language runtimes. WASM is one step in that direction. There are custom rendering/layout engines now, but they basically have to render to canvas and lose a lot of performance and platform integration. Proper official support for such engines with hooks into accessibility features and the like could close that gap. Of course, then you have every website shipping a while OS userland for every pageload, kinda like containers on servers, but that overhead could probably be mitigated with some caching of tagged dependencies. Then you have unscrupulous types who might use load timings to detect cache state for user profiling... I'm sure there's a better solution for that than just disabling cross-site caching...

I digress.

OsrsNeedsf2P•1h ago
If enough consumers aren't able to use the website, then business wouldn't use it. The reality is new computers aren't that expensive (I see used M1s for under 1k) and consumers are upgrading.
anonymous908213•1h ago
You mentioned a used model that is over 5 years old as an example of "a new computer", and "1k" as "not expensive for consumers". It is honestly impressive how well you undermined your own point.

> If enough consumers aren't able to use the website, then business wouldn't use it.

I sincerely doubt any business owner would approve of losing even 10% of their potential users/customers if they knew that was the trade-off for their web developer choosing to use this feature, but there are disconnects in communication about these kinds of things -- if the web developer even knows about compatibility issues themselves, which you would expect from any competent web developer, but there are a whole lot of incompetent web developers in the wild who won't even think about things like this.

runarberg•49m ago
Most web devs get screemed at (by their peer reviewers or [preferably] static analysis tools) if they use a feature which has less then like 98% support without gracefully denigrating it, and rightfully so.

But your GP is in a massive minority, if every developer would cater to 11 year old browsers we would be wasting a lot of developer time to inferior designs, with more hacks which brake the web for even more users.

anonymous908213•33m ago
I don't know about "most". For various reasons, I use a 2-year-old browser on a daily basis (alongside an up-to-date browser), and I routinely run into websites that are completely broken on the 2-year-old browser. Unrelated to outdatedness, I recently ran into a local government website that e-mailed me my password in plaintext upon account creation. I have no way of accurately quantifying whether "most" web developers fall into the competent or incompetent bucket, but regardless of which there are more of, there are a significant enough number of incompetent ones.
spankalee•1h ago
When the web came out it itself was new technology that excluded some older machines. Lynx kind of worked (I used it!) but it was a poor substitute, especially once `<img>` showed up.

You want to platform to be able to make progress and not be frozen in amber by what we had at some "magical" year when things were in some Golidlocks powerful enough but not too complex state. Especially since a lot of progress lately has been fixing long-standing inconsistencies and obvious gaps.

The cost of that is that yes, neither my Apple IIe or my Micro Pentium 90 run the modern web... one day my MBP M1 won't either.

runarberg•1h ago
Yes it is. Developers write bad code when they try to work around the lack of features with ill thought out hacks, this results in a bad website for everybody, even those of us that keep our software up to date, and just so happen to have a different screen resolution and a different browser then what the developer tested on.
mikae1•1h ago
> Maybe sites could check for CSS feature support too? But they seem not to.

Certainly can: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/A...

SeanAnderson•1h ago
What does the age of your machine have to do with browser compatibility issues? Are you running a stale OS and a stale browser on that OS?
exasperaited•55m ago
Sooner or later, the age of your machine will affect browser compatibility.

It doesn't even take many things to do this — the knock-on support of a bug in a driver that no-one wants to fix, a package that you like that prevents you from upgrading your host OS, web browser developers abandoning something about your GUI (how long before they drop X?) etc.

In the Linux world, the age of your machine is a limit with a blurry edge, but it's still there.

acdha•1h ago
> Is this increasing complexity in the Web layout world worth it? Anyone who wants to use this is going to drop support for older browsers (and, in so doing, older machines that can't run newer OSes and newer browsers).

If you’ve been at this for a while, it’s important to remember that browsers update a lot faster than they used to. Anchor positioning came out last year, for example, and all of the major browsers support it by now. Very old devices are a problem but security is purging those out faster than used to be the case.

We also have better tools for progressive adoption since you can easily query for things like CSS feature support. In this demo, they didn’t implement fallbacks but in most real sites you’d have something like a basic grid layout which is perfectly serviceable for the fraction of users on old Firefox releases.

throwaway613745•57m ago
I am using a machine older than eleven years old and can still run the newest version of Firefox and Chrome.

I don't think the world needs to cater to people that refuse even basic internet hygiene.

mikae1•52m ago
I routinely use an 11 year old computer too. I can not see why "userscript hacks" would be needed.
afavour•51m ago
> Is this increasing complexity in the Web layout world worth it?

Yes. I held off learning about CSS Grid for a very long time and as soon as I did I was converted. Sometimes I think the web doesn’t get enough credit for its ambition: mobile viewports, desktop viewports, touch interaction, pointer interaction, complex documents, webapps… it’s a lot. But you get some complexity as a side effect. The complexity we do see these days isn’t invented out of whole cloth, it’s standardising and improving layouts people are implementing with JavaScript, often badly.

crazygringo•39m ago
> I use an 11-year-old machine

So what OS are you running that can't run modern versions of browsers, and on what hardware?

Current Chrome runs on Windows 10, which came out 9.5 years ago but was intended to run on older computers, and macOS Monterey, which runs on Macs from ~2014-2015 depending on the model. But even Big Sur before that, the most recent version of Chrome which runs on that is Chrome 138 from just 6 months ago, and that doesn't seem old enough that you need to build userscript hacks.

I'm really curious what you're actually running. Generally speaking, an 11-year-old machine should be able to run the current browser, and if not, a very recent one.

alwillis•27m ago
> Personally, I use an 11-year-old machine and have had to add userscript hacks to certain major Web sites to work around bugs in CSS grid (not the "lanes" described here).

The version of CSS Grid we're using today didn't ship until 2017; a browser from 11 years ago would be using one of the non-standard versions of Grid. For example, Internet Explorer 11 was the first browser to ship a grid implementation.

> At least new JavaScript features can be "polyfilled" or whatever. Maybe sites could check for CSS feature support too?

First, not every site needs to look exactly the same in every browser; that's why progressive enhancement is a thing.

Second, there are multiple ways to create masonry-style layouts that don't require masonry support in the browser using multi-column layout or flexbox.

Third, masonry can be polyfilled using JavaScript [1].

[1]: https://masonry.desandro.com/

phoronixrly•1h ago
Oh, how cool! Another barrier to a new browser gaining user base!
ThatMedicIsASpy•1h ago
I've run the masonry layout (for my personal bookmark website) ever since I've found it in the browser settings.

grid-template-rows: masonry;

is going to be outdated then?

miiiiiike•1h ago
Yeah, there was a years long debate that effectively ended with: “We held a vote that you weren’t aware of and decided that masonry was out. If you cared, you should have participated in the vote that you were not aware was happening. It’s too late to change it.”

https://m.youtube.com/watch?v=yikbSQ6tvlE

culi•32m ago
Wasn't Firefox the only browser that actually implemented `grid-template-rows: masonry` anyways?

It sucks whenever browsers backtrack on a W3C standard that reached "Working Draft" status but it doesn't seem like it's gonna impact many people

Besides, it's not being "deprecated". It will continue to work as it does. We just have a better alternative that the big 3 all agreed on.

afavour•26m ago
Masonry was never “in”, no? Mozilla proposed it and were the only ones to implement it, behind a feature flag. Then WebKit proposed an alternative that was discussed at length:

https://github.com/w3c/csswg-drafts/issues/10233

dylan604•26m ago
I still prefer the layout look from something like justifiedGallery.js where the heights of each row are the same. Actual masonry with stacking stones would never stack directly on top of each other like this. Calling it masonry just feels unnatural as anything stacked like that would easily be knocked over. "Lanes" is definitely more appropriately named than "masonry". The layout look of a justifiedGallery would be more masonry than the grid-template-rows:masonry setting. yeah yeah, raw css vs js library blah blah
brcmthrowaway•43m ago
I don't understand all the busywork goes behind new browser updates, just to retain their market share (since they can afford more engineers, than say Ladybird). Is this needed? It's not rocket science, folks.
fragmede•29m ago
Psh, rocket science only has to contend with physics, which generally doesn't change much, if at all. The equations used to get humans to the moon didn't change because someone discovered you can send a specially crafted packet and escape the sandbox and steal money from everybody on the Internet.
culi•36m ago
Props to the Safari team. They surprised us all when they suddenly shot to the top of interop-2025 this October

https://wpt.fyi/interop-2025

nitwit005•29m ago
How would you query the location where you need to load more data when scrolling down (the highest empty spot)?
jonah•14m ago
You just append new <figure> elements to the <main> in the example and it will automatically put them in the appropriate column.
nitwit005•12m ago
Your answer doesn't appear to relate to what I asked. You need to know when to query the backend for more data if it's an infinite scrolling setup.
tom1337•10m ago
I guess you can just start loading a first batch, add an intersection observer to the last 3 elements (if you have 3 lanes) and then when one of those intersects you simply start fetching the next.
rokkamokka•3m ago
I suppose just checking scroll height of the container? Once you're x pixels above the bottom, fetch more. Not the smoothest, but doable
cod1r•28m ago
sweeeeeeeeeeeet
uniq7•15m ago
Maybe this will be an unpopular opinion, but I really dislike the lane layout, because it is not possible to efficiently take a glance at all elements in the list, one by one.

If you try to go left-to-right, you will quickly realize that at the end of each "line" it is really difficult to know where the next line starts. It is easy to accidentally start again on the same line (and inspect the same elements), or skip one accidentally. Then navigating through the elements one by one requires a considerable amount of cognitive effort, your eyes bounce up and down constantly, and you end up inspecting the same elements multiple times.

If you try to go top-to-bottom, lane by lane, you will then realize that the page also has infinite scroll and you will never go past the first lane.

Tempest1981•11m ago
Feels very "right-brain". I'm a brain-hemisphere equality advocate.
jbritton•15m ago
I have often thought layouts should be done by a constraint solver. Then there could be libraries that help simplify specifying a layout, which feed constraints to the solver.
eurleif•10m ago
Recently discussed on HN: https://news.ycombinator.com/item?id=46144039

Cloudflare's Code Orange Resilience plan following recent outages

https://blog.cloudflare.com/fail-small-resilience-plan/
1•sdko•18s ago•0 comments

Humongous Fungus — the largest single living organism on Earth

https://www.oregonencyclopedia.org/articles/humongous-fungus-armillaria-ostoyae/
1•andsoitis•1m ago•0 comments

End of Year Pay Report 2025

https://www.levels.fyi/2025/
1•cebert•1m ago•0 comments

Ask HN: Acceleration of a Drop Falling Through Mist?

1•AnimalMuppet•5m ago•0 comments

How has public history changed since 1951?

https://www.historytoday.com/archive/head-head/how-has-public-history-changed-1951
1•hhs•7m ago•0 comments

Kew: Simple Static Site Generator

https://github.com/uint23/kew
1•uint23•9m ago•0 comments

The Great Re-Aggregation: Vertical AI and the Battle for the Control Point

https://medium.com/@gp2030/the-great-re-aggregation-vertical-ai-service-as-software-and-the-battl...
1•light_triad•14m ago•1 comments

Ask HN: What app/website do you think should exist? (non-AI)

1•DinakarS•14m ago•0 comments

PBS News Hour West to go dark after ASU discontinues contract

https://www.statepress.com/article/2025/12/politics-pbs-newshour-west-closure
1•heavyset_go•15m ago•0 comments

Ask HN: Has your iPhone Safari been hijacked by ChatGPT?

1•dalemhurley•16m ago•1 comments

Evolution by Natural Induction

https://royalsocietypublishing.org/rsfs/article/15/6/20250025/366156/Evolution-by-natural-induction
1•Anon84•18m ago•0 comments

Computational prediction of human genetic variants in the mouse genome

https://www.nature.com/articles/s41587-025-02925-0
1•bookofjoe•18m ago•0 comments

The Most Dangerous Spot on Caltrain

https://valuetowndotjson.substack.com/p/the-most-dangerous-spot-on-caltrain
1•panic•18m ago•0 comments

The Present and Future of HPC Networking with Cornelis Networks CEO Lisa Spelman

https://chipsandcheese.com/p/sc25-the-present-and-future-of-hpc
1•rbanffy•21m ago•0 comments

The Model T of Agentic AI was Introduced in 2025

https://backnotprop.substack.com/p/the-model-t-of-agentic-ai-was-introduced
1•ramoz•30m ago•0 comments

Controversial Dakota Pipeline Gets a Big, Belated Government Boost

https://www.nytimes.com/2025/12/19/climate/dakota-access-pipeline-greenpeace-energy-transfer-army...
1•geox•30m ago•0 comments

What building a Package Manager taught me

1•xerrs•32m ago•0 comments

Humanoid Robots for War and Work: Startup Plans to Build 50K by End of 2027

https://www.forbes.com/sites/johnkoetsier/2025/12/16/humanoid-robots-for-war-and-work-startup-pla...
1•rmason•33m ago•0 comments

Building Slatron: The Digital TV Scheduling and Automation System

https://justinwoodring.com/blog/introducing-slatron/
1•lukastyrychtr•36m ago•0 comments

Shoshana Zuboff: 'AI is surveillance capitalism continuing to evolve and expand'

https://english.elpais.com/technology/2025-12-15/shoshana-zuboff-philosopher-ai-is-surveillance-c...
4•hhs•38m ago•0 comments

Show HN: Promptty – AI Prompt Manager for iOS

https://apps.apple.com/us/app/promptty-ai-prompt-manager/id6751414013
1•haXiscz•39m ago•1 comments

GEMM Performance Optimization Across Generations of Ryzen AI NPUs

https://arxiv.org/abs/2512.13282
1•fenced_load•40m ago•0 comments

Samsung Investigating Whether Employees Accepted Kickbacks for Memory Orders

https://www.pcmag.com/news/samsung-investigating-whether-employees-accepted-kickbacks-for-memory-...
2•alecco•41m ago•0 comments

A visualizer for BPF program state

https://lwn.net/Articles/1050585/
2•todsacerdoti•45m ago•0 comments

Senators Want to Hold Open Internet Hostage, Demand Meta Write the Ransom Note

https://www.techdirt.com/2025/12/19/senators-want-to-hold-the-open-internet-hostage-demand-zucker...
2•hn_acker•46m ago•2 comments

2 Days with Gemini-3-flash, def a good model

https://bsky.app/profile/verdverm.com/post/3maetqcc4722f
1•verdverm•46m ago•0 comments

The Weird OS Built Around a Database [video]

https://www.youtube.com/watch?v=pWZBQMRmW7k
1•rickcarlino•47m ago•0 comments

Show HN: Faithful Today: A Privacy-First Journaling App (No Cloud, Local Storage

https://www.faithfultoday.com/
2•sbworker•49m ago•1 comments

QuickCurrency – Free currency converter with no sign-up required

https://quickcurrency.net/
1•DDARJEAN•52m ago•0 comments

Trump signs executive order to reclassify marijuana as a Schedule III drug

https://www.cbsnews.com/news/trump-order-reclassifying-marijuana-schedule-iii-drug-expected/
9•mhb•52m ago•3 comments