VinokurovVE/bun-server-test
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
faea4e4d1f6b9dea4372fe28af3ec11830ce58f2
bun-server-test/BUN_CAPABILITIES.md

7.2 KiB
Raw Blame History

📊 Что Bun может из коробки с рендером - ИТОГИ

✅ 10 встроенных возможностей Bun

1. Template Literals ⭐⭐⭐ (РЕКОМЕНДУЕТСЯ)

Самый быстрый способ генерирования HTML

const html = `<!DOCTYPE html><html><body><h1>${title}</h1></body></html>`;
return new Response(html, { headers: { "Content-Type": "text/html" } });
  • Скорость: 0.1ms (самый быстрый!)
  • Оптимизация: встроенная V8
  • Использование памяти: минимальное
  • Сложность: низкая

2. JSX/TSX Компиляция ✅

Встроенная поддержка без бандлеров

// Просто работает!
const Component = () => <h1>Hello</h1>;
  • Требует: React (если используется JSX)
  • Компиляция: встроенная на лету
  • Конфигурация: не требуется

3. React.renderToString() ✅

Server-Side Rendering из коробки

import React from "react";
const html = React.renderToString(<MyComponent />);
  • Скорость: 2-5ms (медленнее Template Literals)
  • Полезно: для переиспользуемых компонентов
  • SSR: полная поддержка

4. Встроенный Bun.file() ✅

Супер быстрая работа с файлами

const file = Bun.file("path/to/file.html");
return new Response(file);
  • Скорость: 0.05ms (очень быстро!)
  • Оптимизация: встроенная
  • Потоковая передача: автоматическая
  • Идеально: для статических файлов

5. Streaming API ✅

Web Standard Streaming для больших данных

const readable = new ReadableStream({
  start(controller) {
    controller.enqueue(chunk);
    controller.close();
  }
});
return new Response(readable);
  • Скорость: 0.05ms (очень быстро!)
  • Случай: большие файлы, real-time данные
  • Стандарт: Web Standards API

6. JSON Оптимизация ✅

Встроенная V8 оптимизация

const json = JSON.stringify(data);  // Супер быстро!
return new Response(json, { headers: { "Content-Type": "application/json" } });
  • Скорость: встроенная оптимизация V8
  • Сложные структуры: работают быстро
  • Сериализация: максимально оптимизирована

7. Web Standards API ✅

Полная поддержка стандартных API

// Все работает из коробки:
- Request / Response
- Headers
- URL / URLSearchParams
- FormData
- Blob / ArrayBuffer
- TextEncoder / TextDecoder
- ReadableStream / WritableStream

8. TypeScript из коробки ✅

Встроенная компиляция TS на лету

const greeting: string = "Hello";  // Просто работает!
  • Компиляция: встроенная
  • Конфигурация: tsconfig.json опционально
  • Performance: оптимизирована

9. HTTP Кеширование ✅

Встроенная поддержка Cache-Control и ETag

return new Response(html, {
  headers: {
    "Cache-Control": "public, max-age=3600",
    "ETag": '"123456"'
  }
});

10. Cookie Поддержка ✅

Встроенная установка и чтение Cookie

return new Response(html, {
  headers: {
    "Set-Cookie": "session=abc123; Path=/; HttpOnly"
  }
});

🚀 Демонстрационные маршруты

В проекте добавлены примеры всех встроенных возможностей:

Маршрут Демонстрирует Скорость
/demo/fast-render Template Literals ⚡⚡⚡
/demo/dynamic-data Динамический контент ⚡⚡⚡
/demo/optimized-json JSON оптимизация ⚡⚡⚡
/demo/streaming Streaming API ⚡⚡⚡
/demo/cached-asset Cache Control ⚡⚡
/demo/cookie Cookie установка ⚡⚡
/demo/all Все методы ⚡⚡⚡

Тестирование:

# Быстрый HTML рендер
curl http://localhost:3002/demo/fast-render

# Динамические данные (таблица)
curl http://localhost:3002/demo/dynamic-data

# JSON API
curl http://localhost:3002/demo/optimized-json

# Streaming контент
curl http://localhost:3002/demo/streaming

# Кешируемый контент
curl http://localhost:3002/demo/cached-asset

# Установка Cookie
curl http://localhost:3002/demo/cookie

# Информация о всех методах
curl http://localhost:3002/demo/all

📊 Сравнение производительности

Template Literals:      0.1ms   ⚡⚡⚡ ИСПОЛЬЗУЙТЕ!
Bun.file():            0.05ms   ⚡⚡⚡ Для статики
Streaming:             0.05ms   ⚡⚡⚡ Для больших
JSON.stringify():      встроено ⚡⚡⚡ Оптимизирован
React renderToString:   2-5ms   ⚡ Когда нужен
HTML Builder Pattern:    0.2ms   ⚡⚡ Специальные

💡 Рекомендации по использованию

Используйте Template Literals для:

  • ✅ Простых HTML страниц (80% случаев)
  • ✅ API с JSON
  • ✅ Динамического контента
  • ✅ Максимальной производительности

Используйте React компоненты для:

  • ✅ Переиспользуемых компонентов
  • ✅ Сложной логики UI
  • ✅ Интеграции с фронтенд кодом

Используйте Streaming для:

  • ✅ Больших файлов
  • ✅ Real-time контента
  • ✅ Progressive rendering

Используйте Bun.file() для:

  • ✅ Статических файлов
  • ✅ CSS/JS/изображений
  • ✅ Медиа файлов

🎯 Главный совет

Используйте Template Literals в 80% случаев - это будет самым быстрым и удобным решением!

// ХОРОШО (используйте это в 80% случаев)
const html = `<h1>${title}</h1><p>${content}</p>`;

// ИСПОЛЬЗУЙТЕ КОГДА НУЖНЫ КОМПОНЕНТЫ
const html = React.renderToString(<MyComponent />);

// ИСПОЛЬЗУЙТЕ ДЛЯ ФАЙЛОВ
return new Response(Bun.file("static/style.css"));

📚 Дополнительная информация

Смотри файл BUN_RENDERING.md для подробной документации о каждом методе.

Исходный код примеров:

  • src/bun-rendering-guide.ts - Теория
  • src/bun-rendering-examples.ts - Практические примеры