A Modern Front-End Workflow

on YouTube ↗31m

" summary

Announces a paid video course called modern dev tools and demos concrete features: console violations that flag long JS calls, experimental timeline flow in Canary that draws arrows between events, accessibility audits and a color-contrast line in the color picker, the coverage panel that pinpoints unused CSS and JS, and server-side metrics via the server-timing module (npm install server-timing). Shows an integrated terminal and file-system persistence that edit SASS/CSS in-browser—live demo works but is visibly buggy.

AI-written summary · about

" chapters (10)

1. 0:00Start
2. 1:01THANK YOU RENDERCONF
3. 5:20CONSOLE VIOLATIONS
4. 14:30CSS VARIABLE SUPPORT
5. 14:53OBJECT PREVIEWS
6. 15:57SMART CONSOLE
7. 17:32DOCKING SUPPORT
8. 17:46SERVER TIMING
9. 19:06CODE COVERAGE
10. 21:43LIGHTHOUSE A

" related talks

• 33mTooling For The Modern WebApp DeveloperAddy Osmani · dotJS 2012
• 20mJavaScript Authoring ToolingPaul Irish · Fluent 2013
• 35mOptimise your Web Development WorkflowUmar Hansa · ffconf 2016
• 51mModern CSS Development: Tooling & WorkflowsUmar Hansa · CSS Day 2023
• 21mFuture of Web ToolingNikita Vasilyev · JSConf EU 2014
• 40mModern CSS Development and DebuggingUmar Hansa · Pixel Pioneers 2023
• 25mDevTools: State of the Union 2022Jecelyn Yeen · Google I/O 2022
• 57mPanel 7: Testing and toolingRemy Sharp, Paul Irish, Simon Mavi Stewart, David Blooman, Ivan Žužak · Edge Conference 2013