How to make elements show and hide smoothly?

Question

css

I use backbone.js for my project.
It makes sense for the user class to hide some elements.
For example, the toolbar.
It turns out that I render the entire template. Then I hide a certain element with $('.class').hide or display: block. And it's noticeable. It can be seen how when you go to the page, the element is there and then hidden, all this is very clumsy.
How can this be done without the user noticing?

Answer 1

fadeIn() fadeOut() work?

Answer 2

pass the user model to the template and, by condition, do not draw the panel if the user is not an admin

Answer 3

As an option, initially make the unnecessary hidden and only then show it.

Answer 4

In a good way - to give different templates on the server. Or you change the render yourself. Conditions are implemented in many template engines.