Protocols

HTTP/2 Support

Full native HTTP/2 support with server push, stream prioritization, and multiplexing. Built on Node.js http2 module with automatic HTTP/1.1 fallback.

Overview

Without HTTP/2, you're missing server push, multiplexing, and header compression. With MoroJS, you get all of that automatically. Traditional HTTP/2 setup requires complex configuration. We handle that automatically.

Without HTTP/2

No server push capabilities
No multiplexing
No header compression
Slower page loads

With MoroJS

Built-in server push
Automatic multiplexing
HPACK header compression
Faster page loads

Faster

Server push for proactive resource delivery

Efficient

Multiplexing and header compression reduce latency

Compatible

Automatic HTTP/1.1 fallback for all clients

How It Works

HTTP/2 is a major revision of the HTTP protocol that provides better performance through server push, multiplexing, header compression, and stream prioritization. MoroJS provides native HTTP/2 support built on Node.js's http2 module, with automatic HTTP/1.1 fallback for clients that don't support HTTP/2.

Quick Start

Basic HTTP/2 Servertypescript

1import { createApp } from '@morojs/moro';
2import * as fs from 'fs';
3
4const app = await createApp({
5  http2: true,
6  https: {
7    key: fs.readFileSync('key.pem'),
8    cert: fs.readFileSync('cert.pem'),
9  },
10});
11
12app.get('/', (req, res) => {
13  res.json({
14    message: 'Hello HTTP/2!',
15    version: req.httpVersion // '2.0'
16  });
17});
18
19app.listen(3000);

Advanced Configurationtypescript

1const app = await createApp({
2  http2: {
3    allowHTTP1: true, // Support HTTP/1.1 fallback
4    settings: {
5      enablePush: true,
6      maxConcurrentStreams: 100,
7      initialWindowSize: 65535,
8      maxFrameSize: 16384,
9    },
10  },
11  https: {
12    key: fs.readFileSync('key.pem'),
13    cert: fs.readFileSync('cert.pem'),
14  },
15});

Server Push

Automatic Push (Recommended)typescript

1import { middleware } from '@morojs/moro';
2
3app.use(middleware.http2Push({
4  autoDetect: true, // Auto-detect CSS/JS from HTML
5  resources: [
6    {
7      path: '/styles/main.css',
8      as: 'style',
9      type: 'text/css',
10      priority: 200 // High priority
11    },
12    {
13      path: '/scripts/app.js',
14      as: 'script',
15      type: 'application/javascript',
16      priority: 150
17    },
18  ],
19  condition: (req) => req.path === '/' || req.path.endsWith('.html'),
20}));

Manual Pushtypescript

1app.get('/', (req, res) => {
2  // Check if push is available
3  if (res.push) {
4    // Push CSS with high priority
5    const cssStream = res.push('/styles/main.css', {
6      headers: { 'content-type': 'text/css' },
7      priority: 200,
8    });
9
10    if (cssStream) {
11      cssStream.end('body { font-family: Arial; }');
12    }
13
14    // Push JavaScript
15    res.push('/scripts/app.js', {
16      headers: { 'content-type': 'application/javascript' },
17      priority: 150,
18    });
19  }
20
21  res.send('<html>...</html>');
22});

Stream Prioritization

Priority Controltypescript

1// Critical API endpoint - highest priority
2app.get('/api/critical', (req, res) => {
3  if (res.setPriority) {
4    res.setPriority({
5      weight: 256,      // 1-256, higher = more important
6      exclusive: true   // Exclusively process this stream
7    });
8  }
9
10  res.json({ critical: 'data' });
11});
12
13// Background data - low priority
14app.get('/api/background', (req, res) => {
15  if (res.setPriority) {
16    res.setPriority({ weight: 1 });
17  }
18
19  res.json({ background: 'data' });
20});

Priority Values Guidetypescript

1// Priority weight ranges from 1-256:
2// 256 - Critical resources (HTML, critical API data)
3// 200 - High priority (CSS, fonts)
4// 150 - Medium priority (JavaScript)
5// 100 - Normal priority (images)
6// 50  - Low priority (analytics, tracking)
7// 1   - Lowest priority (background tasks)

SSL Certificates

Generate Self-Signed Certificate (Development)typescript

1# Generate self-signed certificate
2openssl req -x509 -newkey rsa:2048 -nodes -sha256 \
3  -subj '/CN=localhost' \
4  -keyout localhost-key.pem \
5  -out localhost-cert.pem
6
7# For production, use certificates from a trusted CA like Let's Encrypt

Checking HTTP Version

Detect HTTP Versiontypescript

1app.get('/', (req, res) => {
2  const httpVersion = req.httpVersion; // '2.0' or '1.1'
3
4  if (httpVersion === '2.0') {
5    // Use HTTP/2 features
6    res.push('/assets/critical.css');
7  }
8
9  res.json({ version: httpVersion });
10});

Best Practices

1. Use Server Push Wisely

Only push resources that are:

• Critical for initial render
• Small in size (< 100KB)
• Used by most users

2. Set Appropriate Priorities

typescript

1// Critical path
2res.setPriority({ weight: 256, exclusive: true });
3
4// Important but not critical
5res.setPriority({ weight: 200 });
6
7// Background/analytics
8res.setPriority({ weight: 1 });

3. Enable HTTP/1.1 Fallback