FuncLab — Advanced Function Graphing & Analysis Platform preview 1

Key Features & Highlights

Multi-Mode Graphing — Plot 2D Cartesian, Parametric, Polar, Implicit curves, 3D Surfaces, and labelled coordinate points with pan, zoom, tracing, and high-res image export.

Safe Math Evaluation Engine — Engineered an AST-level validated parser on Math.js that eliminates arbitrary execution risks (no eval/new Function) and protects against resource exhaustion.

Dynamic Variables & Function Chaining — Support for interconnected functions (e.g. g(x) = f(x) + 2) with reactive slider controls and dependency graph evaluation.

Scientific Numerical Analysis — Tools for computing symbolic and numerical derivatives, definite integrals, root finding, extrema detection, limit approximations, and descriptive statistics.

Interactive Value Tables — Generate configurable multi-function tables with custom steps, sorting, curve point inspection, and CSV export capabilities.

Workspace State & Privacy — Client-side state architecture with Zod schema validation, multi-workspace switching, and seamless JSON import/export without requiring accounts or cloud databases.

Technologies & Architecture

Next.js 16React 19TypeScriptTailwind CSS v4Plotly.jsMath.jsZodVitestReact Testing LibraryLucide ReactAST Validation EngineClient-Side Numerical Analysis

View Source Code

FuncLab — Advanced Function Graphing & Analysis Platform

Live Demo

About Project

A privacy-first mathematical computing workspace and multi-dimensional graphing platform designed to combine function authoring, real-time plotting, value tables, and numerical analysis in a unified web interface.

Built with Next.js 16, React 19, TypeScript, Plotly.js, and Math.js, the application features an AST-validated safe mathematical evaluation engine with cross-function dependency resolution, interactive 2D/3D surface visualization, numerical calculus tools (differentiation, definite integration, root finding, extrema, and limits), and tab-session workspace management with JSON export/import.

Application Architecture & Math Engine

I designed and developed FuncLab as an interactive mathematical laboratory running entirely in the browser. A major challenge in browser-based math tools is safely evaluating arbitrary mathematical expressions without opening security vulnerabilities. To solve this, I built an AST-level validation layer on top of Math.js that blocks dangerous globals, assignment expressions, property accessors, and prototype pollution, guaranteeing that expressions execute purely as safe mathematical evaluations.

The engine also implements a dependency resolution pipeline for workspace functions. Users can define functions that reference other functions in the workspace, with the engine building an execution graph that recomputes downstream functions and variable sliders reactively.

Multi-Dimensional Graphing & Numerical Tools

The visualization layer is powered by Plotly.js, wrapped in responsive React components supporting 2D curves, polar coordinates, parametric trajectories, and WebGL-accelerated 3D surfaces. I implemented adaptive sampling algorithms to generate smooth curves across diverse domain scales while gracefully handling discontinuities and asymptotes.

In addition to graphing, I engineered an integrated numerical analysis suite that includes finite-difference differentiation, definite numerical integration (Simpson's rule and adaptive quadrature), root finding (Bisection/Newton-Raphson), local extrema detection, limit estimation, unit conversion, and descriptive statistics.

What I Learned

Through this project, I deepened my knowledge in AST parsing, secure expression evaluation, numerical computing algorithms, and complex state synchronization across canvas and charting components in React 19 and Next.js 16. I also honed my skills in writing rigorous test suites using Vitest and React Testing Library, designing intuitive scientific user interfaces with Tailwind CSS, and architecting privacy-first, client-side web applications.