IndexDB is a web database and is a bit more complicated to work with compared to storing information in LocalStorage/SessionStorage. As for filtering your todo items, you can definitely do that with C#.
That's a tricky subject because it all depends on your data, your use-case, and what you want to do with conflicts. There are some simple scenarios, like when the user generates new content locally and then syncs it and there can't/won't be a conflict. Then you just upload the data and you are done. There are other scenarios where data may be changed on both sides, so when you sync, you have to know what to do with the conflicts (which to keep) and possibly even have manual intervention in the case where a rule cannot say for certain which is correct.
@@IAmTimCorey Thanks for replying! That's exactly my problem, I've ended up implementing my own solution as I couldn't find anything out of the box. Is there anything that you know of that handles this? So a remote data storage solution that has offline capabilities and auto syncing (as best it can).
3:10 Blazor is full of those types of bugs unfortunately. You also can’t debug when running VS in admin mode. Publishing to Azure is super buggy, often hangs and then you have to re-attempt. Not to mention the absolute catastrophe the publishing window is just for regular file publishing profiles. Blazor often doesn’t recognize component tags in a razor view, which really just means an annoying squiggly line but it still drives me nuts. I wonder sometimes how they still haven’t ironed all these little bugs out. Are other large companies not widely using Blazor for large projects?
@@RouteDeTours I’m under the impression you are feeling quite clever. I’ve been working with Blazor for about two years now, I think that’s long enough to share my experience. I run into a lot of little time wasting bugs that I can eventually get around. I haven’t had these issues with other technologies like .NET Framework. Carry on trolling I guess.
7:20 Yup, another extremely common bug. Just the other day I was able to go back and forth editing on one line, but could not place my cursor on the next line to copy/paste/edit. Something locks up and takes a while (or rebooting VS) to fix. Again I must ask… how is Microsoft not aware that regular people run into this stuff….
I don't think I heard you mention this, but browsers only allow a 5MB maximum of data to be stored in local storage per origin. Same for session storage. I'm not sure if you get more space after installing as a PWA but I didn't find anything on it. The other storage systems: IndexedDB, Cache API, and File System API seem to get more space, but every browser sets their own limits based on your hard drive size.
Correct. You are limited to 5MB of data. That is a LOT of data for what is essentially just an offline cache of server data. It you start to bump into that limit, I would first address if you should be doing something different. Only then would I look at alternatives.
@@IAmTimCorey In my case, I have many search screens and was just trying to cache the results so the user wouldn't have to re-run the search API every time they returned from the edit pages. I ended up turning off the result caching for them and just re-run the searches now. Eventually, I may look at one of the other storage types, or some type of compression to help store more. So far, the performance seems okay so I'm not too worried, but it's on my todo list :^)
Not yet, but it is on my wishlist of demos to do soon. Here is a suggestion on the suggestion site that I've been tracking: suggestions.iamtimcorey.com/Details/670080229e1a26a88f36a838
Is there a compelling reason for using Blazored/LocalStorage instead of just doing it directly? I mean, Why not just do await JS.InvokeVoidAsync("localStorage.setItem", key, value); versus await localStorage.SetItemAsync(key, value) ?
The library is a wrapper around that, but it adds additional features to make it easier to use in C#. For instance, when you call the GetItemAsync, you pass in the type of object you want and it maps the returned JSON back to the strongly-typed model instead. You could absolutely do that by hand or you could create your own library that does it, but then you would end up writing the code that the NuGet library already has.
Why would you do this in Blazor / WebAssembly? if you're going to be doing things locally and using local storage, wouldn't it be easier and more straight forward to use WinUI or WPF? I don't understand why you would want to go through all this instead of just using a platform designed to work natively. What am I missing here?
There are a number of reasons. First, deployment is so much easier. Just navigate to a URL like any other website and you can install the app. Or you can use it without installing it. Updates are downloaded automatically in the background whenever you update the website. Compare that to creating a desktop application, an installer, an updater, and a distribution system. Also, you cannot use a WPF/WinUI app on Mac, Linux, iOS, or Android. Second, you can use your existing web skills to build this application. You almost certainly need a website anyway. This way, you don't have to have a team dedicated to the web and a different team dedicated to the desktop app. Third, this process works. It is simple, easy to distribute, and yet powerful. Why look for more if this meets your needs?
Very easy to follow, I got it working on my local IIS and on Android phone within a few minutes. Thanks.
You are welcome.
Blazor is getting great.
It really is.
good job
what is the difrint between localstorge and indexdb
if id need show list from todos by where ToDoItem like '%fourth%'
i can do this conditon
IndexDB is a web database and is a bit more complicated to work with compared to storing information in LocalStorage/SessionStorage. As for filtering your todo items, you can definitely do that with C#.
What would be the best way to sync that data to remote data storage when the user reconnects to the internet?
That's a tricky subject because it all depends on your data, your use-case, and what you want to do with conflicts. There are some simple scenarios, like when the user generates new content locally and then syncs it and there can't/won't be a conflict. Then you just upload the data and you are done. There are other scenarios where data may be changed on both sides, so when you sync, you have to know what to do with the conflicts (which to keep) and possibly even have manual intervention in the case where a rule cannot say for certain which is correct.
@@IAmTimCorey Thanks for replying! That's exactly my problem, I've ended up implementing my own solution as I couldn't find anything out of the box. Is there anything that you know of that handles this? So a remote data storage solution that has offline capabilities and auto syncing (as best it can).
3:10 Blazor is full of those types of bugs unfortunately. You also can’t debug when running VS in admin mode. Publishing to Azure is super buggy, often hangs and then you have to re-attempt. Not to mention the absolute catastrophe the publishing window is just for regular file publishing profiles. Blazor often doesn’t recognize component tags in a razor view, which really just means an annoying squiggly line but it still drives me nuts. I wonder sometimes how they still haven’t ironed all these little bugs out. Are other large companies not widely using Blazor for large projects?
That's not a Blazor issue, that's a Visual Studio bug. It happens in MVC and even Uno as well.
@@IAmTimCorey if I were to be more precise with my language, “developing with Blazor” is an experience plagued with bugs.
@@CollinGerken "tedious" is a good word to describe people who know nothing but complain about everything.
@@RouteDeTours I’m under the impression you are feeling quite clever. I’ve been working with Blazor for about two years now, I think that’s long enough to share my experience. I run into a lot of little time wasting bugs that I can eventually get around. I haven’t had these issues with other technologies like .NET Framework. Carry on trolling I guess.
7:20 Yup, another extremely common bug. Just the other day I was able to go back and forth editing on one line, but could not place my cursor on the next line to copy/paste/edit. Something locks up and takes a while (or rebooting VS) to fix. Again I must ask… how is Microsoft not aware that regular people run into this stuff….
That was my fault, not the editor's fault. I hit Ctrl+X to cut but then hit Ctrl+C to paste (which copies a blank line instead.
very useful for store user state... shopping cart, list of user's stuff...
Yep.
I don't think I heard you mention this, but browsers only allow a 5MB maximum of data to be stored in local storage per origin. Same for session storage. I'm not sure if you get more space after installing as a PWA but I didn't find anything on it. The other storage systems: IndexedDB, Cache API, and File System API seem to get more space, but every browser sets their own limits based on your hard drive size.
Correct. You are limited to 5MB of data. That is a LOT of data for what is essentially just an offline cache of server data. It you start to bump into that limit, I would first address if you should be doing something different. Only then would I look at alternatives.
@@IAmTimCorey In my case, I have many search screens and was just trying to cache the results so the user wouldn't have to re-run the search API every time they returned from the edit pages. I ended up turning off the result caching for them and just re-run the searches now. Eventually, I may look at one of the other storage types, or some type of compression to help store more. So far, the performance seems okay so I'm not too worried, but it's on my todo list :^)
Great video! Do you have anything on authentication in an offline Blazor App? What kind of strategy should be used?
Not yet, but it is on my wishlist of demos to do soon. Here is a suggestion on the suggestion site that I've been tracking: suggestions.iamtimcorey.com/Details/670080229e1a26a88f36a838
Thanks Tim.
Just to say, that dependency warning was not present for me, so I suppose its been fixed already.
You are welcome.
Is there a compelling reason for using Blazored/LocalStorage instead of just doing it directly?
I mean,
Why not just do
await JS.InvokeVoidAsync("localStorage.setItem", key, value);
versus
await localStorage.SetItemAsync(key, value)
?
The library is a wrapper around that, but it adds additional features to make it easier to use in C#. For instance, when you call the GetItemAsync, you pass in the type of object you want and it maps the returned JSON back to the strongly-typed model instead. You could absolutely do that by hand or you could create your own library that does it, but then you would end up writing the code that the NuGet library already has.
Is it a good practice to use async in your get and set if you're only interacting with local storage?
Anyway, thanks for the video
Yes, because LocalStorage is synchronous, and you don’t want to lock up your UI waiting on it.
Cool Thanks 👍🏻
You are welcome.
Why would you do this in Blazor / WebAssembly? if you're going to be doing things locally and using local storage, wouldn't it be easier and more straight forward to use WinUI or WPF? I don't understand why you would want to go through all this instead of just using a platform designed to work natively. What am I missing here?
There are a number of reasons. First, deployment is so much easier. Just navigate to a URL like any other website and you can install the app. Or you can use it without installing it. Updates are downloaded automatically in the background whenever you update the website. Compare that to creating a desktop application, an installer, an updater, and a distribution system. Also, you cannot use a WPF/WinUI app on Mac, Linux, iOS, or Android.
Second, you can use your existing web skills to build this application. You almost certainly need a website anyway. This way, you don't have to have a team dedicated to the web and a different team dedicated to the desktop app.
Third, this process works. It is simple, easy to distribute, and yet powerful. Why look for more if this meets your needs?