Draft Blog Post

VisualPDE: Partial differential equations solved live in your browser

Partial differential equations (PDEs) are the basis of a huge array of topics in theoretical and applied science, from quantum mechanics to designing airplanes. PDEs describe heat transport, fluid dynamics, population invasion, and a huge number of other physical, biological, and even sociological processes, as well as being core tools in geometry, topology, and more. However, the vast majority of PDEs do not admit closed-form analytical solutions, despite the emphasis on such solutions in undergraduate degrees. In many applications, especially in science and engineering, these equations are solved computationally, typically requiring sophisticated programming and a deep understanding of numerical methods. This is a significant barrier to entry, meaning that the solutions of a PDE – the reason we wrote it down in the first place – can be hard to understand intuitively.

Recent advancements in browser technology and graphics hardware, however, have changed the landscape (and we’re not talking about AI). In 2023, we launched VisualPDE.com, a browser-based instant solver and visualiser for a range of PDE systems you can input yourself, with as few barriers to entry as possible. Initially intended for teaching, the tool was quickly adopted for research and science communication outside of academia. To date, the website has had enormous success in teaching, research, and public outreach, evidenced by over 80,000 unique users and 250,000 simulations from 172 countries (Google Analytics data). Links to the site, or downloaded visualisations, are included in over 35 published research papers written across a range of different fields of science, with authors from more than 10 countries.

Below is an interactive example of a cyclic competition system (with one of three interacting species plotted) that spontaneously forms spiral wave chaos. You can click to perturb the solution locally in space. Pausing the simulation then lets you “paint” an initial condition. Clicking “VisualPDE” in the bottom left of the simulation also opens that simulation in a new, full-screen page.

What can you solve?

VisualPDE solves systems of PDEs in 1D or 2D space, originally focusing on time-dependent (parabolic) problems of reaction-diffusion type with at most second-order in space derivatives. By using algebraic variables and small timescales, a much larger class of examples including elliptic and hyperbolic models can also be approximated in real time. A complete description of the class of systems solvable in VisualPDE is given on this page. As an example, below we see a passive scalar in a 2D Navier–Stokes simulation (using a vorticity formulation). The buttons on the let you pause or restart the simulation, or change what field is being plotted (the three ‘layers’ at the bottom). This lets you see the vorticity or kinetic energy, for example, and how these are sheared in this particular setup. You can also ‘click’ to introduce some local vorticity via a perturbation.

By default the domain is your device screen (your computer, your phone, your TV, etc.) but you can switch to other shapes by using indicator functions, or uploading a picture. While the interface is intended to be simple, one can modify the spatial discretisation and timestepping, alongside many other aspects of the simulation and its display. You can even make simulations where the user can change the domain itself; below is an example of wave propagation where clicking introduces obstacles, allowing you to observe reflection of waves from obstacles in real-time.

You can see 60 pre-made examples on our explore gallery, from spatial mathematical biology and fluid dynamics, to solitons and image processing PDEs. But the real power is in you being able to enter the system you’re most interested in. There is a short video guide to creating your own systems, and complete documentation of all features on the website. Play around and, if you’d like help, get in touch.

PDEs on GPUs

The great advancement in scientific computing of recent years has been to give graphics cards more to do. VisualPDE takes advantage of this by treating device screens as the pixel grids they are, and then performing finite difference methods on them. This is done through Javascript, a WebGL library and a low-level shader language called GLSL so that you can type equations into the browser, have them interpreted instantly, and then have them solved directly on the device. Contrast this to how we normally have to solve such problems: code up the domain in Python or MATLAB, write the numerical integration and timestepping schemes, then write the code to make videos. Then run the code a number of times for all the parameters you want. VisualPDE dramatically reduces the barrier to entry to just start exploring, providing a real-time exploration of how a system responds to changes in parameters, initial and boundary data.

There are some trade-offs in this approach: for implementation reasons, and to ensure consistent real-time visualisation, VisualPDE relies solely on explicit timestepping schemes with a fixed timestep. We can get away with this to a degree due to the speed of GPUs, though this also comes with the disadvantage that WebGL only supports single-precision arithmetic. Despite these limitations, our experience has been that one can gain a huge amount of real insight into rather complicated PDE systems.

Learning PDEs through play

The seed of VisualPDE came from teaching reaction–diffusion models to undergraduate students of mathematical biology. Very often we teach analytic methods – separation of variables, eigenfunctions – which our students become proficient at but without deep intuition for what these models predict. But our students are used to playing with functions and shapes from their pre-university education: tools like Desmos and Geogebra are great at seeing, for example, the consequence of a quadratic function losing real roots.

With VisualPDE, we’ve been able to let our students play with PDE models directly. They can change parameters and boundary conditions live and see that patterns emerge or die out: bifurcations are now conceptually clearer when they can be demonstrated by perturbing a system directly. They can quickly scan a region of parameter space and see where interesting behaviour might lie. They can change domains completely and see that (maybe) Bessel functions aren’t so scary after all. As a somewhat nontrivial example of this, below is a simulation of a localised pattern in the Swift-Hohenberg equation which is linearly stable simultaneously with a stable uniform state [2]. Poking at the screen away from the patterned region perturbs the solution, but these perturbations decay exponentially back to the uniform state, unless you hold and click which perturbs the system enough to locally form a stable pattern.

Getting involved

VisualPDE is open source and you can find the details on GitHub, but what we’d love for you to do is to create a simulation and embed it wherever you need to show off a PDE model live. This should be great for academics and industrial partners. Websites and Google Slides are great venues. If you don’t want the interactivity, you can easily export a video or a screenshot.

Start by picking from 60 models in our explore gallery, or watch a six-minute video to create your own from scratch. The first time you use VisualPDE, there’s a little tour you can take that shows you where you can find the useful tools, and a ‘?’ button on the right of any simulation allows you to get help anytime.

We’re really keen to hear from users, so let us know if you have any questions or have used VisualPDE in a fun way. We’d love to make VisualPDE better, and would love for you to help us do that with your feedback.