@defaced Not on Android, where it’s based on the Web App Manifest (web.dev/splash-screen/). On iOS, you can just specify whatever splash screen you like (developer.apple.com/library/archiv…). One workaround for Android might be to dynamically (re)set the theme col

addyosmani New Performance Heads-Up Display is now available in @ChromeDevTools! Try it in Rendering > Core Web Vitals in Chrome Canary. pic.twitter.com/lcL7Zza34F
cramforce 🎉 New blog post: More than you ever wanted to know about font loading on the web
Featuring
👷🏽♀️ practical advice 😊
🛠a new tool based @notwaldorf’s font matching idea & @bram_stein’s FontFaceObserver
🕸and a web standard proposal to make things simple
industrialempathy.com/posts/high-per…
Several people have pointed at the wavy-dot proposal (#TIL github.com/tc39/proposal-…) to make this line of code ⤵️ nicer, but error handling (which is YOLO in the quoted tweet) is still hard: github.com/tc39/proposal-…. twitter.com/threepointone/…
@henrylim96 @addyosmani @furqanabid @Una `aspect ratio` support’s growing (caniuse.com/mdn-css_proper…), but far from universal. Meanwhile, you can use the fallback, as @bramus explains: bram.us/2020/11/30/nat…. Depending on browser distribution, you could developer.mozilla.org/en-US/docs/Web…
Favicons used for tracking purposes: cs.uic.edu/~polakis/paper… [PDF]. Interesting attack vector.
@GDGLaPaz ¡Gracias por invitarme! Aquí están mis diapositivas: goo.gle/cds-extended-l…. Un placer estar en Sudamérica para esta charla. 🌎
@voxpelli @DasSurma @philwalton That’s what I am doing on my blog. github.com/tomayac/blogcc…
@HamidQasemy @slightlylate The closest we have so far is Window Controls Overlay for installed PWAs: github.com/WICG/window-co…. Maybe open a new Issue there, describing your use case (optionally including the screenshots from the tweet).

DasSurma Mini-hack of the day:
Removed the Google Analytics script from my blog in favor of sendBeacon()-based custom code by @philwalton (thank you!).
It’s smaller, it’s anonymous (I don’t track users anymore) and I can collect core web vital scores.
github.com/surma/surma.de… pic.twitter.com/4EaVjBUCui

andreban Tried out the Web Serial API in Chrome 89 today to interact with the MicroPython REPL on a Pi Pico. The whole thing is a little more than 60 lines of JavaScript. Check out the code glitch.com/edit/#!/viridi… or try it at: viridian-receptive-rugby.glitch.me @Raspberry_Pi @micropython twitter.com/ChromiumDev/st… pic.twitter.com/gvZPx1DP3M
Una CSS aspect ratio is finally here! 😱🥳🎉
web.dev/aspect-ratio/

codepo8 🚨 🛠 Experiment in @MSEdgeDev Canary @EdgeDevTools right now - adding a “+” to add new tools to the current tab control. Together with the “move tab to bottom/top” this gives us full control over the interface. pic.twitter.com/Joa4nGgfpe
jaffathecake 📝 Don’t use functions as callbacks unless they’re designed to be callbacks, and the same goes for option objects!
It might work fine today, but could break in the future.
jakearchibald.com/2021/function-…
Come on, folks, we can collectively do better. ⤵️ twitter.com/eva_trostlos/s…
@henrylim96 @kennethrohde @ChromiumDev Settings > Safari > Advanced > Website Data.
Alone enumerating the sites takes ages on my phone. 😬
@sw12 @henrylim96 At a global level, there is a way better system than addresses: Open Location Code: github.com/google/open-lo…. Unfortunately I am not aware of a postal service in my part of the world that would use it.
@sw12 @henrylim96 Or have them, but they don’t form part of the official way of writing addresses.
My parents live in “72770” (zip code) “Reutlingen” (city). The state is “Baden-Württemberg”, but the zip code already contains more accuratgoo.gl/maps/SEo75gknB…

sw12 Hey form users!
Help autofill work better on platforms like Google Forms.
• Use field labels browsers understand.
• Don’t split out name parts.
• Ask for street address in a single field.
• Remember that some countries don’t use postal codes.
Anything else?
ht @tomayac pic.twitter.com/ADZqNhrUn7
A whole website in a single HTML file: clever use of the :target selector makes this site feel like an SPA: john-doe.neocities.org. Via @css: css-tricks.com/a-whole-websit…
There’s a developer preview of “Bento” components, that is, the possibility of using @AMPhtml components in isolation—without the AMP buy-in. Right now, they still require the entire AMP library, but the objective is to remove this dependencamp.dev/documentation/…
@darin_hensley I don’t know, but it’s been quite recently..github.com/apache/incubat…2Q.
People keep tripping over the question how to serialize a `FileSystemHandle` when working with the File System Access API. My StackOverflow post provides an answer: stackoverflow.com/a/65938910/625… (PR to add this to our article web.dev/file-system-ac… coming, too

Back in August of last year @jefbinomed invited me to an #AskTheExpert event to present about Project Fugu 🐡 (youtu.be/U8vqBf8LB6s). Thanks so much for the super cute surprise that was in the mail today. <3 pic.twitter.com/CFzaxnhjnD

webkit Release notes for Safari Technology Preview 119 are available with updates to Web Inspector, Speech Recognition, CSS, Scrolling, JavaScript, and more. webkit.org/blog/11525/rel… pic.twitter.com/RTy2XFEj96
@hashseed Is this a financial advice that I can hold you accountable for? I’m all in now.
ericwbailey I wrote about how you can use your mouse without using your hands, featuring a video where I put my gigantic eyebrows to good use. thoughtbot.com/blog/an-introd…
@shadeed9 The famous grid blowout. I was bitten by this, too, when I redesigned my blog (blog.tomayac.com/2019/09/29/the…). Thanks for sharing this article!
When to use HTTPS for local development and how (web.dev/how-to-use-loc…), all explained by @maudnals. 🔒 web.dev/when-to-use-lo…
@andrey_l1nd3n 🎈 Congratulations, we need more professional bridge builders! 🌉

w3c The @w3c and the @ietf are pleased to announce that Web Real-Time Communications (WebRTC) is now an official standard, bringing audio and video communications anywhere on the Web.
w3.org/2021/01/pressr… pic.twitter.com/gBwdap47sO
Long awaited and finally coming: The File System Access API will soon support a suggested file name for the file save dialog (and a suggested opening location, too). 🎉 Users of Browser-FS-Access 💾 will automatically make use of the name once it landgithub.com/GoogleChromeLa…twitter.com/intenttoship/s…
Bringing @EdgeDevTools to VS @code for debugging Web Apps, by @codepo8: christianheilmann.com/2021/01/27/bri…. I love it when the Web toolbox gets better. 🧰
📢 PSA: If you use `browser-nativefs`, it has been renamed to `browser-fs-access` (github.com/GoogleChromeLa…) as part of our effort for a more inclusive language (developers.google.com/style/inclusiv…). Install the latest release v0.13.0 via npm:
“`bash
npm install -

GDGLaPaz Thomas Steiner is a Developer Advocate at Google Hamburg, focused on making the Web a better place through standardization, creating and sharing best practices, and doing research. @tomayac
#CDSExtendedLatam
➡️Registrate en: bit.ly/ChromeDevSummi… pic.twitter.com/6kxKONSVwu

@benadam11 @rsms 🎧 As a happy user of your PWA on desktop (installed via Chrome), I’m only bummed that Safari/Firefox don’t allow for the same install experience. Have you pushed them? (Full disclosure: Project Fugu 🐡 DevRel here ✌️.) pic.twitter.com/B4fgRq9Fpv
@codepo8 The only caveat is the color of visited links. Chrome recently made the switch so our contrast is sufficient, but other browsers haven’t (bug links in the article). Also need to be careful w/ iframes, since the CanvasColor system color that thi
@codepo8 Well, 15 lines of code is nice. But how about 1? 😉 Works best in combination with `prefers-color-scheme`, but also in isolation.
“`css
:root { color-scheme: dark light; }
“`
Article: web.dev/color-scheme/
Demo: apple-creative-airplane.glitch.me
@DasSurma @RReverser @brucel @parceljs Something pretty close would be the eleventy-image package described in @zachleat’s post zachleat.com/web/eleventy-i….
MSEdgeDev We’re proud to welcome Open Web Docs, a collective created to support a sustainable path forward for the development and maintenance of web developer documentation. opencollective.com/open-web-docs/… twitter.com/OpenWebDocs/st…
samsunginternet We’re pleased to be a supporter of Open Web Docs – a new initiative to support technical documentation of the web platform! ^DKtwitter.com/OpenWebDocs/st…Jr
ChromiumDev We’re excited to publicly introduce Open Web Docs, a collective project between Google, Microsoft, Mozilla, Coil, W3C, Samsung and Igalia!
Supporting a community of technical writers around strategic creation and long-term maintenance of web platform technology documentation. twitter.com/OpenWebDocs/st…
OpenWebDocs We’re happy and proud to announce Open Web Docs, to support a community of technical writers around creation and long-term maintenance of web platform technology documentation that is open and inclusive for all.
opencollective.com/open-web-docs/…
ChromiumDev Progress update on the Privacy Sandbox initiative:
blog.chromium.org/2021/01/privac…
@davidwalshblog Might be github.com/brave/brave-br…. Not sure if @brave does something else than Chrome when it comes to media-related wake locks.
@davidwalshblog Just saw davidwalsh.name/wake-lock-api—thanks for writing! I wonder what concrete video site issues you had in mind, since playing video takes a wake lock automatically, whereas this API web.dev/wake-lock/y) is for manual wake locks (e.g.web.dev/betty-crocker/
@Gorsefan @ChromiumDev This search link of the www-html list may be useful: w3.org/Search/Mail/Pu….
@Gorsefan @ChromiumDev As many have argued over the years, footnotes in the print sense don’t really mean a lot in a linkable document. I use “footnote” indeed more in the sense of “annotation” (or side note if you will).
@FremyCompany @chriscoyier @edent Yeah, absolutely. It’s more tolerable (for me at least) with small footnotes. I was hoping there somehow was a way to disconnect the `rt` box from the `ruby` by positioning it absolutely—no success so far. I also trie
@FremyCompany @chriscoyier @edent Thanks for the feedback! I realize it’s not great at the moment (definitely not production ready). The properties`ruby-align`, `ruby-position`, and `ruby-merge`—once implemented—seem to improve the controllability o
ChromiumDev ✍️ Over the weekend, @tomayac has been looking into using the `ruby` element for HTML footnotes [1]. He’s now interested in the thoughts of HTML, CSS, and accessibility experts [2].
—
[1] See quoted tweettwitter.com/tomayac/status…g ⤵️
[2] See blog post and tweet thread for details.
@svgeesus @draggett @edent @ppk Oh, super interesting! Do you have a pointer to mailing list threads (or similar) where I could read up on the original conversations from back then? Thanks in advance!
@Gorsefan @ChromiumDev Nice, thanks for the reply (example URL?)! `DL` is what the HTML 3.0 example (blog.tomayac.com/2021/01/24/rub…) used, too. I know progressive enhancement is perfectly possible with JavaScript. I am especially interested in pure HTML+CSS solu
andrey_l1nd3n Everyone is excited about the #YouTube baseline PWA launch and I’m just sitting here re-reading the @ZDF case study 👉 web.dev/zdf/ by @MartinSchierle and Scott Friesen and hoping YT keeps moving in the right direction at pace. There’s a bunch to catch up on!

bramusblog Implement footnotes in HTML with the `<ruby>` element (by @tomayac)
🔗 bram.us/2021/01/24/imp…
🏷 #footnotes #html #link pic.twitter.com/2lMsjSqkDz
@danbri @sw12 @agektmr Somewhat the same experience here. Especially “afraid” of autofill up-filling (i.e., retouching things I entered before). Down-filling (i.e., pre-filling things I haven’t touched before) is mostly fine, albeit still subtly wro

stefanjudis Chrome 89 comes a bunch of useful @ChromeDevTools additions but I’m mostly excited about the new Puppeteer recording button! 🔴 🎉
🔗 Changelog: developers.google.com/web/updates/20…
Video alt: Example showing how to record a Puppeteer script right from within Chrome DevTools. pic.twitter.com/b7SRPGisu4
edent Here’s an interesting take on Footnotes in HTML from @tomayac
blog.tomayac.com/2021/01/24/rub…
@justmarkup Thanks for the inspiration: blog.tomayac.com/2021/01/24/rub…. I would never have considered using the `ruby` element without your tweet. 🙏
@edent That’s interesting. Especially since Firefox is the only browser at the moment to support `ruby-align`. I wonder if by making the footnote text display block it’d look better, maybe in combination with different values of this property?
@chriscoyier, since you had thoughts on @edent’s `<details>` footnotes (css-tricks.com/a-terrible-way…), I’m wondering what you think of `<ruby>` footnotes. Also, any CSS trick up your sleeve regarding my identified presentational shortcomings: blog.tomayac.com/2021/01/24/rub…
👂 I’m very interested in the thoughts of experts of CSS (Can the rendering be improved?), accessibility (Does this work well with screen readers?), and HTML (Is this abusing `ruby`?). Also HTML elders (@draggett, what happened to `FN`?). I mention prio@edent@ppk
Interesting: WebXR (w3.org/TR/webxr/) was added to the @webkit status tracker as officially “in development”. platformstatus.io/Changes/2021-0…
@KevinLozandier Have a great day! 0x1F 🎂
@AdaRoseCannon @Vincent_Scheib @KevinPicchi Wow, that’s really cool. I stalked your GitHub, Kevin, but at the first glance couldn’t find it. Curious since I have built a similar WebHID “driver” for Nintendo Joy-Cons: blog.tomayac.com/2020/12/21/rel…. Is yo
@Justinwillis96 Did you check its site engagement score? Just curious…chromium.org/developers/des…sPweb.dev/periodic-backg…M6
Also: nice URL :-)
andreban Easily sharing content is one of the things that make the web great. Chrome 88 shipped a change to Custom Tabs that will make it easier for users to share URLs. Read more about it at blog.chromium.org/2021/01/better… #customtabs
rachelandrew Towards the end of last year I was working on some material on animations with @kaycebasques and I’m happy to see it go live web.dev/animations/ #css
@DotProto Yeah, I saw that when scrolling up, but it was too late, the tweet was sent. Anyway, we agree on the topic, which is nice. ✌️
@myfonj @bramus It’s essentially density-independent pixels, which you might know from Android: developer.android.com/training/multi….
@bramus It’s a little more complex. Check out goo.gle/learning-from-… for some background. I also have a series of articles coming on the topic.
@samthor Thanks. It’s too many around me for being either of those, though. Weird.
@zachleat Really nice custom element (#UseThePlatform) and great use case. You might want to change the styling though, since on mobile (iOS at least) it’s indistinguishable from regular text (it works perfectly fine, it’s just not discoverable).
@DotProto Smart, but please do not put this in the extension docs. People don’t have to be destructuring experts to build extensions, and those who are will easily spot the potential for smartifying the code when reading the docs.
@samthor Do you have any idea what these /N[A-Z0-9]{4}/ devices are? I see plenty of those when I scan around at my place.

smashingmag 🔥 How We Improved SmashingMag Performance, a case study
How on critical CSS, JavaScript optimizations, code splitting, web font loading, third-parties, performance profiling and a fancy CSS outline property.
smashingmagazine.com/2021/01/smashi… pic.twitter.com/Qv0GDmI9zf
derSchepp Running WebKit on Windows schepp.dev/posts/running-…
@kennethrohde @yoavweiss @dhh @firefox @webkit @domenic @hober I realized that there wasn’t a @webkit bug asking for import maps support (<script type=”importmap”>), so I created one:
bugs.webkit.org/show_bug.cgi?i…. Thanks for your consideration!
Now can we get PiP in PiP next? On a serious note, multiple PiP is a really cool feature! ⤵️ twitter.com/FirefoxNightly…
ddprrt 📝 “Low maintenance types” in TypeScript
Maintaining types is boring, let’s make sure they update themselves:
👉 fettblog.eu/low-maintenanc…
I maintain a local reverse geocoder library (i.e., a library that translates 📍 latitude/longitude pairs to 🏠 addresses), where “maintain” nowadays mostly means merging PRs. Surprisingly they keep coming. Thanks so much to @rdil_pickle for the latestnpmjs.com/package/local-…

samthor I write about observing 👀 DOM nodes via callbacks: removal/addition, resize, and being moved around the page:
whistlr.info/2021/observing…
Detecting move is pretty fun and (ab)uses IntersectionObserver ➡️ check out this video & demo: codepen.io/samthor/pen/da…! pic.twitter.com/1ZauKOjHBQ

_developit Element Worklet is my proposal for threaded DOM:
Custom Elements in threads for performance isolation.
jasonformat.com/element-workle… pic.twitter.com/MKXQOa4lqW

alexey_rodionov Good news! 🔥
@ChromeDevTools now shows categories and screenshots from web app manifest (w3c.github.io/manifest-app-i…).
It also shows some basic validation errors, e.g. for the min size of screenshots.
Available in Chromium Nightly right now and in Chrome Canary tomorrow. 😉
#PWA pic.twitter.com/aHFTmnjYbt
@rowan_m Increasing my initial and follow-up rating to now ⭐️⭐️⭐️⭐️☆. This is a lot of fun already. Would rate even higher if it supported device motion or Joy-Con motion signals. I hear there’s a cool library…
svillarsenin After “Flexbox gaps” I’m presenting “Flexbox cats” the sequel everybody was waiting for 😁. Check it out at blogs.igalia.com/svillar/2021/0… and tell me what do you think
@lmedini @dret An important question raised in a response to my initial tweet is how sites would be incentivized to adopt this. I see way too many dark patterns where the “customize” option is several hidden clicks away, and the “accept all” setti

shadeed9 ✍️ New Article: Understanding Clip Path in CSS
I wrote an article about clip-path in CSS, exploring how it works, its various values, and where we can use it along with interactive demos. Happy learning!
🔗 ishadeed.com/article/clip-p… pic.twitter.com/lKMHt70oYs
@bramus Indeed. Just realized my early morning brain typed “expired” instead of “inspired”. Anyway you got it.
@rowan_m Addendum: doesn’t load on my machine. Copied the URL http://localhost:8080 exactly, but no luck. This is a scam, or vaporware at best. Updated rating is ⭐️☆☆☆☆, and would be zero stars if I could.
@rowan_m I expected sparkles at the climax. Rating this experience ⭐️⭐️☆☆☆ so far.

kennethrohde 📢 Service Announcement
Web App Manifest fields related to digital store fronts is now maintained in its own extension spec “Application Information”, edited by own good friend @AaronGustafson 👏
@ChromiumDev is currently implemented support for these fields on Android! 🥳🎉 pic.twitter.com/zexJkUqFVq
brave Our CTO and co-founder @brianbondy details the work our team has done for the first deep @IPFS integration of its kind. brave.com/ipfs-support/

ChromiumDev Chrome 88 is rolling out now! @petele has all the details!
* Extension manifest v3
* CSS aspect-ratio property
* Play billing OT for PWAs using Trusted Web Activity
* Throttling of chained JS timers
* Abort signals in `addEventListener`s
* And lots more
developers.google.com/web/updates/20… pic.twitter.com/R7p0yMNGp2
brave With today’s desktop browser update (v1.19), Brave is the first browser to offer a native @IPFS integration, enabling users to seamlessly browse the decentralized Web,
and increasing content availability and Internet resilience. brave.com/brave-integrat…

ChromeDevTools ✨ First What’s New in DevTools of 2021!
🐞 Debugging support for Trusted Types violations
📸 Capture *full* node screenshot (finally)
🖲 New Trust Token tab
🩸 Color pickers for custom CSS properties
Try in Chrome Canary today!
Full list of goodies 👉🏼 developers.google.com/web/updates/20… pic.twitter.com/fgAqIaRQA6
@bramus Wisdom of the ancients: xkcd.com/979/ #xkcd. It expired my StackOverflow username.
CascadeStudio (see quoted tweet ⤵️) is an amazing app if you’re interested in CAD. It makes use of the File System Access API (web.dev/file-system-ac…) for its file operations, for example, for saving: github.com/zalo/CascadeSt…. This kind of app is whtwitter.com/JohnSelstad/st…
@hdv @Una In the Bundesland of Hamburg, Germany (not all of the federal country yet), it’s a reality already: hamburg.de/kindertagesbet… (try …cyoafdy-www-hamburg-de.translate.goog/kindertagesbet…). We have three kids (born 2007–2012) and it’s made a real difference. With each kid, #Thankful
@slightlylate @justinfagnani I _think_ what Alex is aiming at is: lit-html can be immediately used w/o tool chain: lit-html.polymer-project.org/guide/getting-… (which is great). When you come to LitElement and copy the example from lit-element.polymer-project.org/guide/start#in…, as a newbie you’rlit-element.polymer-project.org/guide/start#ad…
@agektmr #TIL about the term “Stuttgart pitch” for A440: en.wikipedia.org/wiki/A440_(pit…. I grew up close to Stuttgart.
@simevidas @GDSTeam They’re all in one repo, github.com/alphagov/govuk…, and by following the steps at frontend.design-system.service.gov.uk/installing-wit… I was able to get things running. But yes, quite some tree shaking is required if you only need select components. I wonder if @snowpackjs@FredKSchott
@rick_viscomi @ChromeUXReport @HTTPArchive Congratulations, Rick! Have the best of all times and enjoy the extended family! 🍼

andreban Saw someone asking if it is possible to integrate in-app-reviews with Trusted Web Activity. The answer is: yes, it is! And here’s how to do it: bandarra.me/2021/01/18/Int… #trustedwebactivity #pwa pic.twitter.com/y0FsrM3iSt
Jack_Franklin If you’re building any UI components, I cannot recommend the WAI-ARIA authoring guides enough. They are a fantastic free resource that documents how to build highly accessible components.
For example, TreeView components: w3.org/TR/wai-aria-pr…
@wesbos @syntaxfm ☝️ This is super important! In case where you’re wondering what “base font size in their browser’s settings” (from above) is about, see the screenshot in the quoted tweet. Please never set an absolute font size unless you fultwitter.com/tomayac/status…
@mathias @bramus Jean-“Mathias” Pfaff. youtu.be/NDf0p4MgFmw
@mathias Impressed by your German! Maybe try the webmaster contact form instead: rki.de/SiteGlobals/Fo….
For people seeing this only now: the explainer has landed in its own folder within the WebKit Explainers repository: github.com/WebKit/explain…. Issues are tracked through a special label: github.com/WebKit/explain….
@dret @lmedini There is indeed a proposal for such an API. See the quoted tweet for details and some discussion. twitter.com/tomayac/status…
@mhartington Might be a memory issue. Works fine on my iPhone 11 Pro Max test device. </privilege>
An Analysis of Privacy on the Apple App Store, by @K0nserv. Interesting patterns emerge. hugotunius.se/2021/01/03/an-…
Sorry, @GoogleStadia of course.
The fact that modern gaming platforms like @stadia rely on streaming means sharing game state can be as easy as sharing a 🔗 link: community.stadia.com/t5/Stadia-Comm…. The same is true for immediately Web-based games of course.
Does anyone remember savegame passworen.wikipedia.org/wiki/Saved_gam…twitter.com/tcmg/status/13…
@tunetheweb @scottjehl @HenriHelvetica @simevidas @jensimmons It certainly doesn’t hurt, even today. And for the foreseeable future, you need a backup plan anyway until all browsers you care about support it. I can’t wait for it to land everywhere. Th
@tunetheweb @scottjehl @HenriHelvetica @simevidas @jensimmons Correct. The ultimate plan is to add it, as outlined here: github.com/WICG/intrinsic…:
The UA-stylesheets of all browsers will add this code:
img, video {
aspect-ratio: attr(width) / attr(h
@scottjehl @HenriHelvetica @simevidas @jensimmons The difference to images is that you need to explicitly set the rule for videos or iframes, whereas the user-agent stylesheet now does it for you for images.
@scottjehl @HenriHelvetica @simevidas @jensimmons I’d say yes, put it. The new aspect ratio calculation can use it. See Example 2 of drafts.csswg.org/css-sizing-4/#….
@simevidas You might need both:
Alt: A rolled up cat sleeping on a chair.
Caption: Taking a nap.
@andreban @samthor Yeah, seems like an end-of-life Android device’s System WebView (apkmirror.com/apk/google-inc…). Maybe someone embeds your app and ships it (for $) on the Play Store. Good luck combing through play.google.com/store/search?q….

modelviewer Very impressive use of our web component! slide3d.com
Especially nice is the use of annotations in combination with pointers baked into the 3D model. pic.twitter.com/N8osM5g7PM
@RReverser IRC. E-Mail.
IPFS We teamed up with @igalia to bring the #dweb to browsers. See what we’ve done so far, and what’s coming up next!
blog.ipfs.io/2021-01-15-ipf…

_developit 😴 turns out you 𝗰𝗮𝗻 implement sleep() in JavaScript.
Never do this on the main thread, but if you need to pause a Worker thread… here’s how:
jasonformat.com/javascript-sle… pic.twitter.com/gC1b0SpG1Q
@_developit @kristoferbaxter I pretty regularly move myself into a state where it’s easier to copy my changes into a temporary directory, delete the whole project, and start off with a freshly cloned copy where I paste in my stuff in a new branch. 🙈

excalidraw Continuous integration in one chart.
stats.excalidraw.com
Click refresh if you haven’t done it in a while to get the latest tweaks of Excalidraw.
#opensource #stats pic.twitter.com/hCQM87kQDX
Advanced Promise Patterns: Promise Memoization. jonmellman.com/posts/promise-…
@kennethrohde Wow, that’s brilliant. ⌚️+🖱 This got to be the new cassette + pencil meme.
@samthor 😱 Wait, are you building Excalidraw in a `WKWebView`? We just deprecated the Electron version: web.dev/deprecating-ex….
Or are you working on improving the Web app when running in a Safari tab on iOS?
@aardrian @scottohara Why this is not the default is beyond me, and why browser vendors (a11yproject.com/posts/2017-12-…) reflected it even more.
From old @Apple Human Interface Guidelines: “When using the mouse is undesirable, difficult, or impossible, users ctableless.github.io/exemplos/pdf/g…
@zachleat @yoavweiss Since `prefers-reduced-data` is really new, you first want to be sure the browser even has an idea what it is, because, turns out, there is a gotcha: blog.tomayac.com/2019/09/16/not….
@_zouhir All the best for whatever comes next!
@littledan Woohoo, congratulations and enhorabuena or enhorabona, whichever you prefer. Both count!
@NicoloRibaudo @laurieontech I so want this. Completely wasn’t aware of dedent and simply clicked through for the funny name. It would be so useful to have this in the core language. Thanks for bringing this to my attention.
@_developit I’ve been on it since the first beta. There were a lot of issues with kernel extensions that have been fixed with the final version. I’m now still on the latest betas after stable, and performance has been realllly bad. The design is nice.
scottjehl Web video is a big performance challenge. According to @HTTPArchive, avg video weight is heavier on mobile (1897kb) than desktop (1592kb)! It’s too hard for developers to deliver appropriate video sizes.
A proposal: HTML Video Sources Should Be Responsive
filamentgroup.com/lab/video-with…
Streams 😎
“`js
const c = (await fetch(‘streams.spec.whatwg.org’)).body
.pipeThrough(new CompressionStream(‘gzip’));
const h = await showSaveFilePicker({types: [{
description: ‘GZIP File’,
accept: {‘application/gzip’: [‘.gz’]}
}]});
c.pipeTo(awa

We’re in full Chrome Dev Summit Extended season. @sw12 and I have the pleasure and honor to speak at CDS Extended Indonesia 🇮🇩, organized by @gdgjkt, alongside many other exciting local speakers from the thriving community. If you’re interested, siggdg.community.dev/events/details…pic.twitter.com/6cVmxvZs1t

alexey_rodionov Exciting news! 🥳
You can enable a new PWA install UI via chrome://flags/#mobile-pwa-install-use-bottom-sheet flag in Chrome Canary on Android.
#PWA #ProgressiveWebApps #ProgressiveWebApp #Installability #UX #UserExperience #FeatureDiscoverability pic.twitter.com/dE0T8Tfc0o
webcomp_dev And now #jtml is open source!
github.com/github/jtml
Thanks @Keithamus and the team.
FredKSchott Introducing Snowpack v3.0: Our biggest release yet!
☁️ Pre-bundled streaming imports
⚡️ Integrated bundler (esbuild)
📦 New JS API
🎮 New SSR runtime
✅ Bug fixes & improvements
snowpack.dev/posts/2021-01-…
andreban A while ago I used the Doom Fire animation to experiment with the Offscreen Canvas API. I finally got around writing about it and you can read it at bandarra.me/2021/01/13/Bui…. Check out the implementation (as a web component!) in the blogpost or at doom-fire.com.

domenic Readable *byte* streams are coming to Chrome 89, implemented by Nidhi Jaju! Here are some benchmark results: pic.twitter.com/x9SLfe1qdJ
@edsu It’s indeed interesting that they didn’t just block new tweets (as they’d have done for regular users), but that they suspended the whole account. Regarding your questions: I guess we’ll find out beginning on January 20, 2021 on the newly estrumplibrary.gov
@edsu An official archive is coming: twitter.com/tomayac/status….
slightlylate Love how compact this is with Web Animations and `new KeyframeEffect()`; it’s like a dozen or so lines vs. an NPM thicket for alternatives:
kirillvasiltsov.com/writing/how-to…
@DotProto @mhartington Yes, it’s spilling over to the Web. See bugs.chromium.org/p/chromium/iss… for how the browser could solve this.
@mhartington See bugs.chromium.org/p/chromium/iss…. Fingers crossed.
@mhartington Android icons need to be PNG. The browser or WebAPK service should, IMHO, totally take care of the conversion from SVG, though.
jaffathecake Interesting timing attack with tainted <canvas> + CPU rendering blog.mozilla.org/attack-and-def…
“AVIF is a new image format derived from the keyframes of AV1 video. It’s a royalty-free format, and it’s already supported in Chrome 85 on desktop.”-jakearchibald.com/2020/avif-has-…a.
avif.js adds support to other browsers through wasm and a service worker:github.com/Kagami/avif.js
@sympap Also see this thread: twitter.com/tomayac/status….
@chrisdavidmills For folks following this from the comfort of their couches at home: github.com/mdn/yari/issue….
@chrisdavidmills Thanks, will do!
@samthor @MozDevNet This would certainly be an option. I’m also thinking something something Web IDL, but am not sure to what extent (if at all) it’s being used for creating @MozDevNet article (stubs). I’m hoping for a secret link in MDN I can click
Still stuck on this one. Maybe @chrisdavidmills has an idea!?
Chromium University 2020 was a virtual public event that’s well worth catching up with and that was organized by @samuelgoto where Chromium engineers gave lectures about many aspects of the project.
👉 Schedule: code.sgo.to/2020/12/16/chr…
👉 YouTube playyoutube.com/playlist?list=…
Quoted from archives.gov/foia/pra-trump….
“The @USNatArchives will receive, preserve, and provide public access to all official Trump Administration social media content, incl. deleted posts from @realDonaldTrump and @POTUS. [It will be] made available online at NARA’s newly established trumplibrary.gov
🤔 @MozDevNet—Is there a way to find all properties or methods that return objects of a certain data type? E.g., I know that Blob.streams()` developer.mozilla.org/en-US/docs/Web…1) and `Body.body` developer.mozilla.org/en-US/docs/Web…b) return a `ReadableStream`. How
w3c 📣 #w3ccommunity Web NFC API ships in Chrome ift.tt/3sig6HQ
v8js V8, step back from the regex! Or maybe don’t 😏
V8 now has an additional RegExp engine that can prevent many instances of catastrophic backtracking: v8.dev/blog/non-backt…
samthor Check your legacy JS with TS: whistlr.info/2021/check-js-…
@_developit @wesbos Next I got a Samsung Yepp YP-E64 (amazon.com/Samsung-YP-E64…) that—as a flash device, had no issues with vibration—but with only 64MB forced me to down-encode my proud 128 kbps music collection, which I did for a few selected tracks,
@_developit @wesbos 🎧 I thought I was living in the future when I bought the Freecom Beatman: a Mini CD player capable of playing MP3 CDs 💿 8:18 AM, Jan 11th, 2021 via Echofon in reply to _developit
HenriHelvetica Well then, looks like @firefox support for AVIF will be set to default in release 86, which should be in Feb 2021.
#webperf #perfmatters
hg.mozilla.org/mozilla-centra…
@ricmac @mahemoff All my tweets get auto-archived at tomayac.com/tweets/ through Tweet Nest (github.com/graulund/tweet…). It’s a bit outdated and unmaintained, but has done a decent job so far. I think there are some forks that patch some of the bugs.
@lmatteis That’s true. Unfortunately the Library of Congress has abandoned its Twitter archive project: npr.org/sections/thetw…. Not sure whether there’s anything official or will be.
Wow, the developer Brendan got back already. There’s now an endpoint where you can search by tweet ID. Example: thetrumparchive.com/tweets/1347569….

xkcd Steepen the Curve xkcd.com/2409 pic.twitter.com/buClthMojS
@JorgeCasar @passle_ @mxbck When I read about it, I asked for technical details, but haven’t heard back so far. Any updates now, @devoorhoede?
twitter.com/tomayac/status…
With Trump’s Twitter account suspended, there needs to be an archive to look up his past tweets. There’s thetrumparchive.com, which is used regularly by reputable sources (according to thetrumparchive.com/faq), but which doesn’t offer tweet ID stwitter.com/HillaryClinton…
Looping over Arrays: `for` vs. `for-in` vs. `.forEach()` vs. `for-of`, by @rauschma. 2ality.com/2021/01/loopin…
1996: JavaScript Annoyances and Meeting The DOM: webdevelopmenthistory.com/1996-javascrip…. 🤓
firt Progressive Web Apps in 2021-New post! ✍️
Current status, market share, what’s new, what’s missing, new challenges, and new capabilities
firt.dev/pwa-2021/

anssik Web NFC API just received its 3rd LGTM approval signaling readiness to ship by default in Chrome 🚀
It’s been my privilege to shepherd this spec from an early idea to production. Congrats team for this massive milestone and for the “sisu” attitude! 💪groups.google.com/a/chromium.org… pic.twitter.com/Ort6kULaI8
@Lipis @fireship_dev @excalidraw This would probably work, but maybe with the phone as a secondary input device that controls a desktop instance of Excalidraw.
@spacegangster @ChromiumDev @excalidraw Thanks for asking. They still love us because the app is designed to work well with notch devices (webkit.org/blog/7929/desi…) and for the advanced features we use a progressive enhancement approach: blog.excalidraw.com/browser-native…

.@RegSprecher Trying to read the description of the necessary cookies on my iPhone 11 Pro Max. It’s almost as if in order to read the _necessary_ cookie information, I need to accept _all_ cookies first. And I’m a technically versed person.
#GDPR #DSGVO#Failpic.twitter.com/gk0WncTi7E
@theurbenlife @WebCreators Noticed that on smaller viewports the headings flow in two lines, with the second line reaching into the main text.
jensimmons Aspect Ratios in CSS will also solve the oh-so-annoying problem with not being able to make iframe-based videos flexible (YouTube, Vimeo, etc) without JavaScript or a padding hack.
Check out how this non-hacky CSS makes squishy videos super easy:
codepen.io/jensimmons/pen…
Seven lesser-known web features that you can implement into a Progressive Web App (PWA). Nice rundown by @fireship_dev. youtu.be/ppwagkhrZJs
webcomp_dev 🔥 All the ways to make a Web Component - 2021 🔥
New update with the number of variants bumped to *51*!
Please RT♻️
See thread for some highlights ⤵️
webcomponents.dev/blog/all-the-w…
The results of the @w3ctag elections are in: w3.org/blog/news/arch…. The TAG is essential for providing feedback on all of the browser API proposals coming out of the Project Fugu 🐡 team. Thanks for your work in advance, and congratulations to all newtwitter.com/kennethrohde/s…

GoogleDevsIN 📢Get ready for ✨#CDSExtendedIndia✨
#CDSExtended @WebDevsIn
Say ‘hi’👋to the
Speakers-@shidhincr, @imsaurabhrajpal, @bharatagsrwal, @angularboy, @Paul_Kinlan
&
Panelists - @tomayac, @sunitj, @rithekar, @vikassalyan
When: Jan 9th, 2 pm IST
Register👉cds.webdevsin.com pic.twitter.com/DkznbxYF94
@excalidraw @Hicksyfern The Catalan flag emoji isn’t properly supported/defined yet, but the underlying issue still is that languages aren’t countries. We have discussed this before. I have corrected the translation, though: Catalan is català.
@jarethgk @justinfagnani @JoubranJad @samthor For completeness sake: here’s also @dandclark1’s HTML Modules proposal: github.com/MicrosoftEdge/….
@Hicksyfern @excalidraw Laura (my wife who actually is Catalan) raised her eyebrows. A few of her eyebrows…emojipedia.org/flag-for-catal…9W

petele @dalmaer @dangoor @cjamcl @andreban @justinfagnani I put the code for my StreamDeck + Google Meet extension up at github.com/petele/StreamD…. You could easily modify it to send emoji or a handful of other things.
The super cool thing, it uses WebHID, so no special drivers/software required, and it works on ChromeOS! pic.twitter.com/x5We7VoKQh
ricmac 1/ Introducing my new side project: WebDevelopmentHistory.com ⏳ It’ll be an ongoing chronicle of internet history, from a development perspective rather than a business one. Subscribe now via email or RSS. Here’s a bit more about the project, including links to the first posts 👇
@Hicksyfern @excalidraw My wife and I just finished Catalan. ✅
@JoubranJad The world is waiting for CSS module scripts, proposed by @justinfagnani: github.com/WICG/webcompon…:
`import styles from ‘./styles.css’;`
Interesting breakdown of browser use in the Dutch market (for an undisclosed site, but the analysis is exciting nevertheless). Be sure to read the whole thread. Some great insights on the commonalities and differences between Android and iOS. twitter.com/html5test/stat…

addyosmani Tip: In @ChromeDevTools you can copy all authored CSS for an element for instant reuse. Right-click element -> Copy -> Copy styles pic.twitter.com/Gk6kDcP7qJ