[backbonejs] re-create view or create it once and then display and hide it

I am trying to write a view that displays the user details when user logs in.

As far as I know I have two choices:

1)      When logged in successfully create brand new view & render it

2)      Create new view at the init time and then display it when logged in or hide it when logged out.

Which one of them seems to be the cleanest one?

I am still lacking experience in backbone – I need some directions please.

You can also use one view and just switch some CSS class, hiding/showing login form and showing/hiding user details. Bonus: you can sprite some CSS animation magic on top of it. 

Well that is something to try. Did not think about that.

In general, I prefer not to create a view until it's needed, and then to clean it up once it's no longer on screen. That's best for memory usage, and also avoids startup cost of initializing a bunch of things.

Hope that helps,

So I have a sidebar static login form (just html script). After user logs in with the correct username and password I am hiding static form and append to the parent  my backbone view called SideBarUserView (in my Router where I handle login button).

When I log off, your suggestion is that I should call sideBarUserView .$el.remove() – to remove everything from view including view itself and when user logs in again I re-create my view with the new operator (new SideBarUserView()).

Did I get it right?

I think that's right, not 100% sure since I don't know your app, but basically just (1) create the view when you need it, and immediately put it on screen, and (2) call view.remove() when you are done with it, and then discard it. Call remove() on the view, not on the $el. That will do some cleanup like removing event listeners, and will also call $el.remove() for you.