Convert HTML to TyXML

Im prototyping a new backend with OCaml, and im using Dream and TyXML for generating the output (HTML). Having done web dev for over a decade, i am scarred by the ecosystem that is javascript. Because of this i decided to build with HTMX (i return HTML fragments instead of JSON).

I have some experience with this approach from a Go app i did previously, and the developer experience was fantastic. However its super tedious to mock up the TyXML code from a Tailwind template (i want to reuse some previous components i got), and it seems the TyXML ppx is not working with ocaml 5. Does anyone have any suggestions how i could “generate” the TyXML code from a valid HTML string, this would vastly increase the time taken to build my prototype.

2 Likes

I don’t know if you are wedded to TyXML, but if not dream-html offers built-in support for the custom htmx attributes and is quite simple to use.

That’s not going to help with your reverse-engineering HTML though. Personally I’d probably end up with a monstrous bunch of python/perl hand-written translation rules that would get me 80% of the way there and do manual cleanup.

2 Likes

Thanks!

I actually found dream-html, and at a first glance it looks very similar to TyXML (not sure if you loose some of the type safety compared to TyXML). I started with TyXML because thats what i had used previously, however never with the starting point of migrating HTML to TyXML. I Got quite complex components, and when composing them they are hundreds of LOC so the migration is quite painful without a ppx or some tool.

I strongly suggest trying putting your htmx snippets in .re files, and making use of tyxml’s jsx ppx. This and other similar topics are touched on in this thread: Htmx/htmlact web development approach - #16 by cemerick

Using this approach, I find it quite pleasant and easy to bring HTML+tailwind templates and snippets into jsx/tyxml.

Hey, so dream-html is similar to TyXML in the basic approach (model HTML in OCaml) but is simpler in the sense that it doesn’t try to exactly model correct HTML e.g. it doesn’t stop you from putting a <div> inside a <span> or whatever. In my opinion that’s the right level of tradeoff of type-safety and convenience, of course others make different tradeoffs.

You have a good point about tooling to import HTML though, I will look into that.

Thanks. I give dream-html a quick test tomorrow and see how it goes. I see it has included htmx support, so thats good, as i have written some wrappers for TyXML for htmx. A HTML => dream-html converter tool would be awesome, however its probably not a simple task, as it requires HTML parsing and code generation.

I am actually not too worried about parsing HTML because we have an amazing library by the author of Dream: lambdasoup 1.0.0 (latest) · OCaml Package

Just need to explore it a bit and see if we can get to an 80/20 solution quickly.

I have an incomplete tool for this I originally hacked out for bucklescript-tea and recently modified for playing with dream-html adapt to dream-html by joprice · Pull Request #3 · joprice/htmltea · GitHub. I only hardcoded a handful of attribute mappings I ran into while converting some tailwind examples.

1 Like

Interesting approach.

I need to investigate this further. However im a little skeptical of introducing another language (i know its just alternative syntax, but the fact remains) this early in the project. I would probably need to setup some sort of pipeline to handle the .re files in tandem with .ml files and all that jazz that comes with it. Do you happen to have any public repos that uses this method i could take a closer peek at?

What’s the issue with tyxml’s ppx ? It’s designed to solve that problem exactly.

Edit: OH, The last release was indeed not 5.0 compatible. I’m doing a new release right now!

7 Likes