734: Web Performance with Ben Schwarz

The podcast discusses web performance, focusing on the poor user experience of airline websites despite their high-stakes nature. These sites often fail Core Web Vitals, particularly on mobile, with issues like slow loading, layout shifts, and unresponsive interactions - even among top-ranked airlines by service quality. A study of 111 airlines found that 95% failed Core Web Vitals on mobile, highlighting a disconnect between brand reputation and digital performance.

The discussion emphasizes the limitations of synthetic testing tools like Lighthouse, which provide controlled snapshots but miss real-world variability. Real User Monitoring (RUM) and Chrome UX Report (CrUX) data offer more accurate insights by capturing performance across diverse devices and network conditions. The conversation advocates for prioritizing real user metrics over vanity scores, implementing incremental improvements, and leveraging native browser features instead of bloated JavaScript frameworks to enhance speed, accessibility, and overall user experience.

• What if you audited your SaaS app's real-user performance during critical flows like checkout or onboarding?

  • Move: Use free-tier Real User Monitoring (RUM) tools (e.g., Calibre, SpeedCurve, or even Google's CrUX via BigQuery) to capture Core Web Vitals (LCP, INP, CLS) specifically from your conversion funnel pages. Export session recordings for the slowest 5% of interactions.
  • Why Now?: Most solo developers rely only on Lighthouse scores, which miss real-world bottlenecks - especially post-load interactivity delays that kill conversions. With INP now a stable metric, identifying these issues is urgent before Google's ranking updates fully roll out.
  • Expected Upside: Fixing just one high-impact interaction (e.g., a laggy calendar picker in booking flow) could improve conversion rates by 10 - 30%, directly increasing MRR without new marketing spend.

• What if you replaced a single bloated JavaScript component in your app with a native browser alternative?

  • Move: Audit your UI for custom implementations of elements like dropdowns, modals, or accordions. Replace one instance with the <details> and <summary> HTML element or a native <select>, removing associated JS/CSS dependencies.
  • Why Now?: Heavy third-party UI libraries often add 100s of KBs of unused code. As mobile traffic grows and users access apps on slower networks (e.g., travelers at airports), reducing JS execution time has immediate UX impact.
  • Expected Upside: Cutting unnecessary JavaScript improves INP scores, reduces layout shifts, and speeds up page interactivity - leading to better retention and lower bounce rates, especially on mid-tier devices.

• What if you prioritized performance fixes based on actual user impact instead of vanity metrics?

  • Move: Export RUM or synthetic test data showing top 5 pages with worst UX ratings (e.g., poor INP or high CLS). Sort them not by score but by monthly unique visitors. Pick the highest-traffic page with failing Core Web Vitals and implement one fix (e.g., preloading a late-discovered LCP image or reserving space for dynamic content).
  • Why Now?: Many indie hackers obsess over perfect Lighthouse scores while ignoring pages that affect thousands of real users. Tools now make it easy to correlate performance with business outcomes - use that advantage before competitors do.
  • Expected Upside: Targeting high-traffic, low-performance pages can yield measurable improvements in engagement and conversions within weeks, proving ROI and building momentum for further optimization.

• Audit and replace custom UI components with native HTML elements (e.g., <details>, <dialog>) to reduce JavaScript bloat and improve accessibility, performance, and maintainability.
• Implement real-user monitoring (RUM) for at least one high-conversion page to gather actual performance data across devices and networks, prioritizing fixes based on user impact.
• Run a Lighthouse audit on core user journeys (e.g., checkout or booking flows), then focus on fixing specific issues like LCP delays or layout shifts instead of chasing score improvements.
• Replace misleading skeleton loaders with spinners or accurately sized placeholders to prevent cumulative layout shifts and improve perceived responsiveness.
• Conduct an A/B test on a single performance-driven change (e.g., deferring non-critical JavaScript) to measure its impact on conversion or engagement, using results to justify further optimization work.