www.digitalmars.com         C & C++   DMDScript  

digitalmars.D.announce - Webassembly TodoMVC

reply Sebastiaan Koppe <mail skoppe.eu> writes:
Hey guys,

Following the D->emscripten->wasm toolchain from CyberShadow and 
Ace17 I created a proof of concept framework for creating single 
page webassembly applications using D's compile time features.

This is a proof of concept to find out what is possible.

At https://skoppe.github.io/d-wasm-todomvc-poc/ you can find a 
working demo and the repo can be found at 
https://github.com/skoppe/d-wasm-todomvc-poc

Here is an example from the readme showing how to use it.

---
struct Button {
   mixin Node!"button";
    prop innerText = "Click me!";
}
struct App {
   mixin Node!"div";
    child Button button;
}
mixin Spa!App;
---
Sep 21
next sibling parent Suliman <evermind live.ru> writes:
On Friday, 21 September 2018 at 14:01:30 UTC, Sebastiaan Koppe 
wrote:
 Hey guys,

 Following the D->emscripten->wasm toolchain from CyberShadow 
 and Ace17 I created a proof of concept framework for creating 
 single page webassembly applications using D's compile time 
 features.

 This is a proof of concept to find out what is possible.

 At https://skoppe.github.io/d-wasm-todomvc-poc/ you can find a 
 working demo and the repo can be found at 
 https://github.com/skoppe/d-wasm-todomvc-poc

 Here is an example from the readme showing how to use it.

 ---
 struct Button {
   mixin Node!"button";
    prop innerText = "Click me!";
 }
 struct App {
   mixin Node!"div";
    child Button button;
 }
 mixin Spa!App;
 ---
Very cool! Thanks!
Sep 22
prev sibling parent reply aberba <karabutaworld gmail.com> writes:
On Friday, 21 September 2018 at 14:01:30 UTC, Sebastiaan Koppe 
wrote:
 Hey guys,

 Following the D->emscripten->wasm toolchain from CyberShadow 
 and Ace17 I created a proof of concept framework for creating 
 single page webassembly applications using D's compile time 
 features.

 This is a proof of concept to find out what is possible.

 At https://skoppe.github.io/d-wasm-todomvc-poc/ you can find a 
 working demo and the repo can be found at 
 https://github.com/skoppe/d-wasm-todomvc-poc

 Here is an example from the readme showing how to use it.

 ---
 struct Button {
   mixin Node!"button";
    prop innerText = "Click me!";
 }
 struct App {
   mixin Node!"div";
    child Button button;
 }
 mixin Spa!App;
 ---
Can the SPA code be released as a separate module for WebAssembly web app development?
Sep 22
parent reply Sebastiaan Koppe <mail skoppe.eu> writes:
On Saturday, 22 September 2018 at 14:54:29 UTC, aberba wrote:
 Can the SPA code be released as a separate module for 
 WebAssembly web app development?
Currently the whole thing is not so developer-friendly, it was just the easiest way for me to get it up and running. Right now I am trying to ditch emscripten in favor of ldc's webassembly target. This will make it possible to publish it as a dub package (ldc only), as well as reduce some of the bloat. The downside is that ditching emscripten means I have to implement things like malloc and free myself. There is some obvious overlap between this and recent efforts by others (I remember D memcpy, and people trying to run it without libc, etc.), so I expect a situation in the future where all these efforts might be combined. Regardless, I don't need much from the C library, just enough to make (de)allocations and parts of the D standard library work. TL;DR I intend to publish it on dub, but it does takes some more time. What do you think of the struct approach compared to a traditional jsx/virtual-dom?
Sep 22
next sibling parent reply Suliman <evermind live.ru> writes:
What do you think of the struct approach compared to a 
traditional jsx/virtual-dom?
jsx is sucks. Look at Vue.js way, if you will able to fo you framework Vue-style it will be perfect!
Sep 23
next sibling parent Paolo Invernizzi <paolo.invernizzi gmail.com> writes:
On Sunday, 23 September 2018 at 17:53:32 UTC, Suliman wrote:
What do you think of the struct approach compared to a 
traditional jsx/virtual-dom?
jsx is sucks. Look at Vue.js way, if you will able to fo you framework Vue-style it will be perfect!
Being a Vue user for three years now, I completely agree. /P
Sep 23
prev sibling parent Sebastiaan Koppe <mail skoppe.eu> writes:
On Sunday, 23 September 2018 at 17:53:32 UTC, Suliman wrote:
What do you think of the struct approach compared to a 
traditional jsx/virtual-dom?
jsx is sucks. Look at Vue.js way, if you will able to fo you framework Vue-style it will be perfect!
The reason I made this wasm experiment was not to port some js-framework over to D, just to do the same thing but then in D. If I like some js framework out there, I would just use that one. My goal here is to bring something new to the table.
Sep 23
prev sibling next sibling parent reply Joakim <dlang joakim.fea.st> writes:
On Saturday, 22 September 2018 at 19:51:48 UTC, Sebastiaan Koppe 
wrote:
 On Saturday, 22 September 2018 at 14:54:29 UTC, aberba wrote:
 [...]
Currently the whole thing is not so developer-friendly, it was just the easiest way for me to get it up and running. [...]
Vladimir mentioned that there's a Musl port to wasm, have you tried it? https://github.com/jfbastien/musl Druntime and ldc support Musl.
Sep 23
next sibling parent Vladimir Panteleev <thecybershadow.lists gmail.com> writes:
On Sunday, 23 September 2018 at 18:36:11 UTC, Joakim wrote:
 Vladimir mentioned that there's a Musl port to wasm, have you 
 tried it?
My knowledge of the intersection of Musl and WASM is that Musl is used as the libc in Emscripten (and, as extension, in Dscripten), and Emscripten/Dscripten can target WASM as well as asm.js / regular ol' JavaScript.
Sep 23
prev sibling parent Sebastiaan Koppe <mail skoppe.eu> writes:
On Sunday, 23 September 2018 at 18:36:11 UTC, Joakim wrote:
 Vladimir mentioned that there's a Musl port to wasm, have you 
 tried it?

 https://github.com/jfbastien/musl

 Druntime and ldc support Musl.
Thanks for the link, I will have a look at it!
Sep 23
prev sibling parent aberba <karabutaworld gmail.com> writes:
On Saturday, 22 September 2018 at 19:51:48 UTC, Sebastiaan Koppe 
wrote:
 On Saturday, 22 September 2018 at 14:54:29 UTC, aberba wrote:
 Can the SPA code be released as a separate module for 
 WebAssembly web app development?
Currently the whole thing is not so developer-friendly, it was just the easiest way for me to get it up and running. Right now I am trying to ditch emscripten in favor of ldc's webassembly target. This will make it possible to publish it as a dub package (ldc only), as well as reduce some of the bloat. The downside is that ditching emscripten means I have to implement things like malloc and free myself. There is some obvious overlap between this and recent efforts by others (I remember D memcpy, and people trying to run it without libc, etc.), so I expect a situation in the future where all these efforts might be combined. Regardless, I don't need much from the C library, just enough to make (de)allocations and parts of the D standard library work. TL;DR I intend to publish it on dub, but it does takes some more time. What do you think of the struct approach compared to a traditional jsx/virtual-dom?
As a pro web developer, I think JSX will be the perfect abstraction for maximum adoption. React, being one of the most popular library for developing web applications, is loved by the community. Its the perfect way to model UI components that fits well in my logic. "ReactJS provided the solution that developers were looking for. It uses JSX (a unique syntax that allows HTML quotes as well as HTML tag syntax application for rendering specific subcomponents) This is very helpful in promoting construction of machine-readable codes and at the same time compounding components into a single-time verifiable file. ... ... It allows developers to write their apps within JavaScript. JSX is one of the greatest features that not only makes ReactJS easy but fun too. Developers can easily make a new UI feature and see it appear in real time. It brings HTML directly into your JS. ... ... Components allow developers to break down complex UI. The idea of components is what makes ReactJS unique. Instead of worrying about the entire web app, it makes it possible to break the complex UI/UX development into simpler components. This is crucial in making every component more intuitive." See JSX: https://medium.com/ thinkwik/why-reactjs-is-gaining-so-much-popularity-these-days-c3aa686ec0b3 I'm personally not tied to any framework or library. Only use React/JSX because its solves a real and practical problem for me. Something most web developers agree from the stackoverflow 2017 survey: https://insights.stackoverflow.com/survey/2017
Sep 23