In what situations is it justified to use utility classes (bootstrap)?

Question

css

Bootstrap has many utility classes like .text-center, .text-lowercase, .w-100, .border-0and so on.
You can find out more here
The framework itself defines them as

classes with a single purpose to reduce the frequency of highly repetitive declarations.

Some of these classes include several rules, some only one (often with an !important flag, which clearly refers to functional css )
So the question is: when to use them? Someone will say: "when you want, then use it." So it is. But I mean something else.
When is it right to use them and when not?
Here I have sketched two examples.
In the first case, the element is styled with as many utility classes as possible. Some rules are listed directly in .my-div, because I need them, and the framework does not provide a utility class for them. And if it did, it would not be a bootstrap, but tachyons.
In the second example, the usual option is all styles under one class.
The first example tries to reuse commonly used css rules (this was bootstrap's idea), but we get this hype in html

class="my-div1 d-inline-block text-center text-uppercase w-100 font-italic py-3 my-3"

In the second example, I have only one class (which is already not bad, at least boiling in html), but the styles are no reusable.
It remains to be seen which of these is the worst evil.
Do you think it's necessary to use helper classes as much as possible (dry css) and sacrifice how the html will look?
How do you use them?

Answer 1

Let's say you have 2 such blocks on your page. One is centered, the other is left. In the case of your css, you will have to copy-paste the block completely and remove the text-align. In the case where there are many classes - just remove 1 class from the element.