How to properly include/override bootstrap?

Question

css

There is a project where bootstrap is taken as a basis.
But I want to do everything according to the rules of Google, that is, the upper visible part of the site is initially loaded (only the bootstrap grid, well, some styles), then bootstrap is loaded completely + additional styles are applied.
But that's not the task, after as soon as the top of the site is loaded, the rest of the bootstrap styles override the styles of the top of the site. Of course, the output under the connected bootstrap styles should be defined again, but this is nonsense)
How do you solve this problem?

Answer 1

You have SASS in your tags. And what is the problem in additional styles to import the Bootstrap components necessary for lazy loading (in this case, it turns out that you use bootstrap-sass?), And write the grid and additional styles for the beginning of the page in the html code?
I may be wrong with the implementation of the grid in . I didn’t have to do this myself, but I decided to share the idea, maybe someone will suggest a better solution.