Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

Programação T5 - 04/2023 - Tema 01, lição 24: Visão além do alcance IV.

Olá pessoal! Me chamo Igor ( Iniciante em JavaScript ), estou no curso "JavaScript e HTML: desenvolva um jogo e pratique lógica de programação".

Na etapa do curso Tema 01, lição 24: Visão além do alcance IV, me deparei com um fato curioso e decidi abrir este tópico para compartilhar com quem possa se interessar.

No exercício foi levantada uma questão e sugerido 04 possíveis respostas, onde apenas uma é a correta. O objetivo aqui não será discutir a resolução do exercício, mas a funcionalidade, a estrutura e as "boas práticas" na organização do código.

<!-- 01 - Solução  sugerida no exercício -->
<meta charset="UTF-8">
<h1>Primeiro programa</h1>
<script>
    alert("Este é um popup feito com Java Script");
</script>
<!-- 02 - Solução alaternativa - Boas práticas -->
<meta charset="UTF-8">
<script>
    alert("Este é um popup feito com Java Script");
</script>
<h1>Primeiro programa</h1>

Ambas funcionam e entregam o mesmo resultado final. Minha Dúvida... Na opinião de vocês, a segunda opção não seria a mais indicada em termos de "boas práticas" e melhor compreensão das equipes no entendimento do código?

Pergunto porque humanamente falando, a percepção da ordem das ações do código estariam melhor representadas na opção 02 (Na minha opinião); 01 - Leitura do meta charset="UTF-8"; 02 - Ação do popup scritpt/alert na tela; 03 - Por fim a impressão do título "h1".

O mais interessante é que pode-se chegar no mesmo resultado, de muitas formas. Legal né?

Obrigado!

4 respostas

Também sou iniciante, mas na minha opinião a primeira está mais correta em relação a boas práticas, porque eu sempre vejo os desenvolvedores, e no caso eu também, colocando/coloco o JavaScript depois do HTML, mas no caso da segunda, começa com tags HTML, vem tag script e depois volta para o HTML.

Entretanto, não se preocupe muito com boas práticas agora, porque nesse curso, o importante mesmo é entender a lógica de programação.

Parabéns pelo desempenho.

Olá Lucas! Tudo bem? Interessante poder analisar sobre a tua perspectiva, ainda que discordamos nas opiniões. Considerando que a TAG em HTML sirvam para incluir ou referenciar ações executáveis/dinâmicas num programa, é muito comum elas surgirem inúmeras vezes num bloco de código. Penso que a partir de que se renomeia um documento com ".html", (mesmo com algumas limitações) o navegador já entenda que o bloco de códigos é html. Ou seja, a TAG script não esta "antes" nem "depois", mas no "meio". É invocado conforme os problemas a ser atendidos como se fossem janelas de códigos. Além de ser metódico, meus primeiros códigos foram em VBA e Java (Tipagens mais fechadas), estou estranhando toda esta liberdade do JS rsrsrs.

Na escola da programação voltada a objeto, me doutrinei neste formato de pensamento lógico (Paradigma da abstração), por isso meu esforço organizar meus códigos mais próxima possível da realidade.

Obrigado pela tua opinião e pelo tua recomendação! Te desejo tudo de bom e bons estudos!

solução!

Ah sim, entendi sua colocação e realmente faz sentido, como a IDE ou editor de texto entende as diferenças das TAG's de cada mundo, não tem problema em ficar como no segundo exemplo.

E sobre o JavaScript, na verdade, não é boa prática unir o JavaScript com o HTML da forma com que esta sendo ministrado na aula, ensinam dessa forma por questões didáticas. O correto seria separar o arquivo HTML do arquivo JavaScript, com extensões, mas isso você verá mais para frente.

Também já codei em Java, e realmente, é uma linguagem bem verbosa e cheia de detalhes chatinhos, em comparação com JS hehe

o script fica sempre no final, antes do fechamento do body.

  1. O navegador renderiza o HTML de cima para baixo. Se o elemento script estiver no cabeçalho ou no início do documento, o navegador precisará interromper o processo de renderização para buscar, carregar e executar o arquivo de script antes de continuar a renderização do restante do documento. Isso pode fazer com que a página demore mais tempo para ser exibida, especialmente se o script for grande ou estiver hospedado em um servidor lento.
  2. Ao colocar o elemento script no final do documento, o navegador pode primeiro carregar todo o conteúdo da página e, em seguida, carregar e executar o script sem interromper o processo de renderização. Isso geralmente resulta em tempos de carregamento mais rápidos e uma melhor experiência do usuário.
  3. No entanto, existem situações em que é necessário colocar o elemento script no cabeçalho ou no início do documento, por exemplo, quando o script é necessário para a renderização do conteúdo da página. Nesses casos, é importante otimizar o carregamento do script usando técnicas como minificação, compactação e cache para garantir que a página seja carregada o mais rápido possível.