Is your app feeling sluggish? Scott and Wes break down the biggest performance bottlenecks—like bloated assets, slow databases, and waterfall requests—and share easy wins to make your site feel lightning fast. From smarter caching to preloading tricks, these tips will have your app zipping along in no time! <a id= "Show_Notes_2"></a>Show Notes <ul> <li class="has-line-data" data-line-start="4" data-line-end="5"> <a href="#t=00:00">00:00</a> Welcome to Syntax!</li> <li class="has-line-data" data-line-start="5" data-line-end="6"> <a href="#t=00:58">00:58</a> Brought to you by <a href="https://sentry.io/syntax">Sentry.io</a>.</li> <li class="has-line-data" data-line-start="6" data-line-end="7"> <a href="#t=02:01">02:01</a> What makes apps slow?</li> <li class="has-line-data" data-line-start="7" data-line-end="8"> <a href="#t=02:10">02:10</a> Loading too much.</li> <li class="has-line-data" data-line-start="8" data-line-end="9"> <a href="#t=03:26">03:26</a> Slow database work.</li> <li class="has-line-data" data-line-start="9" data-line-end="10"> <a href="#t=04:04">04:04</a> Slow server.</li> <li class="has-line-data" data-line-start="10" data-line-end="11"> <a href="#t=04:54">04:54</a> Waterfall requests.</li> <li class="has-line-data" data-line-start="11" data-line-end="12"> <a href="#t=06:34">06:34</a> How do I know what is slow?</li> <li class="has-line-data" data-line-start="12" data-line-end="13"> <a href="#t=06:45">06:45</a> <a href= "https://webvitals.com/">Web vitals</a>.</li> <li class="has-line-data" data-line-start="13" data-line-end="14"> <a href="#t=12:50">12:50</a> Streaming.</li> <li class="has-line-data" data-line-start="14" data-line-end="15"> <a href="#t=14:05">14:05</a> Network tab.</li> <li class="has-line-data" data-line-start="15" data-line-end="16"> <a href="#t=18:18">18:18</a> Performance tab.</li> <li class="has-line-data" data-line-start="16" data-line-end="17"> <a href="#t=22:53">22:53</a> Caching.</li> <li class="has-line-data" data-line-start="17" data-line-end="18"> <a href="#t=22:59">22:59</a> Client-side caching.</li> <li class="has-line-data" data-line-start="18" data-line-end="21"> <a href="#t=23:38">23:38</a> Server-side caching. <ul> <li class="has-line-data" data-line-start="19" data-line-end="20"> <a href="https://valkey.io/">Valkey.io</a>.</li> <li class="has-line-data" data-line-start="20" data-line-end="21"> <a href="https://redis.io/">Redis.io</a>.</li> </ul> </li> <li class="has-line-data" data-line-start="21" data-line-end="22"> <a href="#t=25:40">25:40</a> Local data.</li> <li class="has-line-data" data-line-start="22" data-line-end="23"> <a href="#t=26:11">26:11</a> Gzip.</li> <li class="has-line-data" data-line-start="23" data-line-end="24"> <a href="#t=29:23">29:23</a> CDN.</li> <li class="has-line-data" data-line-start="24" data-line-end="29"> <a href="#t=30:57">30:57</a> Images. <ul> <li class="has-line-data" data-line-start="25" data-line-end="26"> <a href="https://cloudinary.com/">Cloudinary</a>.</li> <li class="has-line-data" data-line-start="26" data-line-end="27"> <a href= "https://www.cloudflare.com/en-ca/developer-platform/products/cloudflare-images/"> Cloudflare Images</a>.</li> <li class="has-line-data" data-line-start="27" data-line-end="28"> <a href="https://www.imgix.com/">Imgix</a>.</li> <li class="has-line-data" data-line-start="28" data-line-end="29"> <a href="https://vercel.com/blog/images-on-the-web">Vercel Images</a>.</li> </ul> </li> <li class="has-line-data" data-line-start="29" data-line-end="30"> <a href="#t=31:08">31:08</a> Serving.</li> <li class="has-line-data" data-line-start="30" data-line-end="31"> <a href="#t=34:16">34:16</a> Compressing.</li> <li class="has-line-data" data-line-start="31" data-line-end="32"> <a href="#t=35:06">35:06</a> Ship fewer images.</li> <li class="has-line-data" data-line-start="32" data-line-end="34"> <a href="#t=35:50">35:50</a> Loading JS. <ul> <li class="has-line-data" data-line-start="33" data-line-end="34"> <a href= "https://www.growingwiththeweb.com/2014/02/async-vs-defer-attributes.html"> Async vs Defer Attributes</a>.</li> </ul> </li> <li class="has-line-data" data-line-start="34" data-line-end="35"> <a href="#t=37:00">37:00</a> CSS.</li> <li class="has-line-data" data-line-start="35" data-line-end="36"> <a href="#t=38:28">38:28</a> Preloading & Prefetch.</li> <li class="has-line-data" data-line-start="36" data-line-end="37"> <a href="#t=39:40">39:40</a> Preloading on hover.</li> <li class="has-line-data" data-line-start="37" data-line-end="38"> <a href="#t=41:44">41:44</a> Ship less code.</li> <li class="has-line-data" data-line-start="38" data-line-end="40"> <a href="#t=43:49">43:49</a> Icons <ul> <li class="has-line-data" data-line-start="39" data-line-end="40"> <a href="https://nucleoapp.com/">Nucleo App</a>.</li> </ul> </li> <li class="has-line-data" data-line-start="40" data-line-end="42"> <a href="#t=47:01">47:01</a> Fonts <ul> <li class="has-line-data" data-line-start="41" data-line-end="42"> <a href="https://tolin.ski/">Tolin.ski</a>.</li> </ul> </li> <li class="has-line-data" data-line-start="42" data-line-end="44"> <a href="#t=51:13">51:13</a> Sick Picks + Shameless Plugs.</li> </ul> <a id="Sick_Picks_44"></a>Sick Picks <ul> <li class="has-line-data" data-line-start="46" data-line-end="47"> Scott: <a href= "https://www.netflix.com/ca/title/81758544">Skywalkers on Netflix</a>.</li> <li class="has-line-data" data-line-start="47" data-line-end="49"> Wes: <a href="https://amzn.to/40RO4Gt">Oxo Swivel Peeler</a>.</li> </ul> <a id="Shameless_Plugs_49"></a>Shameless Plugs <ul> <li class="has-line-data" data-line-start="51" data-line-end="53"> Scott: <a href="https://youtube.com/@syntaxfm">Syntax on YouTube</a>.</li> </ul> <a id="Hit_us_up_on_Socials_53"></a>Hit us up on Socials! Syntax: <a href="https://twitter.com/syntaxfm">X</a> <a href= "https://www.instagram.com/syntax_fm/">Instagram</a> <a href= "https://www.tiktok.com/@syntaxfm">Tiktok</a> <a href= "https://www.linkedin.com/company/96077407/admin/feed/posts/">LinkedIn</a> <a href="https://www.threads.net/@syntax_fm">Threads</a> Wes: <a href="https://twitter.com/wesbos">X</a> <a href= "https://www.instagram.com/wesbos/">Instagram</a> <a href= "https://www.tiktok.com/@wesbos">Tiktok</a> <a href= "https://www.linkedin.com/in/wesbos/">LinkedIn</a> <a href= "https://www.threads.net/@wesbos">Threads</a> Scott: <a href="https://twitter.com/stolinski">X</a> <a href= "https://www.instagram.com/stolinski/">Instagram</a> <a href= "https://www.tiktok.com/@stolinski">Tiktok</a> <a href= "https://www.linkedin.com/in/stolinski/">LinkedIn</a> <a href= "https://www.threads.net/@stolinski">Threads</a> Randy: <a href="https://twitter.com/randyrektor">X</a> <a href= "https://www.instagram.com/randyrektor/">Instagram</a> <a href= "https://www.youtube.com/@randyrektor">YouTube</a> <a href= "https://www.threads.net/@randyrektor">Threads</a>

Podurama

Home

Trending

Personal

Your Podcasts

New Episodes

My Files

Favourite Episodes

Tags (Folders)

Recently Played

Bookmarks

Followed Playlists

874: Fast Apps - Easy Perf Wins

Syntax - Tasty Web Development Treats

AI Chapters

AI Insights

Reviews