Back
ML Infra, Classifiers & RL

A Browser-Native Neural Network Simulation That Learns to Drive From Experience

How Pfactorial Technologies built a dependency-free JavaScript simulation where AI-controlled cars learn to navigate a road and avoid traffic through mutation-driven neural network training.

August 21, 2026
Share
ENGAGEMENT SNAPSHOT

Pfactorial_Case_Study_CarSim image 1
Figure 1 - Key figures from this engagement, at a glance.
EXECUTIVE SUMMARY
Our client wanted to explore how a car might learn to navigate a road and avoid obstacles from experience rather than hard-coded rules - a way to prototype and teach AI-driven vehicle control concepts without the cost or turnaround of real-world testing or heavy simulation infrastructure.
A naive approach doesn't hold up here: hand-coding driving logic for every obstacle configuration doesn't generalize, and standing up a full physics engine or an ML framework is heavy overhead for a use case that needs to run instantly, anywhere, with no install step - the environment had to be a browser tab, not a lab setup.
Pfactorial built a self-contained car simulation in vanilla JavaScript, where a hand-rolled feed-forward neural network - fed by ray-cast sensor readings - learns to drive through mutation-based iteration, with dummy traffic providing obstacles and a live visualizer exposing the network's decision-making as it evolves.
Why this engagement is representative This engagement demonstrates Pfactorial's ability to build lightweight, dependency-free machine-learning demonstrators - implementing the learning algorithm itself rather than wiring together an existing framework - when the goal is an accessible teaching or prototyping tool rather than a production model.
THE CHALLENGE
Building a car that learns to drive from experience, entirely inside a browser tab, meant solving problems that a rule-based script or an off-the-shelf ML framework wouldn't have to.

1. Real-world and heavy-simulation testing is too slow to iterate on

A browser-native environment was needed so driving behavior could be observed and refined in seconds, not by standing up external simulation or vehicle infrastructure.

2. Sensor-based decisions have to be learned, not scripted

Hand-coding a response for every possible obstacle configuration doesn't generalize; the car's steering and acceleration needed to come from a model that improves with exposure, not an ever-growing rule list.

3. The whole system had to run with zero external ML infrastructure

No TensorFlow.js, no server-side training job - the neural network itself had to be implemented in plain JavaScript so the simulation stays a single dependency-free artifact.

4. Learners need realistic traffic to learn against

AI cars can't just avoid a static wall; dummy cars with fixed behavior had to act as moving obstacles so avoidance behavior generalizes beyond the training track's geometry.
The real brief Not "script a car that follows the road" but "build an environment where driving behavior is learned through iteration and is visibly, legibly, improving."
THE SOLUTION
Pfactorial built a browser-native simulation in which a hand-rolled feed-forward neural network, informed by ray-cast sensors, learns to drive through mutation-based iteration against a mix of AI and dummy traffic.
Pfactorial_Case_Study_CarSim image 2
Figure 1 - Sensor readings feed the network each frame; mutation, not gradient descent, is what improves it run over run.

Architectural principles

  • Sensors as the network's only interface to the world - Decisions are made from a fixed set of ray-cast readings, not raw pixels or global state, keeping the model small enough to mutate and evaluate every frame.
  • Mutation-driven learning instead of backpropagation - The network learns by random perturbation rather than gradient descent, which needs no labeled "correct" driving data - there isn't any to begin with.
  • Dummy and AI cars share one physics and collision model - createPolygon() and assessDamage() apply identically to every car regardless of control type, so an AI car's obstacle avoidance is trained against the exact physics it has to survive.
  • Visualized as it learns - visualizer.js renders the network's structure live, keeping the learning process interpretable rather than a black box.
CAPABILITIES DELIVERED
Each capability was built to make the learning process both functional and observable.
CAPABILITY
WHAT IT DOES
Neural-network-driven steering
network.js feeds sensor readings forward to decide acceleration and turning for each AI car.
Ray-cast sensing
sensor.js casts a configurable spread of rays and measures the nearest intersection with road borders or traffic.
Collision-aware physics
car.js builds a per-car polygon each frame and checks it against road borders and other vehicles.
Mixed AI and dummy traffic
Dummy cars with fixed control act purely as obstacles, giving AI cars a moving environment to learn against.
Manual keyboard control mode
controls.js supports human keyboard driving alongside AI or dummy control, useful for comparison and debugging.
Live network visualization
visualizer.js renders the evolving neural network structure during simulation, alongside the cars themselves.
Pfactorial_Case_Study_CarSim image 3
Figure 2 - The same loop - perceive, decide, improve - runs for every AI car in the simulation.
Design note Mutation-based learning was chosen over reinforcement learning or backpropagation deliberately - it needs no labeled data or reward function, which suits a lightweight demonstrator, but it's flagged directly, alongside realistic physics and richer traffic scenarios, as the first thing to revisit if this moves from a teaching tool toward a production-grade driving model.
ENGINEERING FOR SCALE AND RELIABILITY
Five decisions kept the simulation dependency-free and fast to iterate on.

Vanilla JavaScript over a machine-learning framework

The entire simulation, including the neural network, is dependency-free and runs directly in a browser canvas, at the cost of the tooling a framework like TensorFlow.js would provide.

Ray-cast sensor input over raw pixel or camera input

Fixed-length distance readings keep the network small enough to mutate and evaluate every frame, trading perceptual richness for trainability.

Mutation-driven evolution over backpropagation

Learning works without labeled "correct" driving data or a reward function, at the acknowledged cost of the sample efficiency reinforcement learning would offer - flagged directly as a future-work path.

Simplified 2D physics over a full physics engine

Acceleration, friction, and turning are modeled directly in car.js rather than pulled from an external engine, keeping the simulation lightweight and deterministic for fast iteration.

One shared collision model for AI and dummy traffic

assessDamage() and createPolygon() run identically for every car regardless of control type, so an AI car's obstacle avoidance is validated against the exact physics it needs to survive.
DELIVERY APPROACH
The simulation was built from the ground up, road and physics first, learning and visualization last.
1. Road & rendering foundation - establishing road.js and the index.html/main.js canvas render and animation loop, with multi-lane road geometry.
2. Car physics & controls - building car.js and controls.js - movement, acceleration, friction, turning, and both keyboard and dummy control types.
3. Sensing layer - implementing sensor.js for configurable ray-casting against road borders and traffic.
4. Neural network core - implementing network.js - feed-forward evaluation and mutation-based weight and bias adjustment.
5. Collision detection - wiring createPolygon() and assessDamage() so both AI and dummy cars share one damage model.
6. Visualization layer - building visualizer.js to render the network's structure live alongside the running simulation.
RESULTS AND IMPACT

Pfactorial_Case_Study_CarSim image 4
- Key outcomes from this engagement.
Across simulation runs, the AI-controlled cars visibly improve at staying on the road and avoiding both static obstacles and dummy traffic - evidence that a mutation-driven neural network can learn usable driving behavior without labeled training data or a reward function.
Because the simulation is dependency-free vanilla JavaScript running entirely on an HTML canvas, it doubles as an accessible teaching and prototyping tool: the live network visualization makes the model's decision-making legible rather than a black box, and the codebase is small enough to serve as a starting point for further experimentation with sensor design or learning algorithms.

What it enabled commercially

Delivered as a self-contained browser artifact rather than a research notebook, the simulation gives the client a reusable, zero-infrastructure environment for demonstrating and iterating on autonomous-vehicle control concepts - a foundation to evaluate more sophisticated learning approaches, such as reinforcement learning or realistic physics, before investing in them.
WHY PFACTORIAL
This engagement reflects Pfactorial's applied AI/ML engineering practice - building learning systems from first principles when a framework would be overkill, and making the model's behavior visible and explainable rather than shipping a black box.
Pfactorial_Case_Study_CarSim image 5
- Service lines this engagement draws on.
Engagement enquiries Pfactorial Technologies works with organisations that need a working, explainable machine-learning demonstrator - for training, prototyping, or evaluating an approach before committing to production infrastructure. If you're scoping an AI/ML proof-of-concept, we're happy to talk through what's realistic to build and in what timeframe. · pfactorial.ai
APPENDIX A - TECHNOLOGY STACK
The technology stack underpinning the system, grouped by the layer it serves.
Pfactorial_Case_Study_CarSim image 6

Result and Analysis

ENGAGEMENT SNAPSHOT

How Pfactorial Technologies built a dependency-free JavaScript simulation where AI-controlled cars learn to navigate a road and avoid traffic through mutation-driven neural network training.

Pfactorial_Case_Study_CarSim image 1
Pfactorial_Case_Study_CarSim image 2
Pfactorial_Case_Study_CarSim image 3
Pfactorial_Case_Study_CarSim image 4
Pfactorial_Case_Study_CarSim image 5
Pfactorial_Case_Study_CarSim image 6