In the video I posted a couple days ago I mentioned that the goal for the shadow-cljs UI is to be embeddable.
One of the locations this could be embedded into would be the Chrome Devtools and this then begs the question if this could replace the built-in HUD entirely?
One of the “problems” with the HUD has always been that it runs inside your build and has to work in your page. This means that is can easily conflict with your HTML/CSS (demonstrated by turning everything green above) or your JS. The HUD also has to stay quite minimal since we don’t want to inject too many deps into your build.
The Devtools Page however runs completely isolated and can do whatever it wants. It also runs in its own thread so it won’t interfere with your page in any way.
The downside I see for this is that you have to have the devtools open and the “shadow-cljs” tab selected. You won’t see anything when inside the Elements or Network tabs. Although the HUD could be reduced to minimal icons so you know when to check the devtools.
As an alternative I might experiment with embedding the same UI via a seamless iframe into the page itself. It would then still run isolated and wouldn’t have to worry about whats happening in the page either.
I like the HUD in the devtools section. Could you still have a ‘popout’ button to get it in a separate window, so we can see other devtools, the HUD, and our app? Probably too busy for most usage, but would be nice sometimes.
After playing with it for a few hours I have to admit that it doesn’t appear that useful to have this running in the Chrome Devtools. I have never much cared for the HUD in general either though. I mostly develop “mobile-first” webapps nowadays which means I almost always have the webpage open in some responsive resolution which doesn’t have enough space to fit any of the HUD anyways.
Having the feedback directly in my Editor seems to be the sweetspot for me. If not there a small window right next to my Editor seems good.
I’ll still experiment with the HUD-in-iframe a bit probably but I don’t think I’ll push the Chrome Extension any further. The only real benefit of the Chrome Extension is that it can run inside the Chrome Window and doesn’t require an extra window which might be enough to justify its existence. The code is extremely minimal anyways so I may just publish it and let people decide what they want to use.
PS: Also the HUD was always limited to the Browser anyways so having something that works for targets that don’t run in the Browser (:node-script, :node-library, …) is a must anyways.
I’m also not a great fan of HUDs, and prefer to have feedback in the editor (or even just the terminal). I always liked figwheel’s refresh/reload indicator, tho.
My main gripe with all the development feedback we get is that it’s all over the place. Server logs, Browser console, REPL output … sure, it might not make sense to have all those in one place, but personally I don’t need another place to sometimes look at.
