#advanced

Subscribe
Advanced in the context of JavaScript means having a deep understanding of the language and its features. This includes being able to write complex code that makes use of advanced language features such as closures, prototypes, classes, and asynchronous programming. Advanced JavaScript developers are also capable of creating custom libraries and frameworks to extend the language’s capabilities. Additionally, they should be able to debug and optimize their code to ensure it runs efficiently.
React Performance Debugging Masterclass
React Summit 2023React Summit 2023
170 min
React Performance Debugging Masterclass
Top Content
Featured WorkshopFree
Ivan Akulov
Ivan Akulov
Ivan’s first attempts at performance debugging were chaotic. He would see a slow interaction, try a random optimization, see that it didn't help, and keep trying other optimizations until he found the right one (or gave up).
Back then, Ivan didn’t know how to use performance devtools well. He would do a recording in Chrome DevTools or React Profiler, poke around it, try clicking random things, and then close it in frustration a few minutes later. Now, Ivan knows exactly where and what to look for. And in this workshop, Ivan will teach you that too.
Here’s how this is going to work. We’ll take a slow app → debug it (using tools like Chrome DevTools, React Profiler, and why-did-you-render) → pinpoint the bottleneck → and then repeat, several times more. We won’t talk about the solutions (in 90% of the cases, it’s just the ol’ regular useMemo() or memo()). But we’ll talk about everything that comes before – and learn how to analyze any React performance problem, step by step.
(Note: This workshop is best suited for engineers who are already familiar with how useMemo() and memo() work – but want to get better at using the performance tools around React. Also, we’ll be covering interaction performance, not load speed, so you won’t hear a word about Lighthouse 🤐)
Gain Performance! Take Your Run Time to Build Time
React Summit US 2024React Summit US 2024
12 min
Gain Performance! Take Your Run Time to Build Time
Hi everyone! I'm Rohit, a founding engineer at Tria. We are working on bringing the world to Web3 using names. My talk is about gaining performance and taking runtime to build time. There is an upward trend in libraries towards build time optimization, especially in React. Build time optimization improves performance, reduces bundle size, and provides more predictable software. Babel is a free and open source JavaScript transpiler that allows leveraging latest JavaScript features and moving computationally heavy logic from runtime to build time. Building a Babel plugin involves checking for a style prop inside an HTML tag and searching for aliases or token values. The visitor pattern is used to define the JSX type of node and access its path and attributes. The plugin can be customized for different utilities by defining aliases and tokens in a config file. Helpful resources for understanding and building custom Babel plugins include the Babel handbook, Babel docs, astexplorer.net, and the speaker's Twitter account.
Implementation of Schedules and Timelines
React Advanced 2023React Advanced 2023
6 min
Implementation of Schedules and Timelines
Watch video: Implementation of Schedules and Timelines
Today's Talk focuses on implementing schedules and timelines using the PlanBy component. PlanBy is a React-based tool that offers a simple interface and features like sidebar, timeline, layout, and live program refreshing. It uses a custom virtualized view to handle large amounts of data efficiently. The component allows for easy customization and can be used to build schedulers, conference agendas, TV guides, and more. Installation is straightforward, requiring only a few components, one hook, and two wrappers.
Advanced linting rules with ESLint
TypeScript Congress 2023TypeScript Congress 2023
10 min
Advanced linting rules with ESLint
Tibor Blanesy from Sonar presents advanced techniques for linting with ESLint, including the use of ControlFlowGraph to detect errors in code. The algorithm is based on liveness analysis, which identifies live variables at any point in the program. Additionally, the talk covers the computation of block sets using the difference between outset and kill set unionized with genset.
Advanced GraphQL Architectures: Serverless Event Sourcing and CQRS
React Summit 2023React Summit 2023
28 min
Advanced GraphQL Architectures: Serverless Event Sourcing and CQRS
Watch video: Advanced GraphQL Architectures: Serverless Event Sourcing and CQRS
GraphQL is a strongly typed, version-free query language that allows you to ask for specific data and get it in JSON format. It simplifies data retrieval and modification by allowing the server to handle all necessary operations. Serverless architectures, such as AWS Lambda, are scalable, cost-effective, and good for event-driven applications. Event sourcing and CQRS are techniques that ensure consistency and separate reading and writing parts of an application. Building a GraphQL API with commands and queries can be achieved using AWS AppSync and DynamoDB. This approach offers low latency, scalability, and supports multiple languages. Challenges include application complexity, data modeling, and tracing, but starting with simplicity and making something work first can lead to success.
What Happens When You Build Your App
React Advanced 2022React Advanced 2022
20 min
What Happens When You Build Your App
Today's Talk dives deep into React Native development, exploring the development process, JavaScript-native communication, and app deployment. It highlights the app building process, the React Native Run iOS command, and development gestures for efficient execution. The Talk also emphasizes the recommended process for starting and testing your app, as well as handling the 'red screen of death' error by installing missing libraries and understanding the role of the UI manager in creating native views.
Everything You Need to Get Your GQL Server Production Ready
GraphQL Galaxy 2021GraphQL Galaxy 2021
130 min
Everything You Need to Get Your GQL Server Production Ready
WorkshopFree
Uri Goldshtein
Uri Goldshtein
There are always a lot of questions and conference talks about bringing GraphQL servers into production, but there aren’t a lot of good concrete steps and actions to follow. In the workshop Uri (The founder of The Guild) will walk you through The Guild’s process of bringing GraphQL Server into production.

We will add:

- Powerful Caching
- Logging, Monitoring and tracing
- Security features like Auth, Error Masking, Persisted Operations, Depth and Rate limit
If you are planning to have your GraphQL server running in production, this is a must have workshop for you!
Advanced Patterns for API Management in Large-Scale React Applications
React Advanced 2021React Advanced 2021
20 min
Advanced Patterns for API Management in Large-Scale React Applications
Top Content
This Talk covers advanced patterns for API management in large-scale React applications. It introduces the concept of an API layer to manage API requests in a more organized and maintainable way. The benefits of using an API layer include improved maintainability, scalability, flexibility, and code reusability. The Talk also explores how to handle API states and statuses in React, and provides examples of canceling requests with Axios and React Query. Additionally, it explains how to use the API layer with React Query for simplified API management.
We Don’t Know How React State Hooks Work
React Advanced 2021React Advanced 2021
28 min
We Don’t Know How React State Hooks Work
This talk explores how useState works under the hood and why it's important to understand. It addresses the common confusion around the callback to setState and provides insights gained from exploring React hooks source code. Knowing how useState works is important for learning patterns, debugging, and gaining confidence in our code. React manages the current value of hooks in a linked list and performs updates sequentially. React optimizes rendering by caching computations and performing shallow renders when the state doesn't change.
Inside Fiber: An Overview of React's Reconciliation Algorithm
React Summit Remote Edition 2021React Summit Remote Edition 2021
20 min
Inside Fiber: An Overview of React's Reconciliation Algorithm
React Fiber is a reconciliation algorithm introduced in React 16 to address laggy input fields and heavy rendering. The old stack reconciler caused a laggy experience by re-rendering the entire subtree immediately. React Fiber solves this by breaking work into incremental units and assigning priorities. It introduces concurrent mode to make apps responsive and adaptable. The useDeferredValue hook is commonly used to keep the interface responsive by rendering components immediately and others at a later time.
We Don’t Know How React State Hooks Work
React Summit Remote Edition 2021React Summit Remote Edition 2021
7 min
We Don’t Know How React State Hooks Work
This Talk provides an introduction to React Staytools, explaining how to use the state and setState function to update a counter. It also delves into the inner workings of React rendering, discussing the update queue and re-rendering conditions. The Talk concludes by mentioning the different modes of updating and triggering re-renders in React, and encourages further exploration of the source code and discussion in Discord.
Road to a Better UX with Suspense and Concurrent UI
React Summit Remote Edition 2021React Summit Remote Edition 2021
9 min
Road to a Better UX with Suspense and Concurrent UI
This talk explores how React Suspense and Concurrent mode can enhance the user experience by controlling loading areas, prefetching data, and reducing loading time. It demonstrates how UseTransition can remove unnecessary loaders by skipping the loading state if data arrives within a specified time. The speaker advises using these experimental features in personal projects rather than enterprise applications. The talk concludes with an invitation to join the journey at Postman and thanks to the organizers, sponsors, speakers, and audience for making the conference a success.