HTTP/1.1 vs HTTP/2: пример кода

Question

Accepted Answer

HTTP/2 вы не трогаете в JS — браузер и сервер договариваются через ALPN при TLS. Меняется **build strategy**: то, что оптимизировало HTTP/1.1, часто вредит на HTTP/2.

## Пример

```js
// ❌ HTTP/1.1-era optimisations — often HARMFUL on HTTP/2:
//   - one giant bundle.js  → kills granular caching; one byte change re-downloads all
//   - domain sharding (cdn1, cdn2) → defeats multiplexing, adds DNS+TLS+congestion cost
//   - image sprites        → unnecessary; parallel requests are now cheap

// ✅ HTTP/2-era: ship smaller, cacheable chunks and let multiplexing parallelise
// vite.config.js — split vendor from app so a code change doesn't bust vendor cache
export default {
  build: {
    rollupOptions: {
      output: {
        manualChunks: {
          react: ['react', 'react-dom'],   // rarely changes → long-lived cache
          // app code hashes separately → tiny diffs re-download tiny chunks
        },
      },
    },
  },
};
```

```bash
# Confirm the protocol actually negotiated (h2 = HTTP/2)
curl -I --http2 https://example.com   # look for "HTTP/2 200"
# In DevTools → Network → add the "Protocol" column: h2, h3, or http/1.1
```

## Разбор

HTTP/2 multiplexes запросы на одном TCP — domain sharding и sprites теряют смысл. Мелкие cacheable chunks лучше одного giant bundle: изменение кода не инвалидирует vendor. В DevTools колонка Protocol показывает `h2`, `h3` или `http/1.1`.

## Итог

На HTTP/2: code splitting вместо mega-bundle, без domain sharding; протокол смотрите в curl/DevTools, а не в application code.