O que é a deteção de funcionalidades do navegador (feature detection)?

A deteção de funcionalidades do navegador (feature detection) é um método de programação que permite verificar se o navegador atual suporta determinada funcionalidade (API). Em vez de adivinhar ou verificar a versão do navegador, esta abordagem baseia-se na testagem direta da presença de propriedades ou métodos.

Vantagens:

• Compatibilidade máxima: O código funciona apenas onde a funcionalidade necessária é suportada.
• Resiliência a mudanças: Não depende das versões dos navegadores, que podem mudar.
• Abordagem mais fiável: Uso de capacidades, não de suposições.

Exemplo:

Verificação do suporte ao localStorage:

if (typeof(Storage) !== "undefined") {
  // localStorage é suportado
  localStorage.setItem("myKey", "myValue");
} else {
  // localStorage não é suportado
  // Oferecer uma alternativa ou notificar o utilizador
}

Verificação do suporte ao canvas:

var canvas = document.createElement('canvas');
if (canvas.getContext) {
  // canvas é suportado
  var ctx = canvas.getContext('2d');
  // desenhar no canvas
} else {
  // canvas não é suportado
}

Diferenças do Browser Sniffing:

O Browser Sniffing baseia-se na análise da string navigator.userAgent para determinar o navegador e a sua versão. Este método não é confiável, pois a string User Agent pode ser falsificada, modificada ou conter informações incompletas. A deteção de funcionalidades concentra-se nas capacidades, não na identificação do navegador.