Pong: The Favicon Edition

A complete iteration of the classic game Pong is currently executing within the icon of this browser tab.

This is not a standard web page game. Instead, the action happens entirely in the favicon.

🕹️ How to Play

To interact with the game, follow these instructions:

• Movement: Use your mouse or trackpad to scroll up and down, which controls the position of your paddle.
• Tracking: The current score is displayed dynamically within the browser tab title.

Feature	Location
Game Visuals	Tab Favicon
Scoreboard	Tab Title
Input Method	Page Scrolling

🛠️ Technical Overview

The game logic follows a basic loop where the score $S$ increases based on the condition: $S_{new} = S_{old} + 1$

Implementation Details

The core functionality relies on updating the href of the link element with the ID favicon. For example: document.querySelector("link[rel='icon']").href = canvas.toDataURL();

// Conceptual core loop
function gameLoop() {
  updateBall();
  updatePaddle(scrollPosition);
  drawFavicon();
  updateTitle(score);
  requestAnimationFrame(gameLoop);
}

📋 Checklist & Resources

• Look up at your browser tab to see the game in action.
• Try scrolling to move the paddle.
• Review the Core code.
• Run the Self-tests (which execute live in your browser).