Deploying a distribution

To deploy a built distribution of the log viewer, you’ll need to do the following:

1. Serve the files using a static file host.

2. Apply any of the following optimizations:

   • Compression

   • Configure a MIME type for WebAssembly files

Static file hosting

You can deploy the built distribution (the dist directory) to any static hosting service such as:

• GitHub Pages

  Tip

  If you fork this repository and enable GitHub Actions in your fork, every push will trigger the deployment workflow to deploy the site to https://<your-github-username>.github.io/yscope-log-viewer/ using GitHub Pages.

• Netlify

• Cloudflare Pages

• Vercel

• Object storage with a CDN (e.g., AWS S3 with CloudFront)

Alternatively, you can set up your own web server (e.g., Apache HTTP Server or Nginx).

Tip

We recommend serving the distribution (and by extension, any log files the user wishes to view) over a secure connection.

If you encounter any issues with serving the distribution with a static file host, check out the troubleshooting section below for potential solutions.

Troubleshooting

1. If users of the deployed distribution want to load log files from a different origin than the static file host, you’ll need to ensure that the host serving the log files supports cross-origin resource sharing (CORS).

   Note

   Sites served over http:// and https:// are considered different origins, even if the domain is the same.

2. If your static file host serves the log viewer over a secure connection, modern browsers won’t allow users to load log files over an insecure connection due to mixed content restrictions. So you’ll need to ensure either:

   • all log files to be loaded are served over secure connections; or

   • the log viewer is served over an insecure connection (for security, this is not recommended).

Enabling compression

To improve load times, you can reduce file transfer sizes by enabling compression for the files in the distribution (.css, .js, .html, and .wasm files). You can enable compression by configuring the static file host to support popular content-encoding methods (e.g., gzip).

You can verify that compression is working by inspecting the response headers for any of the static assets. The Content-Encoding header should show a supported content encoding method (e.g., br, gzip, or zstd).

Configuring a WebAssembly MIME type

To avoid unnecessary downloads of WebAssembly (.wasm) files (see emscripten-core/emscripten#18468), the server should be configured to serve such files using the application/wasm MIME type. The following web server deployments use this MIME type by default:

• The Apache HTTP Server on Debian-based systems (e.g., Debian v10+ or Ubuntu v20.04+)

  • This deployment relies on the system’s /etc/mime.types file which is included in the media-types v3.62 package).

• Nginx v1.21.0+.

If your web server is not one of the above, ensure it is configured to use the aforementioned MIME type.