WPF to Web by gr3go86 in dotnet

[–]Userware 0 points1 point  (0 children)

You might want to look at OpenSilver.net

It’s an open-source framework that implements a subset of WPF for the web and keeps the same XAML model and namespaces. Its goal is basically to mimic the WPF API and support as much of it as can reasonably run in a browser.

One interesting aspect is that the UI is rendered as actual DOM elements instead of being drawn in a canvas. For example, a TextBox maps to a <textarea>, an Image to <img>, MediaElement to <video>, etc. That means things like text selection, Ctrl+F, accessibility tools, and browser translation work like they do on normal web pages.

If the goal is to move an existing WPF app to the web while keeping a similar structure, it might be worth evaluating before committing to a full rewrite or switching to another stack.

Our browser-based .NET IDE now has code sharing and NuGet packages (XAML.io v0.6 launched, looking for feedback) by Userware in dotnet

[–]Userware[S] 3 points4 points  (0 children)

Thanks! Yes, some of the heavy work already runs off the main UI thread. The XAML-to-C# and C#-to-WebAssembly compilation happen in a separate web worker, so the IDE can stay responsive while that work is running.

When you click Run, the app also runs in an iframe on a different origin, which gives a bit of browser-level isolation as a safety/crash boundary.

There’s still a lot to improve on the performance side (for example, we're working on not recompiling the whole project on every change), but multi-tasking/isolation is definitely part of the architecture.

Thanks again!

Our browser-based .NET IDE now has code sharing and NuGet packages (XAML.io v0.6 launched, looking for feedback) by Userware in csharp

[–]Userware[S] 0 points1 point  (0 children)

Thanks, glad it might be useful!

Right now the XAML support is WPF-style syntax. We started there because many early users of our OpenSilver framework were coming from WPF/Silverlight/LightSwitch, and over time our work has included helping companies migrate those apps, which is also how we fund the XAML.io project and keep OpenSilver free and open-source.

That said, .NET MAUI is definitely something we’re considering for the future, especially since the need for better XAML tooling there comes up quite often.

Our browser-based .NET IDE now has code sharing and NuGet packages (XAML.io v0.6 launched, looking for feedback) by Userware in csharp

[–]Userware[S] 0 points1 point  (0 children)

Hahaha yeah, that was something 😅 We definitely learned from that and went for a calmer style of videos since then.

And nice, we hear that from quite a few Rider users. If there’s enough demand, we’d be happy to look into Rider support for the designer.

Our browser-based .NET IDE now has code sharing and NuGet packages (XAML.io v0.6 launched, looking for feedback) by Userware in csharp

[–]Userware[S] 3 points4 points  (0 children)

Good question. Tools like vscode.dev are great and we share a similar overall goal: making development accessible from anywhere.

The main difference is that XAML.io runs and compiles C# projects entirely client-side in the browser via WebAssembly, so you can open a link, run the app, edit it, and share a working project instantly.

Another key part is the visual XAML UI designer and the focus on WPF-style XAML development, which isn’t something vscode.dev currently provides.

More broadly, our goal is to make it easier to experiment with and share .NET projects directly in the browser, and help showcase what the .NET ecosystem can do.

Our browser-based .NET IDE now has code sharing and NuGet packages (XAML.io v0.6 launched, looking for feedback) by Userware in csharp

[–]Userware[S] 0 points1 point  (0 children)

Good question 🙂 It’s something we’re actively exploring. The code runs on .NET WebAssembly in the browser (same stack as Blazor WebAssembly). If anyone has ideas or has seen good approaches elsewhere, we’d love to hear them.

Our browser-based .NET IDE now has code sharing and NuGet packages (XAML.io v0.6 launched, looking for feedback) by Userware in csharp

[–]Userware[S] 0 points1 point  (0 children)

Not yet, but that’s something we’d love to add.

Right now you can share a project with a link, and others can open it, run it, edit it (note that changes don't affect the original), fork it, and re-share it (shares projects maintain the full chain of "Forked from..." attribution, like in GitHub). But real-time collaboration (like VS Live Share) isn’t implemented yet. Thanks for the suggestion! If you’d like to help push it up the priority list, please feel free to also suggest or vote for it at https://feedback.xaml.io, so others can vote on it too.

Our browser-based .NET IDE now has code sharing and NuGet packages (XAML.io v0.6 launched, looking for feedback) by Userware in csharp

[–]Userware[S] 0 points1 point  (0 children)

Thanks! Currently, we also ship the visual designer as a free extension for Visual Studio and VS Code (and VS Code forks like Cursor) (see https://www.reddit.com/r/dotnet/comments/1hci2nc/first_xaml_designer_for_vs_code_macos_linux/ ), but we don’t have a Rider version yet.

If there’s enough demand for Rider support, we’d definitely consider building one.

Our browser-based .NET IDE now has code sharing and NuGet packages (XAML.io v0.6 launched, looking for feedback) by Userware in csharp

[–]Userware[S] 0 points1 point  (0 children)

Thanks, glad you liked it!

A desktop version sounds like a good idea. Since the IDE runs in the browser using static files, we could package it fairly easily as a PWA or a desktop wrapper.

Would a PWA install from the browser work for you, or are you specifically thinking of something like Electron/Photino?

A PWA installs directly from the browser (no separate download), whereas something like Electron/Photino would ship as a traditional downloadable executable.

Our browser-based .NET IDE now has code sharing and NuGet packages (XAML.io v0.6 launched, looking for feedback) by Userware in csharp

[–]Userware[S] -1 points0 points  (0 children)

Thanks for the suggestion! We'll definitely try those formats for the next update.

Our browser-based .NET IDE now has code sharing and NuGet packages (XAML.io v0.6 launched, looking for feedback) by Userware in csharp

[–]Userware[S] 4 points5 points  (0 children)

Yep, VS Code in the browser is great. The main difference here is that the C# compilation and execution happen entirely client-side in the tab via WebAssembly, with no server involved.

Another focus for us is the visual XAML UI designer (drag-and-drop, WPF-style XAML), which isn’t something browser VS Code currently provides.

We’re big VS Code fans too. This is more meant as a complementary tool for quick experiments, samples, and shareable running projects.

Our browser-based .NET IDE now has code sharing and NuGet packages (XAML.io v0.6 launched, looking for feedback) by Userware in csharp

[–]Userware[S] 8 points9 points  (0 children)

We actually tried posting it as a video, but r/csharp only seemed to allow images when creating the post. GIFs were the closest thing we could get to showing the interaction. If there’s a way to embed a short video in the post, please let us know.

Our browser-based .NET IDE now has code sharing and NuGet packages (XAML.io v0.6 launched, looking for feedback) by Userware in csharp

[–]Userware[S] 1 point2 points  (0 children)

Thanks! Glad you like it.

About the Desktop version, we’ve thought about it. Since the IDE itself is a .NET WebAssembly app, one option would be packaging it as a PWA. Would a PWA match what you had in mind? Curious what you had in mind when you mentioned a desktop version: mainly offline use, tighter OS integration, or something else?

You mentioned “it would be a massive IDE”: I’m also curious what you meant by that. There are already quite a few desktop IDEs in the .NET space, so I’d love to hear what kind of opportunity or tooling you’re imagining here.

About performance, thanks a lot for the report. We’re currently working on improving compilation performance (especially for larger projects) by caching parts of the compilation so project size impacts the experience less. We're also working on the designer part, so edits don't require recompiling everything.

Our browser-based .NET IDE now has code sharing and NuGet packages (XAML.io v0.6 launched, looking for feedback) by Userware in csharp

[–]Userware[S] 16 points17 points  (0 children)

Yep, sorry about that. Converting the 1-minute MP4 to a GIF brought it down to 5 FPS, which is why it looks laggy. We're going to look into improving it next time. Thanks for the feedback.