October 17, 2018 #362 — October 17, 2018Read on the WebFrontend Focus Rhythm in Web Typography — Horizontal rhythm mostly impacts the legibility, while vertical rhythm impacts the readability of the text and establishes a sense of visual hierarchy.Matej LatinSmart Bundling: How To Serve Legacy Code Only To Legacy Browsers — More browsers than ever are releasing frequent updates and supporting modern standards, so with code size rising fast, is it time to rethink asset delivery for the modern web?Shubham Kanodia Functional Programming with JavaScript. Did You Get the Cheat Sheet? — JavaScript developers, here’s a handy resource for your reference stack. Download this handy resource containing short definitions, tips, code examples of arrow functions and more. Get your copy.Progress Kendo UI sponsorWhat’s New in the Latest Microsoft Edge Update — EdgeHTML 18 is now available with the Windows 10 October 2018 Update, featuring Web Authentication API support, Service Worker improvements, new WebView features, CSS Masking, new autoplay policies, and more.Kyle Pflug (Microsoft)Why Don’t We Add A lovely Element to HTML? — The title is tongue in cheek, but this post explores HTML elements, why we don’t have certain HTML elements that would be useful to have, and workarounds.Bruce LawsonChrome 70 Release: What’s New for Developers? — Chrome 70 brings support for desktop-based progressive web apps (PWAs) on Windows, Web Bluetooth support on Windows 10, support for public key credentials in the Credential Management API, and named Web Workers. The DevTools also have numerous improvements.Google DevelopersAn Introduction to Houdini’s Animation Worklet — In future, you might not need to worry about requestAnimationFrame.. as Animation Worklet will let you create imperative animations that run at a device’s native frame rate more easily. Only in Chrome Canary for now.Surma (Google)? JobsWork on Uber’s Open Source Design Language — We’re developing Base UI, a new React component library for web applications at Uber and beyond. Join our team.UberJoin Our Career Marketplace & Get Matched With A Job You Love — Through Hired, software engineers have transparency into salary offers, competing opportunities, and job details.Hired? TutorialsThe MDN CSS Layout Cookbook — Now with seven handy ‘recipes’ for implementing things like breadcrumb navigation, centering an element, and sticky footers with modern Web techniques.MDN Web DocsCSS Animations with Finite State Machines — An explanation of state machines based around their relevance to CSS.David KhourshidHow to Stop using console.log() and Start using Your Browser’s DebuggerParag ZaveriHTML for Numeric ZIP Code Inputs — Take care, because ZIP codes aren’t exactly ‘numbers’ in the traditional sense.Chris CoyierLazy Loading Images with Vue.js Directives and Intersection ObserverMateusz RybczonekCreate a Serverless Powered API in 10 Minutes — Use Cloudflare Workers to create and deploy a serverless API to 150+ data centers.Cloudflare Workers sponsorCalls Between JavaScript and WebAssembly Are Finally Fast — The interoperability between JS and WebAssembly has been a sticking point for performance, but this is changing. Here’s an amazingly accessible writeup of the how and why.Lin Clark? Two Live Accessibility And Performance Audits from SmashingConf — Two talks from Marcy Sutton and Tim Kadlec focusing on assessing real sites/code.Smashing MagazineValid CSS Content — What’s valid content in CSS’s content property?Chris Coyier? Code and ToolsThe Webflow CSS Grid Playground — Build grid layouts visually with this powerful Web-based tool. (Note: An account is needed to export code.)WebflowMuze: Build Composable Data Visualizations for the Web — Composable, can be themed with CSS, supports dynamic binding for tooltips and other ‘reactions’, stackable layouts..Charts.comBuild Real-Time Web Experiences with a Simple but Powerful Serverless BackendMicrosoft sponsorAn Experiment to Use QR Codes for WebRTC Signalling DataGorka LudlowSome Neat Pure CSS Toggle ButtonsHimalaya SinghAdidas Rolls Out Mini-Site Inspired by 1990s Web Design — They’ve done a pretty good job with this fun site for some 1990s-influenced sneakers.AdidasRecreating the Banksy Artwork Shredder in CSS — A fun little demo, with an associated write-up here.Lee MartinFind, Organize, and Connect the Best Cloud ServicesManifold sponsor Source link