Acabo de ejecutar una prueba y la única diferencia parece estar en los navegadores móviles.
Creé una imagen de 990 x 900px del icono de Twitter (ese icono parece un diseño demasiado detallado para una buena escala, tan bueno para esta prueba). Lo guardé como SVG, JPG, GIF, GIF transparente (solo la forma del pájaro, sin color de fondo, en cambio agregué esto con CSS), PNG, PNG transparente.
Luego los reduje a 15 px, 25 px, 50 px, 100 px y 150 px.
Aquí están los resultados en Firefox:
Aquí están los resultados en Chrome:
Si hacemos zoom en una captura de pantalla de los resultados más pequeños para que podamos ver qué píxeles se están generando, entonces Firefox (arriba) oscurece ligeramente los bordes en las versiones no transparentes, pero todos los demás resultados son muy similares.
Sin embargo, en un navegador IPod Touch Safari, la versión SVG parece bastante borrosa, y las otras bastante pixeladas:
Un resultado similar también se ve en Android Chrome. No he tomado una captura de pantalla de esto.
Me pregunto si la razón de esto podría tener algo que ver con la densidad de píxeles, que es la principal diferencia en la visualización, aunque eso tendría más sentido para mí si todas las imágenes se manejan de manera diferente en el móvil, en lugar de solo la SVG.
Si alguien puede explicar por qué este es el caso, entonces transferiré la marca de respuesta aceptada. De lo contrario, supongo que la respuesta TL; DR es que depende si prefiere iconos borrosos o pixelados (o hacer muchos iconos en tamaños de píxeles perfectos para sus puntos de corte receptivos).
editar: desde entonces he observado que los svgs suelen ser mucho más claros en los dispositivos de Apple: el pájaro de Twitter puede haber sido demasiado detallado para que esto aparezca en mis pruebas anteriores, por lo que siento que son el formato correcto para usar para los iconos.