Qual é a maneira correta de ocultar elementos HTML no carregamento da página antes de serem exibidos?

Eu encontrei várias respostas parciais para essa pergunta, mas nada que pareça uma resposta definitiva. Para uma técnica tão importante, acho isso um pouco estranho.

Como devo ocultar elementos (usando javascript) para que eles não apareçam rapidamente quando a página é carregada antes que o JS tenha a chance de ocultá-los? Eu não quero configurá-los para oculto inicialmente com CSS, como se um usuário não tivesse Javascript, eles não verão nada.

Para ser claro. Não estou perguntando como lidar com a exibição de conteúdo para usuários que não possuem JS. Esse é um assunto totalmente diferente. Eu só quero uma maneira confiável de ocultar elementos HTML antes que eles sejam exibidos.

Então meus requisitos:

Elementos HTML não estão ocultos inicialmente usando CSSSe JS estiver disponível, esses elementos estarão ocultos para que nunca sejam exibidos, nem mesmo por um instante. Isso significa ocultá-los do JS carregado no final do corpo está fora).

questionAnswers(4)

yourAnswerToTheQuestion