Qual a diferença entre URLs absolutas e relativas nos conteúdos da página

Neste artigo veremos qual a diferença entre URLs absolutas e relativas em nossos sites, por exemplo quando colocamos a URL de um CSS em vez do caminho.

Fala programador(a), beleza? Será que tem diferença colocar  URL ou o caminho da pasta quando chamamos arquivos externos? Bora ver isso agora!

Veja os exemplos das situações:

Formação Recomendada

Formação Vibe Coding

Do Prompt ao Produto: Crie Software Real com IA

• 474 aulas
• 20 projetos
• 39h 27min

Conhecer formação

<!-- URL absoluta -->
<script src="https://www.meusite.com.br/src/js/scripts.js"></script>

<!-- URL relativa -->
<script src="src/js/scripts.js"></script>

<!-- URL relativa da raiz -->
<script src="/src/js/scripts.js"></script>

Na verdade não há diferença alguma em chamar arquivos por qualquer uma destas maneiras apresentadas

O browser otimiza as chamadas da forma que é mais interessante tanto para ele quanto para o cliente que está acessando o site

Tamanho do arquivo

Porém, como você deve saber, a cada caractere escrito em um arquivo o seu tamanho aumenta

Quando maior o arquivo, mais tempo demora para o mesmo ser interpretado e executado

Ou seja, as formas maiores de chamar um arquivo implicarão em um arquivo maior e consequentemente mais lento para ser lido

Claro que a este nível não deve impactar muito, porém é bom ter o cuidado

Manutenção

Se você colocar URLs absolutas, toda vez que for alterado o domínio, por exemplo, você também tem que lembrar de mudar a chamada do arquivo

Então começa a se aumentar os custos de manutenção, sendo assim a URL relativa o caso mais indicado para menos manutenção no código

Já as URLs relativas globais, que vão desde a raiz, tendem a economizar tempo na manutenção

Pois dificilmente um projeto vai mudar a sua estruturas de pastas, ainda mais após o mesmo estar em produção e o time todo com o projeto em suas máquinas

Conclusão

Neste artigo vimos a diferença entre URLs absolutas e relativas ao chamar arquivos para o projeto

Na prática não implica em nada para o cliente, ele receberá o arquivo da mesma forma

Porém vimos que utilizar URLs absolutas é uma má prática, pois aumenta a ocorrência de manutenções e também o tamanho do arquivo HTML

Confira também nosso catálogo de cursos gratuitos, com aulas semanais no YouTube