
Project Oracle: A Streaming Render Framework for the front end
I conceived a new streaming render architecture to replace our five year old Next.js foundation. The framework proved to be 7× faster TTFB and 3.4× faster hydration than legacy, making our search page the fastest in the category, ahead of every competitor, and it lifted search engagement and lead submissions by double digits.
2026 · Principal Engineer · Conceived the idea, built the prototype, and mentored the lead who delivered it
Our search and listing detail pages are Realtor.com's two highest-traffic, highest-revenue surfaces, and both were still running on a roughly five year old Next.js 12 foundation. Years of incremental upgrades had failed to remove the structural bottlenecks, and roll-forwards kept getting rolled back after performance regressions tied to abstraction and JavaScript bloat. I conceived Project Oracle as a new streaming render platform and built a prototype that proved the path: 97% faster TTFB and 88% faster FCP against production. My mentee Jay Ellul then led and built the production platform behind feature flags, and we rolled it out incrementally with full parity tracking and rollback readiness. Oracle drove double digit gains in search engagement and lead submissions.
01Context & StakesRead moreHide
Our search and listing detail pages are Realtor.com's two most critical traffic and revenue surfaces, and both were still running on a roughly five year old Next.js 12 foundation.
Those pages had grown slow and bloated, and the sluggish performance was directly dragging on core business metrics. Benchmarked against our two largest competitors, Zillow and Homes.com, we had the slowest search page of the three. Yet performance had never been an organizational priority, and no one owned fixing it.
Prior upgrade attempts had already exposed the core problem. Incremental fixes were not removing the structural bottlenecks, and roll-forwards kept getting rolled back after performance regressions tied to abstraction and JavaScript bloat.
So the case for Oracle was never just "modernize the stack." It was to close the performance gap to competitors, move revenue-sensitive speed metrics, and build a frontend platform that is cheaper and easier to evolve.
02Problem → InsightRead moreHide
Before writing a line of the prototype, I mapped each problem to the architectural insight it pointed toward.
| Problem | Insight |
|---|---|
| The legacy search page blocked on multiple API calls before the browser saw a single byte, and with some exceeding 700ms, that upstream latency was a hard constraint outside our control. | Rather than wait on calls we could not speed up, Oracle streams useful HTML early and fetches data in parallel, designing around the constraint instead of blocking on the full page payload. |
| Hydration and client JavaScript had grown too heavy, around 2.6s on average and over 4s at the 90th percentile. | The fix had to be structural: less JavaScript, less runtime work, and less reliance on the browser recovering on the main thread after load. |
| Ads, tracking, and third-party code were loading in the same critical path as core content. | Faster first paint and earlier hydration were monetization wins too, moving ad and tracking readiness earlier in the session. |
| Styled-components and fragmented frontend patterns created both runtime overhead and organizational drag. | Oracle needed a paved-path stack: one framework direction, one state approach, one styling direction, and real governance over bundle growth. |
| A straight Next.js upgrade would have meant heavy investment while deepening framework lock in. | If we had to do a major rewrite anyway, it should land on a more flexible architecture with better long-term control over performance and hosting cost. |
03The PrototypeRead moreHide
This was not an assigned project. I saw the problem and the opportunity myself, and rather than wait for a mandate, I built a prototype with another developer, Victor Cho, to prove the approach out, then used the results to push leadership to invest.
That prototype was the proof that made Oracle credible. Built in under a month and brought to roughly 80% parity with production, it demonstrated that our performance theories were not hypothetical.
It also gave us a practical benchmark for the shape of the future app. The results were strong enough to change the conversation.
| Metric | Improvement vs production |
|---|---|
| TTFB | 97% faster |
| FCP | 88% faster |
| LCP | 24% faster |
| Signal | Production | Prototype |
|---|---|---|
| Ads appear | ~4.5s | 1.4s |
| Tracking fires | ~5.4s | 1.1s |
| Hydration | ~2s | ~700ms |
The prototype was not Oracle itself. It was the forcing function that proved a rebuilt search page could be materially faster, commercially interesting, and worth turning into a full platform bet.
"The prototype proved the performance theories were not hypothetical."
04Approach & ExecutionRead moreHide
Oracle's core strategic choice was to rebuild the search page from the ground up rather than keep stacking patches on the old app. We delivered it with a small team of just three engineers, and the execution was deliberately staged.
- Earn trust first. Started with an IPR to build trust and shared understanding with the engineers who would have to adopt the platform, and to align on the future stack and paved paths before any code was written.
- Build fast. We set a two month delivery target. I pushed the team to lean on Claude religiously and worked with them on workflows that shipped fast without sacrificing quality: we define the structure and standards in code, then have Claude mimic them.
- Roll out incrementally. Use traffic split routing so we could compare Oracle and legacy traffic and roll back without a redeploy.
05Design & Technical DetailsRead moreHide
Every layer of Oracle was chosen for performance, governance, and long-term control.
| Layer | Oracle choice | Why it mattered |
|---|---|---|
| Framework | React Router 7 with Vite and React 19. | Gave us streaming SSR and far more direct control without deeper vendor lock in. Everything was added modularly, so any piece could be swapped out later. |
| Rendering | Custom SSR with streaming. | Let Oracle send a lightweight shell early, overlap rendering with data fetches, and cut TTFB by roughly 200 to 300ms when designed well. |
| Styling | PandaCSS, a build-time, atomic-first CSS-in-TS approach. | Cut runtime styling cost, enforced design-token governance, and was the lowest-friction migration off styled-components. |
| State | Zustand. | One lightweight, predictable state model to replace the fragmented mix of Context, Redux, and one-off patterns scattered across apps. |
A less obvious highlight is that Oracle was built to preserve room for what comes next: shared adoption across verticals, React Native or hybrid integration, and broader platform simplification across Consumer Web.
06ImpactRead moreHide
| Metric | Legacy RDC | Zillow | Homes.com | Oracle |
|---|---|---|---|---|
| TTFB | 1100 ms | 900 ms | 320 ms | 158 ms |
| LCP | 1.8 s | 2.0 s | 1.4 s | 1.2 s |
| Hydration | 2.6 s | 2.2 s | 1.6 s | 760 ms |
| INP | 250 ms | 130 ms | 140 ms | < 150 ms |
| JS Bundle Size Avg | 1.0 MB | 120 KB | 250 KB | 200 KB |
The headline is simple. Oracle was designed to win decisively on speed against the legacy search page, and to be at least competitive, and better on several metrics, than every major peer.
Oracle's business case was tied directly to page speed. Internal FY26 analysis had already shown that a 100ms TTFB improvement correlated with roughly +1.3% eCPM, and other site-speed experiments showed positive movement in page views, engagement, and lead submissions whenever pages got faster or lighter.
The honest story was mixed.
- In rollout, Oracle showed clear top-of-funnel and search engagement gains: for-sale page views per user +2.44%, search page views per user +4.30%, search map page views per user +8.41%, searches per user +12.08%, and search lead submission rate +10.17%.
- It showed downstream pressure: listing-page views per user -1.75% and listing-page lead submission rate -3.24%, though not statistically significant.
- We expected that migrating the listing detail page to Oracle next would relieve the downstream signals we saw on it after the update.
07Leadership & WinsRead moreHide
Oracle was never pitched as a dependency upgrade. I positioned it as a deliberate bet on speed, revenue, and frontend standardization, and backed it with a formal review to win alignment and resourcing.
The work was carried by a small, named team. I conceived the idea and the framework and built the prototype; my mentee Jay Ellul led and built the production platform, with leadership backing from Francisco Martinez.
We treated rollout discipline as part of the product itself. Feature flags, New Relic, Amplitude comparisons, parity tracking, and rollback readiness were all in the plan from the start.
Oracle also advanced more than page speed. It forced alignment on ad parity, design-system migration, governance, and shared engineering conventions that will outlast the search page itself.
08Risks & MitigationsRead moreHide
| Risk | How it showed up | Mitigation |
|---|---|---|
| Big-bang rewrite risk | Oracle was a full architectural rewrite of a tier-1 surface, so regressions were likely if rollout moved too fast. | Phased exposure, feature flags, observability, and clear rollback paths instead of a single cutover. |
| Feature parity drift | Oracle had to match production behavior while production kept evolving. | A living parity tracker, plus freeze and ramp discipline during rollout windows. |
| Metric and tracking distortion | Early readouts were confounded by split contamination, legacy entry points, and missing auth funnel events. | We cleaned the comparison population, fixed the auth event gaps, and re-read performance only once instrumentation was trustworthy. |
| SEO and crawl regressions | Exposure surfaced broken GLP redirects, bad schema caching, crawl spikes from rendered filter links, and bot traffic leaking to frontdoor. | Removed the redirect-breaking condition, added nofollow, restored SEO behavior, and planned an SSR mode for bots that strips JS asset links and keeps API calls server side. |
| Ad revenue regression | Oracle could not replace the legacy search page if ad slots, targeting, and native units behaved differently. | A dedicated ads workstream tracked ad-slot parity, native and sponsored unit parity, click and impression correctness, with "no ad revenue regression" as the definition of done. |
09Aftermath & LessonsRead moreHide
Oracle proved that the old search-page performance ceiling was real, and that structural frontend change could move the needle in a way incremental cleanup never could.
It also reframed performance itself. What the company had treated as an engineering detail turned out to be a growth lever, lifting real engagement and lead submissions once the pages got faster.
The deeper lesson is that performance is not just Core Web Vitals or a dashboard of metrics. It is how a consumer actually experiences the page: how responsive and effortless it feels, the intangibles that numbers never fully capture.
The rollout discipline was a real win. The Oracle team found problems at 1% and 5%, corrected them, and kept moving, instead of forcing a full launch on schedule and absorbing uncontrolled damage.
10CreditsRead moreHide
Concept & framework: Austin Spaeth
Prototype build: Austin Spaeth & Victor Cho
Engineering lead: Jay Ellul, who led and built the production platform
Engineering: Steve Matchett, Antoine Simard, Steve Lipsitz, Joyce Leung, Siri Gore
Leadership: Francisco Martinez
Oracle was carried by a small, focused team. Special thanks to everyone who shipped it.
Speed isn't an engineering metric. It's a growth lever.