エピソード

  • Vue Performance Tips
    2024/10/03

    Vue is fast (actually the fastest SSR framework)! But sometimes apps might a bit more fine-tuning. And by sometimes, we mean rarely.

    Still, it can happen - so join Alex and Michael in this DejaVue episode to dive into what tools Vue gives us to improve the frameworks' performance.

    Further, they dive into the recent SSR benchmark and what it means for you as a developer, as well as striving topics like perceived performance.

    Enjoy the episode!

    Chapters

    • (00:00) - Intro
    • (01:14) - The topic of this episode - Performance
    • (02:05) - Optimizing for performance from the beginning?
    • (04:03) - Prop stability
    • (08:18) - v-once
    • (10:45) - v-memo
    • (12:57) - Does v-pre fit into the mix?
    • (14:28) - Recalculation of computed's
    • (20:47) - Virtualization
    • (24:05) - shallowRef
    • (27:25) - Vapor Mode in the future
    • (28:44) - Server Side Rendering
    • (29:14) - The recent SSR benchmark
    • (31:35) - Results of the benchmark
    • (32:00) - What does this mean for you?
    • (35:19) - Perceived performance
    • (37:33) - Improving SSR performance
    • (39:12) - VueConf Toronto
    • (40:20) - Wrapping up


    Links and Resources

    • 15% discount for the VueConf Toronto* with code DEJAVUE


    • DejaVue #E026 - Vue 3.5 Analyzed
    • DejaVue #E027 - Working at AWS (with Erik Hanchett)
    • v-once
    • v-memo
    • v-pre
    • The shallowRef guide
    • Performance Vue Docs
    • Michael Reactivity From Scratch Free Course
    • Vapor Mode
    • Reading vuejs/core-vapor
    • DejaVue #E001 - The Need for Server-Side Rendering (SSR)
    • Alex' SSR Benchmark video


    Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.

    続きを読む 一部表示
    41 分
  • Working at AWS (with Erik Hanchett)
    2024/09/26

    While Alex is at PragVue, Michael is joined by Developer Advocate Erik Hanchett who works at no other company than AWS. In this DejaVue episode, they discuss the different duties of a Developer Advocate and skills one need to become one, as well as everything around content creation and conferences.
    In addition, Erik shares how it is to write Vue code as a Software Engineer at AWS, which he did for multiple years.

    Enjoy the episode!

    Our Guest

    Erik Hanchett

    • Website
    • Twitter
    • YouTube


    Chapters

    • (00:00) - Welcome to DejaVue
    • (00:35) - How would you describe your job?
    • (03:20) - Do you miss the deep technical problems?
    • (09:41) - Duties when speaking at a conference
    • (12:50) - What is Developer Advocacy?
    • (23:30) - Which skills do you need to be a Developer Advocate?
    • (26:40) - Your first content pieces doesn't have to be perfect
    • (28:16) - First Five unreleased DejaVue episodes
    • (29:44) - Putting yourself out there
    • (32:09) - Erik's first podcast guest appearance ever
    • (37:10) - Using Vue.js at Amazon Web Services
    • (41:29) - How did you get into Vue?
    • (43:16) - Working on AWS Open Source projects
    • (45:06) - Migrating a library from Vue 2 to Vue 3
    • (49:48) - Nested Slot Bonanza
    • (51:34) - Angular, React and Vue devs in the same project
    • (52:15) - Wrapping up


    Links and Resources


    • Get 15% OFF for your Vue Toronto ticket with code DEJAVUE *


    • AWS Amplify
    • VueUse
    • Vue Demi
    • XState


    Your Host


    Michael Thiessen

    • Twitter
    • YouTube
    • Website


    ---

    Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.

    続きを読む 一部表示
    54 分
  • Vue 3.5 Analyzed
    2024/09/19

    Vue 3.5 came out recently, so why not using the opportunity to dive into the features of the new minor version? Michael and Alex will do so and discuss performance improvements, SSR features and new composables in detail.

    If you wondered what the difference of the future Lazy Hydration and existing async components or what other features are part of the new minor, it is time to tune in ✨

    Enjoy the episode!

    Chapters

    • (00:00) - Welcome to DejaVue
    • (01:26) - Performance improvements in 3.5
    • (04:59) - Props Destructuring out of experimental
    • (12:23) - SSR Improvements
    • (12:52) - Lazy Hydration
    • (17:10) - How is Lazy Hydration different to existing async components?
    • (21:42) - useId
    • (25:25) - data-allow-mismatch
    • (29:02) - Web Component improvements
    • (31:42) - useTemplateRef
    • (34:34) - Deferred Teleports
    • (38:45) - onWatcherCleanup
    • (42:37) - Wrapping up


    Links and Resources

    • 10% discount for the vue.js de Conf in Bonn, Germany* with code DEJAVUE


    • DejaVue #E016 - The Future of Vue.js (with Evan You)
    • Vue 3.5 announcement blog post
    • Rolldown
    • Vite
    • Evan's Tweet about Vue using Rolldown (there are more though!)
    • Props Destructure RFC (now part of core)
    • DejaVue #E001 - The Need for Server-Side Rendering (SSR)
    • Hydration Error blog post
    • Vue.js Hydration Explained
    • Lazy Hydration in Nuxt (voice your opinion!)
    • Volkswagen package
    • Volar
    • DejaVue #E006 - Nuxt Server Components (with Julien Huang)
    • DejaVue #E004 - Teleports and When to Use Them
    • DejaVue #E011 - Learning new Vue Features and Concepts (with LearnVue aka. Matt Maribojoc)
    • VueUse


    Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.

    続きを読む 一部表示
    44 分
  • Nuxt Modules and Open Source at work (with Lucie Haberer)
    2024/09/12

    In this episode, Alex is joined by fellow Nuxt core team member Lucie Haberer, who is not only a DX Engineer at Prismic, doing open source but also public speaking.

    Together they talk about Lucie's recent free Nuxt and Nuxt UI course and how she got into Vue and Nuxt. Lucie explains further why she fell in love with Nuxt modules and which modules she built so far - with some enlightening surprise there!

    In addition, they talk about how Open Source works at Prismic - from when they do open source over to sponsoring projects and contributing - and many more insights.

    Enjoy the episode!

    Chapters

    • (00:00) - Welcome to DejaVue
    • (00:49) - A Free Nuxt UI Course
    • (04:02) - How you got into Vue.js
    • (06:42) - From Building a Nuxt module for SSG to joining the core team
    • (13:48) - A module to control your smart lightbulb?
    • (14:35) - Running a Nuxt module in every Nuxt app on the computer
    • (19:33) - Public Speaking and Conferences
    • (23:41) - Local Meetups
    • (26:26) - Lucie's responsibilities in the Nuxt team
    • (27:27) - Inbox 0 and GitHub notifications
    • (28:55) - Building vs. working with a framework
    • (31:21) - Monkey patching - but don't forget to raise an issue!
    • (32:11) - Being a DX Engineer
    • (35:20) - Prismic and Open Source
    • (40:56) - Open Source Sponsoring
    • (43:00) - Working with other frameworks
    • (45:36) - Wrapping up


    Links and Resources


    • $10 off for Michael's Nuxt Tips Collection* with this link and the code DEJAVUE
    • 10% discount for the vue.js de Conf in Bonn, Germany* with code DEJAVUE


    • Prismic
    • Free Nuxt UI Course
    • unhead
    • NuxtLink RFC
    • .nuxtrc
    • Nuxt Devtools Discussion
    • defu
    • DejaVue #E024 - Between Agency Work and Open Source (with Zoey and Dan from SIDESTREAM)


    Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.

    続きを読む 一部表示
    47 分
  • Between Agency Work and Open Source (with Zoey and Dan from SIDESTREAM)
    2024/09/05

    This DejaVue episode is a world premiere, with having two guests on the episode for the first time! And not only that, the topics are exciting too. Michael and Alex are joined by Dan and Zoey, both working at SIDESTREAM, an agency using Vue and Nuxt to realize projects.

    But besides the project business, they also have Sidebase, a non-profit "spin-off" responsible for open-source Nuxt modules like @sidebase/nuxt-auth which some of you might know already!

    Listen to the discussion around how doing Open Source benefits SIDESTREAM, how the Vue job market and hiring works, why Vue and Nuxt were chosen first of all and all around Nuxt Auth and further modules. Enjoy the episode!

    Enjoy the episode!

    Chapters

    • (00:00) - Welcome to DejaVue
    • (01:37) - Sidebase vs SIDESTREAM
    • (03:57) - How did you choose Vue and Nuxt?
    • (08:21) - Do clients care about your tech stack?
    • (10:31) - Finding Vue.js Developer to Hire
    • (14:35) - What brought SIDESTREAM to open source?
    • (18:45) - Developing Sidebase - From template to starter
    • (22:11) - Which choices Sidebase offer?
    • (26:03) - The case against wrapper packages
    • (28:57) - How did SIDESTREAM benefits from Sidebase?
    • (33:17) - Inspired by Open Source
    • (37:42) - Influence from previous projects on Sidebase
    • (40:33) - Moving from Python to full-tack TypeScript
    • (45:48) - Separate services or one Nuxt application?
    • (49:47) - The Sidebase Nuxt Auth Module
    • (54:14) - Migrating the base of Nuxt Auth to Auth.js
    • (56:02) - Other Auth solutions
    • (01:02:37) - Dead ends during module development
    • (01:07:48) - The future of Sidebase and SIDESTREAM
    • (01:15:10) - Wrapping up


    Links and Resources


    • $10 off for Michael's Nuxt Tips Collection* with this link and the code DEJAVUE
    • 10% discount for the vue.js de Conf in Bonn, Germany* with code DEJAVUE


    • DejaVue #E015 - Ten Years of Vue (with Evan You)
    • SIDESTREAM
    • Sidebase
    • Sidebase Promo Video
    • Sidebase Launch Tweet
    • Nuxt CLI Wizard
    • Prisma
    • tRPC
    • Sidebase nuxt-auth module
    • Sentry
    • Sentry Nuxt SDK Alpha
    • Add Sentry to Nuxt 3 recipe
    • Nuxt Layers Intro
    • Zod
    • Auth.js
    • nuxt-auth-utils
    • MakerDAO aka Sky


    Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.

    続きを読む 一部表示
    1 時間 17 分
  • TypeScript and Content Creation (with Matt Pocock)
    2024/08/29

    This episode of DejaVue includes not only knowledge but also a certain degree of magic, as Alex and Michael meet up with the one and only TypeScript Wizard Matt Pocock. Together, they talk about how he became a full-time educator and what the pros and cons are, then of course discussing everything around TypeScript - from Types vs. Interfaces, any vs. unknown, Matt's ts-reset library, Flappy Bird in TypeScript and more amazing nuggets

    Enjoy the episode!

    Chapters

    • (00:00) - Welcome to DejaVue
    • (02:08) - How Matt came to join DejaVue
    • (03:03) - Becoming a full time TypeScript educator
    • (05:10) - What do you miss when doing full time content creation?
    • (08:16) - Being an employee vs. self-employed
    • (14:42) - Why using TypeScript?
    • (19:59) - TypeScript only for libraries?
    • (22:40) - Migrating JS to TS
    • (28:08) - The build/compile step
    • (33:20) - Types vs. Interfaces
    • (37:19) - Declaration Merging pitfalls
    • (41:35) - TS Reset and TS 5.5 improvements
    • (48:25) - TypeScript enforcing a way of programming
    • (51:18) - any vs. unknown
    • (54:25) - Wrapping up


    Links and Resources


    • $10 off for Michael's Nuxt Tips Collection* with this link and the code DEJAVUE
    • 10% discount for the vue.js de Conf in Bonn, Germany* with code DEJAVUE


    • Matt's Truck stream
    • Badass.dev
    • NeverThrow
    • Sentry migrating to TS
    • Stripe migrating to TS
    • TS Reset
    • Dan Vanderkam's PR to TS
    • TS Flappy Bird
    • Total TypeScript


    Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.

    続きを読む 一部表示
    57 分
  • Signals
    2024/08/22

    It was teased in the last episode already and here it - Michael and Alex talk about the current hype in the front end development community: Signals. But if you as a Vue developer don't feel hyped around it and maybe even didn't hear much around it, fear no more - that is normal and will be explained in the episode too.

    Join the two Vue experts covering the history of Signals, what's behind the term and how they work in Vue.js and other major frameworks.
    And of course, the TC39 proposal to add Signals to the language itself wasn't forgotten either.

    Enjoy the episode!

    Chapters

    • (00:00) - Welcome to DejaVue
    • (01:06) - Signals and Reactivity
    • (04:41) - Functional Programming
    • (10:51) - Signals in Modern Frameworks
    • (11:48) - How Signals look like in other Frameworks
    • (14:20) - Signals in Vue
    • (15:20) - Signals vs. refs?
    • (17:51) - A Standard for Signals
    • (21:54) - Benefits of Signals in the language
    • (25:16) - Vue.JS DE Conf 2024


    Links and Resources

    • $10 off for Michael's Nuxt Tips Collection* with this link and the code DEJAVUE
    • 10% discount for the vue.js de Conf in Bonn, Germany* with code DEJAVUE


    • DejaVue #E022 - Reactivity in Vue
    • Haskell
    • OCaml
    • Elixir
    • Elm
    • Zod
    • Valibot
    • Solid.js
    • Building solid-like Signals in Vue with shallowRef
    • Vue Docs on Signals
    • TC39 Proposal
    • VueUse


    Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.

    続きを読む 一部表示
    26 分
  • Reactivity in Vue
    2024/08/15

    Join Alex and Michael on a talk about a key topic in Vue.js - the reactivity system. Before diving into how it works in Vue 3, reactivity in Vanilla JS is covered. Then, the differences between the major Vue versions are discussed, showing an astonishing evolution in terms of DX but also performance when it comes to reactivity.
    Of course, the ref vs reactive topic can’t be left out, and neither can signals and vapor mode.
    Sounds interesting? Then tune in!

    Enjoy the episode!

    Chapters

    • (00:00) - Welcome to DejaVue
    • (01:38) - What is Reactivity in general?
    • (03:47) - Reactivity in JavaScript?
    • (07:45) - Reactivity in Vue 1
    • (09:08) - Changes to reactivity in Vue 2
    • (10:47) - Reactivity system and caveats in Vue 2
    • (15:10) - Vue 3 Reactivity with Proxies
    • (19:00) - No IE11 support
    • (20:22) - Ref and Reactive in Vue
    • (25:12) - shallowRef, triggerRef and more
    • (28:23) - Why not shallowRef by default?
    • (31:24) - Vue's reactivity system as a standalone package
    • (34:21) - Vapor Mode
    • (40:52) - Wrapping Up


    Links and Resources

    • $10 off for Michael's Nuxt Tips Collection* with this link and the code DEJAVUE (Release on Aug 5th)
    • 10% discount for the vue.js de Conf in Bonn, Germany* with code DEJAVUE


    • DejaVue #E015 with Evan You
    • Petite Vue Talk
    • Debugging Guide: Why Your Vue Component Isn't Updating (and how to fix it)
    • Marc Backes - Building a Time Machine with Proxies
    • CanIUse Beowser Usage Stats
    • Michael Thiessen on ref vs. reactive
    • Alex's shallowRef guide
    • Alpine.js
    • Reactivue - Vue CAPI in React 👀
    • Arrow-js
    • Vapor Mode Repo
    • Vapor Mode Playground


    Links marked with * are affiliate links. We get a small commission when you register for the service through our link. This helps us to keep the podcast running. We only include affiliate links for services mentioned in the episode or that we use ourselves.

    続きを読む 一部表示
    42 分