JSJ 315: The effects of JS on CSS with Greg Whitworth

JavaScript Jabber

Episode | Podcast

Date: Wed, 30 May 2018 10:00:00 +0000

<div class="trix-content"> <div><strong>Panel: </strong></div><ul> <li>AJ O’Neal</li> <li>Aimee Knight</li> </ul><div> <strong>Special Guests: </strong>Greg Whitworth</div><div>In this episode, the JavaScript Jabber panelists discuss the effects of JavaScript on CSS with Greg Whitworth. Greg works on Microsoft EdgeHTML, specifically working on the Microsoft Layout team, is on the CSS working group, and is involved with the Houdini task force. They talk about JS engines and rendering engines, what the CSSOM is, why it is important to understand the rendering engine, and much more!</div><div><strong>In particular, we dive pretty deep on:</strong></div><ul> <li>Greg intro</li> <li>What is the Houdini task force?</li> <li>Extensible web manifesto</li> <li>DOM (Document Object Model)</li> <li>Layout API</li> <li><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Projects/SpiderMonkey/Parser_API">Parser API</a></li> <li><a href="https://babeljs.io/">Babel</a></li> <li><a href="https://jquery.com/">jQuery</a></li> <li>Back to basics</li> <li> <a href="https://www.javascript.com/">JavaScript</a> engine and rendering engine</li> <li>What is the CSSOM?</li> <li>Every browser has its separate JS engine</li> <li>Browsers perspective</li> <li><a href="http://shoptalkshow.com/episodes/306-debugging-css-aimee-knight/">Aimee ShopTalk Podcast Episode</a></li> <li>Why is it important to understand how the rendering engine is working?</li> <li>Making wise decisions</li> <li>Give control back to browser if possible</li> <li>When you would want to use JavaScript or CSS</li> <li>Hard to make a hard or fast rule</li> <li>CSS is more performant</li> <li>Overview of steps</li> <li>And much, much more!</li> </ul><div><strong>Links:</strong></div><ul> <li><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Projects/SpiderMonkey/Parser_API">Parser API</a></li> <li><a href="https://babeljs.io/">Babel</a></li> <li><a href="https://jquery.com/">jQuery</a></li> <li><a href="http://shoptalkshow.com/episodes/306-debugging-css-aimee-knight/">Aimee ShopTalk Podcast Episode</a></li> <li><a href="https://www.javascript.com/">JavaScript</a></li> <li><a href="https://twitter.com/gregwhitworth?ref_src=twsrc%255Egoogle%257Ctwcamp%255Eserp%257Ctwgr%255Eauthor">@gregwhitworth</a></li> <li><a href="http://www.gwhitworth.com/">GWhitworth.com</a></li> <li><a href="https://github.com/gregwhitworth">Greg’s GitHub</a></li> <li> </li> </ul><div><strong>Sponsors</strong></div><ul> <li><a href="https://www.telerik.com/kendo-ui?utm_medium=social-paid&amp;utm_source=devchattv&amp;utm_campaign=kendo-ui-awareness-jsjabber">Kendo UI</a></li> <li><a href="https://promo.linode.com/javascriptjabber/">Linode</a></li> <li><a href="https://www.freshbooks.com/invoice?ref=11731&amp;utm_source=pbm&amp;utm_medium=affiliate-program&amp;utm_influencer=419364&amp;utm_campaign=podcast-influencers">FreshBooks</a></li> </ul><div><strong>Picks:</strong></div><div>AJ</div><ul> <li><a href="https://www.microsoft.com/en-us/surface">Microsoft Surface</a></li> <li>Microsoft Cursor</li> </ul><div>Aimee</div><ul> <li>Greg’s Talk</li> <li><a href="http://www.sarahmei.com/blog/2014/04/07/what-your-conference-proposal-is-missing/"><em>What Your Conference Proposal Is Missing</em> by Sarah Mei</a></li> </ul><div>Greg</div><ul> <li><a href="http://shoptalkshow.com/episodes/306-debugging-css-aimee-knight/">Aimee ShopTalk Podcast Episode</a></li> <li><a href="https://www.youtube.com/watch?v=cCOL7MC4Pl0">Jake Archibald Tasks Talk</a></li> </ul> </div> Support this podcast at — https://redcircle.com/javascript-jabber/donations Advertising Inquiries: https://redcircle.com/brands Privacy & Opt-Out: https://redcircle.com/privacy