caching

Join Wes and Scott for a hasty episode of Syntax as they unpack the power of middleware for developers, covering caching, authentication, A/B testing, error handling, and user redirection in a quick, punchy rundown to supercharge your backend skills!

Show Notes

• 00:00 Welcome to Syntax!
• 00:41 Syntax on YouTube.
• 01:28 What is middleware?
• 05:04 Some real-world examples of middleware.
  • 05:10 Authentication.
  • 07:44 Redirecting users to a specific instance.
  • 08:28 Logging + statistics.
  • 09:41 Debugging.
  • 10:00 Timers.
  • 10:46 A/B testing.
  • 11:59 Error handling + logging.
  • 12:23 Caching.
  • 13:02 Multi-tenant applications.
• 15:08 Where does it run?
• 18:07 What are the limitations?
• 21:52 Next.js middleware is one file only.
• NextJS Middleware
• 23:35 Sveltekit solution.
• Sveltekit Hooks
• 24:31 Connect style.
• Fastify Express
• Fastify Middle
• 25:28 One last thing, NPM Installing.

Hit us up on Socials!

Syntax: X Instagram Tiktok LinkedIn Threads

Wes: X Instagram Tiktok LinkedIn Threads

Scott:X Instagram Tiktok LinkedIn Threads

Randy: X Instagram YouTube Threads

In this episode of Syntax, Wes and Scott talk through the ways they improved performance on the Syntax.fm website, how they knew it was slow to begin with, and the various changes they made to caching, and loading transcripts to improve the speed of the site.

Show Notes

• 00:25 Welcome
• 01:32 Adding a database requires queries
• 03:32 How did we know the site was slow?
• 04:25 Syntax Brought to you by Sentry
• 07:45 Changing the way transcripts are being loaded
• 13:41 Caching
• 21:16 Caching Headers

Hit us up on Socials!

Syntax: X Instagram Tiktok LinkedIn Threads

Wes: X Instagram Tiktok LinkedIn Threads

Scott: X Instagram Tiktok LinkedIn Threads

In this episode of Syntax, Wes and Scott explain what Stale While Revalidate is, why you should use it, and explore whether you should use it all the time on all the things.

Show Notes

• 00:25 Welcome
• 01:05 Syntax Brought to you by Sentry
• 01:34 What is Stale While Revalidate?
• 03:13 Why is caching important?
• Max age calculator
• Can I Use
• 05:09 Where does a cache live?
• 07:05 Limit how often an API is being hit
• 11:51 What about Stale while Revalidate?
• 18:30 Why wouldn’t you just use Stale While Invalidate on everything?
• Syntax 484: Cache Control Headers Explained

Hit us up on Socials!

Syntax: X Instagram Tiktok LinkedIn Threads

Wes: X Instagram Tiktok LinkedIn Threads

Scott: X Instagram Tiktok LinkedIn Threads

In this episode of Syntax, Wes and Scott talk through the fundamentals of web workers and service workers - examples, when you should use them, how to debug, local dev, and more.

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.

Sanity - Sponsor

Sanity.io is a real-time headless CMS with a fully customizable Content Studio built in React. Get a Sanity powered site up and running in minutes at sanity.io/create. Get an awesome supercharged free developer plan on sanity.io/syntax.

Freshbooks - Sponsor

Get a 30 day free trial of Freshbooks at freshbooks.com/syntax

Show Notes

• 00:11 Welcome
• 04:34 What are threads?
• 06:12 Concurrent vs parallel
• 09:22 Green screen web cam example
• 13:02 Examples of what you could use web workers for
• Party Town
• Deno
• 19:52 Sponsor: LogRocket
• 20:42 Post Message API and Web Workers
• 25:57 What about WASM?
• 27:28 Offline sync
• 28:14 What are service workers?
• 31:20 How do you caching sites for offline use?
• 32:39 Web worker vs service worker
• 34:12 Sponsor: Sanity
• 35:40 What is the lifecycle of a service worker
• 38:18 Possible issues with Service Workers
• 42:46 Debugging service workers
• Svelte Kit Service workers
• Workbox
• 43:04 Testing and local development
• Service Workers notes from Wes’ Workshop
• 46:45 Sponsor: Freshbooks
• 49:59 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Setex Gecko Grip 1mm Anti Slip Eyeglass Nose Pads
• Wes: Samsung Frame TV

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

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

In this potluck episode of Syntax, Wes and Scott answer your questions about middleman for API fetching, when to introduce SvelteKit, generating PDFs serverside, trade offs of being an entrepreneur vs employee, and more!

Prismic - Sponsor

Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at prismic.io/syntax.

Auth0 - Sponsor

Auth0 is the easiest way for developers to add authentication and secure their applications. They provides features like user management, multi-factor authentication, and you can even enable users to login with device biometrics with something like their fingerprint. Not to mention, Auth0 has SDKs for your favorite frameworks like React, Next.js, and Node/Express. Make sure to sign up for a free account and give Auth0 a try with the link below. https://a0.to/syntax

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

• 00:18 Welcome
• 02:50 Is there a way to create a “middleman” to fetch data from an API once a day?
• Redis
• 06:53 Should I wait before introducing team members to SvelteKit?
• SvelteKit V1 issues
• 10:28 What options do we have for generating PDFs serverside?
• WKHTML to PDF
• Puppeteer
• PhantomJS
• html2canvas
• Generate Invoice Workers
• 15:47 Sponsor: Prismic
• 17:08 How do you say thank you to sponsors?
• 18:32 How would you compare the tradeoffs of working at a tech company vs. an agency vs. freelancing vs. entrepreneurship?
• 20:47 What’s the best way for an oldie like me to catch up?
• CSS Grid.io
• Modern CSS Layouts
• 26:08 I’m wondering what do you think about tRPC?
• trpc.io
• Create t3 app
• 29:00 Sponsor: LogRocket
• 30:03 PDF creator Cloudflare worker
• 32:50 How do you feel about keeping separate accounts for things like Twitter?
• 37:28 Does using prototypes mean you are not doing functional programming?
• 42:09 PHP vs JavaScript based CMS
• Ghost
• Keystone
• Strapi
• 45:15 Sponsor: Auth0
• 46:21 Why do you think this mindset that with age comes an inability to learn?
• Syntax 44 How to Learn New Things Quickly
• 51:32 Are there other payment providers you guys recommend or should I stick with Stripe and hope for the best?
• Stripe
• Paypal
• 56:10 SIIIIICK ××× PIIIICKS ×××

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Literature and History
• Wes: Kitchen faucet

Shameless Plugs

• Scott: LevelUp Tutorials
• Wes: Wes Bos Tutorials

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

In this episode of Syntax, Wes and Scott talk through the tech stack they use to manage their course websites.

Kontent by Kentico - Sponsor

Kontent by Kentico is a headless CMS that provides live editing experience to non-technical users and hands you the technical tools to build websites, mobile apps, voice assistants, or anything else where you need content. Use REST API or GraphQL and get your content via the global Fastly CDN. Designed to unify all your content and operations, in compliance with ISO27001 and SOC2Type2 certifications.Spin up a new project today and discover Kontent.

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.

.TECH Domains - Sponsor

Dot Tech domains has launched a new game with wicked prizes. It’s a windows 98 inspired game where you need to find and solve puzzles in each of the drives. This is unreal and you need to see it to believe it - good luck and start the game March 25th at go.tech/syntaxbtc.

Show Notes

• 00:10 Welcome
• 02:50 CSS Redesign of LevelUpTuts
• 03:56 Overview of our platforms
• 06:06 The API
• ExpressJS
• MongoDB
• GraphQL
• Fastify
• Mercurius
• Mongoose
• 15:13 Sponsor: Kontent by Kentico
• 17:07 Customer dashboard
• Svelte Kit
• 21:21 Viewing experience
• React
• GitHub
• VideoJS
• Mux
• Vimeo
• 30:53 Hosting
• 35:51 Sponsor: LogRocket
• 36:45 Admin tooling
• Flexbox
• Postmark
• Drip
• Pancake Charts
• 47:37 Authentication
• PassportJS
• 50:30 Transactional Email
• Nodemailer
• Pug
• Inky
• mjml
• 52:36 Checkout
• Stripe
• Stripe Checkouts
• Stripe Elements
• Braintree
• Paypal
• 55:58 Hosting
• Digital Ocean
• Digital Ocean Platform
• Render
• Cloudflare
• 57:48 Sponsor: .TECH
• 59:39 Other parts

××× SIIIIICK ××× PIIIICKS ×××

• Scott: Toniebox Audio Player Starter Set
• Wes: Vissles v84 Keyboard

Shameless Plugs

• Scott: LevelUp Tutorials - Svelte 3D Course
• Wes: Wes Bos Tutorials

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

In this Hasty Treat, Scott and Wes are back with another edition of Stump’d! where they try to stump each other with interview questions.

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

03:28 - What is the difference between HTML and React event handling?

05:55 - What are JavaScript data types?

07:00 - In which states can a Promise be?

07:48 - Discuss the differences between an HTML specification and a browser’s implementation thereof.

09:14 - What is a stateless component?

10:10 - What is a pure function?

10:51 - What is the output of the following code?

 const a = [1, 2, 3] const b = [1, 2, 3] const c = "1,2,3"  console.log(a == c) console.log(a == b)  

13:35 - What is memoization?

15:15 - How do you pass an argument to an event handler in React?

15:59 - What is HTML5 Web Storage? Explain localStorage and sessionStorage.

Links

• 30 Seconds of Interviews

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