Syntax - Tasty Web Development Treats
Syntax - Tasty Web Development Treats

796: Do We Need JS Frameworks × Are You Over-Engineering? × Webview vs Native

Scott and Wes tackle a variety of audience questions, from the nuances of over-engineering to the energy consumption of AI LLMs. They also discuss the pros and cons of monorepos, frameworks, and the ever-important question: Do you really need to learn all the developer tooling? Show Notes 00:00 Welc

Featured Speakers

Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers Host

Topics Discussed

Episode Summary

Executive Summary: This Syntax potluck episode covered practical frontend engineering tradeoffs: why the show still uses Google Forms, how to spot and avoid overengineering, when webview-based mobile apps can rival native apps, monorepo setup advice, AI energy use compared with web serving, why frameworks still matter, how to survive ad blockers, and how to progressively enhance apps so they work with or without JavaScript. It closed with community advice and two “sick picks.”

Main Topics: Why Google Forms are still used for potluck questions: The hosts explain that Google Forms were originally chosen because the site had no database, making a simple external form the easiest solution. Now that the site does have a database, they agree the intake flow could be rebuilt to support search, filtering, tagging, voting, and even AI-assisted categorization. Overengineering vs. useful abstraction: They define overengineering as adding unnecessary complexity that hurts implementation, maintenance, and deployability. The conversation emphasizes shipping on time, keeping things simple by default, and designing code so it can be abstracted later if needed. Webview apps vs. native components: The hosts argue that webview-based apps can be excellent when built well, citing examples like Missive and tweak.so. Success depends on local storage, native-like interactions, good mobile design patterns, and performance, while bad implementations feel clunky compared with native apps. Monorepos and workspace tooling: For managing monorepos, they recommend starting with PNPM workspaces and only adding tools like TurboRepo if build speed or caching becomes necessary. They caution that extra tooling can turn a repo into a fragile, hard-to-bootstrap project. Energy use of generative AI: They note that the biggest energy cost is model training, while inference is lower but still nontrivial. They also explain that models are fundamentally deterministic, with randomness introduced intentionally via settings like temperature, and that smaller, on-device models will likely reduce energy use over time. Why frameworks still matter and how to think about vanilla JS: For simple brochure sites, frameworks may be unnecessary, but for real applications with persistent state, dynamic interaction, and shared context, frameworks save significant effort. They argue that modern web apps often need more than vanilla HTML/CSS/JS can comfortably provide at scale. Ad blockers, proxying, and progressive enhancement: They explain that ad blockers can block Sentry and analytics, and the common workaround is proxying requests through your own domain. They also strongly endorse progressive enhancement so forms and core actions work without JavaScript, especially in SvelteKit.

Key Arguments: Google Forms were originally a stopgap because the site had no database; now that the database exists, the question pipeline could be improved substantially. Overengineering is not just “too much code,” but unnecessary complexity that makes systems harder to build, maintain, deploy, and understand. A good rule is to keep things together initially while structuring code so it can be split into abstractions later if needed. Webview-based apps can feel native if they use local storage, follow platform design guidelines, and implement high-quality interactions and animations. PNPM workspaces are the simplest reliable monorepo starting point; add TurboRepo only when build speed/caching justifies the extra layer. Generative AI’s largest energy cost is training, not everyday use; future gains will come from smaller, purpose-built, and on-device models. AI models are mathematically deterministic; randomness is intentionally introduced through parameters like temperature and seed. For static brochure sites, frameworks are often unnecessary, but for interactive applications they preserve state and reduce repeated work across navigation. Ad blockers can be bypassed by proxying analytics/error-reporting requests through your own domain rather than calling third-party endpoints directly. Core application flows should work without JavaScript when possible, with JS used as a progressive enhancement rather than a hard dependency.

Data Points: Google Forms question source: Potluck questions are currently submitted via a Google Form - Used because the show originally had no database and needed a quick intake method SVG size: ~100K - Scott’s earlier CD animation SVG was described as large enough to meaningfully affect page load SVG size (alternate estimate): 120K - They also referenced the Easter egg SVG as approximately 120K after investigation Non-finite JavaScript numbers: 3 - Infinity, -Infinity, and NaN were discussed as the three non-finite numeric values in JavaScript AI energy cost focus: Training is the major energy expense - The hosts emphasized that training large AI models consumes far more energy than using them Meetup platform: meetup.com - Recommended as the default place to find local JavaScript meetups Sick pick app price model: Paid and free tiers - tweak.so has a free version and a paid tier with extras like recurring tasks and calendar sync Proxying analytics: Own-domain proxy endpoint - The hosts described routing analytics/Sentry traffic through a custom endpoint to avoid ad blockers Subscription/build speed example: 30 seconds vs. 4–5 minutes - TurboRepo was cited as reducing build/deploy time from several minutes to around 30 seconds in one project Can koozie price: $7 - Mentioned during the shop plug for a stainless double-walled can koozie

Pivotal Quotes: "Did you ship in time? If you shipped in time, all's well that ends well, right?" — Scott: Used to define the practical test for whether a solution has crossed into harmful overengineering "We should build that because our process right now is Scott and I go through it." — Wes: Discussing a better future system for potluck questions with search, filtering, tags, and voting "If JavaScript is off and you get a blank page, you have failed." — Wes: On progressive enhancement and the expectation that content should still render without JS

Implications: The episode pushes listeners toward pragmatic frontend choices: ship simpler systems first, use frameworks where they add real value, build for resilience against blockers and missing JS, and avoid adding tools or abstractions unless they solve a concrete problem.

🔓 Sign Up for Unlimited Episode Search

About Syntax - Tasty Web Development Treats

View all episodes from Syntax - Tasty Web Development Treats