These are chat archives for mithriljs/mithril.js

21st
Oct 2015
Pierre-Yves Gérardy
@pygy
Oct 21 2015 00:46
Basically because Leo is neither Google nor Facebook, and their voice is much louder. Monkey see, monkey do. Few people take the time to evaluate the frameworks on their technical merits.
Gilbert
@gilbert
Oct 21 2015 00:56
Exactly, which is why it's up to us to promote mithril and make it more popular :)
Pierre-Yves Gérardy
@pygy
Oct 21 2015 01:17
I do it when I can, but I sometimes refrain because I don't want to look (too much) like a shill ;-)
Dominik Dumaine
@Bondifrench
Oct 21 2015 01:20
The difference is marketing and corporate backing, but mostly marketing. It needs more presence on blog platforms like Medium or on newsletters like Javascript weekly.
It also needs some media friendly developer endorsement, for instance I have been trying to mention Mithril on the blog posts of Eric Elliott or Nicolas Bevacqua, but they tend to follow the fashion of the day, and some like Eric like to self-promote themselves with the flavour of the month
And it needs regularity of blog posts...to keep its momentum.
Dominik Dumaine
@Bondifrench
Oct 21 2015 01:31
Corporate backing helps to get 'Developer evangelists', for instance Christophe Coenraets does a good job of demonstrating the use of different frameworks and how they integrate with other libaries, he is now at Salesforce but he used to be at PhoneGap, so he shows a multitudes of applications using Angular, React, ES6, Ionic, Cordova etc... He seems to be very present on the conferences front which helps in terms of exposure
dho825
@dho825
Oct 21 2015 01:32
IMO, besides the corporate backing, is also the need for modularity and extensibility. I feel it’s kind of a double edged sword that mithril is so compact but so tightly coupled. It seems (outsider’s perspective) that it’s very standalone—while something like Mercury, because it’s using various libs that focuses on doing specific tasks well, may very well find increased adoption (though, I haven’t heard much more about Mercury than Mithril). The other thing is that I don’t believe that the comparisons between React and Mithril have been very clear. The only real comments have been on the Mithril site that just says they’re similar. Also recent jsPerfs are not making Mithril look as performant, so, from a perspective of a library “shopper”, it’s easy to pass over.
@pygy super excited about the cross of cito and mithril…wish there would be more aggregation of libraries especially when the authors are thinking the same lines—would help with reach in terms of community size…though I’m not one to say much, I’m still very new and still trying to figure out ways I can promote Mithril
Dominik Dumaine
@Bondifrench
Oct 21 2015 01:36
I just did a google search with jsperf mithril react Mithril still shows up on top on my machine
that was not the latest test...just the first one appearing on google
well, test from one week ago still show it on top...anyway benchmark are only as good as what they measure and don't mean much
Omar Hughes
@Naomarik
Oct 21 2015 02:47
As a dev one of the factors when I evaluate things is looking for success cases. emberJS has discourse and angular has made with angular. Maybe a community site or gist with a bunch of sites using mithril would be nice? mithril's landing page has a very solid value proposition with the benchmarks for rendering and loading, but haven't seen that updated in awhile and wondering if it's still current.
Omar Hughes
@Naomarik
Oct 21 2015 03:05
@Bondifrench i'm not really sure how this translates to real world usage but in those tests mithril comes out ahead by far. i'd love to see a solid non-trivial mithril webapp's performance
dho825
@dho825
Oct 21 2015 03:30

@Bondifrench I was referring to this benchmark where it spurred Leo to write this blog post

To clarify what I mean: performance isn’t everything, as Leo writes, however, from the outside looking in, if more “real-life” benchmarks show the same perf as the link you provided, it could possible make mithril more appealing, but it obviously isn’t so. This is just one perspective. I totally agree that we need to be more vocal and spread the love ;) Any thoughts on reaching out to podcasts like JSJabber or the Changelog?

Dominik Dumaine
@Bondifrench
Oct 21 2015 04:10
@Naomarik Mithril has both lichobile and Flarum as both open-source, non-trivial real world apps. I have lichobile on my phone and its rendering performance seems to be pretty good but there are no benchmark per se. Flarum's author has openly stated here how Mithril contributed to reduce the size of its source code. I guess It's not a matter of convincing you as you are already looking at Mithril but a matter of getting other developers on board.
dayu
@dayuoba
Oct 21 2015 05:27
<meta charset="utf-8">
this make the view do not work,when i use msx
Rohith Daka
@rohithdaka
Oct 21 2015 06:04

I really miss those Learn Mithril articles. Trust me, there are lot of newbies like me who are terrified at the JS mess that is out there. Explaining the thought process behind decisions taken while building this framework really help us connect the dots.

@lhorie Could you please continue that blog section? :P Or ask someone to write guest posts if you are overwhelmed with other things :)

dayu
@dayuoba
Oct 21 2015 06:09
return function(controler) {
        return <html>
            <head>
            <meta charset="utf8">
            </head>
            <body>
                <div id="hello">
                    <h1> { controler.getTitle() } </h1>
                    <p> { controler.getWords() } </p>
                    <p> { controler.list().data.id} </p>

                </div>
            </body> 
        </html>
    }
it does not work,but if i remove <meta charset="uft8"> it works.did i get something incorrectly?
and title in head works
HB Stone
@hbstone
Oct 21 2015 06:37
If you close the tag, e.g. <meta charset="utf-8"/> (slash at the end) does it work?
also, not sure if "utf8" without a hyphen will actually work. I don't think it's causing your issue but you may end up with default browser encoding instead.
This message was deleted
dayu
@dayuoba
Oct 21 2015 06:43
@hbstone yep,both <meta /> and <meta></meta> work
Stephan Hoyer
@StephanHoyer
Oct 21 2015 07:22
I try to promote mithril for a year now, with some success. However we have to do better on this. Having popular JS-Evangelists/Opinion-Leaders on our side would be very helpful. Maybe we should search for them and try to convince them to take a look at mithril
dayu
@dayuoba
Oct 21 2015 07:24
i want to ask should i worry about the event listeners on the dom such as
``
arr.forEach(){
  <li onlick={ m.withAttr()}>
}
Dominik Dumaine
@Bondifrench
Oct 21 2015 07:29
@StephanHoyer I thought of recreating some of the examples that Coenraets does, I have started with this and this but haven't found the time to finish. When finished I thought to submit to him and/or send to JS weekly etc...
dayu
@dayuoba
Oct 21 2015 07:29
and which is better msx or m('dom')? i find m('dom') is not friendly for reading. and msx is not friendly for using.
like event handler is not as easy as m('dom')
Dominik Dumaine
@Bondifrench
Oct 21 2015 07:31
@dayuoba It's a matter of taste really. I personally prefer pure simple ES5, so no need for a transpiler etc... and it reminds me that everything are JS functions
Stephan Hoyer
@StephanHoyer
Oct 21 2015 07:34
@Bondifrench nice
dayu
@dayuoba
Oct 21 2015 07:34
@Bondifrench maybe, but a long template is really hard to read with nesting m('dom', [])
Rodrigo Alvarez
@Papipo
Oct 21 2015 07:34
Here we like m()
Stephan Hoyer
@StephanHoyer
Oct 21 2015 07:34
Therfore you have functions
dayu
@dayuoba
Oct 21 2015 07:36

if i organize the code like

module.exports = function(Application) {
    return function(controler) {
        var m = Application.m;
        var handler = m.withAttr("value", function(value) {
                console.log(value)
            });


        return <div>
            <input type="text" onchange={ handler } />
        </div>
    }

};

i also can use functions in msx

Dominik Dumaine
@Bondifrench
Oct 21 2015 07:36
@dayuoba I don't how deep nested dom elements you want to write, but it is encouraged to write small components and Mithril favors functions compositions....you are not obliged to write everything in one block
I meant I don't know how
Stephan Hoyer
@StephanHoyer
Oct 21 2015 07:37
why var m = Application.m;?
dayu
@dayuoba
Oct 21 2015 07:39
only for reading @StephanHoyer
Stephan Hoyer
@StephanHoyer
Oct 21 2015 07:40
If you handler is more complex I tend to create it in the controller and give it a meaningful name, liek this
module.exports = {
   controller: function() {
    return {
      updateWhatever: function(event) {
      }
    }
  },
  view: function(ctrl) {
        return <div>
            <input type="text" onchange={ ctrl.updateWhatever } />
        </div>
  }
}
Also using m.withAttr is not required. It’s just a helper
Dominik Dumaine
@Bondifrench
Oct 21 2015 07:40
@StephanHoyer the other thing we are missing is more presence on YouTube, there are very few videos. One guy posted a series of interesting videos doing a complete app with socket.io, Mithril, msx, babel etc...2 of them focus heavily on Mithril, compared to the number of React/Angular it's a shame. And the author Evilsoft is unfortunately not present in this gitter.
Videos: here and here
jcm169
@jcm169
Oct 21 2015 07:42
Hello
I've this code
Stephan Hoyer
@StephanHoyer
Oct 21 2015 07:42
I plan to create blog-posts on medium and also do some coding examples on youtube. Also I started to create a mithril-book… but I havent come to far with that since I’m pretty busy getting my startup rolling
dayu
@dayuoba
Oct 21 2015 07:42
blob
this is my structure, and i load them use applicatoin Object.
Dominik Dumaine
@Bondifrench
Oct 21 2015 07:43
Same for me...spending most of my time on my start-up
jcm169
@jcm169
Oct 21 2015 07:43
m("input",{onchange: m.withAttr("value",seleccio.id),value: seleccio.id()})
And when I try to change the value of the input field it returns to the original value what's wrong?
Stephan Hoyer
@StephanHoyer
Oct 21 2015 07:44
@dayuoba Splitting your code by type is an antipattern to me. It’s like sorting your book by size :)
In mithril I tend to sort them by modules… I also merge view and controller in simple cases
Dominik Dumaine
@Bondifrench
Oct 21 2015 07:47
@jcm169 As someone else before me said: oninput fires at each single character change in the field
onchange fires when the field is blurred etc. see https://developer.mozilla.org/en-US/docs/Web/Events/change, so you should use oninput
jcm169
@jcm169
Oct 21 2015 07:47
With oninput don't let me change the field
Anybody can help me?
Stephan Hoyer
@StephanHoyer
Oct 21 2015 07:50
I think I don’t understand your problem
dayu
@dayuoba
Oct 21 2015 07:50
your code should nothing happend
you give a setter to handler and return the getter() value to value,it's a circle
Stephan Hoyer
@StephanHoyer
Oct 21 2015 07:52
gtg guys
jcm169
@jcm169
Oct 21 2015 07:52
@StephanHoyer I have a variable seleccio (Is an object with multiple fields) and I try to edit this fields with a form but when I go to change its values they don't change
Dominik Dumaine
@Bondifrench
Oct 21 2015 07:53
@jcm169 your line seems correct, can you give more of your code, do you have a jsfiddle or jsbin?
the code it's a little big
@StephanHoyer @Bondifrench But my application it's a CRUD, and I add many users inside it, and in other view I see the table that contains the ID's of the entries, and when I click the button "Edita" (Edit) This one have the index of value, and I search the entrie with that index, and when I found it, I save it in a new variable, (seleccio), and when I show the form, and I try to change the fields I can't change them
Dominik Dumaine
@Bondifrench
Oct 21 2015 07:58
It's a lot of code, did you try on a smaller sample? I noticed that your last button has 2 onclick even handlers
event handlers
jcm169
@jcm169
Oct 21 2015 07:59
        return m("html", [
        m("body", [
            m("b","ID: "),
            m("input",{oninput: m.withAttr("value",seleccio.id),value: seleccio.id()}),
            m("b","Ultim Acces: "),
            m("input",{onchange: m.withAttr("value",seleccio.ultim_acces),value: seleccio.ultim_acces()}),
            m("b","Codi ISO NIF: "),
            m("input",{onchange: m.withAttr("value",seleccio.codi_ISO_NIF),value: seleccio.codi_ISO_NIF()}),
            m("b","NIF: "),
            m("input",{onchange: m.withAttr("value",seleccio.nif),value: seleccio.nif()}),
            m("br"),
            m("b","Vies: "),
            m("input",{onchange: m.withAttr("value",seleccio.vies),value: seleccio.vies()}),
            m("b","Data Vies: "),
            m("input",{onchange: m.withAttr("value",seleccio.data_vies),value: seleccio.data_vies()}),
            m("b","IVA: "),
            m("input",{onchange: m.withAttr("value",seleccio.iva),value: seleccio.iva()}),
            m("b","RE: "),
            m("input",{onchange: m.withAttr("value",seleccio.re),value: seleccio.re()}),
            m("br"),
            m("b","Venciment Pagament: "),
            m("input",{onchange: m.withAttr("value",seleccio.pag_venciment),value: seleccio.pag_venciment()}),
            m("b","Tipus Pagament: "),
            m("input",{onchange: m.withAttr("value",seleccio.pag_tipus),value: seleccio.pag_tipus()}),
            m("b","Dia 1 Pago: "),
            m("input",{onchange: m.withAttr("value",seleccio.pag_dia1),value: seleccio.pag_dia1()}),
            m("b","Dia 2 Pago: "),
            m("input",{onchange: m.withAttr("value",seleccio.pag_dia2),value: seleccio.pag_dia2()}),
            m("br"),
            m("b","Dia 3 Pago: "),
            m("input",{onchange: m.withAttr("value",seleccio.pag_dia3),value: seleccio.pag_dia3()}),
            m("b","Comanda Formal: "),
            m("input",{onchange: m.withAttr("value",seleccio.comanda_formal),value: seleccio.comanda_formal()}),
            m("b","Comentaris: "),
            m("input",{onchange: m.withAttr("value",seleccio.comentaris),value: seleccio.comentaris()}),
            m("b","Web: "),
            m("input",{onchange: m.withAttr("value",seleccio.web),value: seleccio.web()}),
            m("br"),
            m("b","Tarifa: "),
            m("input",{onchange: m.withAttr("value",seleccio.tarifa),value: seleccio.tarifa()}),
            m("b","Actiu: "),
            m("input",{onchange: m.withAttr("value",seleccio.actiu),value: seleccio.actiu()}),
            m("b","Data de Baixa: "),
            m("input",{onchange: m.withAttr("value",seleccio.data_baixa),value: seleccio.data_baixa()}),
            m("b","Comunicacions: "),
            m("input",{onchange: m.withAttr("value",seleccio.comunicacions),value: seleccio.comunicacions()}),
            m("br"),
            m("b","Divisa: "),
            m("input",{onchange: m.withAttr("value",seleccio.divisa),value: seleccio.divisa()}),
            m("b","Idioma: "),
            m("input",{onchange: m.withAttr("value",seleccio.idioma),value: seleccio.idioma()}),
            m("b","Tags: "),
            m("input",{onchange: m.withAttr("value",seleccio.tags),value: seleccio.tags()}),
            m("br"),
            m("button", {onclick: programa.vm.afegir, onclick:
                function(){
                    m.route("/?editat="+seleccio);
                }
            }, "Guardar Client"),
        ])
        ]);
This is the full form
and seleccio is this
var seleccio = new programa.model({id: 1,ultim_acces: 2,codi_ISO_NIF: 3, nif: 4,vies: 5, data_vies: 6, iva: 7, re: 8 ...});
and programa. model is like this
programa.model = function(dades){
    this.id = m.prop(dades.id);
    this.ultim_acces = m.prop(dades.ultim_acces);
    this.codi_ISO_NIF = m.prop(dades.codi_ISO_NIF);
    this.nif = m.prop(dades.nif);
    this.vies = m.prop(dades.vies);
    this.data_vies = m.prop(dades.data_vies);
    this.iva = m.prop(dades.iva);
    this.re = m.prop(dades.re);
   ...
}
jcm169
@jcm169
Oct 21 2015 08:09
you understand this
Dominik Dumaine
@Bondifrench
Oct 21 2015 08:10
@jcm169 I think I know what you problem is, you are trying to access the model directly, instead you in your event handlers like onclick: m.withAttr("value", seleccio.etc...)} you need to access the view-model, check the getting started guide, Leo is not accessing todo.Todo which is your class constructor but the todo.vm which is more of an instance of your class
You do that correctly in Crear but not in Edita
Dominik Dumaine
@Bondifrench
Oct 21 2015 08:15
In Edita, your controller is initialising a new model withprograma.vm.init() but than in your view you are overriding it somehow with var seleccio = new programa.model()
Additionally, the whole var pasada = m.route.param("index") etc..until while (i! = pasada) should probably reside in a controller or vm and not in the view.
Hope this helps, need to go now!
oliverhunt
@oliverhunt
Oct 21 2015 08:54
@mindeavor you there?
Hendrik Roth
@HendrikRoth
Oct 21 2015 10:43
how do u handle radio inputs in mithril?
onclick event?
oliverhunt
@oliverhunt
Oct 21 2015 10:44
onchange?
Hendrik Roth
@HendrikRoth
Oct 21 2015 11:02
ok
Barney Carroll
@barneycarroll
Oct 21 2015 11:41
The one that fires the change event is the one that's been checked
dho825
@dho825
Oct 21 2015 13:19

@Bondifrench just out of curiosity, since this was being discussed last night (I'm GMT -4), are you aware of what will be the major changes/considerations for changes with the next release of Mithril?

I’d actually love to write some documentation and start some more buzz around this a la what we see in the React community. But, as you might tell, I’m also not as proficient as the rest of you here. I’m thinking this is also an opportunity to invest in Mithril, learn its ins and outs, and really try to drive a bit more traction with this library…

Barney Carroll
@barneycarroll
Oct 21 2015 13:22
@dho825 Leo mentioned a while back that he was thinking about a total re-write of Mithril, inspired by Cito js
Cito is an embryonic virtual DOM library that's far more low-level than Mithril — it's API isn't half as convenient or comprehensive as Mithril's from an application development perspective — but it has a different approach to virtual DOM management.
This makes it much faster than Mithril in theory
There haven't been any other indications of what new Mithril would involve AFAIK
However I would hope this re-write would reconsider some of the APIs
dho825
@dho825
Oct 21 2015 13:33
@barneycarroll glad to see you're back since I haven’t seen you in this channel for a while! I actually was looking into cito—very cool how he is thinking about the vdom diffing strategies. The rewrite is a bit of a dbl edged sword…because Mithril hasn’t reached the amount of adoption that React has (using React as the closest example) it can iterate quickly and implement these breaking changes, but it also hinders the community from really doubling down on it and writing any “marketing” material as @Bondifrench was mentioning last night...
Barney Carroll
@barneycarroll
Oct 21 2015 14:04

It's good to be back, thanks :)

it also hinders the community from really doubling down on it and writing any “marketing” material

I think the opposite might be true, actually

Mithril has become stagnant. In order to get more momentum, it really needs some big changes in core.
Just reading up on what was being said last night
Barney Carroll
@barneycarroll
Oct 21 2015 14:10
I think Mithril really needs that re-write. Mithril's problem is that it was developed in isolation, and has basically not changed significantly since its first release. A combination of hand-optimisation and a lack of clear direction or ambition since initial release have made signifficant contribution very diffcult. Leo wrote some awesome blog posts in 2014, but since then momentum and ambition have all but disappeared. Mithril needs a re-write to catch up with speed - it used to be the fastest thing on the block but incremental bug-fixing and feature addition (while everybody else has been working dilligently on DOM diff / patch improvements) have put paid to that - but it also needs a re-write to tackle API deficit, address the modern expectations and ambitions of web app developers, and give us all some renewed vision and energy to get it out and about.
oliverhunt
@oliverhunt
Oct 21 2015 14:13
blog posts are great. i love those
im currently building a fairly complex app using mithril
for the uk public sector
Barney Carroll
@barneycarroll
Oct 21 2015 14:13
I'd love to write about application development with Mithril, but in order to talk about how I've managed to build what I have I need to explain a lot of hacks and workarounds.
Leo Horie
@lhorie
Oct 21 2015 14:13
@barneycarroll so what's in your wishlist?
Barney Carroll
@barneycarroll
Oct 21 2015 14:13
@lhorie long time no see! :D
Leo Horie
@lhorie
Oct 21 2015 14:14
long time no see indeed :)
been busy
Barney Carroll
@barneycarroll
Oct 21 2015 14:15
How've you been?
oliverhunt
@oliverhunt
Oct 21 2015 14:15
lhorie - been building with mithril everyday for the last 4 months - been a pleasure
Leo Horie
@lhorie
Oct 21 2015 14:16
@oliverhunt nice. What kind of app are you building?
@barneycarroll I'm good. I wish I had more time these days.
oliverhunt
@oliverhunt
Oct 21 2015 14:18
@lhorie it is for contract management
Barney Carroll
@barneycarroll
Oct 21 2015 14:18
  • Per-component redraw
  • Separation of component instance and live DOM element identity
  • Ditch m.redraw.strategy API, and remove all altogether - this is a bad hack for people who screw up DOM state
  • Mitigate state screw-ups and allow more flexibility by exposing lifecycle hooks which don't depend on element destruction
@oliverhunt you're not working with the Department of Justice perchance, are you?
oliverhunt
@oliverhunt
Oct 21 2015 14:18
im not @barneycarroll
are they in need of some contract management software?
Barney Carroll
@barneycarroll
Oct 21 2015 14:19
@oliverhunt they're currently doing something big with regards to software that demystifies legalese
in UK law
oliverhunt
@oliverhunt
Oct 21 2015 14:19
that sounds interesting, do you have a link?
Leo Horie
@lhorie
Oct 21 2015 14:20
re: last point, you mean like that onunload removal callback stuff? @barneycarroll
Barney Carroll
@barneycarroll
Oct 21 2015 14:20
@lhorie yes
Leo Horie
@lhorie
Oct 21 2015 14:21
ok awesome, looks like our wishlists are very similar :)
Barney Carroll
@barneycarroll
Oct 21 2015 14:21
Modulator API was too abstract, but I think it's important to be able to keep virtual DOM component state management without forcing a one-on-one relationship between virtual components and physical components
:D
oliverhunt
@oliverhunt
Oct 21 2015 14:21
lhorie i was struggling with models until yesterday
Leo Horie
@lhorie
Oct 21 2015 14:22
I like where cito was going w/ fragments
Barney Carroll
@barneycarroll
Oct 21 2015 14:22
Yes, that looked very good. Sadly Joel is in a similar position to you - very busy man working in isolation
For me the big challenge lies in milking the speed and flexibility of cito while presenting an API that's user-friendly enough, ie abstracting away literal diff / patch operations
Leo Horie
@lhorie
Oct 21 2015 14:25
yeah he said he won't have time to work on it for a while because of school final exams
wrt to speed vs convenience, it looks like the state of art is moving towards pre-compilers
Barney Carroll
@barneycarroll
Oct 21 2015 14:27
The problem we had when trying to figure out a comprehensive way of doing component invocation and management in 0.2 was that nobody cares about DOM patching / diffing implementation when they're thinking about instantiating / retrieving component instances. The DSL should hide that stuff. But then you get things like infinite lists and components that move from one place to another where being able to do intelligent diff / patching is absolutely crucial. Famo.us tried to do this but ended up having to write a totally gobbledygook DSL for it.
@lhorie was chatting to Dom of T7 and Inferno, he's realised that too
Leo Horie
@lhorie
Oct 21 2015 14:28
yep, I was thinking of him when I said that :)
Barney Carroll
@barneycarroll
Oct 21 2015 14:28
Did you see the thing where Dan Abramov of React slagged him off on Twitter for suggesting that T7 was good because it was all actual Javascript?
Leo Horie
@lhorie
Oct 21 2015 14:29
that and imba
no, do you have a link?
Barney Carroll
@barneycarroll
Oct 21 2015 14:30
I'll try and dig it up
It basically gave Dom a point of reflection to realise that the pseudo-XML thing was the way forward - nesting components was too verbose in T7
So now he's pivoted with Inferno and turning it into an alternative React engine
Leo Horie
@lhorie
Oct 21 2015 14:31
personally I like the mithril selector-based api, but I know some people prefer HTMLy syntax, and I know for a fact that people-who-are-not-in-the-SF-bubble are very much behind the times
Barney Carroll
@barneycarroll
Oct 21 2015 14:31
And he's writing his own JSX alternative for Babel
The idea being, apparently, that Babel is now part of the web (!)
dho825
@dho825
Oct 21 2015 14:32
Is there some way that all of you authors could work towards a common “core” rendering engine like how Mercury is using the vdom lib to do diffing and rendering, but of course build on top of that the apis which would differ based on your philosophies and preferences?…Or is the “core” exactly where the opinions vary?
Barney Carroll
@barneycarroll
Oct 21 2015 14:32
Yeah, I thought T7 was very interesting on that level
Leo Horie
@lhorie
Oct 21 2015 14:33
the nice thing about jsx is that they were working on a spec, so it makes it easier to target when you're building tools
dho825
@dho825
Oct 21 2015 14:33
I think the pseudo-XML is really a point of collaboration, designers and other frontend devs are more comfortable with it which drives adoption and furthers development
I enjoy mithril syntax though…I actually think it is very clear
Leo Horie
@lhorie
Oct 21 2015 14:34
@dho825 re: common core, there was some discussion about this on the mozilla bug tracker, but most people there thought it would be too hard
the HTML syntax is a large reason why a lot of people are still using Angular (and why I think angular 2 will failwhale)
dho825
@dho825
Oct 21 2015 14:36
^ interesting perspective…haven’t thought of it that way, but the reason for that is really just polluting your html and not really having neat separation of concerns. I think with JSX though, its really just syntactic sugar above plain old javascript that people would be more comfortable with...
Barney Carroll
@barneycarroll
Oct 21 2015 14:39
The XML thing is very strange. I hate to sound like a snob, but I really wouldn't want to work with somebody who couldn't work with Mithril because it didn't look like HTML enough for them.
Leo Horie
@lhorie
Oct 21 2015 14:39
to give some perspective, my wife works in a large consulting company doing work for big telecomms and banks. They don't even have a frontend build system. No grunt, no uglify, no jshint, nothing. Just old school HTML files w/ a bunch script tags.
dho825
@dho825
Oct 21 2015 14:40
@barneycarroll lawl, but you have to agree that software adoption is based on these type of entry points
Barney Carroll
@barneycarroll
Oct 21 2015 14:40
And Angular is a great example of how it totally screws the learning curve. Declarative markup is great, until you actually need to do some imperative logic. Then you need to learn this totally new byzantine DSL that's completely unsuited, because guess what - the whole point of the exercise was to write a dynamic application in the first place, you were just putting it off because 'HTML is easy'
@dho825 yes, but it's wrong. It's deceitful and unproductive.
dho825
@dho825
Oct 21 2015 14:41
totes agree
Barney Carroll
@barneycarroll
Oct 21 2015 14:42
It's like politicians saying immigration is threatening the country's stability while they fail to use tax to create more homes and jobs
Angular was originally written to make it easy for designers with no Javascript knowledge to write database-respondent forms
Trying to encourage its use as an application development framework is terrible
randallr
@randallr
Oct 21 2015 14:44
fwiw, i am coming from extjs and mithril lines up more with the extjs js based development.
Barney Carroll
@barneycarroll
Oct 21 2015 14:45
@randallr because it's all written in Javascript? ;)
Leo Horie
@lhorie
Oct 21 2015 14:46
we had a really large and old extjs codebase back at my previous job. Using Ext 2 if I recall. Couldn't even upgrade due to all the massive breaking changes ._.
randallr
@randallr
Oct 21 2015 14:46
i tried several of the html directive based frameworks, and could never get used to writing the xml.
in my opinion, seems like a step backwards using html/xml directly.
Barney Carroll
@barneycarroll
Oct 21 2015 14:47
@randallr I think that's the key: if you have no experience of the difficulties in writing and maintaining web applications, then something that looks like HTML will look awesome to you - because it's deceptively simple. The con with the XML-like thing is that it's solving the wrong problem.
Leo Horie
@lhorie
Oct 21 2015 14:49
it's kinda of like an awkward arranged marriage. It is backwards to use HTML when you really mean to use a programming language, but at the same time, pre-rendering templates to HTML from React/Mithril/whatever is currently being touted as a step forward
Barney Carroll
@barneycarroll
Oct 21 2015 14:49
@lhorie exactly
Brilliant analogy
randallr
@randallr
Oct 21 2015 14:49
agree
Leo Horie
@lhorie
Oct 21 2015 14:50
(which is kind of ironic, since that's kinda what we used to do before..)
dho825
@dho825
Oct 21 2015 14:50
have any of you looked into elm?
Leo Horie
@lhorie
Oct 21 2015 14:50
only as far as skimming the homepage @dho825
randallr
@randallr
Oct 21 2015 14:51
i haven't looked at elm
Leo Horie
@lhorie
Oct 21 2015 14:51
but the reactive model of elm is also one of the things being touted as a step forward
dho825
@dho825
Oct 21 2015 14:52
the only reason I bring it up is because that’s the only way that “arranged marriage” works; if you simply write a language that unifies the two
randallr
@randallr
Oct 21 2015 14:52
the other framework i have tried and follow is cycle.js
Arthur Clemens
@ArthurClemens
Oct 21 2015 14:53
Every once and a while I get the plan to start trying Elm, but then I cannot find a real convincing argument.
Leo Horie
@lhorie
Oct 21 2015 14:53
there are other ways to go about it, e.g. espresso (pulls out list of really obscure frameworks)
Arthur Clemens
@ArthurClemens
Oct 21 2015 14:53
I do think it is interesting because of its Haskell like quality
and Haskell ends up with the same fate
dho825
@dho825
Oct 21 2015 14:55
@ArthurClemens is it due to Elm itself or really just because Javascript is ubiquitous and it’s just simpler to go straight to JS rather than this compile to JS stuff?
Jon Earley
@jonearley
Oct 21 2015 14:56
Is it possible to use a for loop in a mithril view or am I missing something?
Leo Horie
@lhorie
Oct 21 2015 14:56
@jonearley typically you'd use map, e.g. [1,2,3].map(function(n) { return m("div", n) })
Arthur Clemens
@ArthurClemens
Oct 21 2015 14:56
@dho825 I don’t have a huge problem with javascript, so I don’t feel the pain
Barney Carroll
@barneycarroll
Oct 21 2015 14:58
@randallr Cycle has nice language - refreshing to read documentation that's sympathetic, intelligent and non-condescending
dho825
@dho825
Oct 21 2015 14:58
@ArthurClemens yeah that seems to be the issue for the majority, JS is advancing. Things like Elm and Dart may not be a panecea afterall. But, that Elm Time Traveling Debugger is so sweet…too bad it’s impossible in JS
Barney Carroll
@barneycarroll
Oct 21 2015 15:00
@dho825 don't think that's necessarily the case. Flux encourages a method for model management that effectively allows you to capture snapshots
randallr
@randallr
Oct 21 2015 15:00
@barneycarroll -- i'm a proponent of rx, so my interest in cycle stemmed from that.
Leo Horie
@lhorie
Oct 21 2015 15:00
my opinion of compile-to-js languages is that there are a lot of superficial ones (e.g. coffeescript), and a few interesting ones that are mutually exclusive (elm -> reactive model; typescript -> static typing; clojurescript -> immutability-by-default, metaprogramming, etc)
Barney Carroll
@barneycarroll
Oct 21 2015 15:01
@lhorie Babel has been a bit of a revolution in that regard
Leo Horie
@lhorie
Oct 21 2015 15:02
@barneycarroll in what sense? Isn't it just a ES6-to-ES5 compiler?
Barney Carroll
@barneycarroll
Oct 21 2015 15:02
It's got the most comprehensive abstract syntax parser out there
No
You can turn on and off any number of features
Leo Horie
@lhorie
Oct 21 2015 15:02
I say "just" loosely here
Barney Carroll
@barneycarroll
Oct 21 2015 15:03
It used to have JSX compilation built-in
bmartel
@bmartel
Oct 21 2015 15:03
@dho825 It's completely possible, i've done it with mithriljs + immutable structures and redux.
Barney Carroll
@barneycarroll
Oct 21 2015 15:03
But that's now become a formalised plug in
It's got flow type annotation stuff as a plugin, all sorts
Leo Horie
@lhorie
Oct 21 2015 15:03
right, but I mean, Babel can't magically make js have time-travel capabilities
Barney Carroll
@barneycarroll
Oct 21 2015 15:04
No
But as @bmartel proves, 'time travel' doesn't need to be a 'language feature'
Leo Horie
@lhorie
Oct 21 2015 15:06
sure, but if you go down that slippery slope, you don't need anything more than functions and control statements in a language ;)
oliverhunt
@oliverhunt
Oct 21 2015 15:07
im having a serious issue with a model getting update but the view not reflecting this;
Barney Carroll
@barneycarroll
Oct 21 2015 15:07
It depends on the scope of your ambition, I guess
@oliverhunt got some code we can look at?
Leo Horie
@lhorie
Oct 21 2015 15:07
the thing with these interesting features is that what makes them interesting also makes them less approachable to people like the consultants in my wife's company
Barney Carroll
@barneycarroll
Oct 21 2015 15:07
Right
@lhorie I could be one of those consultants :)
I'm developing an application from scratch, I don't want to be locked in to this magic DSL that invalidates all my JS experience
Leo Horie
@lhorie
Oct 21 2015 15:08
if you can handle the bureaucracy and the endless meetings, go for it :)
Barney Carroll
@barneycarroll
Oct 21 2015 15:09
I don't want to think of an awesome idea and then realise I don't even know how to start implementing it because all the language features I'm familiar with are gone
oliverhunt
@oliverhunt
Oct 21 2015 15:09
@barneycarroll http://pastebin.com/RSP5Hrki this selectbox has options, they come from the model, i change an option in the model but the value doesnt go to the view
Barney Carroll
@barneycarroll
Oct 21 2015 15:10
Again, it depends what you think the big problems worth solving are. Time travel is kinda cool, but that's not in my top 5 list of day-to-day struggles or year-to-year ambitions
@oliverhunt the arguments are the wrong way round
ctrl comes first, input fills the rest
I suspect your controller happens to copy input on initialisation, but never updates thereafter
oliverhunt
@oliverhunt
Oct 21 2015 15:13
i pass in the controller manually as those are just functions and the arguments are the correct way round
its bad code atm but:
Barney Carroll
@barneycarroll
Oct 21 2015 15:13
Oh
oliverhunt
@oliverhunt
Oct 21 2015 15:13
return ctrl.fieldPartial(ctrl.model, ctrl);
Barney Carroll
@barneycarroll
Oct 21 2015 15:14
OK
The other thing that jumps out is the onchange function
I'm a big advocate of uni-directional model flow
Leo Horie
@lhorie
Oct 21 2015 15:15
@barneycarroll yep I agree. I'm interested in these features because I have an interest in writing frameworks. But for day-to-day gotta-get-stuff-out-the-door-before-the-deadline, you gotta be pragmatic w/ what tools you're using
oliverhunt
@oliverhunt
Oct 21 2015 15:15
plz explain @barneycarroll
Barney Carroll
@barneycarroll
Oct 21 2015 15:16
So I would assume you have a hierarchy of components, and when you know some of the data changes you get a redraw
This passes the model down through to a tree of components
oliverhunt
@oliverhunt
Oct 21 2015 15:17
im accessing all data from a model layer directly
Leo Horie
@lhorie
Oct 21 2015 15:17
is it just me or is gitter buggy? I just got a private message and it disappeared
Barney Carroll
@barneycarroll
Oct 21 2015 15:17
So the fact you have both of these statements in the view makes me worry:
 field.Value = e.target.value;
ctrl.putFieldInDb(e, that)
@lhorie Gitter is horribly buggy
Leo Horie
@lhorie
Oct 21 2015 15:17
@jonearley
Jon Earley
@jonearley
Oct 21 2015 15:18
@lhorie resent
Barney Carroll
@barneycarroll
Oct 21 2015 15:18
Actually, that's not that bad
@jonearley bitter resentment? ;)
oliverhunt
@oliverhunt
Oct 21 2015 15:18
@barneycarroll ctrl.putFieldInDb = function (e, that) {
Contract.save(ctrl.data);
}
thats all that is
i havent full refactored
but this was the reason for efactoring
Barney Carroll
@barneycarroll
Oct 21 2015 15:20
So the view updates the local model directly, and also tells the server to update records using different inputs?
It looks flaky to me
Leo Horie
@lhorie
Oct 21 2015 15:20
@jonearley thanks
Barney Carroll
@barneycarroll
Oct 21 2015 15:21
Does ctrl.data have a reference to field? Otherwise I'm not sure how it would capture user input
You seem to be passing in the input event and element reference, and then not doing anything with them
oliverhunt
@oliverhunt
Oct 21 2015 15:22
indeed
Barney Carroll
@barneycarroll
Oct 21 2015 15:22
So onchange, I would expect the view to behave fine - unless field is discarded and the component is redrawn with new input, but I don't see how your database is going to get updates
oliverhunt
@oliverhunt
Oct 21 2015 15:22
i need to finish refacorting
my database updates fine, the local model updates fine but the model isnt being reflected in that select field
Barney Carroll
@barneycarroll
Oct 21 2015 15:25
My suspicion would be that what gets passed in as the first argument is different in the redraw to what it referenced originally
oliverhunt
@oliverhunt
Oct 21 2015 15:26
im not convinced a redraw is occuring
Barney Carroll
@barneycarroll
Oct 21 2015 15:26
Redraws are triggered automatically after a DOM event handler resolves
oliverhunt
@oliverhunt
Oct 21 2015 15:28
so the redraw is occuring and the data is exactly as it should be with the updated option label
i am using selectize so this must be the issue
Barney Carroll
@barneycarroll
Oct 21 2015 15:29
@oliverhunt got it
You can't set value on <select>s
oliverhunt
@oliverhunt
Oct 21 2015 15:30
im not setting value im changing the text of an option
its selectize
Barney Carroll
@barneycarroll
Oct 21 2015 15:31
Riiiight
oliverhunt
@oliverhunt
Oct 21 2015 15:32
its not being updated with the text
Barney Carroll
@barneycarroll
Oct 21 2015 15:32
Well I can easily imagine that
Not familiar with selectize
oliverhunt
@oliverhunt
Oct 21 2015 15:32
what would i need to do here? reinitalize the plugin?
Barney Carroll
@barneycarroll
Oct 21 2015 15:33
I guess so
The selectize API looks decent, they have a refreshItems() option
oliverhunt
@oliverhunt
Oct 21 2015 15:34
thing is when i look at the select it doesnt have the items, i guess selectize prevents it
Barney Carroll
@barneycarroll
Oct 21 2015 15:34
Well selectize hides the select and renders a whole bunch of other stuff instead
oliverhunt
@oliverhunt
Oct 21 2015 15:35
yeah i mean when i view the contents of the hidden select
Barney Carroll
@barneycarroll
Oct 21 2015 15:35
I don't know how it would do that
OK, so really the problem is that Mithril's kinda handling things and Selectize is kinda handling things too
oliverhunt
@oliverhunt
Oct 21 2015 15:36
yeah i think so
Jón Atli Ólafsson
@Lozzi
Oct 21 2015 15:38
@barneycarroll @oliverhunt Could it be a problem with the config function? 'initSelectUserFields'
oliverhunt
@oliverhunt
Oct 21 2015 15:39
var initSelectUserFields = function (element, isInitialized, options) {
if (!isInitialized) {
$(element).selectize();
}
}
Barney Carroll
@barneycarroll
Oct 21 2015 15:41
@oliverhunt I don't see how there would be a problem actually. Assuming all of these start off unpopulated.
oliverhunt
@oliverhunt
Oct 21 2015 15:41
the select isnt unpopulated
is that what you mean?
Barney Carroll
@barneycarroll
Oct 21 2015 15:42
Yes
Jón Atli Ólafsson
@Lozzi
Oct 21 2015 15:42
You could try adding an else where you 'refreshItems()'
oliverhunt
@oliverhunt
Oct 21 2015 15:43
i will investigate this tomorrow
thanks for your help
Barney Carroll
@barneycarroll
Oct 21 2015 15:44
Sorry man
Trying to figure it out here (you might want to fork it): http://jsbin.com/tusiko/edit?js,output
Getting errors on Selectivize init, might be to do with jQuery 3 alpha though
oliverhunt
@oliverhunt
Oct 21 2015 15:45
ta
dho825
@dho825
Oct 21 2015 17:18
@bmartel very interesting…is it open sourced on github?
bmartel
@bmartel
Oct 21 2015 22:16
@dho825 No unfortunately not, it was for a closed source application at work. Using the same concepts that react+redux uses to achieve the time travel effect, it can be made to fit mithril (arguably just as well). I am biased to mithril over react, and would say its better haha.
Barney Carroll
@barneycarroll
Oct 21 2015 23:51
@ArthurClemens I'm so glad that was published, and I'm sad that poor soul had to invest so much to figure out it was wrong
My last boss went to a Meteor event here in London a few months back
He was kinda interested because it seemed to address a lot of the nebulous difficulties WRT to front-end / back-end API bottlenecks
Barney Carroll
@barneycarroll
Oct 21 2015 23:58
The whole event was Meteor (company) delivered. They were desperate for any people outside of the company to provide any talking points. They revealed their business plan was in selling hosting and support.