|
| ▲ | easyThrowaway 4 days ago | parent | next [-] |
| Not the first time I hear of this, but I thought it was a blink-specific issue when using severely nested structures (e.g., html pages written using visual editors like Elementor or Webflow)? |
|
| ▲ | throwaway77385 4 days ago | parent | prev | next [-] |
| For quite a while, I had to keep using flexbox instead of grids, because grids killed performance, funnily enough.
That seems to have been rectified with modern browsers though, funnily enough. |
|
| ▲ | zwnow 4 days ago | parent | prev | next [-] |
| Flexbox is great and having nested flexboxes is also great. It makes building responsive pages a bliss. Learn it if you are having trouble with it, it is really not that difficult. Grids are much more error prone and allow for much less flexibility. |
| |
| ▲ | cluckindan 3 days ago | parent [-] | | The issue with nested flexboxes is that flexbox containers size their content to match the container. Therefore, to calculate the size of an item, the sizes of other items need to be known. Now, if one of the items is a flexbox, its item sizes cannot be known until the previous flexbox is laid out. Of course, properly using flex-grow and flex-shrink can optimize that calculation, but what about deeper nested flexboxes? |
|
|
| ▲ | twsted 4 days ago | parent | prev [-] |
| Useful insight: any sources? |
| |
| ▲ | dekoidal 4 days ago | parent [-] | | From 2014 https://jakearchibald.com/2014/dont-use-flexbox-for-page-lay... | | |
| ▲ | wk_end 4 days ago | parent [-] | | Browser performance tips from 2014 mean very little twelve years on. Not only have machines gotten faster and networks gotten faster, rendering engines gotten faster. And I'm doubtful it nested flexboxes would've been all that much of a problem in most cases even then. The most important thing is to use the right tool for the job. If grid lets you express what you want in the most straightforward way, use it; if flexbox does - even if it needs nesting - then use it instead. Don't shoehorn one into a situation where the other makes more sense. And sometimes either will work for a particular situation and that's fine too; use whatever you find most ergonomic. They're both very good in their own way. | | |
| ▲ | mananaysiempre 4 days ago | parent | next [-] | | The article is largely about layout shifts caused by flexbox during loading, and while networks have indeed gotten faster, they haven’t gotten faster uniformly across situations and people. Being able to show things properly while they are still downloading remains useful. | |
| ▲ | cluckindan 4 days ago | parent | prev [-] | | Try resizing a browser window with nested a flex layout. | | |
| ▲ | tim1994 4 days ago | parent [-] | | Should you optimize for resize performance? I guess that depends on the app. Use the tool that fits the requirements. | | |
| ▲ | cluckindan 4 days ago | parent [-] | | Resizing is not the optimization target, it just makes reflow performance visually apparent. |
|
|
|
|
|
