Site for an ECU remap and mechanics shop in Vila Velha, Brazil
HTMLCSSJavaScriptVercelSearch Console
Hover or focus a piece: it lights up with its links.
11 pieces11 links4 areas
>Context
Modesto Performance is an ECU remap and mechanics shop in Vila Velha, Brazil. The owner, Jonatam, sent me a São Paulo tuner's site as a reference and asked for a site for his shop.
I measured the reference before starting. On Lighthouse mobile it scores 33 for performance and the page weighs 3,664 KiB. The Modesto home page, measured live on 29 October 2026 over 3 runs, scores 93 to 97 (median 96) and transfers 331 KiB on first load.
The site has an animated intro with a tachometer, a gamified gain simulator, a portfolio of 15 real cars taken from the shop's Instagram, a page that explains ECU remapping, with an FAQ, and an about page. It runs on its own domain, modestoperformance.com, with Search Console and the Google Business Profile wired up.
>High-level design
It is static too: HTML, CSS and JavaScript with no framework, served by Vercel. The first screen loads the tachometer, the intro and the cars grid. The simulator and the catalog download their scripts and the estimates table (sim.json) only when the visitor reaches them, and both read the same file, so the numbers match.
The simulator goes in steps: brand, car, version and stage. At the end it shows the estimated gain with the difference and the percentage, and opens the shop's WhatsApp with the quote message already filled in with the car and the stage. Simulated cars stay in the browser, in localStorage, and nothing goes to a server.
Measurement uses Vercel Web Analytics. The domain has robots.txt, sitemap.xml and an IndexNow key, and the remapping page, which holds the FAQ, carries FAQPage JSON-LD.
Components
Intro and tachometer :: The needle moves on events, and the idle wobble is CSS only, so it stays off the main thread.
Gain simulator :: Stepped picker (brand, car, version, stage), a short hold on the dyno and the result with difference and percentage, which turns into a WhatsApp quote.
Catalog by brand :: Every version of each brand, with search, reading the same sim.json as the simulator.
Portfolio :: 15 real cars from the shop, taken from its Instagram posts, each with a project page.
Content pages :: ECU remapping explained, with FAQ JSON-LD, and an about page.
>Trade-offs
Static site, no framework.
Alternative rejected: A front-end framework with a JavaScript bundle.
Why: The reference weighs 3,664 KiB and scores 33 on Lighthouse mobile. Without a framework, the Modesto home page transfers 331 KiB and scores 96 (median of 3 runs).
The quote closes on WhatsApp.
Alternative rejected: A form with a backend and a database.
Why: The shop already talks to customers on WhatsApp. The message arrives with the chosen car and stage, and the site stores no customer data.
The simulator and the catalog load on demand.
Alternative rejected: Load everything on the first screen.
Why: The first screen downloads only what it shows, which keeps LCP down on phones.
>Highlights
>Lighthouse mobile performance of 96 (median of 3 runs, 93 to 97); the reference the owner sent scores 33.
>331 KiB on first load, against 3,664 KiB for the reference.
>A 4-step simulator that ends in a pre-filled WhatsApp quote.
>15 real cars from the shop in the portfolio.
>Own domain with Search Console and the Google Business Profile wired up.
>Fun facts
*Before the number shows up, the simulator's result holds for a moment on the dyno.
