lwjgl.org - Home of Lightweight Java Game Library

The website for LWJGL is build with React. It is a single-page application with client-side routing. It installs a Service Worker in order to work offline.

Notable features:

• Client-side routing
• Service Worker (works offline)
• Tiny production build (entire codebase + content weights less than 300KB gzipped)
• Code splitting at route & component level
• Scroll restoration
• Route preloading
• Proximity based route preloading (see /download page)
• Build Customizer with smart download queue & client-side ZIP generator
• Custom webpack manifest parsing + code minification
• CSS-in-JS with Stitches
• Client is written in Typescript

Warning:

There is currently no server-side rendering because of hosting constraints.

Dependencies

Static assets are loaded from LWJGL's CDN (AWS CloudFront).

Build status icons are loaded directly from travis-ci.org and appveyor.com.

Three.js is loaded from jsDelivr.

Prerequisites

• Node.js v19+
• NPM v9+

Development

Install all required npm packages and build styles:

npm i
npm run build:styles

Start the server in dev mode:

npm -s start

CLI flags

The following flags are used for testing production builds locally. NODE_ENV environment variable must be set to "production".

--test # Enables production test mode (e.g. disables HSTS)
--nocache # Disables Pug view caching
--pretty # Pretty prints HTML
--s3proxy # Proxies S3 images

Environment variables

NODE_ENV="production" # default: development
PORT="8080" # default: 80
HOST="127.0.0.1" # default: 0.0.0.0

Codebase Diagram

Visualization of the codebase

Production

To deploy LWJGL in production please read the separate guide: DEPLOYMENT.md.

Testing production builds

git pull
npm i
npm run release

You can run the production build locally:

npm run dev:test-production

Debugging production output

The following debugging tips may come in handy:

• Disable minification by uncommenting minimize: false in webpack.config.js
• Prevent Terser from dropping console.log or debugger by changing terserOptions in terser-config.json
• Set PROFILING=1 env variable to load React profiling builds
• Output named module & chunk ids in webpack.config.js
• Analyze build output with npx webpack-bundle-analyzer public/js/webpack.manifest.json -h 0.0.0.0 (for full breakdown, change to all: true when writing webpack.manifest.json in build-production.js)

Other LWJGL subdomains:

• The website for LWJGL 2 can be found here. A static copy of the old LWJGL website is now hosted directly from S3
• The blog is powered by Ghost.
• The forum is SMF.
• The wiki for LWJGL 2 was MediaWiki. A static copy of the old LWJGL wiki is now hosted directly from S3.