Love this article with embedded demos on the CSS `color-mix()` function by @argyleink@front-end.social. It also illustrates well what the differences between all those new and old color spaces are. developer.chrome.com/en/blog/css-co….
Great video overview of some cool APIs that make your PWA feel a lot better: shortcuts, file system access and file handling, and window controls overlay: youtu.be/AhMstpK2U-Y. All presented by the dream team @tropicadri@hachyderm.io and @diekus@toot.c
@verekia @alexey_rodionov @diekus @andreban @tropicadri: Do we have documentation on how PWAs can enforce to open out-of-scope links _not_ in the in-PWA browser, but in the user’s main browser? The `target=”_blank”` trick does not seem to work on Android,web.dev/add-manifest/#…
@alexey_rodionov @verekia @diekus @andreban Launch handler is not related to this question. As far as I recall, you need to use `target=”_blank”` for all links, but it may not always work on all platforms.
@ldenoue I’m forwarding this question to @quicksave2k. He’s more deeply in this particular topic than I am.
@JoubranJad That’s brilliant news. Please try our APIs and let us know how it goes.
(Depicted: my personal takeaway 🐈.) pic.twitter.com/XQjHPIAwwr
👀 Basic offline page for web apps on Chrome Android: developer.chrome.com/en/blog/defaul…. If you for whatever reason are not in a position to build a custom offline experience for your app, Chrome 109 on Android wil..toot.cafe/@tomayac/10976…My
vinlim Project Fugu is a cross-company effort to close gaps in the web’s capabilities, enabling new classes of applications to run on the web.
developer.chrome.com/blog/how-fugu-…
@dave_bitter @petele Thanks for the kind words! Really happy the guidance is useful.
bramus On my way back home from the #GDESummit in Berlin.
Had a wonderful time catching up with GDEs, colleagues, and the local Berliner.
#ChromeDevRel pic.twitter.com/eG0cdWbu4H
jh3yy We may have also put together a new web tech boy band 🎸 pic.twitter.com/vSWkgNy76H
At the #GDESummit in Berlin and helping developers understand:
🐡 #HowFuguIsMyBrowser? howfuguismybrowser.dev
🐡 #HowFuguIsTheWeb? goo.gle/how-fugu-is-th…
@gilberto_cocchi @mozilla likes it (mozilla.github.io/standards-posi…) and is implementing (bugzilla.mozilla.org/show_bug.cgi?i…).
@webkit likes it (github.com/WebKit/standar…) and is implementing (github.com/WebKit/WebKit/…).
@tunetheweb I’ve heard better excuses before. Now swing by the office already. 😂
cramforce @andrewingram As the wise @tomayac once said: you always need to AB test your site with the AB testing service against the site without it.
@cramforce @andrewingram This was peak performance Tom who said that. I still stand by the statement.
@AnaestheticsApp Wait. You were there? If we spoke, I didn’t realize it was you. If we didn’t speak, what a missed opportunity. I’m terrible remembering faces, but I don’t know how you look like.
JorgeCasar Para el que se lo perdiera, el viernes publiqué el número 12 de #Estandarte.
- structureClone (inspired by @vidalitapower)
- Speedometer
- trace.cafe de @paul_irish
- cositas sobre #Fugu de @tomayac.
- charlas en @teacht3ch y @CodemoMadrid
jorgecasar.substack.com/p/estandarte-12
If you’re looking for a Site Reliability Engineer (SRE) with the right mindset, look no further than David Masover: linkedin.com/feed/update/ac…. #GoogleLayoffs
Send your 🔥 questions to @tunetheweb@webperf.social for the upcoming #AskMeAnything panel with the Chrome team at the GDG Berlin meetup tonight. RSVP ➡️ goo.gle/web-2023-meetup.
SSSVG: an interactive SVG reference: fffuel.co/sssvg/. Immediately see what each option 🎛️ does in code and the shapes🔺🔵!
@jaffathecake @samthor Save me a spot at your table!
Thank you for your service, Arthur! Followed your docs since the early days of Polymer and now @buildWithLit.
If you need a tech writer, please reach out to Arthur!
♥️💛💙💚♥️🫡 twitter.com/devdocdude/sta…
@dotproto Thank you for your service, Simeon! I’m sad and disappointed. All the best for the future!
♥️💛💙💚♥️🫡
Incredibly sad to see my colleague Simeon be let go 😔 from Google. He’s an expert in the Chrome / Web extension ecosystem. If you’re active in this field, be sure to reach out to him! twitter.com/dotproto/statu…
tomayac ♥️💛💙💚♥️🫡
@kennethrohde @fabiospampinato @perjerz34 It’s best to bring such feedback forward on the Issue tracker of the spec: github.com/wicg/compressi…. Thank you!
(To clarify, I don’t know yet if I’m affected personally. The joys of living in a country with protective labor laws. It could be months until there’s clarity.)
♥️💛💙💚♥️🫡
quicksave2k 💁 Here’s one tip for you today:
Use AudioWorklet to process audio from the user’s microphone on the Web. It is really good for very low latency audio processing.
Learn how with this brand new media pattern: web.dev/patterns/media…
web.dev/patterns/media…
OpenWebAdvocacy A great new tool from @tomayac to compare Native like capabilities on the Web.
howfuguismybrowser.dev outlines support for a wide variety of features important for various applications.
@othermaciej You can see the full list in this sheet: docs.google.com/spreadsheets/d…. There are some pre-Fugu APIs indeed. We called the predecessor to Fugu internally Project Fizz, see @slightlylate’s summary from 2015: developers.google.com/web/shows/blin…. We see these API
No, Mastodon isn’t perfect, but after x-posting from Twitter to Mastodon for a long time (thanks for bearing with me), I’ve now fully switched to Mastodon toot.cafe/@tomayac and will from hereon instead x-post my toots (not boosts) via moa.party
🙋 My browser…
👉 `Mozilla/5.0 (iPhone; CPU iPhone OS 16_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) GSA/243.0.495136164 Mobile/15E148 Safari/604.1` 👈 (Google in-app browser)
…is 🟥 16% Fugu 🐡!
How Fugu 🐡 is youhowfuguismybrowser.dev#HowFuguIsMyBrowserpic.twitter.com/AqT5cr9bQO
SingleStoreDevs Last week @tomayac introduced a Wasm build of SQLite that runs completely in Chrome.
developer.chrome.com/blog/sqlite-wa…
#WasmWednesday #wasm #webassembly #sqlite #chrome
🙋 I just found an app…
whatwebcando.todayoJ 👈
…that uses 37 Fugu 🐡 APIs!
How Fugu 🐡 is the Web? Find out by installing the extension fgoo.gle/how-fugu-is-th…c2CG and share#HowFuguIsTheWebeWpic.twitter.com/b2I9tlCT02CT02
🙋 I just found an app…
excalidraw.com5q 👈
…that uses 9 Fugu 🐡 APIs!
How Fugu 🐡 is the Web? Find out by installing the extension fgoo.gle/how-fugu-is-th…c2CG and share#HowFuguIsTheWebeWpic.twitter.com/oq2sAG7Suv7Suv
ChromiumDev 🤔 What advanced web capabilities does your browser support?
🤔 What are the web apps that make use of these capabilities?
💡 To answer these questions, check out a browser testing site and a browser extension by @tomayac.
developer.chrome.com/blog/how-fugu-…
ChromiumDev @tomayac 🙋 I just found an app…
web.devEk 👈
…that uses 2 Fugu 🐡 APIs!
How Fugu 🐡 is the Web? Find out by installing the extension fgoo.gle/how-fugu-is-th…kFCx and share#HowFuguIsTheWebeWpic.twitter.com/wTE2TxdXSodXSo
ChromiumDev @tomayac 🙋 My browser…
👉 `Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/110.0.0.0 Safari/537.36` 👈
…is 🟩 74% Fugu 🐡!
How Fugu 🐡 is yours? Find outhowfuguismybrowser.devVAhH and share#HowFuguIsMyBrowserwspic.twitter.com/373jN3ViayViay
🙋 My browser…
👉 `Mozilla/5.0 (iPhone; CPU iPhone OS 16_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.3 Mobile/15E148 Safari/604.1` 👈
…is 🟩 20% Fugu 🐡!
How Fugu 🐡 is yours? Find outhowfuguismybrowser.devrLha#HowFuguIsMyBrowserpic.twitter.com/C4ZWi5coec
The maximum expiry time for cookies 🍪 is 400 days in Chrome (developer.chrome.com/en/blog/cookie…), following RFC 6265bis httpwg.org/http-extension…. Before, you could set your cookies to expire effectively never. Why 400 days? For sites like your tax office’s that yo
Tweetbot is affected, too. twitter.com/tweetbot/statu…
Hello @elonmusk 👋. A couple of third-party @Twitter clients are having @TwitterAPI “re-authentication required” problems. Among them @echofon and @feather_ios, which are both down. Hope your team can fix the issue! Hugs 🤗!
@TheRealPomax @humphd To be fair, most minimal modern websites probably won’t need a SQLite database. 😅 But I hear you!
@humphd @TheRealPomax Doing it in Wasm land has the advantage that it’s easier to update when security issues are detected, unlike with baked-in sqlite engines in browsers. The Web SQL spec literally required a certain sqlite version. Wasm allows for fu
@AnaestheticsApp The library uses the OPFS, the origin private file system, and requires a web worker context.
@basketball_gm Quota-managed storage mechanisms are: cache storage, IDB, service worker, media license, OPFS, Web SQL (the last is of course soon history).
@basketball_gm Okay, scrap that. When it hits your origin, _all_ quota-managed storage mechanisms get purged. The way if it hits your origin gets decided is by looking at all quota-managed storage mechanisms of all origins and then purging by LRU.
ChromiumDev Chrome 110 Beta is now available, find out what’s included in the release post developer.chrome.com/blog/chrome-11…
@basketball_gm My current understanding is that the data would be persisted and not purged under memory pressure. I will check back with engineering for an authoritative answer.
@pesterhazy @ChromiumDev Here’s some more documentation on the file locking behavior: sqlite.org/wasm/doc/trunk….
No. 1 on Hacker News (news.ycombinator.com/item?id=343529…) with my article “SQLite Wasm in the browser backed by the Origin Private File System”: developer.chrome.com/blog/sqlite-wa…. Doing DevRel on Project Fugu 🐡 is such an incredible joy and honor!
@max77sabers It’s dark here, too. These are my settings. pic.twitter.com/UkVzES2vHt
benmorss SQLite, now available in the browser!
Wasm binary is ~300K and speed is comparable to Web SQL.
Now lots of databases can add the web as a back end. Who’s next? twitter.com/ChromiumDev/st…
Educated myself about micro frontends via @AnfibiaCreativa’s site microfrontend.dev. Reading @martinfowler’s example alongside (martinfowler.com/articles/micro…) helped my understanding on top.
@RReverser @jaffathecake I made a similar remark about `response.ok` to Jake, and usually have a check like you in my code when I `fetch()`.
jaffathecake 📝 The gotchas of unhandled promise rejections, and how to work around them.
jakearchibald.com/2023/unhandled…
tunetheweb After a lot of analysis we’ve published “Our top Core Web Vitals recommendations for 2023” - the 9 things (3 per CWV) that sites can do to most impact their website performance in 2023.
web.dev/top-cwv-2023/
igalia Igalia Brings MathML Back to Chromium: Now shipping in stable (109)!
Learn more + find links to our podcast and more in
igalia.com/2023/01/10/Iga…
csswizardry 📖 Why Not document.write()? I’ve written up everything I currently know about what exactly makes document.write() *so* bad for performance: csswizardry.com/2023/01/why-no…
@pesterhazy @ChromiumDev See sqlite.org/wasm/doc/trunk…: […] multi-threaded use of a single database handle is not possible in the JS environment. […] The exception is if a database is stored in persistent storage, but concurrent access to a single datab
@nelapilled @ChromiumDev In the SQLite team’s measurements, this technology was actually _faster_ than Web SQL in many cases. Be sure to check back with the team if you’re interested in learning more. They may be willing to share their benchmarks.
ricmac I check in with @slightlylate, @tomayac and @mtomweb from @OpenWebAdvocacy on three key issues for the web: 1) JavaScript performance woes caused by React, 2) Progressive Web Apps, and 3) Apple browser ban. thenewstack.io/2023-web-tech-…
ChromiumDev The official 🛢️ SQLite Wasm port, backed by the Origin Private File System for 💨 maximum performance:
developer.chrome.com/blog/sqlite-wa…
Check out @tomayac’s article and demo for all details!
(This is our replacement for the deprecated Web SQL, but it’s interesting for all SQLite users.)
Web Audio developers rejoice: starting from Chrome 110, you can now choose the audio destination programmatically. @quicksave2k has documented the details in developer.chrome.com/blog/audiocont… and created a neat demo at sinkid.glitch.me.
Audio to Sink B! ↘
GoogleDevEurope 💻 🌐 What are the next use cases to unlocking on the web platform?
Ask @tomayac at the upcoming web meetup @GDGBerlin!
RSVP ➡️ goo.gle/web-2023-meetup pic.twitter.com/d9fUJM1xLn
@erickoleda @ChromeDevTools Hard same, just that I built up my SOAP experience as a Google intern: I created the first AdWords PHP client library—called APIlity (word play on “ability” & “API”, no one got it)—as part of my ad-hoc self-created intern p
(If you read the source code glitch.com/edit/#!/jagged…, don’t judge me for lack of error handling and parsing XML with RegEx in the response, because this was just a demo and also: YOLO!)
Triggered by a question regarding XML request logging in @ChromeDevTools, I created a small 🧼 SOAP API client demo: jagged-abrupt-baritone.glitch.me. It’s incredible we tended to do Web services this way. I used `fetch()`, but what a missed opportunity to dig opic.twitter.com/uetKv9of9n
Understanding Authentication In Websites—A Banking 🏦 Analogy:smashingmagazine.com/2023/01/authen…c. Well-written post with code samples linked at the end. Good to recall the concepts of authentication every now and then—even if you’re not concerned with imple
A brilliant MVP guide ⤵️ by @Keithamus on how to create Web Components the modern way! 👏 As a practical start, there’s a scaffolding tutorial for how to write a `<toot-embed>` custom element: webcomponents.guide/tutorials/mast…. twitter.com/Keithamus/stat…
shadeed9 🌟 New: Conditional CSS
I wrote about my thoughts on why I think CSS is conditional in many ways, and how I enjoy writing CSS with that mindset. Happy reading!
🔗 ishadeed.com/article/condit… pic.twitter.com/YjfweoOHs4
@LeaVerou @jimniels @JoshWComeau @bjornornorn It’s definitely my immediately formed mnemonic after learning about all of those color channel options: the okay lifetime channel habit, oklch(). 🎨
JSPartyFM Is GitHub’s “.” feature’s editor a progressive web app or is that a web app or an app or whatever is it?
🗣 @tomayac on jsparty.fm/254 pic.twitter.com/WoeZiLcIXa
@pepelsbey_dev It’s a relatively simple Tonor TC 777 mic with a third-party cheap stand off Amazon: tonormic.com/collections/ga….
“So what I’m getting to is maybe Progressive Web Apps have just succeeded because we build them and don’t really think about it anymore.”—From the teaser vidyoutu.be/lbbj5aPlEAAs for the JS Party podcast 🎧 I was on a while ago to talk Projchangelog.com/jsparty/254
I’m at the “What’s my LDAP again?” stage 🤔 of continuing where I left off in 2022. Happy first workday of 2023 to those who celebrate! 🎉
rniwa_dev Declarative Shadow DOM is getting enabled by default in WebKit: commits.webkit.org/258566@main
36degrees Wrote a blog post about an interesting Safari bug that we looked into… (*checks watch*) a little over a year ago.obyford.com/posts/the-safa…J8
Better late than never, I guess?
ChromiumDev Blink Intents help structure and regulate how features make their way into the Blink rendering engine.
Catch the latest episode of #ChromeConcepts to learn more about Blink and how Blink Intents work → goo.gle/3ikLYv5 pic.twitter.com/TGFnt86Wzh
Vertigo87 Hello Berlin!
📅 January 23rd | 5.30PM | Google Berlin office
Join the #Chrome squad and get a glimpse into what’s coming to the Web in 2023 🚀🚀🚀
Don’t forget to bring your questions for the #AskMeAnything afterwards!
Check the agenda and register:
goo.gle/web-2023-meetup pic.twitter.com/rfCvTXZSQh
henrylim96 Looking forward to meeting the Chrome Team in person on 23 Jan at Google Berlin office! 🐻🐡🐠🌭
🎟️ Sign up here:
gdg.community.dev/events/details…
@GDGBerlin
@jaffathecake @RReverser Looking forward to coming back to work on the 9th. Not.
Rich_Harris TIL about publint.dev (and the associated package —github.com/bluwy/publint/…f) by@bluwyooo, which helps find common errors in npm packages (e.g. incorrect ESM setup). this should be a part of every prepublishOnly script and CI process
b1tr0t What are your thoughts on using OS share capability to share content between apps on Windows or Macs. Is this a common user behavior? Do you use it? Esp. interested in hearing from folks who started with a multi-touch device as their first device.
chriscoyier What does it look like for the web to lose? chriscoyier.net/2023/01/04/wha…
@henrylim96 @kennethrohde @SantoshYadavDev @GoogleDevExpert Yes, see you soon!
@jh3yy Many feed readers like @feedly support iframes, for example for YouTube embeds. Probably OK to leave them in. Non-supporting feed readers will simply not render them or display them as a link.
@roderickhsiao @Tinder @ChromiumDev Thanks for having made a lasting impression when it comes to Project Fugu 🐡 APIs: developer.chrome.com/blog/fugu-show…. All the best for whatever comes next!
@PixelAmbacht All the best and congratulations! 🎈
@fgnass @rikschennink Yes, same here. Thanks for documenting this. I dug out the relevant “reading further” links in twitter.com/tomayac/status….
A not so obvious trick in the post below ⤵️ is the _setting_ part of `HTMLInputElement.files`:
- pqina.nl/blog/set-value…
- html.spec.whatwg.org/multipage/inpu…
- developer.mozilla.org/en-US/docs/Web…
If you need to save back to the opened file(s), try the File System Access APweb.dev/file-system-ac…twitter.com/rikschennink/s…
Nice “Share to Mastodon” Web Component by @justinribeiro: justinribeiro.com/chronicle/2022….
Vjeux The browsers now have all the APIs to do fast video editing, but there’s seldom any documentation for it. I spent the last 3 weeks getting re-encoding of a mp4 file to work and documented the hell out of it. Hopefully you can build cool stuff on-top of it github.com/vjeux/mp4-h264…
@shadeed9 As someone new to right-to-left website creation, RtLStyling.com was incredibly useful for localizing my app SVGcode (svgco.de) to Arabic and Hebrew. From the `dir` attribute to more subtle things like styling a `<details