Great DevTools improvements in Chrome 75 and 76

#394 — June 5, 2019 Read on the Web Frontend Focus What's New in Chrome 75 for Developers — Pete Le Page highlights changes in the next stable version of Chrome, with the most exciting things being a way to create lower latency canvases and sharing files with the Web Share API. Here’s a related video on changes to DevTools in version 75. If you're on the Dev channel, you might also want to check out what's new in Chrome 76's DevTools (which includes a feature that guesses what CSS properties you want based on a value, e.g. bold would suggest font-weight). Google Developers A Drop-In CMS That Works Anywhere — Find 100s of frontend modules for common needs like CMS, forms, and more. Free and open-source. Built by the community so you don't have to reinvent the wheel. Sign up for free. AnyMod sponsor A Quick Look at the First Public Working Draft for Color Adjust Module 1 — The spec introduces three new CSS properties that help inform how much control the user agent should have when determining the visual appearance of a rendered page based on user preferences. Geoff Graham Will Only Enterprise Chrome Installs Have Full Ad-Blocking? An Update on Manifest v3 — A rather deep and technical thread but essentially Chrome is deprecating the blocking capabilities of the webRequest API in its new standards Chrome extensions will have to adhere to. This will likely have impacts on how things like ad blockers work. The Register has a more accessible writeup. Simeon Vincent How Frontend Developers Can Help To Bridge The Gap Between Designers And Developers — Stefan Kaltenegger shares his personal experience and advice on what frontend developers can do on their end to better bridge the gap between designers and developers. Smashing Magazine ▶  Web Typography: A Non-English Perspective — English speakers make up less than 5% of the world’s population — this talk covers the intricacies of ensuring web fonts display and are laid out correctly, regardless of language. Hui Jing Chen 💻 Jobs Frontend Developer at X-Team (Remote) — Join the most energizing community for developers. Work from anywhere with the world's leading brands. X-Team Land a New Dev Job on Vettery — Vettery specializes in tech roles and is completely free for job seekers. Vettery 📰 News Release Notes for Safari Technology Preview 83 — Several changes to the web inspector, plus multiple rendering fixes, and CSS implementations. Jon Davis (WebKit) Firefox Dev Tools Can Now Show Why a CSS Property is Having No Effect — This handy new feature provides a brief explainer as to why a CSS property isn’t functioning. Nicolas Chevobbe on Twitter Mozilla's Firefox Starts Blocking Third-Party Cookies by Default Emil Protalinski Firefox Reality VR Browser Is Coming to Oculus Quest Headset Janko Roettgers 📘 Tutorials & Opinion Building The Most Inaccessible Site Possible with A Perfect Lighthouse Score — Yikes. This experiment attempts to prove that automatic accessibility testing is only really a first step and that manual testing is vital. Manuel Matuzovic Movin' Modals Along a Path — Rather than just having your modal dialogs or alerts appear out of nowhere, how about having them fly in from outside the viewport? Here’s how. Chris Coyier Self-Host Your Static Assets — Outlines the disadvantages of hosting your static assets ‘off-site’, and the “overwhelming benefits” of hosting them on your own origin. Harry Roberts Free Guide: The Evolution of JavaScript Tooling — Learn the pros and cons of some of the most popular JavaScript frameworks and libraries, including Angular, React and Vue. SENCHA sponsor Cake or Death: AMP and The Worrying Power Dynamics of The Web — A cautionary viewpoint on Google’s AMP and how such ‘syndication’ results in “valuing content that is fast over content that is right”. Andrew Betts Patterns for Promoting PWA Installation on Mobile — How to promote the installation of Progressive Web Apps and best practices to follow. Google Developers Extract Critical CSS — How to extract and inline critical CSS to improve the perceived rendering performance of your pages. Milica Mihajlija ▶  The Future of Web Animation — “in terms of animation on the web, we’re just getting started” Sarah Drasner Prevent Page Scrolling When a Modal is Open Brad Wu 💡 Quick Tutorial of the Week supported by How React Hooks Can Help Make Your Code More Reusable Exclusively for Frontend Focus readers, Eric Bishard has put together a brief tutorial on the basics of React hooks and how creating your own custom hooks can help when it comes to code reusability and working with other developers. This week's tutorial is sponsored by KendoReact. Learn how to quickly build a sleek-looking dashboard following Eric Bishard’s step-by-step instructions in “Let's Build a Sales Dashboard with React” (+ source code). 🔧 Code, Tools & Resources Puppeteer Recorder: A Chrome Extension That Creates Puppeteer Scripts — Hit record, do things in your browser, and this extension generates JavaScript code you can then run that uses Puppeteer to reproduce the actions headlessly. Checkly Studio 3T Makes SQL Migration to MongoDB, Powerfully Simple Studio 3T sponsor Scene.js: A JavaScript & CSS Timeline-Based Animation Library — Plenty of fluid examples on the site. Daybrush IP Geolocation API with Country Information — A free real-time IP to Geolocation JSON API with detailed countries data integration. Madis Väin Apple's 'SF Symbols' — A Collection of User Interface Glyphs — Includes a variable fonts component for handling weight adjustments. Apple    🗓 Upcoming Events CSS Day, June 13-14 — Amsterdam, Netherlands — Features eight world-class sessions by eight world-class speakers about curious, 'badly-known', or otherwise interesting CSS features. CSSCamp 2019, July 17 — Barcelona, Spain — A one-day, one-track conference for web designers and developers. An Event Apart, July 29-31 — Washington, D.C. — A popular three-day conference that focuses on all things relating to digital design and user experience. Front Conference, August 29-30 — Zurich, Switzerland — A two-day double-track conference for everyone involved from concept to implementation.

by via Frontend Focus

Make the most of Remote Work in Your Startup

The remote work trend is continuing to grow alongside advances in technology and changing employee preferences. Technology makes connecting with a remote employee on the other side of the world a simple process, and now a full 52% of employees work remotely at least once a week, a number that has...

[ This is a content summary only. Visit our website http://bit.ly/1b4YgHQ for full links, other content, and more! ]

by Web Desk via Digital Information World

UI Code Challenge #1 – Heartbeats

Do you ever find that the UI screens that we see in blockbuster movies, television, and games are so much more fun than the UIs we might build at work? Here's your chance to code something fun and maybe even win an Amazon Gift Card.

The post UI Code Challenge #1 – Heartbeats appeared first on SitePoint.

by Alex Walker via SitePoint

Handtrack.js : Realtime Handtracking in the Browser

Handtrack.js is a library for prototyping realtime hand detection (bounding box), directly in the browser. Underneath, it uses a trained convolutional neural network that provides bounding box predictions for the location of hands in an image. The convolutional neural network (ssdlite, mobilenetv2) is trained using the tensorflow object detection api .

The post Handtrack.js : Realtime Handtracking in the Browser appeared first on Best jQuery.

by Admin via Best jQuery

Zdog : A Pseudo-3D Engine for Canvas and SVG

Zdog is a 3D JavaScript engine for <canvas> and SVG. With Zdog, you can design and render simple 3D models on the Web. Zdog is a pseudo-3D engine. Its geometries exist in 3D space, but are rendered as flat shapes.

Zdog uses the same principle. It renders all shapes using the 2D drawing APIs in either <canvas> or <svg>. Spheres are actually dots. Toruses are actually circles. Capsules are actually thick lines. It’s a simple, but effective trick. The underlying 3D math comes from Rotating 3D Shapes by Peter Collingridge.

The post Zdog : A Pseudo-3D Engine for Canvas and SVG appeared first on Best jQuery.

by Admin via Best jQuery

New Course: Build an App With GraphQL, Laravel, and Vue

Anton Chalov's Portfolio

This site is an attempt to make the process of viewing one's portfolio thoughtful, entertaining and a little bit nostalgic. It requires 2 devices to view it, smartphone as a controller.
by via Awwwards - Sites of the day