¿Cómo hacen Facebook, Google y otras aplicaciones grandes sus archivos CSS y JavaScript?

Question

Facebook: http://static.ak.fbcdn.net/rsrc.php/v1/yh/r/u2OL99TwlfU.css
Google: http://ssl.gstatic.com/gb/js/sem_cf9545d69b4bd3d22ed10206010c8b23.js

Hay otros sitios, como la etiqueta que también utiliza este tipo de método.

¿Cómo hacen estos sitios y otras aplicaciones grandes estos archivos? Supongo que cuando actualizan su archivo, la URL realmente cambia para que la memoria caché no reconozca la URL y vuelva a cargar el archivo nuevo.

En realidad estoy más confundido sobre el rsrc.php de Facebook, pero todavía no entiendo muy bien el resto. Parece que la cadena aleatoria de Google es un MD5 de algo.

Quiero algo como esto en mis sitios web, las aplicaciones grandes lo usan así que debe ser útil su uso, incluso si no decidí usarlo, su conocimiento puede ser beneficioso en el futuro cercano.

Answer 1

(yo soy el autor original de rsrc.php y sistema de gestión de recursos estáticos Haste de Facebook.)

Puede encontrar una descripción de algunos de los problemas encontrados con Facebook gestión de recursos estáticos y cómo los resolvió aquí, en la documentación phabricator:

https://secure.phabricator.com/book/phabflavor/article/soon_static_resources/

a la pregunta específica, los URI rsrc.php son así (con "rsrc.php" en ellos) específicamente porque no teníamos una regla global de reescritura de Apache en 2007 cuando escribí rsrc.php y agregué, implementé y probé uno para algunos No parece que valga la pena preocuparse por un URI más elegante (en PHP, puede leer el resto del URI después de la parte del archivo "x.php" en tiempo de ejecución). Entonces esa parte es solo un artefacto de implementación PHP. Los otros componentes de ruta se han utilizado para varios aspectos a lo largo de los años, como un número de versión de emergencia que podemos superar globalmente para romper las cachés de todos si algo sale mal con la secuencia de caché, una suma de comprobación hash para poder distinguir entre válidos y no válidos. solicitudes de basura para el registro, indicadores internos que alteran la política de caché del recurso devuelto para el desarrollo y los sabores de un recurso (por ejemplo, adaptado a un navegador específico o localizado a un idioma específico).

Answer 2

Facebook y Google usan un sufijo md5 en su nombre de archivo de recursos estático.

Primero, es una optimización general para el rendimiento, podemos versionar un recurso estático usar el md5 de su contenido de archivo (después de la minificación) y establecer el control de caché = 10 años (nginx o apache). Si presiona el botón avanzar/retroceder en su navegador o ve la página por segunda vez, el archivo se recuperará de su disco local, no a través de la red (a menos que presione el botón de recarga, habrá un 304).

En segundo lugar, cuando publica código en línea, primero puede insertar todos los recursos estáticos, no entrarán en conflicto con los antiguos. Y luego empuja todo el código del lado del servidor, todos los usuarios no tendrán acceso de error a su página.