1 Critical Blazor Mistake to Avoid in 2024: Interactive Auto Render Mode

[@julienbarach6620]

Finally someone talking about the main issue with the Auto mode. Blazor templates are not as ready to go (except for Server) as they were with .Net 7. New developers will think that Auto is the default mode and the best of both worlds but you are always dealing with two modes (Server and WASM) that are fondamentally different and no one is telling you that it's dangerous. API calls are one example but you'll find even more complex issues when you'll want to use localSotrage for instance. So be careful when you want to use the Auto mode. It's sexy on the paper but it can lead to big headhaches and too much complexity for nothing.

[@alexmadnix]

Useful information!☺

[@DevilMadeMeDoIt666]

What’s the issue with local storage?

[@imashar]

​@@DevilMadeMeDoIt666You cannot access localStorage on the server.

[@der-mit-dem-rotwild-tanzt]

This rendermode stuff is really confusing. Thanks for this great explanation and sample!

[@waynehawkins654]

Amazing. Thank you so much for this. I did more then click 'Like'. Now I have discovered your channel, I will be seeing what else you can tech me.

[@SBDavin]

Going out on a limb here... For a new "WebAssembly" or "InteractiveAuto" project, I think it's a mistake to assume the non-client project is the server. I think it's simply two client projects. Both DLLs are downloaded to the web browser with the .NET wasm runtime. The purpose of the two projects are just to break up the pages based on their render modes. After all, why would a server project have a reference to a client project? It's just weird. It goes against all my development experience. We Blazor developers continue asking the question, "What was Microsoft thinking?" while we try to make sense of the two VS projects, blaming ourselves for not understanding it and trying to mold the code into the .NET 7 project pattern. I think if we want a server project, we should just add a separate Web API project like in .NET 7. Thank you as always, Patrick.

[@lucasmegaloja]

+1 subscriber for clarity and great content!

[@PatrickGod]

Thank you so much! Means a lot! ❤️

[@patrickkuhnel9531]

Danke!

[@stefanobompieri5836]

Hi, i set up a project with just WebAssembly and there is a similar problem: on first run , it works but if i reload the pagine, it says "No services injected". If i inject the services also in the api project it works. It's so strange. Than does any kind of interactive mode needs a service in api project and client project ?

[@krrk7356]

How do you think it is possible to turn these 2 separate services into server and client. For separate instances of the mediator. We inject the mediator into the component. If it runs on the server then it uses the corresponding handler. If on the client, then the corresponding handler does the http query. And the controller uses the mediator from the server.

[@webmaster4095]

Привет, рекомендую посмотреть портированную библиотеку redux-blazor. Она отлично работает с обновлением состояния.

[@tajmaut2]

what about it in MudBlazor??

[@samerelsahih]

Total chaos. I still can't seem to run it correctly on both server and client side

[@jaytandon]

Agreed, hopefully dotnet 9 makes Mudblazor work better

[@imSkod]

I think this title should just be like 'how to use services in Auto rendermode' or something similar. Good explanation and video though

[@LlamaNL]

This is ridiculous, look at the amount of boilerplate just to get a single array! Now imagine if you have 10 controllers each with a 4 endpoints!!!

[@Rks1926]

Great stuff, thank you!

[@webmaster4095]

Привет, Мир! Я начал использовать Blazor 8 и столкнулся с проблемой контроля за персистентностью состояния при использовании режима AutoInteractive, где почитать/посмотреть лучшие практики по данному режиму рендеринга?

[@bou7eliw]

Hi, please could show us how we can do an authentification using active directory? Please

[@Conjuredfilms]

Hi Patrick I saw you're looking for an editor! I'm available and emailing you.

[@jmmoyadev]

Great explanation! But all this workaround this is why Blazor will die sooner than later... So, you have to create two implementations for the same service, one in client, and one in server? And the API endpoint too... now do that for a big application with 10 controllers, with 4 or 5 endpoints or more, and at least another 10 services with another 5, 6.. 10 methods? C'mon... what a waste of time...

[@kvelez]

Cool

[@Hasan10-oh7vl]

Love ittt!!! You need a video editor bro ? I can do a sample video 👊🏽

[@mtranchi]

No way I could bring myself to make two database calls for every page load across every web app I run.

[@kijanawoodard]

Wouldn’t it just be for the initial load and then you’re pure web assembly after that?

[@mtranchi]

@@kijanawoodard No it doesn't work that way. Put a break point on your controller and you'll see the endpoint gets hit twice: once from the server, again from the client... though... i already can't remember how Patrick set up his code, so not sure about his implementation, lol. however, there's a super simple check built in to Blazor 8 where you can check if the component is being rendered on the server or in the web browser. You can use that to (pseudo code) "if(Environment.IsBrowser)" in your OnInitializedAsync to decide whether you want the db to be hit on the server or in the browser. Comment on this, when i get a chance, i'll find it, post it back here

[@markhill1066]

Your not supposed to, the first database call which happens via SSR fetches the data which is then added to the persistent state. When the component/page is loaded in wasm it loads data from the persistent state. So SSR is for the initial load, WASM handles incremental updates.

[@mtranchi]

@@markhill1066That's the way it should be, but not according to my break-point when debugging. The `controller` `action` that fetches the data from the db gets hit twice, 100% certain it is so in Blazor 8 because i've spent copious hours working to eliminate one of the calls.

[@slynch401k]

@@markhill1066 That is if it ever switches over, it is so overengineered and basically doesn't work most of the time.