Well WebComponent is one word solution which combines/uses all of the options that you have stated.
One simple example is here: time2hack.com/2018/01/todo-app-with-webcomponents… which I wrote as post.
Of course the things are tedious in VanillaJS but you have freedom to take things in any direction and the level of complexity.
Personally I choose frameworks/libs on the basis of size of app and time available. And if I have enough time, I will definitely go for WebComponents.
Few things I would suggest
- If you are worried about browser support and weight of JS code, don't use template tag
- Definitely not the 3rd option as it will leave the element rendered but not visible which is waste of processing as you are not going to attach it to the DOM
- template literals are really powerful as I guess you will be using some bundler and in that case it will be converted to simple string interpolations compatible to most browsers
- you can go very functional with createElement and hence save a lot. I am pretty sure it will pain in the ass to manage many edge cases but for a big app it is will be worth