Obsługa gzipped CSS i JavaScript z Amazon CloudFront przez S3

Moja odpowiedź to start na to: http://blog.kenweiner.com/2009/08/serving-gzipped-javascript-files-from.html

Bazując na odpowiedzi Skylera możesz wgrać gzip i nie-gzipową wersję css i js. Ostrożnie nazywaj i testuj w Safari. Ponieważ safari nie obsługuje plików .css.gz ani .js.gz.

site.js i site.js.jgz oraz site.css i site.gz.css (musisz ustawić nagłówek content-encoding na prawidłowy typ MIME, aby te serwowały poprawnie)

Następnie na swojej stronie put.

<script type="text/javascript">var sr_gzipEnabled = false;</script> 
<script type="text/javascript" src="http://d2ft4b0ve1aur1.cloudfront.net/js-050/sr.gzipcheck.js.jgz"></script> 

<noscript> 
  <link type="text/css" rel="stylesheet" href="http://d2ft4b0ve1aur1.cloudfront.net/css-050/sr-br-min.css">
</noscript> 
<script type="text/javascript"> 
(function () {
    var sr_css_file = 'http://d2ft4b0ve1aur1.cloudfront.net/css-050/sr-br-min.css';
    if (sr_gzipEnabled) {
      sr_css_file = 'http://d2ft4b0ve1aur1.cloudfront.net/css-050/sr-br-min.css.gz';
    }

    var head = document.getElementsByTagName("head")[0];
    if (head) {
        var scriptStyles = document.createElement("link");
        scriptStyles.rel = "stylesheet";
        scriptStyles.type = "text/css";
        scriptStyles.href = sr_css_file;
        head.appendChild(scriptStyles);
        //alert('adding css to header:'+sr_css_file);
     }
}());
</script> 

Gzipcheck.js.jgz jest po prostu sr_gzipEnabled = true; testuje, aby upewnić się, że przeglądarka może obsłużyć kod gzipped i zapewnić kopię zapasową, jeśli nie mogą.

Następnie zrób coś podobnego w stopce zakładając, że wszystkie Twoje js są w jednym pliku i mogą przejść do stopki.

<div id="sr_js"></div> 
<script type="text/javascript"> 
(function () {
    var sr_js_file = 'http://d2ft4b0ve1aur1.cloudfront.net/js-050/sr-br-min.js';
    if (sr_gzipEnabled) {
       sr_js_file = 'http://d2ft4b0ve1aur1.cloudfront.net/js-050/sr-br-min.js.jgz';
    }
    var sr_script_tag = document.getElementById("sr_js");         
    if (sr_script_tag) {
    var scriptStyles = document.createElement("script");
    scriptStyles.type = "text/javascript";
    scriptStyles.src = sr_js_file;
    sr_script_tag.appendChild(scriptStyles);
    //alert('adding js to footer:'+sr_js_file);
    }
}());
</script> 

Aktualizacja: Amazon obsługuje teraz kompresję gzip. Ogłoszenie, więc to już nie jest potrzebne. Ogłoszenie Amazona

Cloudfront obsługuje gzipping.

gzip_http_version 1.0

To ma efekt uboczny sprawiania, że połączenia keep-alive nie działają dla połączeń HTTP 1.0, ale ponieważ korzyści z kompresji są Ogromne, na pewno warto się wymienić.

Wzięte z http://www.cdnplanet.com/blog/gzip-nginx-cloudfront/

Edit

Serwowanie treści, które są gziped w locie przez Amazon Cloud front jest niebezpieczne i prawdopodobnie nie powinno być zrobione. Zasadniczo, jeśli serwer WWW jest gzipping treści, nie będzie ustawić długość zawartości i zamiast tego wysłać dane jako chunked.

Jeśli połączenie między Cloudfront a twoim serwerem zostanie przerwane i przedwcześnie zerwane rozwiązanie Cloudfront nadal buforuje wynik częściowy i służy jako wersja buforowana, dopóki nie wygaśnie.

Akceptowana odpowiedź gzipping najpierw na dysku, a następnie serwowanie wersji gzipped jest lepszym pomysłem, ponieważ Nginx będzie w stanie ustawić nagłówek Content-Length, a więc Cloudfront odrzuci wersje okrojone.

Wykonaliśmy kilka optymalizacji dla uSwitch.com ostatnio do kompresji niektórych zasobów statycznych na naszej stronie. Chociaż skonfigurowaliśmy do tego cały serwer proxy nginx, zebrałem również małą aplikację Heroku, która proxy między CloudFront i S3 kompresują zawartość: http://dfl8.co

Podane publicznie dostępne obiekty S3 mogą być dostępne za pomocą prostej struktury URL, http://dfl8.co po prostu używa tej samej struktury. Tzn. następujące adresy URL są równoważne:

http://pingles-example.s3.amazonaws.com/sample.css
http://pingles-example.dfl8.co/sample.css
http://d1a4f3qx63eykc.cloudfront.net/sample.css

Wczoraj amazon ogłosił nową funkcję, możesz teraz włączyć gzip w swojej dystrybucji.

Działa z s3 bez dodawania .pliki gz sam, wypróbowałem dziś nową funkcję i działa świetnie. (trzeba jednak unieważnić bieżące Obiekty)

Więcej informacji

Możesz skonfigurować CloudFront tak, aby automatycznie kompresował pliki określonych typów i obsługiwał skompresowane pliki.

Zobacz AWS poradnik programisty