• Potatos_are_not_friends@lemmy.world
    link
    fedilink
    arrow-up
    40
    arrow-down
    1
    ·
    edit-2
    1 year ago

    Half of fine. Half is not. I support their cause because CSS has taken a lot of the complexities of JS with it, and would love to see HTML do more as well.

    But half this stuff is like… Noooooo…

    I’m just waking up so I might be rambly. Sorry. Let’s nail two key issues.

    #1 - The reason why html compiler languages exist is because html is still butt-ugly to write. And without a way to natively include html inside html (or pass data values to a “component”), it’s a LOT of copy/paste.

    Try making a form with 20 labels and include selectors/inputs/text fields. Include errors and help text too. That form element will be at least 400 lines of code, not including wrappers. The quantity isn’t a problem. The problem is it becomes spaghetti. It’s a lot of repeating the same thing over and over again.

    #2 - onclick events

    Edit: Lemmy sync code block markdown is breaking the code. Replaced it with a image.

    The “discouraged” part, I somewhat agree. It’s badly named for one.

    But I don’t agree with the “encourage”. Rarely will adding onclick to turn on a class be the only thing you’re doing. Frequently, you’re swapping classes. Turn one off, turn on another.

    Let’s assume you really are just adding a single event that just adds a class (which in my many years of web dev, is a extremely lucky usecsde)

    You’ve already coupled JS into your html by requiring that event. Why not call it by reference, rather than invoke the command directly? You’ve already added the noise. And a good vanilla JS developer would add all their event listeners into one neat file so you can scan all the events. Versus sprinkling JS actions into the HTML.

    #3 - the build step I kinda agree with, but in the year 2023, we are not ready to remove it. Ignore building for JS frameworks or compiling libraries. The huge bonus for build tools is backwards compatibility. Browsers have gotten extremely better at not requiring browser specific hacks (except Safari. Fuck Safari). But Chrome has been going off the rails lately adding new html/CSS features and forcing everyone to catch up.

    Worse, we cant assume every consumer is updating browsers. Many older tech cannot. Your iPad from 6 years ago no longer gets updated, which means the last browser update it can get is already a few years old. The build system handles that usecase. Again, this requires hardware companies to stop locking their system. But as software people, we can solve that using a build step.

  • yyyesss?@lemmy.world
    link
    fedilink
    arrow-up
    24
    arrow-down
    3
    ·
    1 year ago

    this is fairly naive. this is not intended as an insult, just an observation. these suggestions get painful at scale.

    • jeebus@programming.dev
      link
      fedilink
      English
      arrow-up
      5
      ·
      1 year ago

      Not everything is at scale. We have adopted these techniques (at the beginning of this year) for our internal web frontend to our build system at work and it makes it possible for all of the team to work on this system without having to setup a complex node environment or deal with npm. We also get the pretty shiny that Tailwind brings to the table. Our system is as simple as can be but not any simpler.

      • yyyesss?@lemmy.world
        link
        fedilink
        arrow-up
        4
        ·
        1 year ago

        I don’t consider Tailwind (or any atomic CSS library) “as simple as can be”. Having to know a bunch of custom naming conventions seems to go against this whole idea.

  • astronaut_sloth@mander.xyz
    link
    fedilink
    English
    arrow-up
    19
    ·
    1 year ago

    I’m all about this. When I made my personal webpage, this is how I do it. I’m surprised it’s not more popular (at least for certain things) because it looks nice and clean, is fast, and crucially, is easy to put together. Most webpages don’t need a ton of JS to “accomplish the mission.” I get that not everything can do this, but there are soooooo many sites that can strip down to a more minimal site and have better functionality and a better experience. This is a case of less-is-more.

  • Olissipo@programming.dev
    link
    fedilink
    arrow-up
    12
    arrow-down
    1
    ·
    1 year ago

    I don’t agree with the problem they aim to solve with those goals.

    But today it takes several years of mastering tools and frameworks to get to that stage. HTML First principles should allow people to unlock that feeling, and level of mastery, much earlier on in their coding journey.

    The onboarding process can be made easier for devs new to the project (junior or senior) with decent documentation. Just enough install/build the project in their local machine and understand the gist of the technologies.

  • Jiří Král
    link
    fedilink
    arrow-up
    8
    arrow-down
    1
    ·
    edit-2
    1 year ago
    1. Rule - Prefer Naked HTML

    HTML? Naked?? Man, I always did 😍.

  • Jiří Král
    link
    fedilink
    arrow-up
    6
    arrow-down
    2
    ·
    edit-2
    1 year ago

    Where possible, maintain the right-click-view-source affordance. The beauty of the early web was that it was always possible to “peek behind the curtains”.

    Just make the source code availible behind a visible link (hosted on Github or another similiar platform if possible). I don’t see this being a problem by any means.

  • CodeMonkey@programming.dev
    link
    fedilink
    arrow-up
    2
    ·
    1 year ago

    As someone who was a web developer since the mid-2000’s (and not more recently), an HTML first approach speaks to me. I am still of the belief that your contents should be in HTML and not pulled in via JavaScript.

    The article is a bit self contradictory. It encourages specifying style and behavior inline and not using external styles and scripts but also discourages using a website build pipeline or dynamically generated HTML. So how can you maintain a consistent look and feel between pages? Copy and paste?