chanan / BlazorStrap

Bootstrap 4 Components for Blazor Framework
https://blazorstrap.io
The Unlicense
911 stars 156 forks source link

[Question] BlazorStrap vs using Bootstrap directly #548

Closed lonix1 closed 1 year ago

lonix1 commented 1 year ago

Hi and thanks for making this cool library. I'm a long time user of Bootstrap, so was pleased to find this!

Newbie question - and I'm not trolling, just curious:

What is the benefit of using this library rather than just Bootstrap directly? I've looked through the docs site, and noticed that for every bootstrap concept, there is an equivalent in blazorstrap. Are there things that are easier/better when using blazorstrap?

I've looked at some other libraries (e.g. mudblazor) too, and saw that they went in a different direction (abstracting the css+js completely). Where does this library fit in that continuum?

jbomhold3 commented 1 year ago

To put it as simple as possible. Bootstraps javascript library changes the DOM directly. These changes are not tracked by blazor, so it's not stateful. Blazor will rerender the component to what it knows about. Any changes that javascript made will be overwritten if the affected area falls in a tracked area by Blazor. BlazorStrap and alike libraries reimplement what's done in javascript into a stateful way of doing things. So even if your component completely rerenders, the changes made are tracked and will redraw accordingly. This is also true for the stateful javascript library as well(the exact term isn't coming to mind at 5am). Like Angular or Vue.js this is why you will see a library for Bootstrap for them both as well. While it will work just to use the normal library, anytime, Blazor changes state and rerenders, all affected DOM changes will be overwritten because it has zero clue they were made.

For example, you have a modal default closed inside a component and open it via just the normal js library. If that component calls an update, your modal will return to the closed state because Blazor has no clue the show class was added.

To sum it up will the normal library work. Sure, if you are fine with losing the changes to the DOM every time your page gets rendered.

jbomhold3 commented 1 year ago

The other part of the question BlazorStrap is a Bootstrap focused library. We mimic the default behavior of Bootstrap so there should be little to no difference between how BlazorStrap and native Bootstrap behaves. BlazorStrap, MudBlazor, MatBlazor, Blazorise, and all the other libraries made by community members are free and you should pick the one that best suits your needs.

lonix1 commented 1 year ago

@jbomhold3 Thank you John for that excellent explanation! I'm new to blazor too, so didn't realise the bit about stateful components. It all makes sense now :)

About the difference between the libraries, it seems they mostly differ in look and feel. And I'm most comfortable with bootstrap, so I landed here. It's a pity there's no metro/fluent/azure/office365 sort of theme - from what I've found, there's just bootstrap (this one) and material design (mudblazor), and the others are variations on that.

I see you're the main guy behind this library, so thanks for maintaining it... I look forward to using it!

lonix1 commented 1 year ago

Also, maybe it's just my setup, but I've found that this is significantly faster than the mudblazor (etc.) alternatives. There's a noticeable delay with those libraries, whereas this one renders updates immediately. Obviously it was well designed. :+1: