Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Relearn CSS layout

every-layout.dev

Post reply on HN
Print view View original

81–90 of 187 posts

Re: Relearn CSS layout

#81

Post by meerita »

GoToRO wrote: post #70
meerita wrote: post #66

To me this way to CSS development is outdated. I will never program like this anymore. I only do functional/utilitarian CSS.

can you elaborate? (also fotolog is not found)

Yes, fotolog.com doesn't exist anymore but I would gladly elaborate. (full explanation here: http://minid.net/2019/04/07/the-css-utilitarian-methodology/) resume: why go with an OO architecture, when you can use inmutable classes and never again repeat the same properties in your CSS files. In the end, you end up developing faster and you can mantain code easily without having to build the entire UI arquitecture in the CSS. CSS was created to separate style from the content, but also, because back then, HTML wasn't built like we do today with frameworks. Now that we use reactive HTML we can just print inline CSS, but that is a problem, so the functional CSS comes better.

Re: Relearn CSS layout

#82

Post by meerita »

ry_ry wrote: post #72
meerita wrote: post #66

To me this way to CSS development is outdated. I will never program like this anymore. I only do functional/utilitarian CSS.

CSS has been a bit of a mess for ages. It never scaled terribly well in its original state, and with every iteration became more bloated, so we came up with methods of controlling the sprawl; but imo glut of Modern CSS Implementations and their many and varied permutations not only feel like they are not only fighting against the original concepts, but also against each other. Which isn't to say they're bad or anythi…

I've researched all the major newspapers code. From 1996 to 2019 and all of them grew exponentially in size and complexity. It is how you state it: the arquitectures force developers to do bad code. Unmantainable (most devs change jobs, go and read 9k rules) and websites morph over the years carrying lots of legacy code because it takes too much time to fix everything. That's why functional is superior to everything. The problem: all devs are biased with the OO way. It's hard for them to see the benefits.

Re: Relearn CSS layout

#83

Post by ohrus »

orf wrote: post #77
ohrus wrote: post #76

Earlier quoted context omitted.

CSS is not a paradigm. Whatever workflow you have for styling your pages and apps, it's all CSS in the end.

CSS can certainly be described as a paradigm. It's a model you follow to style things on the web. It also doesn't matter if it's all CSS in the end. At one particular end it's all manipulating assembly instructions, but I wouldn't call styling pages writing assembly. That is to say the underlying model or paradigm (styling in this case) doesn't really matter if you build an abstraction on top of it that hides that pa…

Sure, you're right in that sense, thought I do not agree with the comparison to writing assembly.

The phrase "shifting away" from CSS is what I was addressing my initial comment towards, and I don't believe that using a paradigm on top of CSS would constitute a shift away from CSS... you're still using plenty of CSS rules whether you use styled-components, modules, SCSS, etc.

Re: Relearn CSS layout

#84

Post by tannhaeuser »

sktrdie wrote: post #73

To me an evident thing in UI development is that separating stylesheet from layout isn't really a thing anymore and the benefits of this separation aren't really that clear. Things like SwiftUI and React are showing that declarative UIs can be built by tying the style to the layout and allow for much better accessibility, tooling, overall thinking of how UIs work. So to me CSS feels a bit outdated since big companies…

CSS definitely can get in the way with far-distance effects in MVw apps. It tends to not being particularly representative of how you think about and modify the app during development, nor during maintenance. Though you still need media queries since you can't use these and eg :visited etc as inline styles. The reasoning behind this asymetry isn't entirely clear to me; it seems to be a syntactic accident.

Actually, I think CSS sucks at most things. Now CSS grid and flexbox are sold as solutions for long-standing layout deficiencies - and they undoubtly are a progress over grid frameworks using floats. But the real question is what is gained by pretending we're editing a hierarchical document (using HTML envisioned for casual academic publishing like it's 1999) when we layer a layout engine on top of it complicated enough to abstract that 1999s HTML into a grid and constraint-based layout? Why not just write markup representing that conceptual layout in the first place? We now have an enormous syntax proliferation of a markup language with an additional, redundant, and idiosyncratic item-value syntax (CSS) but still can't specify layout constraints in their more natural form as systems of inequalities.

Re: Relearn CSS layout

#85

Post by sureaboutthis »

sktrdie wrote: post #73

To me an evident thing in UI development is that separating stylesheet from layout isn't really a thing anymore and the benefits of this separation aren't really that clear. Things like SwiftUI and React are showing that declarative UIs can be built by tying the style to the layout and allow for much better accessibility, tooling, overall thinking of how UIs work. So to me CSS feels a bit outdated since big companies…

> Things like SwiftUI and React are showing that declarative UIs can be built by tying the style to the layout

That's what we call JavaScript and CSS. You can do that without React and my company has been doing that for 15 years quite successfully--with separation of the elements and styling.

How do you think SwiftUI and React do such things? With JavaScript and CSS!

(Sorry if I have factual errors about SwiftUI cause I really don't know anything about it.)

Re: Relearn CSS layout

#88

Post by plausibilities »

codedokode wrote: post #3

Poor quality articles. They use flexbox and provide no fallback for older browsers. They could use at least non-responsive layout for desktop resolution for older browsers. Probably the reason why they didn't do it is lack of knowledge of CSS.

Maybe their target audience doesn't primarily consist of entry-level devs relegated to maintaining legacy eCommerce web properties and back-office portal/intranet systems?

Re: Relearn CSS layout

#89

Post by danShumway »

sktrdie wrote: post #73

To me an evident thing in UI development is that separating stylesheet from layout isn't really a thing anymore and the benefits of this separation aren't really that clear. Things like SwiftUI and React are showing that declarative UIs can be built by tying the style to the layout and allow for much better accessibility, tooling, overall thinking of how UIs work. So to me CSS feels a bit outdated since big companies…

I work as a web developer for an enterprise-level software company.

Experimented a bit with CSS-in-JS, which is designed to get rid of this separation, and I found it to ultimately be harder to maintain than SCSS. This process was also what got me hooked on BEM after being initially pretty skeptical about whether it had any real value.

I now believe that BEM would meet the needs of most teams, with the exception of a few massive software houses like Facebook. And most companies don't fall into the Facebook category, even if they think they do.

I've also taken some time to reflect on older companies I've worked for, particularly some work I did at Oracle, which was for a reasonably large team spread across several continents. I think BEM would have been good enough for us there as well.

I would propose the following test: Is your front end in a monorepo? If so, BEM is probably good enough to solve any problems with scope and style conflicts. If your code can fit in a monorepo, I think its unlikely you will ever have a legitimate reason to duplicate a component name in multiple places.

Take it or leave it, just my experience, I'm sure other people would advocate different things. But it's by no means a settled debate, different people/orgs have come to different conclusions. It's just that one side writes a lot more blog posts.

Re: Relearn CSS layout

#90

Post by thrower123 »

sktrdie wrote: post #73

To me an evident thing in UI development is that separating stylesheet from layout isn't really a thing anymore and the benefits of this separation aren't really that clear. Things like SwiftUI and React are showing that declarative UIs can be built by tying the style to the layout and allow for much better accessibility, tooling, overall thinking of how UIs work. So to me CSS feels a bit outdated since big companies…

I don't think it ever made sense.

The biggest problem with CSS is that it is essentially global state, and you can get tricky action-at-a-distance effects that you never considered if you happen to wrrite some ids that something else is expecting to own and their selectors are poorly written. Or you can monkey-patch over it and break other things.

Tightly scoping things can make CSS workable, but requires discipline. And things that require discipline to do right don't scale well.

Post reply on HN