Discussion on: Imba - a JavaScript alternative for increased developer productivity

[konung]

Looks interesting!

1. Could you contrast and compare to other languages / frameworks taking similar approach to help understand advantages of Imba? Like elm, svelte , purescript, reasonML, mint-lang ?
2. Could imba be used with an existing large backend written in another language like Elixir or Ruby ? Is it hard to set up ?
3. What are the current limitations & drawbacks of using Imba . I’m partial to elm and svelte , and familiar with some of the hurdles there, that were not quite clear and obvious when I started using them .

Thank you

[Sindre Aarsaether]

I applaud all efforts in improving the tools we all use to make great things! I'm not deeply invested enough in any of these to give a thorough and fair comparison, but generally I do think Imba is the most balanced among them.

Elm, purescript and reasonML are a lot further from js in terms of semantics and ecosystem from my (shallow) understanding. Mint-lang is certainly interesting. Svelte also shares many of the same ideas, but Imba is more opinionated for good and bad.

The support for styling in imba is truly special. Just like tailwind it looks messy at first glance, but the learning curve is not really that steep, and it feels like a super weapon once you master it.

The syntax is imho very elegant and concise, but I'm sure it will appeal more to those coming from ruby than from c-like languages. Most frameworks and languages (including svelte and mint-lang) stick to the jsx-like syntax for tags. Imba takes a much more opinionated approach with flexible event modifiers and powerful touch handling etc right out of the box.

Could imba be used with an existing large backend written in another language like Elixir or Ruby?

We still lack examples and starter-templates for these use-cases, but it should be relatively easy to set up.

What are the current limitations & drawbacks of using Imba?

Imho, the main limitiation is documentation. Too few examples, too many concepts not covered. Also, since Imba is so concise, it is easy to shoot oneself in the foot by not caring about abstractions and separations of concern before your knee-deep in a huge single-file application. As for the language, I think there will be many more pleasant surprises that are not quite clear when you start using it :)

[konung]

Thank you Sindre for a thorough answer, I will certainly try out Imba :)

[konung]

@somebee Could you mention, what current features are lacking/WIP? Or maybe there is a Roadmap?
Just trying to guage what limitations are.

i.e. with Elm the limitation (for my projects) turned out to be the delibirate slow release schedule. Creator of the language addressed it many times and gave his (valid) reasons for doing so. But if I knew about that beforehand, I might have not chosen Elm for a project, despite ti's no-runtime-errors guarantee.

[Sindre Aarsaether]

I will try to put up an official roadmap soon. There are definitely features lacking, but I wouldn't hesitate using it in production. There are things I plan to add, like custom SVG components, but nothing major missing for v2.

Our problem is rather too frequent releases. The main reason we haven't officially moved to beta is that it feels easier to release very frequent updates while in alpha.

[konung]

:) That's a good problem to have :)

[konung]

@somebee I started going through docs on imba.io website ❤️, and one thing that I found missing/WIP ( for my use cases) is global state-managment Redux-like.

I understand it's possible, but can't find a doc or an exmple or a video-tutorial of one. I noticed you recorded a lot of meetups - is there one per-chance where you discuss & show it?

[Matias]

Documentation on state is right around the corner and is being discussed in the Discord community right now, but here's a quick answer:

How do I manage global state? / Where do I use Vuex/Redux/Mobx?

The answer is mind boggling because of how simple it is; you don't. It kind of feels like something is missing, coming from the big web frameworks where thinking about state is a huge part of the day to day work.

When working with the web directly, instead of through the virtual DOM layer of abstraction, it can be as simple as this:

1) Make a new file for state to live in - for example state.imba
2) Export a regular Javascript object to use as the default state - for example:

export let state = {
    answer: 42,
    question: "The Ultimate Question of Life, the Universe, and Everything"
}

That covers the concept of global state, MUTATIONS and GETTERS. For the concept of ACTIONS we can add this, for example:

export def increment
    state.answer++

export def decrement
    state.answer--

3) Use it wherever you need. Here's a full app that imports the state above and uses it for an important calculation:

import {
    state
    increment
    decrement
} from './state'

tag app
    <self>
        <h2>
            if state.answer !== 42
                "A number"
            else
                state.question
        <button @click=decrement> "-"
        <pre> state.answer
        <button @click=increment> "+"

imba.mount <app>

Here's a little repo of the above example: github.com/codeluggage/imba-basic-...

[konung]

Wow . This is awesome !

One more question:
Can you bind to state ? If state changes from one component can you force an automatic update in another component connected/dependent on the same state variable ?