Thank you, much appreciated. Yes, there are proposals for native templating, but i suspect it will take some time to agree on such things. I opted for comments in the end mainly to support multiple top level nodes, but they also prove helpful for place-finding when inspecting the DOM.
RE docs: Yes absolutely! The next section in the docs will be tutorials and all of this great feedback will be most useful in helping figure out what to focus on so thanks again.
see the comment above "RE: #" concerning the index. synergy doesn't provide means for you to pass custom arguments into the event handlers, but the event target and the datum provide context of the loop and the handlers "this" is the viewmodel itself.
RE css-in-js style encapsulation: One of my goals was to support pre-rendering, which is why Synergy doesn't currently use Shadow DOM. In the (hopefully near) future, Shadow DOM will become declarative and at that point Synergy will adopt whichever pattern the web lands on and be able to provide both features.
RE separation of concerns: Glad you like it, and yeah - the react approach is very popular so this won't suit everybody, but that's fine...people have different styles and I don't believe there's a one "right" way any more than there's a "best" programming language.
RE prerendering: yes, completely agree - puppeteer would certainly be heavy for dynamic SSR and I wouldn't suggest that. Perfectly suitable for build-time prerendering though, which is what I've been focused on so far in this area with Synergy.
Re the '#', yes - this is currently a limitation and will be addressed, most likely with destructuring syntax for the repeated block declaration (e.g., #each [i, item] in items)
RE the event signature: (If you raise an event from an item within a repeated block then synergy provides the data for that item as the second argument to your event handler function.) If you have a nested loop then you'll get the data item for that particular loop.
Firstly, thank you so much, this kind of feedback is extremely useful and greatly appreciated. I'll try to reply separately to each of your points for clarity...
Yes, you can prerender in a browser (e.g., using Puppeteer) or provide a synthetic DOM (e.g., JSDOM) in Node. It's the next thing on my list to flesh out some more detail in the docs around this.
Preact is a really great project! I contributed to this myself in a very small way last year to add support for customised built-in elements. I would definitely recommend Preact if you're a fan of React. Synergy is different in a few ways, for example it uses Custom Elements whereas Preact has its own component system just like React. Synergy also separates HTML and JS concerns more clearly, making it a little more like Vue in that respect. Preact and Synergy both share this ability to work "as is" directly from a CDN without any heavy toolchain.
Thanks for your question. I'm not overly familiar with Alpine but yes, the syntax is very different. Alpine appears to freely mix JS and HTML whereas Synergy minimises this in favour of a clearer separation of concerns.
Synergy is my attempt to create the thinnest possible layer of abstraction over the browsers built-in APIs in order to build UIs with Custom Elements. I wanted to be able to express UIs in simpler terms, and I feel like I've achieved what i was aiming for with this. It won't be suited to everybody's tastes, and that’s fine, but I’m having a lot of fun using it myself at the moment and I'm excited to share this for the first time and welcome any and all constructive feedback.