RRU 082: Progressive SSR with Dinesh Pandiyan
React Round Up8 Okt 2019

RRU 082: Progressive SSR with Dinesh Pandiyan

Dinesh Pandiyan is a developer from India. He started as a backend engineer and then moved to frontend. Currently he is working for ThinkMill in Sidney, Australia. Today Dinesh and the panel are talking about devtools and progressive SSR. Dinesh got started with React Redux. The panelists talk about their experiences using primarily Redux for projects. Dinesh talks about his transition from backend to frontend and how it’s a totally different world. On the backend he was working in Java and it ran on a server, but on the frontend, code runs in a browser and the browser is very different for each user. Frontend development is tricky because you don’t know where your code is going to run. One of the trickiest parts of frontend development is debugging something in production. Unless you have good logging tools, you won’t know what’s going on. Debugging this stuff when it’s running on client browsers is hard, but when you’re in development mode your own browser you’ve got handy tools. They talk about some of the tools in React, and agree that console.log is the greatest debugging tool of all time. Dinesh talks about some of the most surprising features about React dev tools. You can benchmark your preferences and identify weaklings in your project, which are things that slow down your application or things that might slow it down. On an application level, you have to build a mental model of how the data flows from the top, where things change, etc, and dev tools can help you build that pretty easily. They talk about how things had to be done before great React tools. In fact, Dinesh chose React just for the devtools. They talk about how the dev tools for React compare to Java. The most important thing is that you have a good debugger that can stop where you want it to. They transition to talking about the differences between SSR and progressive SSR For SSR (Server Side Rendering), rendering happens on the server and you send it to the client. CSSR (Client Server Side Rendering) is when all the rendering happens on the client’s side. PSSR (Progressive Server Side Rendering) is where you render small chunks on the server and then send it to the client bit by bit. They talk about how this has been occurring from the beginning of the internet. This concept is similar to microfrontends. Dinesh gives advice on how to implement PSSR. He says that when you surver render, it loads on differently. Your framework has to do one complete pass of the histiema, so this means you cannot send things to the client until the whole histema is designated. To beat this they’ve been doing a mix of SSR and CSR, with the header, body, and non critical content rendering on the client side. PSSR bridges the gap between SSR and CSSR. How do we make it real and how do we use it? The panel discusses ways to make PSSR a reality. Dinesh has been experimenting with it with extra services, and he gives his method for doing it, emphasizing the importance of where you divide your code is very important, it has to be in sequence. CSS Grid solves this problem, so you could render things out of order and the browser puts it in the right spot. They talk about other ways to get around it. Lucas shares some of the difficulties he’s encountered with streaming and rendering. They talk about the new feature for the Phoenix framework for Elixir, Live View Now. For this feature, you don’t need client side frameworks to generate dynamic content and it enables two way streaming. However, it does not scale well for extremely large apps. They talk about some of the tradeoffs for using this feature. They conclude by discussing the gap between website optimization and device performance. Panelists
  • Thomas Aylott
  • Dave Ceddia
  • Lucas Reis
With special guest: Dinesh Pandiyan Sponsors Links Follow DevChatTV on Facebook and Twitter Picks Lucas Reis: Thomas Aylott: Dinesh Pandiyan: David Ceddia: Special Guest: Dinesh Pandiyan.

Advertising Inquiries: https://redcircle.com/brands

Privacy & Opt-Out: https://redcircle.com/privacy

Become a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

Avsnitt(310)

Is Working at a Large or Small Company Better for Your Career? - RRU 152

Is Working at a Large or Small Company Better for Your Career? - RRU 152

This week the panelists dive into their work backgrounds and discuss the ins and outs of working at small and large companies. They aim specifically at whether one is better than the other for building a career. Panel Jack HerringtonPaige NiedringhausTJ VanToll Sponsors Dev Influencers AcceleratorRaygun | Click here to get started on your free 14-day trial Picks Jack- Virtual CoffeePaige- Raspberry Pi Beginner's Guide 4th EditionTJ- Rocket Contact Jack: Jack Herrington – YouTubeBlue Collar CoderTwitter: Jack Herrington ( @jherr ) Contact Paige: The Home DepotPaige NiedringhausPaige Niedringhaus – MediumTwitter: Paige Niedringhaus ( @pniedri )GitHub: Paige Niedringhaus ( paigen11 ) Contact TJ: TJ VanToll's BlogProgress SoftwareKendoReactTwitter: TJ VanToll ( @tjvantoll ) Sponsored By:Raygun : Raygun now offers Real User Monitoring of Core Web Vitals. Start your 14-day free trial now.Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

18 Aug 202149min

React is a Black Box ft. Florian Rappl - RRU 151

React is a Black Box ft. Florian Rappl - RRU 151

Florian Rappl joins the Round Up to discuss React internals and how to make sense of how React works. He leads the panel through the process of understanding what React is doing when you write your JSX. He also deviates into Microframeworks a bit. Panel Paige NiedringhausTJ VanToll Guest Florian Rappl Sponsors Dev Influencers AcceleratorReact Error and Performance Monitoring | Sentry Links React is a black box. Why does that matter?The Art of Micro Frontends: Build websites using compositional UIs that grow naturally as your application scalespiral.io/community - GitterPiralflorian-rappl.deTwitter: Florian Rappl ( @FlorianRappl ) Picks Paige- GitHub | microsoft/IoT-For-BeginnersPaige- Your Code as a Crime SceneTJ- WandaVisionTJ- Black Widow Contact Paige: Paige NiedringhausPaige Niedringhaus – MediumTwitter: Paige Niedringhaus ( @pniedri )GitHub: Paige Niedringhaus ( paigen11 ) Contact TJ: TJ VanToll's BlogProgress SoftwareKendoReactTwitter: TJ VanToll ( @tjvantoll ) Special Guest: Florian Rappl.Sponsored By:Sentry: Resolve React errors and performance issues with SentryAdvertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

11 Aug 202155min

Form Validations and Open Source ft. Evyatar Alush - RRU 150

Form Validations and Open Source ft. Evyatar Alush - RRU 150

Evyatar Alush joins the Round Up to discuss Vest, a form validation library that handles form validation library in a manner similar to the way that a testing library looks. The panel walks through the process of using Vest to build validations for your forms on the web and in your React Applications. Panel Jack HerringtonPaige NiedringhausTJ VanToll Guest Evyatar Alush Sponsors Dev Influencers AcceleratorRaygun | Click here to get started on your free 14-day trial Links Creating APIs for the human developerGitHub | ealush/vestForm Validations with VEST | Alush Evyatar | Conf42: JavaScript - YouTubeTweets about VestVest - Declarative Validation TestingSvelte Forms: The Missing ManualealushTwitter: Evyatar ( @evyataral ) Picks Evyatar - RunJSJack- Twitter: G.U.N Gals ( @gungalsval )Paige- API connection - PipedreamTJ- Pokemon Unite Contact Jack: Jack Herrington – YouTubeBlue Collar CoderTwitter: Jack Herrington ( @jherr ) Contact Paige: The Home DepotPaige NiedringhausPaige Niedringhaus – MediumTwitter: Paige Niedringhaus ( @pniedri )GitHub: Paige Niedringhaus ( paigen11 ) Contact TJ: TJ VanToll's BlogProgress SoftwareKendoReactTwitter: TJ VanToll ( @tjvantoll ) Special Guest: Evyatar Alush. Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

4 Aug 202145min

Voice Recognition in React ft. Ian Lavery - RRU 149

Voice Recognition in React ft. Ian Lavery - RRU 149

Ian Lavery joins the Round Up to discuss how to add Voice Recognition to your React applications without adding heavyweight cloud solutions from the big cloud providers. Ian guides the Round Up through adding Voice Recognition, providing security and privacy, and how to understand voice recognition in general. Panel Jack HerringtonPaige NiedringhausTJ VanToll Guest Ian Lavery Sponsors Dev Influencers AcceleratorReact Error and Performance Monitoring | Sentry Links Add Voice Recognition to React Native Without Adding the CloudPicovoice: Edge Voice AI PlatformWebAssembly Ian Lavery - Medium Picovoice - MediumPicovoice - YouTubeLinkedIn: PicovoiceTwitter: Picovoice.ai ( @AiPicovoice ) Picks Ian- MandyJack- Mythic Quest | Apple Tv+Paige- Digikey ElectronicsTJ- Hoopla Contact Jack: Jack Herrington – YouTubeBlue Collar CoderTwitter: Jack Herrington ( @jherr ) Contact Paige: The Home DepotPaige NiedringhausPaige Niedringhaus – MediumTwitter: Paige Niedringhaus ( @pniedri )GitHub: Paige Niedringhaus ( paigen11 ) Contact TJ: TJ VanToll's BlogProgress SoftwareKendoReactTwitter: TJ VanToll ( @tjvantoll ) Special Guest: Ian Lavery. Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

28 Juli 202147min

Leveraging Native Features in React Native featuring Youssouf EL Azizi - RRU 148

Leveraging Native Features in React Native featuring Youssouf EL Azizi - RRU 148

Youssouf EL Azizi joins the round up to talk about the best React Native libraries that allow you to leverage the native features of the platforms you run on. Sometimes it's hard to know how to get native features into your mobile app. Whether they're not well maintained or don't cover the widest breadth of use cases, it's hard to know sometimes which ones to use. Youssouf breaks it all down for you. Panel Carl MungaziPaige NiedringhausTJ VanToll Guest Youssouf EL Azizi Sponsors Dev Influencers AcceleratorRaygun | Click here to get started on your free 14-day trial  Links The best React Native libraries for leveraging native featuresWork | ObytesGitHub | obytes/react-native-template-obytesHow to learn TypeScript for react developersNo BS TS #1 - Typescript Setup & Everyday Types - YouTubeYoussouf EL AziziTwitter: Youssouf El Azizi ( @ElaziziYoussouf ) Picks Carl- Building Mobile Apps at ScaleCarl- WODE MAYA - YoutTubeJack- React GUIPaige- Tea brewing basketsTJ- GitHub CopilotYoussouf- Cal NewPort Contact Carl: GitHub: Carl Mungazi ( CarlMungazi )Twitter: Carl Mungazi ( @CarlMungazi ) Contact Jack: Jack Herrington – YouTubeBlue Collar CoderTwitter: Jack Herrington ( @jherr ) Contact Paige: The Home DepotPaige NiedringhausPaige Niedringhaus – MediumTwitter: Paige Niedringhaus ( @pniedri )GitHub: Paige Niedringhaus ( paigen11 ) Contact TJ: TJ VanToll's BlogProgress SoftwareKendoReactTwitter: TJ VanToll ( @tjvantoll ) Special Guest: Youssouf EL Azizi . Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

21 Juli 202147min

Speech Commands and Speech Recognition in React featuring Chris Laughlin - RRU 147

Speech Commands and Speech Recognition in React featuring Chris Laughlin - RRU 147

Chris Laughlin joins the round up to discuss how to use the WebKit Speech Recognition API to interact with your react applications. This opens up a wide range of capabilities for web and React applications. Panel Carl MungaziJack HerringtonPaige NiedringhausTJ VanToll Guest Chris Laughlin Sponsors React Error and Performance Monitoring | SentryDev Influencers Accelerator Links Adding Voice Search to a React ApplicationUsing the Web Speech APIGitHub | streamich/react-useRecutDescriptSvelteNetlifyGithub Co-pilotGitHub: Chris Laughlin ( chrislaughlin ) Picks Carl- Subscribing to different newslettersChris- Script Kit by John LindquistJack- GitHub | solidjs/solidPaige- Logitech Wireless MX KeyboardTJ- Manfrotto Magic Arm Contact Carl: GitHub: Carl Mungazi ( CarlMungazi )Twitter: Carl Mungazi ( @CarlMungazi ) Contact Jack: Jack Herrington – YouTubeBlue Collar CoderTwitter: Jack Herrington ( @jherr ) Contact Paige: The Home DepotPaige NiedringhausPaige Niedringhaus – MediumTwitter: Paige Niedringhaus ( @pniedri )GitHub: Paige Niedringhaus ( paigen11 ) Contact TJ: TJ VanToll's BlogProgress SoftwareKendoReactTwitter: TJ VanToll ( @tjvantoll ) Special Guest: Chris Laughlin. Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

14 Juli 202149min

React Architecture with Tommy Groshong - RRU 146

React Architecture with Tommy Groshong - RRU 146

In today's episode, we talk about state management, dependency injection, react hooks, API access best practices and more with Tommy Groshong a React UI architect. Panel Jack HerringtonPaige NiedringhausTJ VanToll Guest Tommy Groshong Sponsors Dev Influencers AcceleratorRaygun | Click here to get started on your free 14-day trial  Links React Context for Dependency Injection Not State ManagementReduce State Management Footprint with React QueryReduce State Management Footprint with React QueryTest DoubleTommyGroshong.comLinkedIn: Thomas Groshong Twitter: Tommy Groshong ( @tgroshon ) Picks Jack- Deno DeployPaige- Ted LassoPaige- GitHub | foambubble/foamTJ- Land of the GiantsTommy- The CourierTommy- The Anarchist Handbook Contact Paige: The Home DepotPaige NiedringhausPaige Niedringhaus – MediumTwitter: Paige Niedringhaus ( @pniedri )GitHub: Paige Niedringhaus ( paigen11 ) Contact TJ: TJ VanToll's BlogProgress SoftwareKendoReactTwitter: TJ VanToll ( @tjvantoll ) Contact Jack: Jack Herrington – YouTubeBlue Collar CoderTwitter: Jack Herrington ( @jherr ) Special Guest: Tommy Groshong. Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

7 Juli 202155min

React Hook Form with Vijit Ail - RRU 145

React Hook Form with Vijit Ail - RRU 145

React Hook Form is a terrific way to manage state in, from, and through, your forms in React. Since React itself doesn't give you much to manage forms, React Hook Form steps into the gap to help you manage your forms and provide features and functionality to your forms. Our guest, Vijit Ail worked through several of the options out there for managing states and walks the panel through his decision to use React Hook Form. Panel Jack HerringtonTJ VanToll Guest Vijit Ail Sponsors React Error and Performance Monitoring | SentryDev Influencers Accelerator Links React Hook FormRedux FormFormikBundlePhobiaTypeORMNestJS Picks Jack- Nx: Smart, Extensible Build FrameworkTJ- Super Mario 3D WorldVijit- Microservices with Node JS and React | Udemy Contact TJ: TJ VanToll's BlogProgress SoftwareKendoReactTwitter: TJ VanToll ( @tjvantoll ) Contact Jack: Jack Herrington – YouTubeBlue Collar CoderTwitter: Jack Herrington ( @jherr ) Special Guest: Vijit Ail. Advertising Inquiries: https://redcircle.com/brandsPrivacy & Opt-Out: https://redcircle.com/privacyBecome a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

30 Juni 202135min

Populärt inom Business & ekonomi

badfluence
framgangspodden
varvet
uppgang-och-fall
rss-jossan-nina
rss-svart-marknad
rss-borsens-finest
bathina-en-podcast
24fragor
lastbilspodden
avanzapodden
affarsvarlden
svd-tech-brief
fill-or-kill
dynastin
rss-kort-lang-analyspodden-fran-di
rss-dagen-med-di
kapitalet-en-podd-om-ekonomi
borsmorgon
tabberaset