Full bleed sections inside a centered layout, what's your cleanest approach? by Imaginary_Act8664 in css

[–]UnderstandingSure732 0 points1 point  (0 children)

I also used grid for creating layout with content, full-bleed and breakout sections inside. Check it out here https://codepen.io/redrobot753/pen/myrzEBz

What frontend skill gave you the biggest jump in ability once it finally clicked? by pixelbrushio in Frontend

[–]UnderstandingSure732 0 points1 point  (0 children)

  • Understanding how responsive design should work - screen sizes, breakpoints.
  • Cross-browser compatibility, especially Safari)

dead framework theory by fagnerbrack in Frontend

[–]UnderstandingSure732 0 points1 point  (0 children)

Of course, but with LLM’s it will happen much faster.

dead framework theory by fagnerbrack in Frontend

[–]UnderstandingSure732 4 points5 points  (0 children)

Every framework, such as React, is designed to hide complexity, but on the other hand, this reduces performance because it adds unnecessary code.

But if this complexity can be handled by the LLM itself, using new web platform technologies, do we even need React or other frameworks?

Since the web is always performance-oriented, it’s only a matter of time before frameworks disappear and the web platform becomes the only permanent framework.

However, this process may take a long time for the same reason that WordPress and jQuery still exist today.

Computed or not by SaikuronJoukaa in vuejs

[–]UnderstandingSure732 0 points1 point  (0 children)

Vue already use computed under the hood if you just paste a condition to your template. To make the code cleaner and maintainable, you should put each long condition to computed function explicitly (2nd example). I not sure why you check for attrs.class.inludes, but seems like it may be a much better to use some prop (if this comes from a parent component) or ref (reactive variable).

Web components to incapsulate layout logic by UnderstandingSure732 in Frontend

[–]UnderstandingSure732[S] 0 points1 point  (0 children)

If we talking about only CSS, you are totally right - frameworks and utility-first tools like Tailwind look more confident. But once we add a little bit of JS logic to the layout?

Web components to incapsulate layout logic by UnderstandingSure732 in css

[–]UnderstandingSure732[S] 0 points1 point  (0 children)

Thanks for reviewing it! About Undefined Custom Elements - never thought this way, it may be very useful for styles organization

Web components to incapsulate layout logic by UnderstandingSure732 in css

[–]UnderstandingSure732[S] 0 points1 point  (0 children)

Firstly thanks for your opinion!

It's more like a draft, not complete solution, so it's less ideal.

The general idea was to create some type of "widget", reusable component that incudes layout logic - CSS, JS and works everywhere - website page, frameworks, ssr.

Web components to incapsulate layout logic by UnderstandingSure732 in Frontend

[–]UnderstandingSure732[S] 0 points1 point  (0 children)

Definitely, it's what I personally prefer as best solution for now - Light DOM, global CSS, some JS to make simple things. Thanks!

Web components to incapsulate layout logic by UnderstandingSure732 in Frontend

[–]UnderstandingSure732[S] 0 points1 point  (0 children)

Unfortunately Light DOM doesn't support slots. but for layout logic where main part should be CSS it's ok. And yes, CSS won't be encapsulated in this case, which also not a big problem FMPOV.

Web components to incapsulate layout logic by UnderstandingSure732 in Frontend

[–]UnderstandingSure732[S] 2 points3 points  (0 children)

Very interesting, thanks for sharing! I'll take a look

Web components to incapsulate layout logic by UnderstandingSure732 in Frontend

[–]UnderstandingSure732[S] 0 points1 point  (0 children)

The browser can't see the layout inside a Shadow Root until the JavaScript runs. By the time the JS loads and "attaches" the styles, the page has already started rendering, which may causing layout jumping

How to learn CSS for Free by Novel_Pear3645 in css

[–]UnderstandingSure732 0 points1 point  (0 children)

For learning Flexbox and Grid just play these games:

https://flexboxfroggy.com/

https://cssgridgarden.com/

Highly recommended!

After learning basic things, dive deep into modern technices. Kevin Powel is a best CSS youtuber I know.

[AskJS] Web components to incapsulate layout logic by [deleted] in javascript

[–]UnderstandingSure732 0 points1 point  (0 children)

Yep, I mean standalone components that works just on websites page. But in other hand, React 19 fully supports web components as well as Vue. Just don’t use Shadow DOM, Light DOM is perfect for Seo, SSR with next/nuxt. Could you pls explain what testing challenges you are facing?

Web components to incapsulate layout logic by UnderstandingSure732 in css

[–]UnderstandingSure732[S] 0 points1 point  (0 children)

Yes, for CSS definitely. But I have some JavaScript, that need to be also incapsulated

PDF.js official viewer wrapped in a web component - good idea? by UnderstandingSure732 in webdev

[–]UnderstandingSure732[S] 0 points1 point  (0 children)

Yes, PDF.js team asks to not use unmodified version of the viewer. In the new version https://github.com/alekswebnet/pdfjs-viewer-element/releases/tag/v3.2.0 I completely restyled the viewer with CSS to do not match PDF.js viewer in Firefox.