181–190 of 295 posts
It's pretty fascinating how tech tends to spread and influence. We spent years trying to make the web more like traditional UI dev, and now we're making traditional UI dev like web. I would never have believed this if you'd told me about it in 2010.
class Example extends Component {
render() {
return (
console.log('Hello')}>
Button
);
}
}
render();
1) Like run JS, then there 2) parse JSX that will build virtual DOM, then 3) interpret that vDOM to 4) create physical window.
Why not just
let app = Application({params});
let window = app.window({url:"content.xml",
type: "frame" });> It is not only shorter, it is also easier to read and to edit, and can easily utilize the power of the state. Easier to read and edit is obviously subjective, but shorter is not and that front page is just straight up lying. The Qt example is most definitely shorter. What am I missing?
Hey. I'm the author. It's hard to find a simple example that everyone understands but can show capabilities. If you're used to Qt then you're going to like Qt better, but I mainly developed this for people who want to use React. You are obviously free to use whatever you want. But if you have any suggestions let me know!
Is this created and maintained by a single developer (kusti8?), community, or corporation?
I'm one highschooler with not enough time. Ideally this would come from someone who can maintain this full-time like a corporation, but so far no one has done it.
It's pretty fascinating how tech tends to spread and influence. We spent years trying to make the web more like traditional UI dev, and now we're making traditional UI dev like web. I would never have believed this if you'd told me about it in 2010.
> and now we're making traditional UI dev like web It's been like that on Windows since 2006 with XAML. In fact, if you squint at typical JSX, it looks like XAML. Disclosure: I work at Microsoft.
Earlier quoted context omitted.
Writing React makes me feel more like building for web using native paradigms.
And yet there's not much that's like native GUI paradigms in React. At least when concerning all major GUI libs. It's more like a markup driving an immediate-mode graphics API.
Earlier quoted context omitted.
Anything that reduces the number of running chrome instances on my poor little laptop would be nice.
I tried out the example "Notepad" app in the git repo and it ran at 70MB. Is that good? I don't have any metrics about how much memory a hello world Electron app uses.
For the comparison, IDE sketch (editor with syntax highlighting) from Sciter (HTML/CSS/script engine) SDK (https://github.com/c-smile/sciter-sdk/tree/master/samples/id...) takes 43 MB.
Screenshot: https://sciter.com/wp-content/uploads/2018/05/idea-ide.png
Earlier quoted context omitted.
And if we want to compare the syntax then this would be the QML equivalent: import QtQuick 2.9 import QtQuick.Controls 1.3 ApplicationWindow { title: "Example" visible: true width: 300 height: 300 Button { text: "Button" anchors.centerIn: parent onClicked: console.log('Hello') } }
Thank you for posting an example. I was going to. I may be biased, but to me the QML code is much cleaner and clearer than JSX.
Am I the only one who think that this: class Example extends Component { render() { return ( console.log('Hello')}> Button ); } } render( ); is using too many artificial parsing layers ? 1) Like run JS, then there 2) parse JSX that will build virtual DOM, then 3) interpret that vDOM to 4) create physical window. Why not just let app = Application({params}); let window = app.window({url:"content.xml", type: "frame" })…
let button = new Button("Click me");
window.attach(button, {position: 'center'});
Am I the only one who think that this: class Example extends Component { render() { return ( console.log('Hello')}> Button ); } } render( ); is using too many artificial parsing layers ? 1) Like run JS, then there 2) parse JSX that will build virtual DOM, then 3) interpret that vDOM to 4) create physical window. Why not just let app = Application({params}); let window = app.window({url:"content.xml", type: "frame" })…
import { createElement as e } from 'whatever'
return e(App, {}, [
e(Window, { title: 'Example', size: { w: 300, h: 300 }, menuBar: false }, [
e(Button, { stretchy: false, onClick: () => console.log('Hello') }, [
'Button'
])
])
])