Web Game Dev logo

Web Game Dev

Learn how to make games in JavaScript๐ŸŽฎ WebGamer.io๐ŸŽฎ WebGamer.io (opens in a new tab)
GitHubGitHub (opens in a new tab)DiscordDiscord (opens in a new tab)
  • ๐Ÿ‘‹ Introduction
  • โœจ Games & Demos
    • ๐ŸŒ Web Engines
    • โšซ๏ธ Poimandres
    • โš›๏ธ React
    • ๐Ÿงฐ Dev Tools
    • ๐ŸŽฎ Native Engines
    • ๐Ÿฅฝย WebXR (VR, AR)
    • ๐Ÿฆ€ Rust Game Dev
    • ๐Ÿ“ Fundamental Math
    • ๐Ÿชฉ 3D Essentials
    • โœจ VFX & Particles
    • ๐ŸŒˆ Postprocessing
    • ๐ŸŽฌ Animations
    • ใ€ฐ๏ธ Randomness & Noise
    • ๐Ÿ‘ป Shaders
    • ๐Ÿ”ฎ Techniques
    • ๐Ÿ–ฅ๏ธ User Interface
    • ๐ŸŽจ HTML/CSS UI
    • ๐Ÿบ Modeling
    • ๐Ÿƒ Model Animations
    • ๐Ÿฆด Inverse Kinematics
    • ๐Ÿ”ˆ Audio
    • ๐ŸŽน Music Production
    • ๐Ÿ› Asset Stores
    • ๐Ÿฆพ AI-Generated
    • ๐Ÿƒ Gameplay
    • ๐Ÿ•น๏ธ Controls
    • ๐Ÿ—บ Level Design
  • ๐Ÿค– Artificial Intelligence
    • ๐Ÿ‘พ ECS
    • ๐Ÿƒ Testing
    • ๐Ÿšฆ State Machines
    • ๐Ÿ“จ Events & Messaging
  • ๐ŸŽพ Physics
  • โšก๏ธ Performance
    • โœ๏ธ Reduce Draw Calls
    • ๐Ÿ“‹ Instanced Meshes
    • ๐ŸŽฑ Object Pooling
    • ๐Ÿ‘ท Web Workers
    • ๐ŸงŠ Spatial Partitioning
    • ๐Ÿ™ˆ OffscreenCanvas
    • ๐Ÿค” Network Strategy
    • ๐Ÿข HTTP Requests
    • ๐Ÿ”ป Server-Sent Events
    • ๐Ÿ‡ WebSocket
    • ๐Ÿ† WebRTC
    • ๐Ÿค Reconciliation
    • ๐Ÿญ Web Frameworks
    • ๐ŸŽฎ Game Frameworks
    • โ˜๏ธ Backend Services
    • ๐Ÿ”‘ Authentication
  • ๐ŸŒŽย Publishing
    • ๐ŸŒ PWAs
    • ๐Ÿš€ Game Platforms
    • ๐Ÿ–ฅ Desktop
    • ๐Ÿ“ฑ Mobile
    • ๐Ÿฅฝ VR
    • ๐ŸŽฎ Consoles
    • ๐Ÿ’ฐ Monetization
    • ๐Ÿ’ธ Getting Paid
    • ๐ŸŽ“ Learning
    • ๐Ÿง‘ People
    • ๐Ÿ‘ฅ Communities
    • ๐Ÿ’ก Inspiration
    • Steven Yau
    • Dek (Hordes)
    • Hendrik Mans
  • ๐Ÿ’Œ Newsletter
    • Issue 023 โ€“ New! ๐ŸŽ‰
    • Issue 022
    • Issue 021
    • Issue 020
    • Issue 019
    • Issue 018
    • Issue 017
    • Issue 016
    • Issue 015
    • Issue 014
    • Issue 013
    • Issue 012
    • Issue 011
    • Issue 010
    • Issue 009
    • Issue 008
    • Issue 007
    • Issue 006
    • Issue 005
    • Issue 004
    • Issue 003
    • Issue 002
    • Issue 001
  • โœ๏ธ Community Blog
    • A-Frame Mech Walker

๐Ÿ’Œ Check out the newsletter!

๐ŸŒˆ Postprocessing

โœ๏ธ TODO:

Three.js EffectComposer (opens in a new tab)

You can use postprocessingTypeScript2k28k/w with vanilla Three.js and optionally react-postprocessingTypeScript90018k/w for a React Three Fiber integration.

Examples of effects, such as Bloom or Outline

5 ways to draw an outline (opens in a new tab) (Unity) by Alex Ameye (opens in a new tab)

three-good-godrays (opens in a new tab)

realism-effects (opens in a new tab)

โœจ VFX & Particles๐ŸŽฌ Animations
Poki logoPoki logo
Sponsored by Poki
The market leader on Web
Written by ๐Ÿฆ Verekia
๐Ÿ˜ Mastodon โ€ข ๐Ÿ™ GitHub