🦄 Your Fantasy Front End Framework Designs 🧡

The Frontend framework market is cramped, in fact its getting to the point where the runtime framework is graduating to compile time with things like Svelte, Riot.js and Stencil among others.

I often think about syntax, what would my own frontend thing be like?
I would probably have the following rules.

• must be as close to existing specifications as posable and follow pre-existing knowledge as close to the language that it is trying to emulate.
• must either be very prescriptive or very free
• should be compiled first and can also have a runtime effort without stigma that this is inferior in some way.
• all ideas must be as concise as humanly possible

I am looking at approaches that may not be mainstream just for the interest.

I wrote a component:

export default ({
  tag = "x-foo",
  state = {},
  meta = {},
  handle = {
    click() {}
  }
}) => `
  <div>
    <p>hello test</p>
    <button onclick=${handle.click}></button>
  </div>
`;

Now this is valid JS but it has a problem, also quite elegant and I wish it where possible to write a component in this way, in real life this way of defining a component relies on the defaults never being passed, it relies on defaults being completely private even from the framework that would process / compile such a component. This code could only work through introspection or compiling.

What about this one a DSL leaning on your knowledge of css (domain specific language).

@script {
    const foo = "hello world";
    const bar = #333333;
}

@style {
    :host {
        div {
            color: ${bar};
        }
    }
}

@template {
    <div>${foo}</div>
}

That one is actually close to my programming language Jess that I stopped working on because Rust is hard, parsing and lexing is hard too - maybe il try again one day.

The problem is DSL's are weird, really weird and you have to "learn" things, that sucks.

''' js
const foo = "hello world";
const bar = #333333;
'''

I like this variation based on md code blocks, lots of ways to design a syntax, good fun too but none of these would amount to anything special, the solution is still out there and I think it lies within WASM.

Sooo anyway the point of the post what does your Frontend Framework look like? do you like DSL's?
Leave a comment so I can be "inspired" by it.