Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers

Zpravodajství

Technologické zprávy

Technika

Hasty Treat - Developing for Slow and Spotty Connections

Syntax - Tasty Web Development Treats

Full Stack Developers Wes Bos and Scott Tolinski dive deep into web development topics, explaining how they work and talking about their own experiences. They cover from JavaScript frameworks like React, to the latest advancements in CSS to simplifying web tooling.

<p class="has-line-data" data-line-start="7" data-line-end="8">In this Hasty Treat, Scott and Wes talk about how to develop for slow internet connections.</p> <h2 class="code-line" data-line-start="9" data-line-end="10"><a id= "LogRocket__Sponsor_9" name="LogRocket__Sponsor_9"></a>LogRocket - Sponsor</h2> <p class="has-line-data" data-line-start="10" data-line-end="11"> LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It’s an exception tracker, a session re-player and a performance monitor. Get 14 days free at <a href= "https://logrocket.com/syntax">logrocket.com/syntax</a>.</p> <h2 class="code-line" data-line-start="12" data-line-end="13"> <a id="Show_Notes_12" name="Show_Notes_12"></a>Show Notes</h2> <p class="has-line-data" data-line-start="14" data-line-end="15"> 02:26 - Types of Slow connections</p> <ul> <li class="has-line-data" data-line-start="16" data-line-end="17"> Slow upload</li> <li class="has-line-data" data-line-start="17" data-line-end="19"> Slow download <ul> <li class="has-line-data" data-line-start="18" data-line-end="19"> This could be that your kids are watching a show and your partner is on a zoom call</li> </ul> </li> <li class="has-line-data" data-line-start="19" data-line-end="20"> High latency</li> <li class="has-line-data" data-line-start="20" data-line-end="22"> Intermittent</li> </ul> <p class="has-line-data" data-line-start="22" data-line-end="23"> 07:47 - Loading UI</p> <ul> <li class="has-line-data" data-line-start="24" data-line-end="25"> Show loading UI for everything, but after X seconds</li> <li class="has-line-data" data-line-start="25" data-line-end="26"> Page transitions on SPAs</li> <li class="has-line-data" data-line-start="26" data-line-end="28"> Form switches - enter country, get list of provinces/shipping/whatever</li> </ul> <p class="has-line-data" data-line-start="28" data-line-end="29"> 11:58 - Account for XHR failures</p> <ul> <li class="has-line-data" data-line-start="30" data-line-end="31"> Sometimes I’m in a loading state forever</li> <li class="has-line-data" data-line-start="31" data-line-end="33"> State machines will account for this</li> </ul> <p class="has-line-data" data-line-start="33" data-line-end="34"> 13:26 - “Still working” timeouts</p> <ul> <li class="has-line-data" data-line-start="35" data-line-end="37"> Some sort of timeout so the user can get feedback</li> </ul> <h2 class="code-line" data-line-start="37" data-line-end="38"> <a id="Links_37" name="Links_37"></a>Links</h2> <ul> <li class="has-line-data" data-line-start="38" data-line-end="39"> <a href="https://sentry.io/">Sentry</a></li> <li class="has-line-data" data-line-start="39" data-line-end="40"> <a href="https://sapper.svelte.dev/">Sapper</a></li> <li class="has-line-data" data-line-start="40" data-line-end="42"> <a href="https://www.backblaze.com/">Backblaze</a></li> </ul> <h2 class="code-line" data-line-start="42" data-line-end="43"> <a id="Tweet_us_your_tasty_treats_42" name= "Tweet_us_your_tasty_treats_42"></a>Tweet us your tasty treats!</h2> <ul> <li class="has-line-data" data-line-start="43" data-line-end="44"> <a href="https://www.instagram.com/stolinski/">Scott’s Instagram</a></li> <li class="has-line-data" data-line-start="44" data-line-end="45"> <a href= "https://www.instagram.com/LevelUpTutorials/">LevelUpTutorials Instagram</a></li> <li class="has-line-data" data-line-start="45" data-line-end="46"> <a href="https://www.instagram.com/wesbos/">Wes’ Instagram</a></li> <li class="has-line-data" data-line-start="46" data-line-end="47"> <a href="https://twitter.com/wesbos">Wes’ Twitter</a></li> <li class="has-line-data" data-line-start="47" data-line-end="48"> <a href="https://www.facebook.com/wesbos.developer">Wes’ Facebook</a></li> <li class="has-line-data" data-line-start="48" data-line-end="49"> <a href="https://twitter.com/stolinski">Scott’s Twitter</a></li> <li class="has-line-data" data-line-start="49" data-line-end="50"> Make sure to include <a href= "https://twitter.com/SyntaxFM">@SyntaxFM</a> in your tweets</li> </ul>

In this Hasty Treat, Scott and Wes talk about how to develop for slow internet connections.
 LogRocket - Sponsor LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It’s an exception tracker, a session re-player and a performance monitor. Get 14 days free at logrocket.com/syntax.
 Show Notes 02:26 - Types of Slow connections
  Slow upload
 Slow download  This could be that your kids are watching a show and your partner is on a zoom call

 High latency
 Intermittent
  07:47 - Loading UI
  Show loading UI for everything, but after X seconds
 Page transitions on SPAs
 Form switches - enter country, get list of provinces/shipping/whatever
  11:58 - Account for XHR failures
  Sometimes I’m in a loading state forever
 State machines will account for this
  13:26 - “Still working” timeouts
  Some sort of timeout so the user can get feedback
  Links  Sentry

 Sapper

 Backblaze

  Tweet us your tasty treats!  Scott’s Instagram

 LevelUpTutorials Instagram

 Wes’ Instagram

 Wes’ Twitter

 Wes’ Facebook

 Scott’s Twitter

 Make sure to include @SyntaxFM in your tweets

Aplikace Youradio Talk

Pro přehrání dalších podcastů se prosím registrujte.

Hasty Treat - Developing for Slow and Spotty Connections

Poslechněte si podcast