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

Rux: A JSX-inspired way to render view components in Ruby

github.com

Post reply on HN
Print view View original

31–40 of 42 posts

Re: Rux: A JSX-inspired way to render view components in Ruby

#31

Post by mechanicum »

sarahdellysse wrote: post #7
hhthrowaway1230 wrote: post #2

Kind of interesting,i would like it if it had a cleaner fallback to a non JSX version. If you one day decide to not use rux ~~~ h('div.example', [ h('h1#heading', 'This is hyperscript'), h('h2', 'creating React.js markup'), h(AnotherComponent, {foo: 'bar'}, [ h('li', [ h('a', {href: 'http://whatever.com'}, 'One list item') ]), h('li', 'Another list item') ]) ]) ); ~~~

even simpler, I have always wished that JSX/JSX-alikes would serialize to something like a tuple like `(tag: string | Component, attributes: Record, children: List)`, so your example would start looking something like this: This is an example creating React markup One list item Another list item would translate to something like this: ["div", {"class": "example"}, [ ["h1", {"id": "heading"}, ["This is an example"]],…

You’re halfway to Clojure’s hiccup syntax[1] there.

[1]: https://github.com/weavejester/hiccup/blob/master/doc/syntax...

Re: Rux: A JSX-inspired way to render view components in Ruby

#32

Post by petepete »

andrei_says_ wrote: post #30
petepete wrote: post #21

Earlier quoted context omitted.

I maintain a collection of view components[0] and lots are built without a template, just using the Rails tag helpers directly[1]. They're easy to write, familiar to any Rails dev and very fast. [0] https://govuk-components.netlify.app/ [1] https://github.com/DFE-Digital/govuk-components/blob/main/ap...

Am I understanding correctly that there’s a significant difference in performance between using a ViewComponent + a partial vs. a ViewComponent which renders html via a tag - from inside the component? Don’t partials get compiled when used from a ViewComponent? Also - the gov.uk project makes my heart sing ;)

> Am I understanding correctly that there’s a significant difference in performance between using a ViewComponent + a partial vs. a ViewComponent which renders html via a tag - from inside the component?

I don't think there will be much difference at all in everyday use, but some libraries that value performance don't avoid templates for that reason, Pagy for example.

https://github.com/ddnexus/pagy

Personally I omit them in my projects whenever we want to customise attributes, I hate seeing stuff like this in templates:

    " id="">Some header
I'd much rather see:
And as lots of the components allow attributes to be customised, using the tag helpers directly seems like a good choice.

> Also - the gov.uk project makes my heart sing ;)

Thanks :) Although I just reimplement the components and forms in Rails, the proper hard work is done upstream.

Re: Rux: A JSX-inspired way to render view components in Ruby

#35

Post by ravagat »

bradgessler wrote: post #3

The view stack in Rails is one of the creakiest part of the stack. A lot of people don't realize it, but the way partials in Rails leaks the state of the parent renderer is the source of a lot of bugs and code organization issues. It's great to see more attention coming to it. Some other libraries worth keeping an eye on: https://www.phlex.fun - Joel shipped this a few months ago ... it's very similar to Rux except i…

+1 , I came to that conclusion on the view stack being one of the leakiest if not the leakiest part of the Rails stack after developing saas with heavy SPA-like tendencies. Good to see I am not alone, thanks for sharing the links too

Re: Rux: A JSX-inspired way to render view components in Ruby

#36

Post by camertron »

craigmcnamara wrote: post #28
FigurativeVoid wrote: post #16

Earlier quoted context omitted.

ViewComponent is really cool, but still a little fresh. I'm excited to see how they update it in the coming year.

ViewComponent is years old, in large production deployments, and very stable.

We use it extensively at GitHub and consider it very stable.

Re: Rux: A JSX-inspired way to render view components in Ruby

#37

Post by camertron »

compumike wrote: post #15

Does this support HAML-style syntax? We're 100% HAML-only for templating, whether normal Rails views or ViewComponent... https://github.com/haml/haml https://haml.info/ so going back to writing HTML or ERB feels like a huge downgrade.

No, rux doesn't support HAML, since HAML is an entirely different "language" than rux. You'd have to figure out how to identify HAML embedded in Ruby and parse it with the HAML parser. Entirely possible, but not something rux will (probably) ever do.

Re: Rux: A JSX-inspired way to render view components in Ruby

#38

Post by camertron »

Alifatisk wrote: post #34

The html inside the call method looks cool but I have hard time understanding to how the syntax highlighting would react to seeing html inside the ruby code? Would it highlight it correctly?

There's a VSCode extension for highlighting rux (Ruby + HTML): https://marketplace.visualstudio.com/items?itemName=camertro...

Re: Rux: A JSX-inspired way to render view components in Ruby

#39

Post by camertron »

__ryan__ wrote: post #11
jack_riminton wrote: post #9

I wish the syntax was more like erb i.e. instead of { } although I'm sure someone will explain to me why they can't!

I’m sure they could, I imagine they’re appealing to those who prefer JSX’s syntax.

Yeah that's right, I was trying to simulate JSX syntax. I'm not against ERB syntax tho, maybe the lib could eventually support both?

Re: Rux: A JSX-inspired way to render view components in Ruby

#40

Post by camertron »

psadauskas wrote: post #19

This is pretty cool, I like the idea of using inline templates in ViewComponent. I wonder how this would look using something like Markaby[1], so the templating stayed pure ruby, instead of having to be passed through a transpiler... [1]: https://github.com/markaby/markaby Modifying their own example, I kinda like it. class GreetingComponent def call div { "Hey There" + NameComponent(first_name: "Homer", last_name: "…

You might want to take a look at Phlex, which essentially has the same syntax: https://github.com/joeldrapper/phlex
Post reply on HN