The Web Game Hacking Encyclopedia

Section 5: Case studies for Three.js, Canvas 2D, and WebGL web games.

Case Studies (Hypothetical / Educational)

A) Three.js Based Games

Three.js games expose scene graphs, meshes, and cameras that can be manipulated for hacks.

Mesh manipulation for wallhacks

Change the material of obstructing meshes or render boxes around enemies.

scene.traverse(object => {
  if (object.isMesh && object.name.includes('wall')) {
    object.material.transparent = true;
    object.material.opacity = 0.2;
  }
});

Camera modification

Alter camera position or clipping planes to see through walls.

B) Babylon.js / Shell Shockers

Shell Shockers is a notable Babylon.js web shooter. Babylon scenes and meshes can be hooked to expose enemy players, alter materials, and implement aim assistance.

Research workflow

Inspect the global BABYLON namespace, the loaded scene objects, and the game's render loop. Common Shell Shockers research begins by looking for BABYLON.Scene.prototype.render, mesh names, and player state stored on window.

Wallhack / ESP example

const origRender = BABYLON.Scene.prototype.render;
BABYLON.Scene.prototype.render = function() {
  this.meshes.forEach(mesh => {
    if (mesh.name.includes('player') && mesh.material) {
      mesh.material.alpha = 0.35;
      mesh.material.emissiveColor = BABYLON.Color3.Red();
    }
  });
  return origRender.apply(this, arguments);
};

Aimbot pattern

Shell Shockers hack scripts often poll visible enemies and adjust the player's view vector or shot aim toward the closest target. This pattern works in any Babylon.js shooter once the enemy list and local player are discovered.

C) Canvas 2D Games

Canvas 2D games often render with a single <canvas> element, making post-render overlays effective.

Drawing after game renders

const gameCanvas = document.querySelector('canvas');
const overlay = document.createElement('canvas');
overlay.width = gameCanvas.width;
overlay.height = gameCanvas.height;
overlay.style.position = 'absolute';
overlay.style.left = gameCanvas.offsetLeft + 'px';
overlay.style.top = gameCanvas.offsetTop + 'px';
const ctx = overlay.getContext('2d');
document.body.appendChild(overlay);

Sprite replacement

Intercept draw calls and replace enemy sprites with highlighted versions.

D) Krunker & Custom WebGL Games

Krunker is a high-profile WebGL shooter with a minified engine. Hacking it usually involves locating the player array, intercepting render frames, and patching WebGL draw calls or game update functions.

Common Krunker research hacks

Find the loaded JavaScript bundle for Krunker, map the player and camera variables, and trace the game loop using breakpoint instrumentation. A common entry point is the rendering or input update functions that process enemy positions.

No-recoil / fast-fire pattern

Krunker scripts often override the weapon fire handler or input processing to remove recoil and enable faster shot timing. This can be implemented by patching the firing function or by setting the local player's recoil state to zero.

E) Kirka / Phaser-Style Games

Kirka-like games often use Phaser, PIXI, or simple canvas engines. These games are researched by finding the main game scene, reading sprite groups, and patching the object update loop.

Phaser research example

Look for game.scene.scenes and enemy groups such as enemies.getChildren(). Once discovered, you can overlay enemy positions or freeze enemy behavior.

Radar / overlay example

const enemies = game.scene.scenes[0].enemies?.getChildren() || [];
enemies.forEach(enemy => {
  if (enemy.active) {
    enemy.tint = 0xff0000;
  }
});

F) WebGL Games

WebGL games can be vulnerable to shader and uniform hijacking.

Uniform / attribute hijacking

Override WebGL methods like uniformMatrix4fv or drawElements to capture positions or alter rendering state.

Shader injection

Modify fragment or vertex shader source to highlight enemy objects or remove fog.

TL;DR

  • This page uses example scenarios to show how these ideas appear in real game engines and frameworks.
  • It highlights Three.js, Babylon.js, Canvas 2D, WebGL, and other browser-game styles.
  • The examples are meant to make the theory easier to picture in practice.