Marko – A declarative, HTML‑based language • Hacker News Board

Re: Marko – A declarative, HTML‑based language

#131

Post by notpushkin » Sun, Nov 09, 2025, 7:36 AM UTC

tills13 wrote: post #56

It looks interesting and in a past life I probably would have tried it out but do you know why I like React? Because it's just JavaScript. This ` ` and ` ` syntax is awful.

Agreed on the syntax part. We’ve had good syntax for templates before:

  
    {% for user in users %}
      {{ user.firstName }}
    {% endfor %}

And we have good syntax for templates now:

  
    {#each users as user}
      {user.firstName}
    {/each}

Why do we have to squish everything into HTML-like-but-not-quite blocks?

But no, JSX isn’t that great either:

  
    {users.map(user => (
      {user.firstName}
    ))}

Re: Marko – A declarative, HTML‑based language

#132

Post by marginalia_nu » Sun, Nov 09, 2025, 8:01 AM UTC

nchmy wrote: post #48

afavour wrote: post #37

Maybe just me but I actually think building web apps is already fun. I’ve got a hot reloading instant dev environment, I can publish to users in an instant… it’s great! Looking at the Marko examples I feel the same way I do whenever similar stuff gets showcased: it’s trying to focus too hard on brevity and/or cutesiness and doesn’t seem like it would scale well to a full, complex web app. But maybe it’s not supposed…

FWIW, marko comes from Ebay. So, it scales - and being primarily SSR, its a better UX than your preferred frameworks

HTML rendering is, to be fair, not usually where you find the scaling issues.

Re: Marko – A declarative, HTML‑based language

#133

Post by insin » Sun, Nov 09, 2025, 8:05 AM UTC

dualogy wrote: post #123

fouc wrote: post #112

Earlier quoted context omitted.

Speaking of writing javascript instead of JSX, I'm a big fan of the hyperscript approach: var ListComponent = () => { let count = 0, selected = null return { view: ({attrs: {items}}) => m("div", [ m("p", "Clicked: " + count + " times"), m("ul", items.map(item => m("li", { onclick: () => { count++; selected = item }, style: {cursor: "pointer", color: item === selected ? "blue" : "black"} }, item) )), selected && m("p"…

> Speaking of writing javascript instead of JSX, I'm a big fan of the hyperscript approach Speaking of writing JS instead of JSX or your example, I like the vanjs.org approach: const Hello = () => div( p("Hello"), ul( li("World"), li(a({href: "https://vanjs.org/"}, "VanJS")), ), ) van.add(document.body, Hello())

JSX was such a breath of fresh air after having written and maintained apps which used both of these formats for years (and also having written a library which supported both of them for reusing the same templates on the server and in the browser) - it's the commas! I'm glad it's everywhere now.

But that was also back in the days when trailing commas at the end could break things, JavaScript editor support was relatively poor, and tooling wasn't where it is now (knowing your code is once again valid because the autoformatter just kicked in).

Re: Marko – A declarative, HTML‑based language

#134

Post by aatd86 » Sun, Nov 09, 2025, 8:10 AM UTC

lf-non wrote: post #126

fouc wrote: post #112

Earlier quoted context omitted.

Speaking of writing javascript instead of JSX, I'm a big fan of the hyperscript approach: var ListComponent = () => { let count = 0, selected = null return { view: ({attrs: {items}}) => m("div", [ m("p", "Clicked: " + count + " times"), m("ul", items.map(item => m("li", { onclick: () => { count++; selected = item }, style: {cursor: "pointer", color: item === selected ? "blue" : "black"} }, item) )), selected && m("p"…

Yes, I also like relying on just functions. I have found aberdeenjs a better dx than hyperscript. https://aberdeenjs.org/

oh didn't know that one. Been building something that shares the same goals although I can see it is different in many ways. Interesting.

Re: Marko – A declarative, HTML‑based language

#135

Post by Antwan » Sun, Nov 09, 2025, 8:57 AM UTC

The new jquery? Eurk.

Re: Marko – A declarative, HTML‑based language

#136

Post by brazukadev » Sun, Nov 09, 2025, 9:17 AM UTC

pwdisswordfishy wrote: post #124

iammrpayments wrote: post #113

Earlier quoted context omitted.

Do you really believe React is just javascript?

React is "just JavaScript" that you have to write in a very particular way, which the language in no way helps you enforce, for otherwise your "web app" will misbehave is bizarre and confusing ways.

There are no particular ways to code react where JSX is just JavaScript, it is not.

Re: Marko – A declarative, HTML‑based language

#137

Post by cubefox » Sun, Nov 09, 2025, 9:34 AM UTC

It's misleading to call this "A declarative, HTML‑based language" when it in fact relies heavily on writing explicit JavaScript (which is very different from HTML and not declarative at all).

Something like htmx does come a lot closer to being a HTML‑based language in my opinion. So much so that you could add it to the actual HTML spec.

(That's not to say that Marko is bad, just that it's more a way to mix HTML and JavaScript in a more intuitive way rather than a declarative, HTML‑based language.)

Re: Marko – A declarative, HTML‑based language

#138

Post by gdotdesign » Sun, Nov 09, 2025, 9:50 AM UTC

promiseofbeans wrote: post #127

gdotdesign wrote: post #18

Earlier quoted context omitted.

I think I managed to combine three languages in one with Mint ( https://mint-lang.com/ ): 1. There is HTML (tags) with, but without interpolation {...} you can put string literals, variables and everything that type checks as HTML children. 2. There is CSS but only in style blocks where you can interpolate any expression you need and put in if and case expressions too. 3. There is the normal Mint code you write the l…

Your Mint language looks awesome! You’ve done a great job making it very seamless between the 3 languages. I had a couple thoughts regarding your css/styling though: 1. The one feature I prefer in Marko when compared to Mint is Marko’s nice ID and class syntax, rather than your custom selectors, so you can just use regular CSS (which seems to be advancing faster than the JS & HTML specs combined). You could get the s…

1. Inside style blocks it's pretty much regular CSS except for interpolation and if/case expressions, so you can create a style for the root element and then use ids and classes if you desire, but it won't be optimized.

2. CSS definitions without interpolation compile down to static CSS while the ones with interpolation compile down to CSS variables which are set on the element where the style is assigned. This also allows for passig arguments to styles [0].

CSS nesting is supported and the interpolation doesn't conflict with the id selectors because interpolation is not supported in selectors.

[0]: https://mint-lang.com/reference/styling/arguments

Re: Marko – A declarative, HTML‑based language

#139

Post by gdotdesign » Sun, Nov 09, 2025, 9:50 AM UTC

moron4hire wrote: post #33

gdotdesign wrote: post #18

Earlier quoted context omitted.

I think I managed to combine three languages in one with Mint ( https://mint-lang.com/ ): 1. There is HTML (tags) with, but without interpolation {...} you can put string literals, variables and everything that type checks as HTML children. 2. There is CSS but only in style blocks where you can interpolate any expression you need and put in if and case expressions too. 3. There is the normal Mint code you write the l…

It's there a way to define routes in a nested, hierarchial fashion, preferably across multiple modules? For example, with react-router, my root route object array I define by spreading out other route object arrays that I've imported from other modules in my project. And each of those do the same thing, recurring as necessary until I get to the full depth of my route tree.

No it's nor supported currently.

Re: Marko – A declarative, HTML‑based language

#140

Post by cubefox » Sun, Nov 09, 2025, 9:58 AM UTC

notpushkin wrote: post #131

tills13 wrote: post #56

It looks interesting and in a past life I probably would have tried it out but do you know why I like React? Because it's just JavaScript. This ` ` and ` ` syntax is awful.

Agreed on the syntax part. We’ve had good syntax for templates before: {% for user in users %} {{ user.firstName }} {% endfor %} And we have good syntax for templates now: {#each users as user} {user.firstName} {/each} Why do we have to squish everything into HTML-like-but-not-quite blocks? But no, JSX isn’t that great either: {users.map(user => ( {user.firstName} ))}

Why not use html/XML style syntax rather than mixing two syntax styles? For example, "{/each}" already looks like "".