25 ms·

SwiftWebUI

405 points by tambourine_man 7y ago

applecrazy 7y ago
This is insane. It’s bringing the arguably typing of Swift with the flexibility of designing a web app. It may not be feasible (yet) to build a non-trivial web app, but I’ll be watching this project from time to time. Very cool.
saagarjha 7y ago
Wow, what an interesting project. I wonder if you could reroute the connection over a websocket and serve an actual webpage off of it? It'd be a great demo to have the SwiftWebUI page served using SwiftWebUI ;) Also: it would be really nice if SwiftWebUI used actual HTML elements rather than styled divs.
catchmeifyoucan 7y ago
This is super cool! I built the airpptx.github.io project - which similarly uses powerpoint elements to translate to html. The challenges are in the translation of native elements to web elements. I'm going to take a look at your codebase and see if I can help.
dawkins 7y ago
This reminds me a lot about ASP.net Webforms. Maybe this is better conceived but trying to program the web like a desktop app created more problems than what it tried to solve.
- lukeh 7y ago
  It’s a PoC, the endgame could be running it directly in the browser with WASM.
- oaiey 7y ago
  It is hopefully something more like Blazor. That would at least run one day in the browser.
- mtrovo 7y ago
  My first thought also. Also I remember some of the design documents of JSF, it was designed to enable views to be rendered everywhere (Java ME, web, desktop). It only added complexity and in the end nobody used it because the paradigms are so different.
  - ZitchDog 7y ago
    It also scaled poorly.
dcdevito 7y ago
Nah. I’ll stick with Flutter
ben1040 7y ago
Reminds me of Cappucino, which professed to let you build a single-page webapp using "Objective-J," a strange hybrid of Javascript and ObjC. https://www.cappuccino.dev/ https://www.cappuccino.dev/
- zyang 7y ago
  I still remember paying $20 for the Atlas early access but never heard anything after. It was kickstarter before kickstarter. Truly ahead of its time in more than one ways.
- dmix 7y ago
  Whatever happened to that project? They were one of the early guys trying to do full blown "modern" JS apps on the web around the time when backbone.js came out, but with a more desktopy approach. Edit: I forgot, they were one of the first YC companies. Looks like the parent company got acquired by Motorola and somewhat shutdown their 280slides/Atlas projects. One founder also later started RunKit which was bought by Stripe. https://en.wikipedia.org/wiki/280_North,_Inc https://en.wikipedia.org/wiki/280_North,_Inc.
  - mpweiher 7y ago
    They hit 1.0 in April of last year. https://www.cappuccino.dev/blog/ https://www.cappuccino.dev/blog/
- iamgopal 7y ago
  Their demo and look were mind blowing
- chrismorgan 7y ago
  Cappuccino had promise early on, but fell into the trap of trying to reinvent way too much, and doing a horribly bad job of it. The end result looks terribly ugly, and utterly unusable in general. Ugly: it looks like a bad imitation of the appearance of Mac OS X from a mixture of 2002 and 2007, regardless of the fact that I’m on Windows in 2019; and due to pervasive use of 1× raster images instead of vector graphics, gradients, &c. is even more ugly on a high-DPI display. (This use of raster images without complete preload causes rendering issues when a control state is achieved for the first time, too, just like the rollover effects of the era, long since obsolete.) Unusable: it implements scrolling from scratch, which I have never seen work well, or even almost well—it’s just something that you should never under any circumstances do; in this case, I can only get their demos to scroll at about 1% of normal speed on my Surface Book’s touchpad, and touch-based scrolling doesn’t work at all. It tried to be Cocoa on a platform that is not Cocoa at all, with what was even a mediocre implementation a decade ago, let alone now. (I remember being excited about it when it was first announced, until I actually tried using it.)
pabl0rg 7y ago
Looks like vaadin or kweb
- chii 7y ago
  and the OG of them all, GWT.
Razengan 7y ago
SwiftUI, and the underlying system for embedded DSLs that it's built upon, is pure genius. It has excited me and invigorated my creativity in a way that I had not felt since Microsoft's WPF/XAML, but unlike WPF+XAML you don't have to work in 2 different languages for the logic versus the declarative UI, and unlike Microsoft I don't have to worry about it being museum'ed and forgotten after a couple short years. See "What's New in Swift 5.1" [0] around 31:15 where they show an example of how you might use full-featured Swift to output HTML. You can immediately tell that it's a hint of something huge and possibly disruptive to come. SwiftUI and its live previews and device-agnosticism are already insanely powerful. There's no reason why that tech shouldn't be applied to web dev as well, and hopefully even ported to Windows/Linux/Android to output their native GUIs. [0] https://developer.apple.com/videos/play/wwdc2019/402/ https://developer.apple.com/videos/play/wwdc2019/402/
- jasonhansel 7y ago
  > unlike Microsoft I don't have to worry about it being museum'ed and forgotten after a couple short years. I wouldn't necessarily get my hopes up.
  - Razengan 7y ago
    Apple have yet to dishearten me like that in the last 10 years since I started investing into their technologies. With Microsoft there has always been a Sword of Damocles hanging over your head. I still harbor frustrations from the indecisive flip-flopping that occurred in the Windows ecosystem from Vista -> 7 -> 8 -> 10. It's still not easy to tell at a glance what Microsoft's primary APIs/frameworks currently are, what they're supposed to be called, or what their long term strategy is (besides masquerading as the new champion of open-source), and that doesn't inspire confidence. One thing I'll credit Microsoft over Apple though, is the quality of their documentation.
    - mhd 7y ago
      It's been a while since I had to program native, non-cross-platform Windows apps, but isn't the flip-flopping mostly about what's considered the standard for UI programming, yet older technologies still work? I could still make an application with MFC, if I felt particularly masochistic. Carbon on the other hand…
skocznymroczny 7y ago
So this is basically Flutter but for Swift?
- augustl 7y ago
  Not really. Flutter has its own layout rendering engine, and uses low level APIs in the browser to circumvent the default rendering. This is what allows Flutter to do, say, efficient table views on the web, which is kind of a holy grail of web rendering. SwiftWebUI currently seems to rely on normal rendering: > SwiftWebUI tries to replicate common SwiftUI layouts, but doesn’t fully succeed yet. After all it has to deal with the layout system the browser provides. Help wanted, flexbox experts welcome!
  - kenshi 7y ago
    > Flutter has its own layout rendering engine, and uses low level APIs in the browser to circumvent the default rendering. Does this mean that Flutter on the web is really Flutter on Chrome? Or does is support other web browsers well?
    - chrismorgan 7y ago
      See https://flutter.dev/web https://flutter.dev/web. They claim use of DOM and CSS, but the demos I just looked at are rendering completely to canvas, with an empty accessibility tree and effectively no CSS.
      - augustl 7y ago
        Seems like it. Text is not selectable in the latest version of the flutter web preview, for example. But it's an early tech preview version, so I'll judge it more harshly when it's 1.0 :)
    - augustl 7y ago
      It works fine in Firefox and Safari too in my experience (just a small pet project). Not on EDGE though. But it is a technical preview after all.
dmitriid 7y ago
> Unlike some other efforts this doesn’t just render SwiftUI Views as HTML. It also sets up a connection between the browser and the code hosted in the Swift server, allowing for interaction - buttons, pickers, steppers, lists, navigation, you get it all! Sounds like Phoenix LiveView, and IMO it’s a very good approach. We need more things like it.
rebelnz 7y ago
Coming from a job working on a WebObjects behemoth this is terrifying for me ...
- mattl 7y ago
  What was the job?
cerberusss 7y ago
I'm looking forward for a connection between SwiftUI and GTK or Qt, so we could have a fully functional user interface on Linux.
thomasfl 7y ago
Maybe Apple should bless this project, by letting it use the name WebObjects?
gumby 7y ago
This is great -- I was sorry not to see the web target at WWDC, especially given Apple's WebObjects history.
tluyben2 7y ago
It would be great if one of these efforts gets us to something that actually works well as replacement for html/css; the ones that work (what you build is how it will look) feel like Flash (you lose SEO, copy/paste, accessibility etc) while the ones that try to fix that really do not work because you cannot really get the result you were aiming for design and feature wise. Webassembly did not fix (as far as I know) the SEO issue. This will all happen and for me, it cannot happen fast enough!
pavlov 7y ago
It's weird that there are 49 comments and not a single mention of React. SwiftUI is basically React implemented in Apple's proprietary language rather than a preprocessed JavaScript-XML hybrid [1]. More options is a good thing, but it hardly seems revolutionary. [1] This works much better than it sounds like. I'm a long-term C/C++/Obj-C programmer and was very sceptical of JSX, but React is actually very nice to use. The toolchain is kind of byzantine but seems to be settling slowly on reasonable defaults.
- andrekandre 7y ago
  well, to be fair, react wasn’t exactly completely new with its idea either... what’s old is new again
  - yogthos 7y ago
    Sure, but it is one of the most popular way to develop web apps today. So it seems kind of relevant to contrast against it.
  - ptx 7y ago
    Do you have examples of earlier systems based on the ideas that React popularized?
- yogthos 7y ago
  I find using React is a strictly better experience from ClojureScript. There's way less code, no JSX, the toolchain is straight forward, you get reliable hot loading for free, and it actually outperforms plain React in some cases. https://github.com/ClojureTO/JS-Workshop https://github.com/ClojureTO/JS-Workshop https://www.freecodecamp.org/news/a-realworld-comparison-of-front-end-frameworks-with-benchmarks-2019-update-4be0d3c78075/ https://www.freecodecamp.org/news/a-realworld-comparison-of-...
- srfilipek 7y ago
  > Apple's proprietary language While it is heavily funded and used by Apple, I would never call it "proprietary". It's open source. https://swift.org/about/#swiftorg-and-open-source https://swift.org/about/#swiftorg-and-open-source
ragerino 7y ago
Offtopic: Always Right Institute LOL Is there a way to join this institute? I would love to have this on my CV and professional profile.
mark_l_watson 7y ago
Learning Swift is something that I considered when the “TensorFlow in Swift” announcement was made. That project is still in the early days but if eventually the turtles all the way down Swift TensorFlow implementation is complete and mature, then it would be very compelling to have one good programming language for most work. Right now I jump around between using Haskell, Common Lisp, and Python. Perhaps in a year Swift might be a reasonable language for everything I work on - I will wait and see.
davidkhess 7y ago
This seems to me to have a serious architectural issue. If I read it right, the app is rendered in the browser but is processing state changes and doing HTML rendering of the state tree on the server side? How is that going to scale? This is a really neat adaptation of the SwiftUI API to the web but it seems like the guts of it needs to run in the browser to be practical. Perhaps we'll eventually see the Swift compiler support a WASM target? [edit] Like Qt is doing? https://doc.qt.io/qt-5/wasm.html https://doc.qt.io/qt-5/wasm.html

This is insane. It’s bringing the arguably typing of Swift with the flexibility of designing a web app. It may not be feasible (yet) to build a non-trivial web app, but I’ll be watching this project from time to time. Very cool.

saagarjha 7y ago

Wow, what an interesting project. I wonder if you could reroute the connection over a websocket and serve an actual webpage off of it? It'd be a great demo to have the SwiftWebUI page served using SwiftWebUI ;) Also: it would be really nice if SwiftWebUI used actual HTML elements rather than styled divs.

catchmeifyoucan 7y ago

This is super cool! I built the airpptx.github.io project - which similarly uses powerpoint elements to translate to html. The challenges are in the translation of native elements to web elements. I'm going to take a look at your codebase and see if I can help.

dawkins 7y ago

This reminds me a lot about ASP.net Webforms. Maybe this is better conceived but trying to program the web like a desktop app created more problems than what it tried to solve.

lukeh 7y ago
It’s a PoC, the endgame could be running it directly in the browser with WASM.
oaiey 7y ago
It is hopefully something more like Blazor. That would at least run one day in the browser.
mtrovo 7y ago
My first thought also. Also I remember some of the design documents of JSF, it was designed to enable views to be rendered everywhere (Java ME, web, desktop). It only added complexity and in the end nobody used it because the paradigms are so different.
- ZitchDog 7y ago
  It also scaled poorly.

dcdevito 7y ago

Nah. I’ll stick with Flutter

ben1040 7y ago

Reminds me of Cappucino, which professed to let you build a single-page webapp using "Objective-J," a strange hybrid of Javascript and ObjC. https://www.cappuccino.dev/ https://www.cappuccino.dev/

zyang 7y ago
I still remember paying $20 for the Atlas early access but never heard anything after. It was kickstarter before kickstarter. Truly ahead of its time in more than one ways.
dmix 7y ago
Whatever happened to that project? They were one of the early guys trying to do full blown "modern" JS apps on the web around the time when backbone.js came out, but with a more desktopy approach. Edit: I forgot, they were one of the first YC companies. Looks like the parent company got acquired by Motorola and somewhat shutdown their 280slides/Atlas projects. One founder also later started RunKit which was bought by Stripe. https://en.wikipedia.org/wiki/280_North,_Inc https://en.wikipedia.org/wiki/280_North,_Inc.
- mpweiher 7y ago
  They hit 1.0 in April of last year. https://www.cappuccino.dev/blog/ https://www.cappuccino.dev/blog/
iamgopal 7y ago
Their demo and look were mind blowing
chrismorgan 7y ago
Cappuccino had promise early on, but fell into the trap of trying to reinvent way too much, and doing a horribly bad job of it. The end result looks terribly ugly, and utterly unusable in general. Ugly: it looks like a bad imitation of the appearance of Mac OS X from a mixture of 2002 and 2007, regardless of the fact that I’m on Windows in 2019; and due to pervasive use of 1× raster images instead of vector graphics, gradients, &c. is even more ugly on a high-DPI display. (This use of raster images without complete preload causes rendering issues when a control state is achieved for the first time, too, just like the rollover effects of the era, long since obsolete.) Unusable: it implements scrolling from scratch, which I have never seen work well, or even almost well—it’s just something that you should never under any circumstances do; in this case, I can only get their demos to scroll at about 1% of normal speed on my Surface Book’s touchpad, and touch-based scrolling doesn’t work at all. It tried to be Cocoa on a platform that is not Cocoa at all, with what was even a mediocre implementation a decade ago, let alone now. (I remember being excited about it when it was first announced, until I actually tried using it.)

pabl0rg 7y ago

Looks like vaadin or kweb

chii 7y ago
and the OG of them all, GWT.

Razengan 7y ago

SwiftUI, and the underlying system for embedded DSLs that it's built upon, is pure genius. It has excited me and invigorated my creativity in a way that I had not felt since Microsoft's WPF/XAML, but unlike WPF+XAML you don't have to work in 2 different languages for the logic versus the declarative UI, and unlike Microsoft I don't have to worry about it being museum'ed and forgotten after a couple short years. See "What's New in Swift 5.1" [0] around 31:15 where they show an example of how you might use full-featured Swift to output HTML. You can immediately tell that it's a hint of something huge and possibly disruptive to come. SwiftUI and its live previews and device-agnosticism are already insanely powerful. There's no reason why that tech shouldn't be applied to web dev as well, and hopefully even ported to Windows/Linux/Android to output their native GUIs. [0] https://developer.apple.com/videos/play/wwdc2019/402/ https://developer.apple.com/videos/play/wwdc2019/402/

jasonhansel 7y ago
> unlike Microsoft I don't have to worry about it being museum'ed and forgotten after a couple short years. I wouldn't necessarily get my hopes up.
- Razengan 7y ago
  Apple have yet to dishearten me like that in the last 10 years since I started investing into their technologies. With Microsoft there has always been a Sword of Damocles hanging over your head. I still harbor frustrations from the indecisive flip-flopping that occurred in the Windows ecosystem from Vista -> 7 -> 8 -> 10. It's still not easy to tell at a glance what Microsoft's primary APIs/frameworks currently are, what they're supposed to be called, or what their long term strategy is (besides masquerading as the new champion of open-source), and that doesn't inspire confidence. One thing I'll credit Microsoft over Apple though, is the quality of their documentation.
  - mhd 7y ago
    It's been a while since I had to program native, non-cross-platform Windows apps, but isn't the flip-flopping mostly about what's considered the standard for UI programming, yet older technologies still work? I could still make an application with MFC, if I felt particularly masochistic. Carbon on the other hand…

skocznymroczny 7y ago

So this is basically Flutter but for Swift?

augustl 7y ago
Not really. Flutter has its own layout rendering engine, and uses low level APIs in the browser to circumvent the default rendering. This is what allows Flutter to do, say, efficient table views on the web, which is kind of a holy grail of web rendering. SwiftWebUI currently seems to rely on normal rendering: > SwiftWebUI tries to replicate common SwiftUI layouts, but doesn’t fully succeed yet. After all it has to deal with the layout system the browser provides. Help wanted, flexbox experts welcome!
- kenshi 7y ago
  > Flutter has its own layout rendering engine, and uses low level APIs in the browser to circumvent the default rendering. Does this mean that Flutter on the web is really Flutter on Chrome? Or does is support other web browsers well?
  - chrismorgan 7y ago
    See https://flutter.dev/web https://flutter.dev/web. They claim use of DOM and CSS, but the demos I just looked at are rendering completely to canvas, with an empty accessibility tree and effectively no CSS.
    - augustl 7y ago
      Seems like it. Text is not selectable in the latest version of the flutter web preview, for example. But it's an early tech preview version, so I'll judge it more harshly when it's 1.0 :)
  - augustl 7y ago
    It works fine in Firefox and Safari too in my experience (just a small pet project). Not on EDGE though. But it is a technical preview after all.

dmitriid 7y ago

> Unlike some other efforts this doesn’t just render SwiftUI Views as HTML. It also sets up a connection between the browser and the code hosted in the Swift server, allowing for interaction - buttons, pickers, steppers, lists, navigation, you get it all! Sounds like Phoenix LiveView, and IMO it’s a very good approach. We need more things like it.

rebelnz 7y ago

Coming from a job working on a WebObjects behemoth this is terrifying for me ...

mattl 7y ago
What was the job?

cerberusss 7y ago

I'm looking forward for a connection between SwiftUI and GTK or Qt, so we could have a fully functional user interface on Linux.

thomasfl 7y ago

Maybe Apple should bless this project, by letting it use the name WebObjects?

gumby 7y ago

This is great -- I was sorry not to see the web target at WWDC, especially given Apple's WebObjects history.

tluyben2 7y ago

It would be great if one of these efforts gets us to something that actually works well as replacement for html/css; the ones that work (what you build is how it will look) feel like Flash (you lose SEO, copy/paste, accessibility etc) while the ones that try to fix that really do not work because you cannot really get the result you were aiming for design and feature wise. Webassembly did not fix (as far as I know) the SEO issue. This will all happen and for me, it cannot happen fast enough!

pavlov 7y ago

It's weird that there are 49 comments and not a single mention of React. SwiftUI is basically React implemented in Apple's proprietary language rather than a preprocessed JavaScript-XML hybrid [1]. More options is a good thing, but it hardly seems revolutionary. [1] This works much better than it sounds like. I'm a long-term C/C++/Obj-C programmer and was very sceptical of JSX, but React is actually very nice to use. The toolchain is kind of byzantine but seems to be settling slowly on reasonable defaults.

andrekandre 7y ago
well, to be fair, react wasn’t exactly completely new with its idea either... what’s old is new again
- yogthos 7y ago
  Sure, but it is one of the most popular way to develop web apps today. So it seems kind of relevant to contrast against it.
- ptx 7y ago
  Do you have examples of earlier systems based on the ideas that React popularized?
yogthos 7y ago
I find using React is a strictly better experience from ClojureScript. There's way less code, no JSX, the toolchain is straight forward, you get reliable hot loading for free, and it actually outperforms plain React in some cases. https://github.com/ClojureTO/JS-Workshop https://github.com/ClojureTO/JS-Workshop https://www.freecodecamp.org/news/a-realworld-comparison-of-front-end-frameworks-with-benchmarks-2019-update-4be0d3c78075/ https://www.freecodecamp.org/news/a-realworld-comparison-of-...
srfilipek 7y ago
> Apple's proprietary language While it is heavily funded and used by Apple, I would never call it "proprietary". It's open source. https://swift.org/about/#swiftorg-and-open-source https://swift.org/about/#swiftorg-and-open-source

ragerino 7y ago

Offtopic: Always Right Institute LOL Is there a way to join this institute? I would love to have this on my CV and professional profile.

mark_l_watson 7y ago

Learning Swift is something that I considered when the “TensorFlow in Swift” announcement was made. That project is still in the early days but if eventually the turtles all the way down Swift TensorFlow implementation is complete and mature, then it would be very compelling to have one good programming language for most work. Right now I jump around between using Haskell, Common Lisp, and Python. Perhaps in a year Swift might be a reasonable language for everything I work on - I will wait and see.

davidkhess 7y ago

This seems to me to have a serious architectural issue. If I read it right, the app is rendered in the browser but is processing state changes and doing HTML rendering of the state tree on the server side? How is that going to scale? This is a really neat adaptation of the SwiftUI API to the web but it seems like the guts of it needs to run in the browser to be practical. Perhaps we'll eventually see the Swift compiler support a WASM target? [edit] Like Qt is doing? https://doc.qt.io/qt-5/wasm.html https://doc.qt.io/qt-5/wasm.html