Better Performance, Empty Elements Or Create And Destroy With Javascript?

Question

What would be better for performance, having many hidden elements on a page, or creating them and destroying them as they are needed with javascript upon request. For example, when something is clicked the element is first created and then shown. When it is closed it is then destroyed. Would that be better than having hidden elements scattered among the page?

Answer 1

I'd imagine it depends in part on how complex the elements are, and in part on what you mean by "performance". The more complex the element, the more code has to run to create it, and the longer it'll take to create. Thus, hiding the element in the page would probably make it appear faster, but at the cost of a bigger page (and more DOM to sift through), which could slow things down a bit overall.