Back to Basics Let's Code some web stuff

on YouTube ↗43m

" summary

Shows a concrete workflow: inspects a legacy site, writes a small script that uses fetch HEAD to detect png vs gif, parses mangled comments with DOMParser, and wires image previews into the page using developer tools Overrides. Publishes the injector on GitHub Pages and distributes it as a bookmarklet (falls back to an extension when blocked). Demonstrates Playwright for automated rendering checks; the CSDB preview works live and speeds up browsing.

AI-written summary · about

" chapters (14)

1. 0:00Introduction
2. 7:38Enhance remote web content
3. 9:26Inspect the page
4. 12:41Get the content
5. 14:14HTML5 parser
6. 15:58GitHub Pages
7. 17:56Bookmarklet
8. 20:59Web components
9. 22:32Interfaces
10. 25:27Fire Round
11. 29:48CSS generated content
12. 31:44Conclusion
13. 33:02Favorite things in the web
14. 37:27Browser extensions

" related talks

• 33mTooling For The Modern WebApp DeveloperAddy Osmani · dotJS 2012
• 44mAdvancing the web without breaking it?Christian Heilmann · beyond tellerrand Düsseldorf 2015
• 44mEnhance!Jeremy Keith · beyond tellerrand Düsseldorf 2015
• 31mThe Bumpy Road to Universal JavaScriptJohannes Ewald · JSCamp 2018
• 53mWait, I have to test the front end too?Amy Kapernick · NDC Sydney 2020
• 38mSecret Shortcuts of Loading Web PerformanceNikola Mitrovic · NDC Porto 2023
• 26mI Don't Hate JavaScript AnymoreMichael Szul · NationJS Frontrunners 2019
• 34mWeb development isn't about you, dudeCharlie Owen · CSSConf Budapest 2017