1. h3-compression
Adds compression to h3 request (brotli, gzip, deflate)
h3-compression
Package: h3-compression
Created by: CodeDredd
Last modified: Fri, 01 Sep 2023 22:27:42 GMT
Version: 0.3.2
License: MIT
Downloads: 112,709
Repository: https://github.com/CodeDredd/h3-compression

Install

npm install h3-compression
yarn add h3-compression

H3-compression

npm version
npm downloads
bundle
JSDocs
License

Handles compression for H3

Features

✔️  Zlib Compression: You can use zlib compression (brotli, gzip and deflate)

✔️  Stream Compression: You can use native stream compressions (gzip, deflate)

✔️  Compression Detection: It uses the best compression which is accepted

Install

 # Using npm
npm install h3-compression

# Using yarn
yarn add h3-compression

# Using pnpm
pnpm add h3-compression

Usage

 import { createServer } from 'node:http'
import { createApp, eventHandler, toNodeListener } from 'h3'
import { useCompressionStream } from 'h3-compression'

const app = createApp({ onBeforeResponse: useCompressionStream }) // or { onBeforeResponse: useCompression }
app.use(
  '/',
  eventHandler(() => 'Hello world!'),
)

createServer(toNodeListener(app)).listen(process.env.PORT || 3000)

Example using listhen for an elegant listener:

 import { createApp, eventHandler, toNodeListener } from 'h3'
import { listen } from 'listhen'
import { useCompressionStream } from 'h3-compression'

const app = createApp({ onBeforeResponse: useCompressionStream }) // or { onBeforeResponse: useCompression }
app.use(
  '/',
  eventHandler(() => 'Hello world!'),
)

listen(toNodeListener(app))

Nuxt 3

If you want to use it in nuxt 3 you can define a nitro plugin.

server/plugins/compression.ts

 import { useCompression } from 'h3-compression'

export default defineNitroPlugin((nitro) => {
  nitro.hooks.hook('render:response', async (response, { event }) => {
    if (!response.headers?.['content-type'].startsWith('text/html'))
      return

    await useCompression(event, response)
  })
})

[!NOTE]
useCompressionStream doesn't work right now in nitro. So you just can use useCompression

Utilities

H3-compression has a concept of composable utilities that accept event (from eventHandler((event) => {})) as their first argument and response as their second.

Zlib Compression

  • useGZipCompression(event, response)
  • useDeflateCompression(event, response)
  • useBrotliCompression(event, response)
  • useCompression(event, response)

Stream Compression

  • useGZipCompressionStream(event, response)
  • useDeflateCompressionStream(event, response)
  • useCompressionStream(event, response)

Sponsors

Releated Projects

License

MIT License © 2023-PRESENT Gregor Becker

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin