Tech stack
The technologies that power RobinPad, and the architectural decisions that keep it fast.
Local-first, on purpose
The goal of RobinPad is to provide a tool that runs entirely locally. The server doesn't process any of your activity within the drawing tool; everything stays on your computer and in your browser. With no registration required, you retain full ownership of your content and total control over how you manage it.
These are the primary reasons I chose this specific tech stack, it allows me to build, understand, and refine the tool using the technologies I know best.
What's under the hood
The workspace (the painting app):
- HTML, CSS, vanilla JavaScript: no build step, no bundler, no framework.
- HTML Canvas: the drawing engine. Where the brush stamps land.
- IndexedDB + Dexie.js: local storage. Projects, layers, brushes, settings.
- Alpine.js: small reactivity layer for the side panels.
This site (the one you're reading):
- Grav CMS: flat-file PHP CMS. Powers the public site, the admin, and the routing.
- Forum Pro: community plugin. Runs the
/forumsection. - Patreon OAuth: single sign-on for the forum. No password database.
- Tabler Icons: the icon set you see across the UI.
- Source Code Pro + Cherry Swash: the two typefaces from Google Fonts.
- Open-source textures from Unsplash, Pexels, Textureboy. Paper, wood, panel.
Analytics: two counters, and no Google Analytics
RobinPad runs two privacy-friendly analytics systems across the whole site: GoatCounter and Umami. This page, every other page on robinpad.com, and the drawing app all report to both. There is no Google Analytics and no advertising tracker anywhere.
They are running side by side on purpose, for now: we want to see which one gives us the clearest picture, and then keep just that one. Either way, both store nothing in your browser: no cookies, no fingerprinting, and no tracking across sites. A pageview sends the page path, the referrer, your browser name, and a partial IP address that is either hashed (GoatCounter, thrown away within 24 hours) or shortened (Umami, used only to work out a country).
The practical consequence is the part I care about: there is no cookie banner on this site, and you are never asked to agree to being tracked. A conventional analytics tool would have meant a consent dialog in the way of every page before you could read it, including this one. Picking tools that make the dialog unnecessary was worth giving up the more familiar dashboards.
The whole thing is spelled out in the Privacy Policy (§4 and §5).
The drawing experience
-
Loads only what you need: Instead of loading the entire app at once, RobinPad only brings in menus and tools when you actually open them. This means the app starts up almost instantly.
-
One page at a time: Even if your notebook has multiple pages, RobinPad only focuses on the page in front of you. The other pages rest quietly in the background without eating up your device’s memory.
-
Smart brush strokes: Rather than drawing basic computer lines, RobinPad uses a "stamping" system. It presses brush textures onto the canvas thousands of times a second based on how hard you push your stylus. Because brush behaviors are saved as simple, editable settings, tweaking or creating your own custom brushes is effortless.
-
Instant feedback with smart storage: When you lift your pen, your stroke appears immediately on screen. Right after that, a quiet background process compresses the drawing into a lightweight format, saving storage space without slowing down your painting.
-
Effortless zoom and rotation: When you move, rotate, or zoom in on your canvas, RobinPad uses your device’s graphics chip to glide the entire view smoothly, ensuring your strokes stay perfectly in place without stuttering.
Other tools I've used
- Obsidian: Note taking, text content and general management.
- DeepL: Helping me with english corrections.
- Figma: UI design and vector ojects.
- Affinity: For texture adjustments and brushes creation.
- Helium Browser: The main browser for testing the tool.