One of the things that hit me in the SwiftUI XCode...
# linking-togethery
yoz
06/03/2019, 11:33 PMOne of the things that hit me in the SwiftUI XCode demo (in the opening keynote, not PSOTU): at the very beginning, he clicks the rendered “Hello world” widget in the simulator panel; XCode focuses the editor panel and highlights the code for the widget instance in question. It’s blink-and-you’ll-miss-it fast, and the audience don’t react at all.
I’d like to know: which existing web framework + IDE combos currently do this? Specifically: click a rendered component in a page (in a browser, or browser preview panel) and be taken to the code that instantiates that component?
👍 4
yoz
06/03/2019, 11:43 PMMost modern web framework code goes through enough compilation and rendering steps that simply finding the widget instantiation code requires multiple hops, assisted by generated source maps.
yoz
06/03/2019, 11:46 PMOne example that’s fairly terrible to use: Chrome Inspector + React DevTools. It’s terrible because
(a) RDT is old and buggy, and much of the vital component metadata can be lost even in totally valid React programs (but fortunately there’s a new version that looks a lot better), and
(b) although you can use Chrome Inspector as your IDE of choice (yes, it lets you edit and save files), I can’t imagine that many people want to
👍 2
d
Dan Cook
06/04/2019, 2:01 AMSounds like sketch-n-sketch
i
Ivan Reese
06/04/2019, 4:41 AM
In a way, Unity and Unreal let you do this.
y
yoz
06/04/2019, 4:53 AMTo clarify: I'm looking specifically for web development tools that are usable right now. (And yes, this is more about the Present than the Future of Coding, but I'm continually fascinated by how poor most web dev tooling still is.)
j
jaukia
06/04/2019, 8:15 AMI would think you need to either have a very good low-level access to a JS interpreter/compiler (and ability to tune it), or then a lot of instrumentation code wrapped around function declarations etc, to do something like this.
p
Prathyush
06/04/2019, 10:06 AMI think https://webflow.com/ might fit your bill.
g
Gregor
06/04/2019, 12:43 PMI think Svelte's Rich Harris was working on something like that
Gregor
06/04/2019, 12:45 PMd
Daniel Garcia
06/04/2019, 4:58 PM@yoz do you have link to the keynote video?
r
robenkleene
06/04/2019, 5:21 PMIt's live now here https://developer.apple.com/videos/play/wwdc2019/101/
robenkleene
06/04/2019, 5:21 PMSwiftUI is near the end
d
Daniel Garcia
06/04/2019, 5:25 PMThanks @robenkleene!
p
Pete Vilter
06/05/2019, 6:55 AMthis research project out of UChicago: https://ravichugh.github.io/sketch-n-sketch/ (has its own language, a subset of Elm)
y
yoz
06/10/2019, 5:26 PMHey, sorry for taking so long to respond. Thanks @robenkleene for the keynote link; the moment I’m talking about is at 20950
yoz
06/10/2019, 5:28 PM@Gregor Thanks for that! The Twitter thread is fascinating especially because Kenneth Auchenberg (from the VSCode team) is in there…
yoz
06/10/2019, 6:16 PMHe’s been working on the “Browser Preview” VSCode extension as a side project, and a couple of weeks ago he released an experimental version of the feature I’m asking for: https://github.com/auchenberg/vscode-browser-preview/issues/55
yoz
06/10/2019, 6:20 PMThe reason I bring this up is that I find it frustrating and baffling how obviously beneficial this kind of feature is, yet how few open source IDE + framework combos support it.
☝️ 1
yoz
06/10/2019, 6:21 PM(I specify “open source” because I have a hunch that many proprietary IDEs and frameworks have supported this workflow for a while.)
yoz
06/10/2019, 7:45 PM@digitarald: I just read your message in #CC2JRGVLK. I’d be very interested to hear your take on this, if you have the time and inclination.