React Round Up show

React Round Up

Summary: A weekly discussion among React developers

Join Now to Subscribe to this Podcast

Podcasts:

 RRU 100: 100 Round Ups and more! | File Type: audio/mpeg | Duration: 40:44

Chuck and Thomas get together to discuss their favorite parts of the React Round Up. They talk about origins, favorite episodes, and the history of React. Panel Charles Max Wood Thomas Aylott Sponsors Springboard | Promo code "JABBER" gives $500 off the job-guaranteed Course G2i ________________________________________________________ "The MaxCoders Guide to Finding Your Dream Developer Job" by Charles Max Wood is now available on Amazon. Get Your Copy Today! ____________________________________________________________ Picks Thomas Aylott: Principles for Success by Ray Dalio Pandemic Charles Max Wood: Ready, Fire, Aim by Michael Masterson Legendary: A Marvel Deck Building Game

 RRU 099: Scale: In a React Code Base with Tejas Kumar | File Type: audio/mpeg | Duration: 44:35

Tejas, Thomas, and Chuck talk about what Design Systems are, how they're used, and what goes into building them. The compare them to some UI libraries that don't quite meet the mark and talk about how they fit into the development ecosystem and people's career paths. Panelist Charles Max Wood Thomas Aylott Guest Tejas Kumar Sponsors G2i ____________________________________________________________________________________________ "The MaxCoders Guide to Finding Your Dream Developer Job" by Charles Max Wood is now available on Amazon. Get Your Copy Today! ____________________________________________________________________________________________ Links Scalable Design Systems with TypeScript Tejas Kumar Talk Monaco Editor Operational UI Kent Dodds - Introducing Downshift for React Reach UI Picks Charles Max Wood Hasura The Name of the Wind Clean Coders Podcast Thomas Aylott The Checklist Manifesto Tejas Kumar Follow Tejas on Twitter https://github.com/TejasQ https://tej.as next.js Beautiful Letdown by Switchfoot Power Mentoring book by Susan Murphy

 RRU 098: Accessibility Made Easy with Brittany Feenstra | File Type: audio/mpeg | Duration: 45:36

Brittany is a software engineer for Formidable Labs. She’s a team lead for some client work and likes to poke around in their open-source stuff in her free time. Last year she gave a talk at ReactConf called ‘Accessibility is a Marathon, Not a Sprint’. She talks about her background and how she came to specialize in accessibility. Brittany believes there are a lot of small things you can do to make your website more accessible, and that following best practices in accessibility makes the website easier to navigate for the able-bodied as well. She emphasizes that having accessibility in mind from the get-go will make your website more organized overall and that making things more accessible is as easy as starting with semantic HTML. Brittany and Charles discuss the moral responsibility for businesses to make their website accessible and whose responsibility it is to enforce accessibility. Brittany feels that accessibility really isn’t that hard, but people just don’t know what it looks like or where to get started. Brittany shares some methods to improve accessibility that take very little extra effort. One of the best things you can do is use semantic HTML. To learn things like what is a header, footer, article tag, etc. is, she advises listeners to consult the documents. She talks about the importance of a good pull request and even enlisting coworkers to help you to remember to use these accessibility-friendly methods. Charles and Brittany talk about using heading outline extensions to help you see what content is getting scraped off your site. Once semantic HTML is in place, they suggest testing to see if your site works with accessibility tools like screen readers, or if you can navigate with just a keyboard. They talk about different extensions that mimic visual impairments to ensure your pages are readable. The show concludes with Brittany talking about how this all ties into React.  Panelist Charles Max Wood Guest Brittany Feenstra Sponsors NxPlaybook.com - Use code ‘NXDEVCHAT’ for 50% off the official https://nx.dev/React Advanced Workspaces course!  Sentry | Use the code “devchat” for $100 credit ____________________________ > "The MaxCoders Guide to Finding Your Dream Developer Job" by Charles Max Wood is now available on Amazon. Get Your Copy Today! ____________________________________________________________ Links Formidable Labs Accessibility is a Marathon, not a Sprint Deaf man sues Pornhub over lack of captions HTML elements reference Eslint-plugin-jsx-a11y-npm headingsMap for Chrome headingsMap for Firefox Marcy Sutton noCoffee Color contrast analyzer Writing Automated Tests for Accessibility Lighthouse Axe by Deque JSJ 344: Inclusive Components with Heydon Pickering Picks Brittany Feenstra Follow Brittany on Twitter Inclusive Components by Hendon Pickering Becoming by Michelle Obama Charles Max Wood The Name of the Wind Group coaching course for finding jobs and staying current devchat.tv/workshops

 RRU 097: State Management and React Component Design with Becca Bailey | File Type: audio/mpeg | Duration: 59:10

Guest Becca Bailey gave a talk at ReactConf in 2019 called The State of React State in 2019 and will be giving another talk at an upcoming conference. She gives a summary of her ReactConf talk, which was inspired by her experiences she has had as a developer. In her talk, she talks about different tools and testing for state management. She and the panelists discuss how to recommend changing tools to a team instead of individuals. She shares some experiences from her job. They discuss ways to keep a work culture from turning toxic and how to start the conversation about state management. The React experts talk about strategies when you chose something for a project that ends up being the wrong decision, and prevent poor decisions like that in the future. It’s important to strike a balance between preparing for the future and anticipating it. Becca and the panel discuss alternatives to using Redux for state management, and some of the advantages of using it. They discuss how to decide what is put into local versus global state and how to know when you can depreciate shared state. Becca has helped teams decide what conventions they will use moving forward for managing local and global state, which gives you a standard for code reviews that reduces decision fatigue. They discuss common use cases for refactoring. Put simply, refactoring becomes necessary when it becomes hard to make simple changes. Becca also talks about being intentional about managing team culture and ways to prevent problems from arising in the future.  Panelists Thomas Aylott Dave Cooper Charles Max Wood Guest Becca Bailey Sponsors NxPlaybook.com - Use code ‘NXDEVCHAT’ for 50% off the official https://nx.dev/React Advanced Workspaces course!  G2i ____________________________ > "The MaxCoders Guide to Finding Your Dream Developer Job" by Charles Max Wood is now available on Amazon. Get Your Copy Today! ____________________________________________________________ Links Becca’s ReactConf Talk Formidable Redux React Context Angular Dojo.io Prettier Picks Thomas Aylott Roam Research Charles Max Wood Bose Soundlink Headphones Dave Cooper Styled components Gatsby Becca Bailey Victory Brotopia

 RRU 096: React Round Up at RxJS Live | File Type: audio/mpeg | Duration: 39:15

In this episode of React Native Radio Charles Max Wood continues interviewing speakers at RxJS Live. First, he interviews Mike Ryan and Sam Julien. They gave a talk about Groupby, a little known operator. They overview the common problems other mapping operators have and how Groupby addresses these problems. The discuss with Charles where these types of operators are most commonly used and use an analogy to explain the different mapping operators.    Next, Charles talks to Tracy Lee. Her talk defines and explains the top twenty operators people should use. In her talk, she shows real-world use cases and warns against gotchas. Tracy and Charles explain that you don’t need to know all 60 operators, most people only need about 5-10 to function. She advises people to know the difference between the different types of operators. Tracy ends her interview by explaining her desire to inspire women and people of minority groups. She and Charles share their passion for diversity and giving everyone the chance to do what they love.   Dean Radcliffe speaks with Charles next and discusses his talk about making React Forms reactive. They discuss binding observables in React and how Dean used this in his business. He shares how he got inspired for this talk and how he uses RxJS in his everyday work.     The final interview is with Joe Eames, CEO of Thinkster. Joe spoke about error handling. He explains how he struggled with this as did many others so he did a deep dive to find answers to share. In his talk, he covers what error handling is and what it is used for. Joe outlines where most people get lost when it comes to error handling. He also shares the three strategies used in error handling, Retry, Catch and Rethrow and, Catch and Replace. Charles shares his admiration for the Thinkster teaching approach. Joe explains what Thinkster is about and what makes them special. He also talks about The DevEd podcast.  Panelists Charles Max Wood Guests Mike Ryan  Sam Julien Tracy Lee Dean Radcliffe Joe Eames Sponsors NxPlaybook.com - Use code ‘NXDEVCHAT’ for 50% off the official https://nx.dev/React Advanced Workspaces course!  CacheFly ____________________________________________________________ "The MaxCoders Guide to Finding Your Dream Developer Job" by Charles Max Wood is now available on Amazon. Get Your Copy Today! ____________________________________________________________   Links https://www.rxjs.live/ RxJS Live Youtube Channel https://twitter.com/mikeryandev https://twitter.com/samjulien https://twitter.com/ladyleet? https://www.npmjs.com/package/rx-helper https://twitter.com/deaniusol https://twitter.com/josepheames https://devchat.tv/dev-ed/ https://www.facebook.com/React-Round-Up https://twitter.com/reactroundup

 RRU 095: Designing Your Life | File Type: audio/mpeg | Duration: 28:48

In this episode of React Round Up Charles Max Wood hosts a solo podcast sharing his perspective on designing your perfect life. In this episode he addresses finding your dream job, building your dream life, and staying current. Start by deciding where you want to end up. Do you see yourself retiring? Working forever? Charles shares his vision for his future and discusses the retirements of others in his life.  Working back from the end of your life, Charles has you ask yourself what kind of life and career you want. Charles shares his vision for both his personal life and his career. After you pick your goal, build the skills, and knowledge to reach that goal. He uses the example of becoming a speaker at conferences. He also recommends you find a mentor or someone who has sone what you want to and get there help. Charles explains how important it is to get out of your own way mentally. Many people find reasons real or imagined as to why they can’t reach their goal. He agrees that the world is unfair and barriers can be real. The best way to show others they can overcome barriers is by doing it yourself and working towards your goals. You can if you believe you can and you work for it.  Panelists Charles Max Wood Sponsors NxPlaybook.com - Use code ‘NXDEVCHAT’ for 50% off the official https://nx.dev/React Advanced Workspaces course!  G2i CacheFly ____________________________________________________________ "The MaxCoders Guide to Finding Your Dream Developer Job" by Charles Max Wood is now available on Amazon. Get Your Copy Today! ____________________________________________________________   Links https://www.facebook.com/React-Round-Up https://twitter.com/reactroundup Picks Charles Wood: The Riftwar Cycle The Man in the High Castle

 RRU 094: React Round Up Live at GitLab Commit 2019 | File Type: audio/mpeg | Duration: 54:08

In this episode of React Round Up Charles Max Wood interviews speakers at GitLab Commit 2019. Eddie Zaneski from Digital Ocean talks about "Creating a CI/CD Pipeline with GitLab and Kubernetes in 20 minutes", Shamiq Islam from Coinbase talks about "Closing the SDLC Loop- Automating Security" and Jasmine James, from Delta Airlines, discusses " How Delta Became Cloud Native-Avoiding the Vendor Lock". Eddie, Shamiq, and Jasmine give the 5 min "elevator pitch" for the talks they gave at the conference. In his talk, Eddie deploys a fake startup going through the whole pipeline: building the application, containerizing an application and shipping it off to Kubernetes. Shamiq, talks about how the conventional approach to security is to consider it at the very end after all developer has wrapped up their work and why that should change. Jasmine explains more in-depth what it means for a big corporation like Delta to be in a Vendor Lock. Sponsors NxPlaybook.com - Use code ‘NXDEVCHAT’ for 50% off the official https://nx.dev/React Advanced Workspaces course! Sentry use the code "devchat" for 2 months free on Sentry's small plan ABOUT YOU | aboutyou.com/jobs Cachefly Links Creating a CI/CD Pipeline with GitLab and Kubernetes in 20 minutes by Eddie Zaneski Hacktoberfest presented by DigitalOcean and DEV Commit Brooklyn 2019: Closing the SDLC Loop - A Security Panel by Shamiq Islam Commit Brooklyn 2019: How Delta Became Truly Cloud Native - Avoiding the Vendor-Lock by Jasmine James

 RRU 093: React Round Up at JAMstack Conf SF 2019 | File Type: audio/mpeg | Duration: 57:34

In this episode of React Round Up Charles Max Wood interviews speakers at JAMstack Conf SF. Mandy Michael gives a talk about responsive typography and variable fonts. Mandy explains what variable fonts are and how they can be used to shrink, stretch and do some very fun and creative thing with them. They discuss how to use them and Mandy explains some of the demos from her talk.    Charles asks Mandy what some of the things were that she had to cut from her talk. She had to cut a few longer demos, details and performance improvements that can be made with responsive typography. Mandy shares what she is working on now with responsive typography and explains how much fun she has had expressing herself through variable fonts. To see more of Mandy’s demos and to learn more about responsive typography and variable fonts see the links below.    Next, Charles interviews Shawn Erquhart work runs the Netlify CMS project. Charles shares his experience using Netlify and Shawn addresses some of the issues Charles has come across. Charles does say the using Netlify is simple, clean and nice. Shawn shares the origin story of Netlify. They discuss what it means to be a git-based content management system.    They discuss how to contribute to the Netlify CMS open source project. Charles mentions his book and they discuss how contributions to open source projects like these are a great way to get a job. Shawn explains how to get started implementing Netlify CMS and how they target different static site generators. Finally, Charles talks with Tammy Everts. Tammy gives a listeners a sneak peek into her talk about website performance, more specifically JavaScript performance. Charles discusses the performance of Devchat.tv and Google Lighthouse scores. Tammy explains that while Google Lighthouse is good it isn’t completely reliable and can miss chunks of time when your JavaScript is failing and you have unhappy users. Tammy shares ways to drill down and see how your JavaScript is behaving in the wild. She talks about blocking Javascript which every developer is familiar with and non-blocking JavaScript that has high blocking CPU time which makes for janky sites. Tammy and Charles discuss what CPU is and what it measures. Tammy names resources and tools to help avoid this problem.  Rules of thumb for avoiding these issues are explained by Tammy. First, Reduce, make sure all the JavaScript needs to be there. Next, Monitor, track your metrics. She also suggests working with vendors and maintaining a performance budget for metrics that matter. The interview ends with a little about Speedcurve and what they do. Tammy is the CXO of Speedcurve.  Panelists Charles Max Wood Guest Mandy Michael Shawn Erquhart Tammy Everts Sponsors NxPlaybook.com - Use code ‘NXDEVCHAT’ for 50% off the official https://nx.dev/React Advanced Workspaces course! Sentry use the code “devchat” for 2 months free on Sentry small plan Cachefly Links https://www.netlify.com/ https://www.netlifycms.org/ https://twitter.com/erquhart https://jamstackconf.com/sf/ https://variablefonts.dev/ https://codepen.io/collection/XqRLMb/ https://twitter.com/Mandy_Kerr? https://speedcurve.com/ https://twitter.com/tameverts? https://www.facebook.com/React-Round-Up https://twitter.com/reactroundup

 RRU 092: The Future of APIs, GraphQL, and Developer Tooling with Sean Grove | File Type: audio/mpeg | Duration: 1:01:32

Today the panel and Sean Grove are talking about the future of programming with GraphQL. GraphQL is a new way of building APIs that is more product and frontend focused. All of the panelists agree that it is easy to get exactly what they need with ease when using GraphQL. There are also benefits for backend developers too, since GraphQL lets you see exactly what fields your clients are using. You can also reach out to specific clients who have accessed specific fields before. This is possible because every GraphQL server is introspectable by a computer, and Sean explains how it works. This introspectivity is the basis for an idea he has that allows users to generate realistic fake data before signing up so they know exactly how their application will work before committing, and gives some examples of how it can be used. They all agree that GraphQL is very well formatted and that it provides solutions to real world problems,  The conversation turns to the article How OneGraph Onboards Users Who are New to GraphQL. In particular, they discuss how the GraphiQL Explorer works versus OneGraph. GraphiQL Explorer is an extension that will look at your operations and generate a full React or Bash app from them. Sean talks about the different kinds of operations and how naming them can help you track their performance more easily. There is even a code generator that will flag unnamed queries to help you learn best practices, but won’t stop you from running your code. They talk about the benefits of using OneGraph, a single graphQL endpoint through which you can get all your data from other apps. By wrapping all the APIs in GraphQL, you get access to all the nice GraphQL tooling. They talk about how it works and some of the benefits it can have, such as helping you stay under rate limits. They talk about other interesting tools available for GraphQL and what the explosion of tools means for the GraphQL community. They talk more about how GraphQL fits into the React environment and what they think the future holds.  Panelists Thomas Aylott Charles Max Wood Guest Sean Grove Sponsors NxPlaybook.com - Use code ‘NXDEVCHAT’ for 50% off the official https://nx.dev/React Advanced Workspaces course!  Sentry | Use the code “devchat” for $100 credit Links GraphQL JS CodeShift Comby How OneGraph Onboards Users That Are New To GraphQL GrapiQL  Excel GraphiQL Explorer Bash OneGraph Hasura Framer Swift.ui  Picks Thomas Aylott Framer Famous Charles Max Wood Stop-motion animation Christmas movies (like Rudolph the Red-Nosed Reindeer) A Christmas Story Sean Grove Moon Highway Draftbit  SuperMario Land 2 Exploration

 RRU 091: React Best Practices | File Type: audio/mpeg | Duration: 42:10

In this week’s episode of React Round Up the panel works their way through a blog post outlining best practices for React. The first is “keeping components small and function-specific”. The panel discusses the pros of using this best practice and how it relates to the single responsibility principle. This best practice also helps with the next, “reusability is important”. The panel considers this second best practice and points out some of its flaws. It recommends avoiding the creation of new components. The panel explains that by avoiding creating new components it saves time but can also cause problems as you adapt components to fit more projects.  The next best practice is “consolidate duplicate code”, the panel shares their philosophies on dry code and when to consolidate. The fourth best practice is comment only when necessary, Charles explains how he uses comments to help him keep track of things inside his code and the panel warns against using too many comments as it may clog up your code making it hard to read.  The fifth best practice is, “name the component after the function”. The panel explains how it is an art finding a name that is not too generic but is not overly specific; mastering the art of naming is something that will benefit everyone.  Naming relates to the sixth best practice as well. “Use capitals when naming components”. The panel explains the need for convention and advises developers not to go off-book as this will slow down others.  The last six best practices are all self-explanatory says the panel. “Separate stateful aspects from rendering” is nothing new. “Code should execute as expected and be testable”, the panel explains how this allows for trust between developers.  “All files relating to a single component should be in the same folder”, this makes everything easy to find when necessary.  “Use tools like Bit”, while the panel doesn’t use Bit, they share tool recommendations. They also comment on the progress being made it tooling and the future of automated tools. “Use snippet libraries”, the panel discusses favorite libraries and building their own libraries. The final best practice is “Follow linting rules”. Panelists Charles Wood Christopher Reyes Thomas Aylott Sponsors NxPlaybook.com - Use code ‘NXDEVCHAT’ for 50% off the official https://nx.dev/React Advanced Workspaces course!  Sentry– use the code “devchat” for two months free on Sentry’s small plan CacheFly Links https://teachablemachine.withgoogle.com/  Practical React Hooks: How to refactor your app to use Hooks  12 React Best Practices You Need to Follow in 2020  https://github.com/nadeesha/saul  https://www.facebook.com/React-Round-Up https://twitter.com/reactroundup Picks Charles Wood: White Christmas  Holiday Inn  The MaxCoders Guide To Finding Your Dream Developer Job  Christopher Reyes: https://github.com/microsoft/vscode-eslint  https://www.playingwithfire.co/  Thomas Aylott: test && commit || revert

 RRU 090: How Do I Introduce New Tech at Work? | File Type: audio/mpeg | Duration: 38:25

Today the panel is discussing how to introduce new tech at work. They agree that it’s important to get input from all teams on the decision, although it will primarily affect the development team. One should also consider the different ways people make decisions, such as through discussion or quiet thinking, and give everyone time to come to a decision. The panel talks about positive and negative examples of how to introduce new tech at work. Thomas believes that it is important to acknowledge your own biases in decision making and to try to avoid them. The React experts discuss the significance of the team dynamic and the necessity of different roles in decision making or if it is better to have an organic discovery phase. This relates to Thomas’ point about personal biases, and he believes that it is important to put people in roles that are opposite of their personality. When making decisions about new technology, it is also important to note that not all decisions require the same amount of input, and they discuss how to measure how much input is required for a decision. The discussion turns to methods for introducing testing, and the panelists talk about their experiences. The rule of thumb for introducing testing is to start simple, have an expected behavior, and test the output to see if it matches. Some other aspects of this discussion to consider are that introducing React Hooks could be considered introducing tech, testing is just a new process, introducing new tools, and budget concerns. Charles shares experience convincing his boss to introduce Agile practices which shows the importance of getting management to see the benefits of the new tech or strategy for themselves. The show concludes with the panel acknowledging that other than introducing tech, introducing philosophies on how to organize your code follows the same patterns as introducing technology. Panelists Thomas Aylott Charles Max Wood Chris Reyes Sponsors NxPlaybook.com - Use code ‘NXDEVCHAT’ for 50% off the official https://nx.dev/React Advanced Workspaces course!  Sentry | Use the code “devchat” for $100 credit Links Vue 12 React Best Practices You Need to Follow in 2019 Saul Test && commit || revert VS Code ESLint Picks Thomas Aylott Teachable Machine Charles Max Wood White Christmas Holiday Inn Chris Reyes Practical React Hooks

 RRU 089: Progressive Enhancements with Ire Aderinokun | File Type: audio/mpeg | Duration: 12:34

In this episode of React Round Up Charles Max Wood interviews Ire Aderinokun at JAMstack conf 2019. Ire works for Buycoins, a cryptocurrency exchange for Africa. She gave a lightning talk, “Headless Chrome & Cloudinary for progressively enhanced dynamic content on the web”. After giving a brief overview of her talk to Charles, Ire defines progressive enhancement for the listeners.    Walking through how progressive enhancement works, she explains how Headless Chrome and Cloudinary helped her with the project she shared in the talk. Ire and Charles consider the blindspot that developers experience because they work on high-end devices and how using progressive enhancement helps those who use lower-end devices.   Ire shares her experience with JAMstack and explains how progressive enhancement works with JAMstack. Charles shares his experience using JAMstack. The episode ends with Ire giving advice and resources to help get started with progressive enhancement.    Panelists Charles Wood Guest: Ire Aderinokun Sponsors Nrwl | Nx.Dev/React Sentry– use the code “devchat” for two months free on Sentry’s small plan CacheFly Links https://buycoins.africa/ Headless Chrome & Cloudinary for progressively enhanced dynamic content https://github.com/ireade/caniuse-embed https://ireaderinokun.com/ https://twitter.com/ireaderinokun https://github.com/ireade https://www.facebook.com/React-Round-Up https://twitter.com/reactroundup

 The MaxCoders Guide To Finding Your Dream Developer Job | File Type: audio/mpeg | Duration: 14:35

"The MaxCoders Guide to Finding Your Dream Developer Job" by Charles Max Wood is available on Amazon. Get your copy here today only for $2.99!

 RRU 088: Frustrations with React Hooks with Paul Cowan | File Type: audio/mpeg | Duration: 1:06:50

Paul Cowan was a painter and decorator for 30 years until he switched to front end development. He got into React because for him, much of programming didn’t make a whole lot of sense until he read about the flux model, and React Redux was one of the few frameworks that followed the flux model. Spending most of his life outside of the programming world has granted him a unique perspective frameworks like React. He talks about some of his frustrations with React hooks. Hooks can be frustrating because it’s a new paradigm to learn JS, the dependencies array can get bungled, React relies on the order in which hooks are called, and closures can be difficult. Overall, hooks come off at deceptively simple. Paul believes that we shouldn’t need external tooling to keep the dependency array on the right track. To avoid these frustrations, Paul reminds listeners that hooks have to be called in the same order each time at the beginning of your functional components. You also cannot have a hook in an if statement or event handler. It’s also important to remember the declarative nature of React. In production code, updating states is the best way to go.  The panel agrees that it’s good that react has clarified their position on what hooks are supposed to be used for, and how we are beginning to see the limitations of React hooks. They discuss unit testing with hooks and how to determine when the React framework becomes too big. They talk about some of the new features that are coming out and how they benefit new developers. When mistakes do happen, Paul talks about how he determines what went wrong. If you want to get advice from other humans, they suggest consulting StackOverflow, ReactiveFlux, and IRC chat. When you do consult these sources, it’s important that your problem is reproducible so that it’s easier for people to help you out. It’s also important that you learn how to ask questions.  The show finishes with them discussing how they handle changes in the industry. They have found that reusing components is difficult across Angular and React. They talk about the positive ways that React went version to version. They discuss complexity management in apps. The panel talks about some ways to do things in React without hooks, but also caution that avoiding the popular thing can also get you into trouble.  Panelists Thomas Aylott Charles Max Wood Chris Reyes Guest Paul Cowan Sponsors Nrwl |  Nx.Dev/React Sentry | Use the code “devchat” for $100 credit   _______________________________________________________ "The MaxCoders Guide to Finding Your Dream Developer Job" by Charles Max Wood will be out on November 20th on Amazon. Get your copy on that date only for $1. _______________________________________________________ Links Flux model React Redux useReducer Frustrations with React Hooks Solutions to Frustrations with React Hooks ESLint Next.js Relay Selenium StackOverflow ReactiveFlux Picks Thomas Aylott Shada Charles Max Wood The MaxCoders Guide to Finding Your Dream Developer Job It’s A Wonderful Life Mr. Kreuger’s Christmas Chris Reyes Netlify React Hooks deep dive AirPods Pro Paul Cowan Solutions to Frustrations with React Hooks Stay fit

 RRU 087: The why-did-you-render Library and React Performance with Vitali Zaidman | File Type: audio/mpeg | Duration: 45:17

Vitali Zaidman works for the WellDone Software consultancy. He has worked with a lot of different technologies, but currently works with React. In a recent React meetup, he talked about React performance. When someone says that React is not performant, Vitali disagrees and says that it is very performant unless you do certain things. If your React application is slow, it’s down to the tools you use. The panelists all agree that premature optimization is the root of all evil. The difference between premature optimization and good architecture comes down to experience. It is important to be data driven and consider performance a business environment. Vitali believes that performance is a feature and should be treated like any other.  The panel discusses accessibility versus internationalization. Launching to one language is different than launching to one set of abilities. While you don’t need to internationalize on day one, don’t make it impossible to internationalize. They talk about how creating a timeline of changes in your project can help you pinpoint where your performance issues came from. It is also important to remember that developers have strong computers, while users generally do not. As you build, check your product on slower devices to make sure that it works for your users.  Vitali talks about his tool why-did-you-render, which will notify you of avoidable re-renders. He also talks about considering why you are choosing to use React and whether or not is the correct choice for your project. The panel discusses their feelings on pure components. They talk about the importance of code review and manual QA since not everything can be automated, again suggesting having a slow computer or phone in the office to test as you go. They also agree that it is important to understand how your library works. They talk about the huge amount of work that is required to maintain an open source project, and how development is a team effort if you want to create sustainable software. The show concludes with Vitali talking about a performance issue he encountered and how he recognized it, diagnosed the problem, and fixed it.  Panelists Thomas Aylott Lucas Reis With special guest: Vitali Zaidman Sponsors Nrwl | Nx.Dev/React Sentry use the code “devchat” for 2 months free on Sentry’s small plan Ruby Rogues Links Knockout Why did you render Fusion.js: A Plugin-based Universal Web Framework - Leo Horie React Element's 'Parent' vs Rendered By How To Reduce Unnecessary Re-Renders Why Performance Matters Performance Impact Calculator Welldone Software Follow DevChatTV on Facebook and Twitter Picks Thomas Aylott: Face-API.js React force graph React 3 Fiber Lucas Reis: Opendoodles.com Adopting Optimizely at Compass Vitali Zaidman: JSJ 402: SEO for Developers with Vitali Zaidman

Comments

Login or signup comment.