Jaki jest najlepszy sposób na aktualizację adresów URL CSS i JS?


26

Zgodnie z dobrze sprawdzonymi najlepszymi praktykami firmy Yahoo dotyczącymi przyspieszenia witryny , udostępniamy statyczne treści z CDN przy użyciu nagłówków wygasających pamięci podręcznej w przyszłości. Oczywiście musimy od czasu do czasu aktualizować te pliki „statyczne”, dlatego obecnie dodajemy wersję poprawkową jako część nazwy pliku (na podstawie sumy zawartości pliku SHA1). A zatem:

styles.min.css

Staje się:

styles.min.abcd1234.css

Jednak zarządzanie wersjonowanymi plikami może być uciążliwe i zastanawiałem się, czy notacja argumentu GET może być czystsza i lepsza:

styles.min.css?v=abcd1234

Z którego korzystasz i dlaczego? Czy należy wziąć pod uwagę kwestie związane z przeglądarką lub proxy / pamięcią podręczną?


Powodem, dla którego pytam, jest to, że pamiętam, że słyszę powód, by NIE używać stylu argumentu GET, ale nie pamiętam dlaczego.
David Eyk

Czy użycie argumentu GET nie wymaga podania arkusza stylów za pomocą jakiegoś skryptu po stronie serwera (i nie byłby już statyczny)?
Lotus Notes

@Lotus: Możesz wysyłać argumenty GET i zostaną one po cichu zignorowane, jeśli nic ich nie będzie szukało.
David Eyk,

Odpowiedzi:


10

Według Google Make the Web Faster strony z parametrami zapytania nie są buforowane przez wiele serwerów proxy HTTP.

Większość serwerów proxy, zwłaszcza Squid w wersji 3.0, nie buforuje zasobów za pomocą „?” w ich adresie URL, nawet jeśli Cache-control: publicw odpowiedzi znajduje się nagłówek. Aby włączyć buforowanie proxy dla tych zasobów, usuń ciągi zapytania z odwołań do zasobów statycznych i zamiast tego zakoduj parametry w samych nazwach plików.

Takie styles.min.abcd1234.cssjest preferowane rozwiązanie. Możesz użyć odpowiedniego mechanizmu przepisywania adresów URL, aby zmienić styles.min.abcd1234.cssna łatwiejsze w implementacji styles.min.css?v=abcd1234przejrzyste.

Jeśli obsługujesz tylko HTTPS, ta rada nie ma zastosowania, ponieważ serwery proxy zwykle nie mogą buforować stron obsługiwanych przez SSL.


2
Zastanawiam się, czy informacje dotyczące buforowania ciągu zapytań i serwerów proxy są nieco przestarzałe? Dokumenty Google nie odwołują się już do ciągów zapytań i serwerów proxy w tym kontekście. Chociaż przykłady wciąż wymagają zmiany samej nazwy pliku. Squid 2.7 (2008) i 3.1 (2010) podobno domyślnie obsługują buforowanie ciągów zapytań, a wcześniejsze wersje mogły być skonfigurowane do obsługi tego.
MrWhite

15

Używając wersji w stylu GET, z pustej pamięci podręcznej wiele adresów URL - np. style.css?v=123I style.css?v=456- zwróci tę samą treść. Jednak nie widzę, że byłoby to problematyczne, zwłaszcza, że ​​prowadziłbyś do jednego linku naraz.

Myślę, że łatwiej będzie utrzymać styl GET. Nie potrzebujesz osobnych plików: wystarczy zmienić adres URL, a przeglądarki ponownie pobiorą CSS.

AKTUALIZACJA: po dalszych badaniach wydaje się, że użycie ciągu zapytania może zatrzymać przeglądarki buforujące pliki. Jeśli jednak zwracasz odpowiednie nagłówki, takie jak Expiresten, nie stanowi to problemu.

AKTUALIZACJA 2: zaakceptowana odpowiedź wskazuje, że niektóre serwery proxy nie buforują plików ciągiem zapytania. Jest to jednak oparte na starych informacjach; szczególny problem, o którym wspominali w Squid, został naprawiony 7 lat temu. Imponujące sieci napisały o tym dobrze.


To zastrzeżenie, które próbowałem sobie przypomnieć. Dzięki za link.
David Eyk

1

Oba będą działać równie dobrze, ponieważ ciąg zapytania jest uważany za część adresu URL i zmieniając go, w rzeczywistości zmieniasz nazwę zasobu, powodując w ten sposób pobranie nowej kopii pliku przez przeglądarkę.

Mówię, że używaj dowolnej metody, którą łatwiej utrzymać.


0

to nie jest odpowiedź na powyższe pytanie , chcę lepszego rozwiązania, więc pytam o to tutaj

Obie metody wymagałyby modyfikacji plików, do których odnoszą się pliki css i js. W efekcie wymagałoby to ponownego uruchomienia serwera aplikacji po wprowadzeniu zmian.

Czy istnieje lepszy sposób, w którym można obsłużyć wersjonowanie plików statycznych bez konieczności ponownego uruchamiania serwera aplikacji?

w rozwiązaniu wykluczone jest:

  • zmiana nazw plików css i js
  • przekazanie paremeter zapytania w adresie URL

rozwiązanie również nie powinno wpływać na ustawienie kontroli pamięci podręcznej lub wygasa.

dzięki


1
wygląda na to, że jesteś tu nowy. To dobre pytanie. Powinieneś opublikować go jako taki, być może odsyłając do tego pytania w celach informacyjnych. Oflagowałem to dla uwagi moderatora, aby mogli ci pomóc.
David Eyk

jak zauważył David, ta strona nie przypomina innych stron forum. Jeśli masz nowe pytanie, możesz kliknąć przycisk „zadaj pytanie”
Mark Henderson

To przydatne wyjaśnienie. Jeśli zmienisz arkusz stylów, lepiej byłoby zachować tę samą nazwę i odniesienie, niż aktualizować setki odniesień do niego w całej witrynie.
Mark Stosberg
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.