Zawartość

    Odpowiedź serwera 103 Early Hints

    HTTP status code 103 (Early Hints)

    Status kod 103 (Early Hints) to nowy status, który umożliwia serwerom wysyłanie wstępnych podpowiedzi do klientów o zasobach, które mogą być potrzebne do przetwarzania żądania. Dzięki temu przeglądarki mogą rozpocząć ładowanie zasobów jeszcze przed zakończeniem przetwarzania głównego żądania przez serwer. To może znacząco przyspieszyć czas ładowania stron internetowych.

    103 - Early Hints

    Co to jest status kod 103 (Early Hints)

    • Definicja: Status kod 103 jest częścią protokołu HTTP/1.1 i HTTP/2, który informuje przeglądarkę o dostępnych zasobach, zanim serwer zakończy przetwarzanie żądania.
    • Główne cele:
      • Przyspieszenie ładowania stron przez umożliwienie wczesnego pobierania zasobów.
      • Zminimalizowanie opóźnień w renderowaniu stron internetowych.

    Status kod 103 działa w kontekście standardowych żądań HTTP. Kiedy klient wysyła żądanie do serwera, serwer może odpowiedzieć kodem 103, zanim dostarczy pełną odpowiedź (np. 200 OK), co pozwala na wcześniejsze ładowanie zasobów.

    Zastosowanie status kodu 103 w praktyce

    Użycie statusu kodu 103 może znacznie poprawić wydajność ładowania stron internetowych. Oto kilka przykładów:

    • Przykład 1: Wstępne ładowanie czcionek i stylów.
      • Serwer może wysłać wskazówki do przeglądarki o ładowaniu niezbędnych czcionek i arkuszy stylów, co pozwala na szybsze renderowanie strony.
    • Przykład 2: Wskazanie zasobów do pamięci podręcznej.
      • Serwer może zasugerować zasoby, które mogą być przechowywane w pamięci podręcznej, co zmniejsza liczbę żądań do serwera.

    Interakcja z przeglądarkami i klientami

    • Jak przeglądarki przetwarzają status kod 103: Przeglądarki, które obsługują ten status, mogą rozpocząć pobieranie zasobów, zanim otrzymają pełną odpowiedź, co przyspiesza ładowanie stron.
    • Wsparcie dla status kodu 103 w różnych przeglądarkach: Większość nowoczesnych przeglądarek, takich jak Chrome, Firefox i Safari, wspiera status kod 103.

    Przykłady użycia

    Przykład realizacji na serwerze z użyciem Node.js

    
    const http = require('http');
    
    const server = http.createServer((req, res) => {
        res.writeHead(103, {'Link': '; rel=preload; as=style'});
        // Dalsze przetwarzanie
        res.writeHead(200, {'Content-Type': 'text/'});
        res.end('<>Hello World');
    });
    
    server.listen(3000);
    

    W tym przykładzie serwer w Node.js wysyła status kod 103 z linkiem do arkusza stylów, umożliwiając jego wcześniejsze załadowanie.

    Przykład realizacji na serwerze z użyciem Python (Flask)

    
    from flask import Flask, make_response
    
    app = Flask(__name__)
    
    @app.route('/')
    def index():
        response = make_response('<>Hello World')
        response.headers['Link'] = '; rel=preload; as=style'
        response.status_code = 200
        return response
    
    if __name__ == '__main__':
        app.run()
    

    Ten przykład w Flask również pokazuje, jak wysłać nagłówek Link dla ładowania stylów.

    Przykład realizacji na serwerze z użyciem PHP

    
    header("HTTP/1.1 103 Early Hints");
    header("Link: ; rel=preload; as=style");
    
    header("HTTP/1.1 200 OK");
    echo '<>Hello World';
    

    W PHP serwer wysyła status kod 103 i sugeruje przeglądarkom wczesne ładowanie arkusza stylów.

    Potencjalne problemy i ich rozwiązania

    • Jak obsługiwać błędy związane z używaniem status kodu 103:
      • Błąd: Klient nie obsługuje status kodu 103.
        • Rozwiązanie: Wprowadzenie planu awaryjnego dla starszych przeglądarek, które nie obsługują tego statusu.
    • Jak uniknąć niewłaściwego użycia status kodu 103:
      • Częste błędy: Nieprawidłowe nagłówki Link, które mogą nie prowadzić do optymalizacji.
      • Ich poprawki: Upewnienie się, że wszystkie linki i zasoby są prawidłowe przed wysłaniem statusu kodu 103.

    Jak prawidłowo skonfigurować serwer, aby wspierał status kod 103

    Aby skonfigurować serwer do obsługi statusu kodu 103, należy wykonać kilka kroków:

    • Konfiguracja serwerów WWW:
      • Nginx: Można użyć dyrektywy add_header do dodania odpowiednich nagłówków.
      • Apache: Użycie mod_headers do dodawania nagłówków w odpowiedzi.
    • Rekomendacje dotyczące konfiguracji:
      • Testowanie w różnych przeglądarkach, aby upewnić się, że status kod 103 działa poprawnie.
      • Monitorowanie wydajności strony, aby ocenić korzyści płynące z używania statusu kodu 103.