Thomas Steiner (@tomayac)

Hamburg, Germany

The below is an off-site archive of all tweets posted by @tomayac ever

September 2020

andrey_l1nd3n 2 months since Web Dev Live is plenty to let key insights sink in. Take a look at Day 2 outcomes linkedin.com/pulse/webdevli… & go for it - experiment, fail forward & win with the Web! The entire Web community will be here to help answer questions and celebrate your work.
🌐💙🧰

via Twitter Web App (retweeted on 11:57 PM, Sep 30th, 2020 via Echofon)

@MartinSchierle @html5test @Vincent_Scheib @reillyeon Never mind the brand question (I meant “model” actually, not “brand”, it’s late here)… This seems to be itamazon.com/-/en/dp/B07K2D…fy.

via Echofon in reply to tomayac

@MartinSchierle That’s super cool! I wonder if @html5test and @Vincent_Scheib and @reillyeon have seen this? Also, what Dart board brand is this? 🎯

via Echofon in reply to MartinSchierle

sulco / tip for today:

Checkboxes, radio inputs, and progress elements have an `indeterminate` state - just set the property with JavaScript. pic.twitter.com/QAN5B1REOz

via Twitter Web App (retweeted on 11:11 PM, Sep 30th, 2020 via Echofon)

@DasSurma @mathias Unpress the Turbo button so things appear slower on the screen. 👴

via Echofon in reply to DasSurma

ChromiumDev 🔊 Web Audio API users (developer.mozilla.org/en-US/docs/Web…): We want to hear 👂 your ideas about the future of the API!

Help us by filling out this brief survey: docs.google.com/forms/d/e/1FAI… ✅ Thanks!

via TweetDeck (retweeted on 11:06 PM, Sep 30th, 2020 via Echofon)

@simevidas @robinrendle @FirefoxDevTools `html { overflow-x: hidden; }` then. Maybe @ChromeDevTools has an idea why this happens? Or @jensimmons from team @webkit why this happens in Safari?

via Twitter for iPhone in reply to simevidas

@simevidas @robinrendle Adding `html { overflow: hidden; }` fixes the issue. @FirefoxDevTools ’ scroll container chip to the rescue..pic.twitter.com/JT4fXcUXrlrl

via Twitter Web App in reply to simevidas

Top case study (web.dev/goibibo/#tools) of India’s ✈️ @goibibo PWA (goibibo.com).
List of leveraged Project Fugu 🐡 APIs:
- Contact Picker: web.dev/contact-picker/
- Web OTP: web.dev/web-otp/
- Web Share: web.dev/web-share/
developers.google.com/web/fundamenta…

via Twitter Web App

paulcalvano If you are interested in digging into the data, I also wrote an HTTP Archive discussion forum post with all the queries and data here - discuss.httparchive.org/t/growth-of-th…

via Twitter Web App (retweeted on 12:06 AM, Sep 30th, 2020 via Echofon)

_developit 🦄 SSR for web components! 🦄
Declarative Shadow DOM is a proposed web platform feature that brings Shadow DOM to HTML.

Try it in Chrome (experimental flag) or via a polyfill:
👀 web.dev/declarative-sh… pic.twitter.com/IE2cS8AuLy

via Twitter Web App (retweeted on 12:02 AM, Sep 30th, 2020 via Echofon)

@miketaylr @googlechrome Congratulations and welcome to Google!

via Echofon in reply to miketaylr

techdows Google integrates Link to Text Fragment into Chrome by @techvenkat techdows.com/2020/09/copy-l…

via Twitter Web App (retweeted on 7:02 PM, Sep 29th, 2020 via Twitter for iPhone)

The Flavors of Object-Oriented Programming (in JavaScript): css-tricks.com/the-flavors-of…. A really in-depth post that discusses the various options for OOP and their pros and cons.

via Twitter Web App

Messaging systems and why SMS refuses to die: xkcd.com/2365/ To-the-point .

via Twitter Web App

@apassant All the best, Alex! Fingers crossed 🤞, or as the German saying goes: thumbs pressed!

via Echofon in reply to apassant

LeonieWatson 📢 How screen readers navigate data tables (+video demonstration) tink.uk/how-screen-rea…

via TW Blue (retweeted on 11:47 PM, Sep 28th, 2020 via Echofon)

@jaffathecake @hashseed @RReverser @mrdoob Are you talking about web.dev/storage-for-th…? FWIW, in the context of the original post, I was purely focusing on service worker installations. Or were you referring to both?

via Twitter for iPhone in reply to jaffathecake

@jaffathecake @hashseed @RReverser @mrdoob Absolutely on-board with this not being desirable in the general case. I just always wondered if at one point we’d be forced to house-keep service worker installations.

via Twitter for iPhone in reply to jaffathecake

@sulco As the author of the custom element watching you code this was fun. Apparently I got something right! 😊
If you grant me the usage rights, I’d love to add the video to the official README (with attribution of course). If you can imagine this,

via Echofon in reply to sulco

sulco Just tried the `<dark-mode-toggle>` custom element and dang, implementing a dark/light theme has never been easier.

1⃣ - add a script tag
2⃣ - and the element to the page
3⃣ - create the dark stylesheet

I mean… that’s it 😲 pic.twitter.com/RB8sJudNvE

via Twitter Web App (retweeted on 11:25 PM, Sep 28th, 2020 via Echofon)

@hashseed @jaffathecake @RReverser @mrdoob DevTools on top of things—as always! 👏
Was wondering if at one point we’d need to adopt@webkitt’s way: “To keep only the stored information that is useful to the user, WebKit will remove unused servicewebkit.org/blog/8090/work…

via Echofon in reply to hashseed

@bgbrunocom @ChromiumDev It’s used in a lot of places, one of which is Google Search: web.dev/text-fragments…. Also Edge Collections: twitter.com/mattle/status/…. And of course a lot of individual usage.

via Twitter for iPhone in reply to bgbrunocom

ChromiumDev The Text Fragment URL feature and the Link to Text Fragment extension have seen great adoption (twitter.com/ChromiumDev/st…).

🔗 #:~:text=Yay

We’re happy to report that a first version of the extension is available for 🧭 @webkit
Safari: apps.apple.com/app/link-to-te… (Made by @tomayac).

via TweetDeck (retweeted on 1:37 PM, Sep 28th, 2020 via Twitter for iPhone)

ChromiumDev 🎉 Good news for people interested in the Notification Triggers API: after a short break (twitter.com/ChromiumDev/st…), the API is now in active development again.

@tomayac has updated the post with a link to a 🆕 origin trial for you to try out the API:

👉 web.dev/notification-t…

via TweetDeck (retweeted on 12:41 PM, Sep 28th, 2020 via Twitter Web App)

@zachleat @monjibram @simevidas My debugging stack is:

“`css
* {
outline: solid hotpink 1px;
outline-offset: -1px; /* 🔥 */
}
“`

via Twitter for iPhone in reply to zachleat

jongalloway modify.video - A purely browser-based privacy-first video tool capable of performing tasks like converting, compression, etc. without uploading your files using . pic.twitter.com/cUKmT8OeoS

via Twitter Web App (retweeted on 7:16 PM, Sep 26th, 2020 via Echofon)

passle_ While I agree web components still have shortcomings, I dont think this article is entirely fair. The article pins many of the wider JS ecosystems hardships on web components. twitter.com/LeaVerou/statu…

via Twitter Web App (retweeted on 5:28 PM, Sep 26th, 2020 via Echofon)

ChromeDevTools 📢 New engineering blog!

“How we built the Issues tab” by Jan Scheffler & @sigurdschn takes you through the design, prototyping and implementation of the new Issues tab.

👉🏼 developers.google.com/web/updates/20… pic.twitter.com/MzPbJx3BNK

via TweetDeck (retweeted on 10:49 AM, Sep 26th, 2020 via Echofon)

ChromiumDev 📢 Create an offline fallback page:

web.dev/offline-fallba…

Use this🍴recipe described in @tomayac’s latest post to ensure your site’s visitors get at least a baseline offline experience.

via TweetDeck (retweeted on 3:57 PM, Sep 25th, 2020 via Twitter for iPhone)

firt 😱Wow! Luna, Amazon game platform, is a PWA on iOS. “We worked with the Safari team to ensure that some of the things that weren’t there are there, and that allowed us to kind of get to where we are today.” That’s why store rules mentioned the web recently engadget.com/luna-amazon-cl…

via Twitter for iPhone (retweeted on 8:47 AM, Sep 25th, 2020 via Echofon)

@briankardell I remember using webcomponents.org/element/Google… in the past. It was fine for the foreseen use cases. I needed something on top that wasn’t intuitive for me to do, or at least at the time I didn’t understand the concepts, so going all imperative

via Echofon in reply to briankardell

argyleink “`
text-decoration-thickness: from-font;
text-underline-offset: .5ex;
“`

.. headed for Chromium 87 🎉

will catch Chromium up with Safari & Firefox! Woot!!

🆕 `from-font`
look to the font for the font designer’s defined thickness or position, NOT the browser’s default twitter.com/intenttoship/s… pic.twitter.com/RMhqA5JgZV

via Twitter Web App (retweeted on 8:10 AM, Sep 25th, 2020 via Echofon)

Smarter throwing (`Error`s that is)..remysharp.com/2020/09/24/sma…AB. It totally didn’t occur to me either that `Error.prototype message` is mutable. Sometimes it’s small things like this. Thanks@remem.

via Twitter Web App

JSJabber Check out this week’s episode of about 450: Native Features Inside The Browser – Introducing Google’s Project Fugu with Thomas Steinerfr.bz/t15yae3gpt Apple Podcast@ApplePodcastst@devchattvt@cmaxwx@DanShappiri@Aimee_Knighth@coolaj8686 @

via Campaign Share (retweeted on 2:20 PM, Sep 24th, 2020 via Twitter Web App)

@Paul_Kinlan @chrsgrrtt @samthor Mobile. Right. There’re indeed many options, and you’d have to hook the Escape functionality up with JS indeed. What’s elegant about @samthor’s solution is it makes the non-hamburger/FAB area a click target for clo

via Twitter for iPhone in reply to Paul_Kinlan

@Paul_Kinlan @chrsgrrtt @samthor I’d rather expect the Escape key to close it.

via Twitter for iPhone in reply to Paul_Kinlan

@DanShappir @jordaust @JSJabber Thanks both 😊! Really happy you found the episode worthwhile of your time. It was an honor to be on the show.

via Echofon in reply to DanShappir

@BuzzIlk Thanks 😊. Really an honor to have people listening to my gibberish! Hope you could extract something useful from it.

via Echofon in reply to BuzzIlk

@ericlaw There was, it was called Writable Files API. We discussed several options, including your suggestion, but also Local File System API (my favorite) etc. The worry was that “host” and “local” put too much emphasis on “on your device”, w

via Echofon in reply to ericlaw

@simevidas @firt I see system apps as apps that are tied to the system, like the Phone app, the Messages app, or the Settings app.

via Echofon in reply to simevidas

@samthor Hehe, thanks for sharing your wisdom of doing things “the standard” way!

via Echofon in reply to samthor

@firt Judging from the logo it’s Google Translate.

via Echofon in reply to firt

@Paul_Kinlan @chrsgrrtt A FAB could essentially be implemented the same way as a hamburger menu. Here’s @samthor’s demo codepen.io/samthor/pen/da… from dev.to/chromiumdev/th…. The history spamming is a no-go for many use cases (it’s nice that you can

via Echofon in reply to Paul_Kinlan

@andreasbovens @mozilla All the best for whatever comes next, Andreas! Hope you stay on Team Web!

via Echofon in reply to andreasbovens

@NorbertRittel @excalidraw @dluzar Thank you! I have added the correct component and CC:’ed the relevant folks.

via Twitter Web App in reply to NorbertRittel

How @themarkup built the real-time privacy inspector Blacklight (themarkup.org/blacklight): themarkup.org/blacklight/202….

via Echofon

Project Fugu 🐡 API rename heads-up: the Native File System API is now called File System Access API.
The reason is our effort to make our language more inclusive: developers.google.com/style/word-lis….
I’ve a PR open (github.com/GoogleChrome/w…) to update our articles

via Twitter Web App

@defaced I don’t think so. The closest we have is bugs.chromium.org/p/chromium/iss…, which is about allowing sites to become a Text-to-Speech engine. See this spreadsheet cell on our API tracker: docs.google.com/spreadsheets/d… (deeplink).

via Twitter Web App in reply to defaced

🎧 I had the pleasure and honor of being on the @JSJabber podcast and chat about Project Fugu 🐡. Happy listening! ⤵️ twitter.com/danshappir/sta…

via Twitter for iPhone

@henrylim96 Oh no, I forgot to paste the links. Seems like once submitted I can’t edit the description. The links are:

[1] developer.mozilla.org/en-US/docs/Web…
[2] developer.mozilla.org/en-US/docs/Web…
[3] github.com/google/service…

via Twitter for iPhone in reply to henrylim96

Special thanks to @xeenon for helping me navigate the App Store submission process!

via Twitter Web App in reply to tomayac

📢 PWA developers using  Safari @webkit rejoice:

The 👷 Service Worker Detector browser extension is now on the @AppStore and makes your life a little easier:

💻 Read the beautified Service Worker code.
📄 See the Web App Manifest.
🛢 Checkapps.apple.com/app/service-wo…

via Twitter Web App

katiehempenius Overview of CDNs:
📖 web.dev/content-delive…
- how they work
- selection
- setup
- performance features you should enable pic.twitter.com/x1wAcGs1Qg

via Twitter Web App (retweeted on 12:31 AM, Sep 23rd, 2020 via Echofon)

ChromiumDev The Web DNA Report 2019 identified browser compatibility as the top pain point for developers. We spent 2020 diving deeper: the MDN Browser Compatibility Report identifies specific issues and possible solutions.

Read the full 120-page report: bit.ly/2ZZdlOY (PDF, 1.9mb)

via TweetDeck (retweeted on 9:28 PM, Sep 22nd, 2020 via Echofon)

jaffathecake It’s been talked about for years now, but we might get to the point where browsers disable HTTP/2 push support, because it currently makes things slower for users bugs.chromium.org/p/chromium/iss…

via Twitter Web App (retweeted on 9:23 PM, Sep 22nd, 2020 via Echofon)

@NorbertRittel @excalidraw @dluzar Could you create a bug and ping me the URL here, please? I can help route and triage. For context, here’s @dluzar’s bug: crbug.com/1131034. Thanks for your help in advance!

via Twitter for iPhone in reply to NorbertRittel

@NorbertRittel @excalidraw We also have a bug on Windows. @dluzar is submitting a crbug.com/new as we’re tweeting. It’s still behind a flag for a reason. 😃

via Twitter for iPhone in reply to NorbertRittel

@cshjb007 @kevin_dorion (Removing the wrong (at)-kevin). I’ve added some more detail to the article on this: web.dev/requestvideofr…

via Twitter Web App in reply to cshjb007

@AmeliasBrain @nigeljohnwade @ChromeDevTools @mathias Can the time zone and the locale fields support autocomplete? A simple `<datalist>` (developer.mozilla.org/en-US/docs/Web…) could probably do the job (but haven’t checked myself).

via Twitter Web App in reply to AmeliasBrain

I’ve landed File Handling support (github.com/excalidraw/exc…) in @excalidraw—a cool Project Fugu 🐡 feature:

1. (Re-)installexcalidraw.comq.
2. Open Finder/Explorer.
3. Doubleclick an `.excalidraw` file.
4. Edit on… 🎈

(Needs the chrome:/pic.twitter.com/3xQkogRobj

via Twitter Web App

mathias New favorite screensaver: chrome://discards/graph 🤯 pic.twitter.com/YWNQMq4u65

via Twitter Web App (retweeted on 1:21 PM, Sep 22nd, 2020 via Echofon)

@4xfelix Danke dir für den Blogpost. Schön, eine externe Perspektive auf das Projekt zu lesen!

via Twitter Web App in reply to 4xfelix

@darth_na @cemper This question is independent from the Idle Detection API, but here’s the answer:

Page Visibility detects if the screen is locked: w3.org/TR/page-visibi… and so does `document.hasFocus()`: html.spec.whatwg.org/multipage/inte….

Demo: hasfocus-test.glitch.me

via Twitter Web App in reply to darth_na

@darth_na @cemper This API doesn’t change any of that (window focus) behavior. It barely lets developers know if a user is still using their device, but maybe in another tab or a different app than the browser.

via Twitter for iPhone in reply to darth_na

@darth_na @cemper I was not referring to screen locks, but banking sites that log you out for “security” reasons when you may actually still be using your device, but are maybe looking up a banking account number somewhere in your email.

via Twitter Web App in reply to darth_na

@nhoizey @firt OK, finally tracked this down to a specific blocklist and opened github.com/BlackJack8/iOS…. Hopefully this gets merged soon.

via Twitter Web App in reply to nhoizey

“What is Project Fugu? More power to the web.” View of ⁦community member @4xfelix⁩ on the project I spend most of my time on. 🐡 felixgerschau.com/web-capabiliti…

via Twitter for iPhone

The Idle Detection API (web.dev/idle-detection/) lets you find out which of their devices a user is currently using, so you can dedupe notifications. Another use case is for a banking site to only log a user out when they’re truly idle—not just busy ltwitter.com/intenttoship/s…

via Twitter for iPhone

intenttoship Blink: Intent to Continue Experimenting: Idle Detection API groups.google.com/a/chromium.org…

via Feeds for @intenttoship (retweeted on 8:14 AM, Sep 22nd, 2020 via Echofon)

@nigeljohnwade @AmeliasBrain This exactly! @ChromeDevTools has great I18N support. If something is missing, file a new.crbug.com (choose DevTools issue in the picker).

via Echofon in reply to nigeljohnwade

@scottjehl @argyleink Typos: `media=”pritn”` will never match. Sometimes people use fantasy names like `media=”lazyload”` for lazy loading.

via Twitter for iPhone in reply to scottjehl

@argyleink @scottjehl I have two issues open around the loading behavior, one for normal loads (bugs.chromium.org/p/chromium/iss…) and one for imports (bugs.chromium.org/p/chromium/iss…).

via Echofon in reply to argyleink

@excalidraw Or (temporarily) update to the Chrome Beta channel: google.com/chrome/beta/.

via Echofon in reply to excalidraw

@firt I think I know what happens. There’s a missing space after the quote:

class=”eleventy-plugin-youtube-embed”style=”position:relative;width:100%;padding-top: 56.25%;”

embed”style

via Twitter Web App in reply to tomayac

@RickByers Next Chrome offsite? Erm, wait… Will we ever do those again? 🤔

via Echofon in reply to RickByers

@simevidas @firt Adhering to `disablepictureinpicture` is marked as an OPTIONAL step in the spec: w3c.github.io/picture-in-pic…. Working as intended. It’s acknowledgedly a bad user experience. I wish YouTube would not do this.

via Echofon in reply to simevidas

alanwaketan Face ID for the web is live at GitHub.com! pic.twitter.com/Iep4wesSmP

via Twitter for iPhone (retweeted on 10:37 AM, Sep 19th, 2020 via Echofon)

argyleink I just stumbled across a dark theme in the @csswg draft for Color Level 5! 😈 drafts.csswg.org/css-color-5/ love it, ty somebody for trying this out pic.twitter.com/cuemQDkt0T

via Twitter Web App (retweeted on 10:37 AM, Sep 19th, 2020 via Echofon)

@firt Your YouTube embed somehow doesn’t show on my Pi-hole protected mobile. It does without Pi-hole. Any reason for this? Didn’t look into your code, but probably you want to track plays.

via Echofon in reply to firt

zachleat Wrote up a post on the @Netlify blog about using @eleven_ty and @vuejs together for a no-client-JS baseline tech stack:

Eleventy and Vue, a match made to power Netlify.​com

netlify.com/blog/2020/09/1…

via Twitter Web App (retweeted on 10:20 AM, Sep 19th, 2020 via Echofon)

@samuelgoto Orkut. Now that’s a name I haven’t heard in a while. Look at this video featuring @chanezon speaking at the @Facebook Application Development Meetup: youtu.be/tdNguO6SzU4. The future that could have been.

via Echofon in reply to samuelgoto

You may have heard of OKRs and how Google “measures what matters” that way (google.com/search?tbm=bks…). Dump it.

The one and only @rowan_m introducing OKVRs. Read the whole thread (up and down). ⤵️ twitter.com/rowan_m/status…

via Echofon

@sw12 @yoavweiss Nice soundboard you got there! I think Media Fragments URI support never made its way to <audio> (caniuse.com/media-fragments), just <video>, but you could do this declaratively with an “image-less” video element: w3.org/TR/media-frags….

via Echofon in reply to sw12

diekus Folding the Web: Enabling real responsive design on foldable devices. medium.com/samsung-intern… @samsunginternet @w3cdevs

via Twitter Web App (retweeted on 9:36 AM, Sep 19th, 2020 via Echofon)

@marcosc Thumbs-up’ed 👍. Great idea!

via Echofon in reply to marcosc

@sundress @marcosc @yoavweiss Especially on non-mobile devices you’d want more than one thing visible on the screen. Personally, I multitask all the time while cooking 🧑‍🍳…

(Not a really valid reason, just a data point: Safari on iOS and iPad

via Echofon in reply to tomayac

@sundress @marcosc @yoavweiss I am not against full screen optionally acquiring a wake lock (I really like the simplicity of the proposal actually), but it should not be the exclusive way to acquire one. The recipe page use case definitely is a good examp

via Echofon in reply to sundress

@andreban I’m realizing this now: why is it “Site Settings” instead of “App Settings”? Or just “Settings”? Too much focus on technology IMHO.

via Echofon in reply to andreban

googlewmc 🤓 Googlebot is learning a new HTTP dialect! 🤓
Starting mid November you may see some of the Googlebot crawl to happen over HTTP2 🙌

Read more:
webmasters.googleblog.com/2020/09/google…

via Twitter Web App (retweeted on 11:04 PM, Sep 17th, 2020 via Twitter Web App)

@tjschleining @ChromiumDev Thanks for sharing. We provide a support library that helps with browsers that don’t support the API yet: github.com/GoogleChromeLa…. If you code against the API directly, note that there were some changes after the origin trials: github.com/WICG/native-fi…

via Twitter Web App in reply to tjschleining

@DotProto @reillyeon I tried this, but now whenever I want to open a work project on http://127.0.0.1/, Twitter opens instead.

🤐

via Echofon in reply to DotProto

MSEdgeDev Features like high contrast can help improve readability by enforcing a user’s required color scheme. Learn how browsers apply forced colors, how to optimize styles with new standards, and differences you can expect from legacy implementations. blogs.windows.com/msedgedev/2020…

via TweetDeck (retweeted on 9:45 PM, Sep 17th, 2020 via Echofon)

@schneyra Oh, just responded to the original tweet, not having seen Scott’s follow-up. Anyway, here it is: twitter.com/tomayac/status….

via Echofon in reply to schneyra

@scottjehl This might break some sites that depend on animations having run. Here’s a snippet we collectively came up with that solves this issue: web.dev/prefers-reduce….

via Echofon in reply to scottjehl

@AndyDavies @patmeenan Something I actually miss is a “reset to defaults” option. I keep forgetting which flags I toggled and make wrong assumptions about what’s live to the general public. Are you aware of a place with the documented shipping state

via Echofon in reply to AndyDavies

Validation succeeds, distribution fails. The messages.json file exists and is obviously being used (the extension uses strings from it) and the file exists in Xcode. Have an idea what’s wrong? The error code ITMS-90858 reveals one other user’s question: developer.apple.com/forums/thread/…

via Twitter Web App in reply to tomayac

@xeenon Sorry to bug you… I’ve a weird error:

ERROR ITMS-90858:
“Missing messages file. Safari web extension bundle LinkToTextFragment.​app/Contents/PlugIns/LinkToTextFragment Extension.appex is missing the messages.json file for the en locale.”

pic.twitter.com/LOovZb8BvU

via Twitter Web App

@daviddalbusco @webkit Maybe only after logging in? Or maybe it’s an A/B test? Or it’s a repeat load thing?

via Twitter for iPhone in reply to daviddalbusco

Excited to share that the Service Worker Detector 👷‍♀️ Safari (@webkit) 14 extension (github.com/google/service…) has just been submitted to the App Store.

With it, I just found out that appstoreconnect.apple.com is a perfectly valid installable PWA.pic.twitter.com/Aqd8a0ZFnh

via Twitter Web App

_inside App Clip seem to have propagated by now, so in theory if you scan this QR code from Control Center on iOS 14, you get to play around with @chibistudioapp (Or just open chibi.app in Safari and use the banner at the top) pic.twitter.com/9IzwADXJkI

via Tweetbot for Mac (retweeted on 7:45 AM, Sep 17th, 2020 via Echofon)

passle_ And there we go, first release candidate for generic-components

A collection of generic web components with a focus on:

🚹 Accessibility
🏗 Easy to use
🎨 Easy to style

All components are vanilla web components 🙂

Docs: genericcomponents.netlify.app
Github: github.com/thepassle/gene…

via Twitter Web App (retweeted on 12:22 AM, Sep 17th, 2020 via Echofon)

Wow, WebPageTest has been taken over by @Catchpoint. The article and the FAQ at the end have the details. Congratulations, ⁦@patmeenan⁩! catchpoint.com/webpagetest-jo…

via Twitter for iPhone

There is a feature request bug for `BroadcastChannel` in Safari: bugs.webkit.org/show_bug.cgi?i…. It’s currently blocked by a spec issue around partitioning: github.com/whatwg/html/is….
(CC: @DasSurma, @jaffathecake) twitter.com/chromiumdev/st…

via Twitter for iPhone

@denladeside @Maersk @kennethrohde @slightlylate Sounds super interesting! Any details you could share here? Or maybe there’s even a blog post in the planning?

via Twitter for iPhone in reply to denladeside

newsycbot Managing Several Displays with the Multi-Screen Window Placement API ift.tt/2GTRZMj (cmts ift.tt/2FAqoPv)

via IFTTT (retweeted on 9:20 PM, Sep 16th, 2020 via Twitter for iPhone)

@pfeilbr Maybe worth submitting a new Issue for this proposal to get some discussion around it: github.com/WICG/idle-dete….

via Twitter for iPhone in reply to pfeilbr

@henrylim96 @webkit Correct. Chrome used to ship its own userland implementation of the API, but the team changed their minds on this: blog.chromium.org/2020/01/rethin….

via Twitter for iPhone in reply to henrylim96

@peterfriese I downloaded the `.xip` directly via xcodereleases.com and unpacking the archive alone takes ages… Not even at the install stage.

via Twitter Web App in reply to peterfriese

Chrome on iOS 14 now is a capable-ish browser (or @webkit skin) with service worker support 👏 that can be selected as the default app.

Too bad 😕 that it still doesn’t support `getUserMedia()` bugs.webkit.org/show_bug.cgi?i… and `PaymentRequest`.

PWA testomayac.github.io/pwa-feature-de…pic.twitter.com/ppD3nz271P

via Twitter for iPhone

gauravseth Great story. Made me reminisce the awesome time I got to spend on that product, working with @ahejlsberg and the amazing people on the @typescript team . Congrats TS team… way to go… !!! 👏👏👏

zdnet.com/article/typesc…

via Twitter Web App (retweeted on 8:49 AM, Sep 16th, 2020 via Echofon)

Sending you push notifications to only the device you are currently actively using is one of the core use cases of the Idle Detection API: web.dev/idle-detection/. ⤵️ twitter.com/kylealden/stat…

via Echofon

shshaw There’s been a lot of buzz about AVIF but testing and converting can be difficult. To make it easier we’ve added AVIF support to all of your image assets on @CodePen!

Get amazing savings & easily compare with WebP to get the best format for your images!

codepen.io/assets pic.twitter.com/Fclpxk08pQ

via Twitter Web App (retweeted on 8:19 AM, Sep 16th, 2020 via Echofon)

swyx 🆕 The Third Age of JavaScript

swyx.io/writing/js-thi…

Every 10 years there is a changing of the guard in JavaScript. I think we have just started a period of accelerated change that could in future be regarded as the Third Age of JavaScript. pic.twitter.com/qGX0JvNG5O

via Twitter Web App (retweeted on 10:00 PM, Sep 15th, 2020 via Echofon)

ChromiumDev Access alternative auxiliary keyboards and exotic gamepads with WebHID!

1️⃣ Learn about it at web.dev/hid/
2️⃣ Play with the Joy-Con and keyboard backlight demos
3️⃣ File feedback at github.com/wicg/webhid/

web.dev/hid/

—A Project Fugu 🐡 API.

via TweetDeck (retweeted on 4:43 PM, Sep 15th, 2020 via Twitter for iPhone)

Informative intro to the Media Queries Level 4 Interaction Media Features `pointer`, `hover`, `any-pointer`, and `any-hover`, by @patrick_h_lauke: css-tricks.com/interaction-me…

via Twitter Web App

Nice double article feature by @rachelandrew on CSS clipping ✂️ (web.dev/css-clipping/) and CSS masking 🎭 (web.dev/css-masking/).

via Twitter Web App

surfaceduodev The @MSEdgeDev team wrote about web experiences with CSS and JavaScript examples for the - thanks @_zouhir!
blogs.windows.com/msedgedev/2020…

via Twitter Web App (retweeted on 11:25 PM, Sep 14th, 2020 via Echofon)

holfelder As a member of Google’s Sustainability Board, I am proud that today we are announcing Google’s third decade of climate action with our most ambitious goal yet: By 2030, we aim to operate entirely on carbon-free energy, 24/7/365. Read more at: g.co/carbonfree. pic.twitter.com/6uBX490LXz

via Twitter Web App (retweeted on 10:31 PM, Sep 14th, 2020 via Echofon)

I had a lot of fun building this demo, not to mention the photo shooting. ⤵️ twitter.com/chromiumdev/st…

via Twitter for iPhone

How to tell browsers that your site supports color-schemes: stefanjudis.com/today-i-learne…

via Twitter for iPhone

chromeunboxed Lacros: The “other” Chrome browser on Chrome OS just appeared in the Canary channel.
chromeunboxed.com/first-look-lac… pic.twitter.com/y2G9RoEJIP

via Twitter Web App (retweeted on 12:14 PM, Sep 13th, 2020 via Echofon)

Code_Craftsman Detect inactive users with the Idle Detection API by @tomayac web.dev/idle-detection/ — need this for a project I’m playing with!

via Twitter Web App (retweeted on 8:20 PM, Sep 12th, 2020 via Twitter for iPhone)

@firt I’m using the published 85 and a 87 build, but it’s not there. ¯\_(ツ)_/¯

via Echofon in reply to firt

@firt I’m on iOS 14.0 (18A5373a), but I don’t have the browser switch option. Not sure why.

via Echofon in reply to firt

@simevidas @webkit “Override any of the styling applied by the user-agent stylesheet”?

via Twitter for iPhone in reply to simevidas

@sulco It’s called Text Fragments. Learn everything about this here: web.dev/text-fragments/.

via Echofon in reply to sulco

passle_ 🎉 New blog

The year is 2020. Service workers are still rocket science. Humanity still hasn’t nailed service worker updates. The search continues.

dev.to/thepassle/on-p…

via Twitter Web App (retweeted on 3:53 PM, Sep 11th, 2020 via Echofon)

For people thinking this comes out of nowhere: it doesn’t. Here’s the in-flux spec: wicg.github.io/sanitizer-api/.

via Twitter for iPhone in reply to tomayac

Wow, the HTML Sanitizer API is a useful potential Web platform addition:

const safe = (new Sanitizer()).sanitize(`
<script>
alert(“pwned 😈”)
</script>
<p>Harmless 👼</p>
`);
safe.children.length;
// 1
safe.children[0];
// <p> twitter.com/freddyb/status…

via Echofon

🤔 Every so often I encounter @webkit bugs that really make me go wonder…

“`html
<button type=button>
<img src=”foo.png” width=99 height=99 alt=”“>
</button>
“`

The image’s dimensions are ignored on iOS Safari.

Bugbugs.webkit.org/show_bug.cgi?i…qm
Demimage-in-button.glitch.mepic.twitter.com/b40gHVDj7H

via Twitter Web App

TensorFlow Our Show & Tell has a new home 🏠

Join us for Show & Tell 3 live on Sep 18, 10AM PT on our YouTube channel. See epic demos that give you superpowers with 8 new projects by the community. See you there!

Join the fun → goo.gle/3ii4E9r pic.twitter.com/lXV7MxzC83

via Sprinklr (retweeted on 11:04 PM, Sep 10th, 2020 via Twitter for iPhone)

scottjehl Not sure how I didn’t know about this already but if you need a simple and free spot to prop up a static website from some files, @Netlify’s drag/drop service here is pretty awesome. Thx for the tip, @zachleat

app.netlify.com/drop

via Twitter Web App (retweeted on 10:49 PM, Sep 10th, 2020 via Echofon)

argyleink TIL text-emphasis 🎉

em {
text-emphasis: filled double-circle deeppink;
}

🤯 Put emphasis or an accent on a letter, word or sentence with this nifty prop

Play via @CodePen codepen.io/argyleink/pen/…

Read more (spec) w3.org/TR/css-text-de… pic.twitter.com/b1XlDAmdQS

via Twitter Web App (retweeted on 6:45 PM, Sep 10th, 2020 via Echofon)

smashingmag Proportional Resizing with CSS Variables by @shadeed9

.rect {
—size: 186px;
—aspect-ratio: 2.35;
width: var(—size);
height: calc(var(—size) / var(—aspect-ratio));
}

ishadeed.com/snippet/propor… pic.twitter.com/C6UdWZ3oo6

via TweetDeck (retweeted on 6:41 PM, Sep 10th, 2020 via Echofon)

ChromeDevTools 🥁 *drumroll* Introducing the new engineering blog!

The first post by @TimvdLippe will take you through our journey of migrating DevTools from legacy custom module format to JavaScript modules.

developers.google.com/web/updates/20…

Stay tuned for more engineering content! 🤩 pic.twitter.com/OnaQAtGIFA

via TweetDeck (retweeted on 5:40 PM, Sep 10th, 2020 via Echofon)

@xeenon Cool, thanks for confirming! Hopefully there will be some docs on how to submit by then, too…

via Twitter for iPhone in reply to xeenon

Polls vs. the Street xkcd.com/2357/. Such a true .

via Twitter Web App

@xeenon (Friendly ping after the Labor Day break.)

via Twitter Web App in reply to tomayac

@Rumyra @medleyjp @MozDevNet It’s so great to have excellent documentation! I use it very frequently, and in some cases I even wrote the article. Thanks for your work, Ruth and Joe!

via Twitter for iPhone in reply to Rumyra

📑 “If an API’s not documented it doesn’t exist.”—email footer of@medleyjpp.

That’s also true for Project Fugu 🐡 APIs. Shoutout to@Rumyraa 👏 for her work on@MozDevNett:

developer.mozilla.org/en-US/docs/Web…s
developer.mozilla.org/en-US/docs/Web…Y
developer.mozilla.org/en-US/docs/Web…wiki.developer.mozilla.org/en-US/docs/Web…

via Twitter Web App

auchenberg Introducing Inspect – a new developer tool for macOS and Windows to inspect and debug your web apps and websites in Safari and WebViews on iOS devices 🤯🎉🔥

A little quarantine project of mine! 🤓inspect.devVpic.twitter.com/3qO9DjRYzhzh

via Twitter Web App (retweeted on 8:40 PM, Sep 8th, 2020 via Echofon)

andreban Bubblewrap CLI 1.6.0 is out! Now generating Android packages ~700k smaller. That’s up to 66% reduction! Also, a doctor command, dark mode for splash screens, site settings shortcuts and more. Check all changes at github.com/GoogleChromeLa…) and get it at npmjs.com/package/@bubbl….

via Twitter Web App (retweeted on 6:50 PM, Sep 8th, 2020 via Twitter for iPhone)

Designing With Reduced Motion For Motion Sensitivities: smashingmagazine.com/2020/09/design….

via Twitter for iPhone

For “the web [having] to pick up the scraps left by video formats,” ⁦@jaffathecake⁩ shows how incredible of an image format AVIF is: jakearchibald.com/2020/avif-has-…

via Twitter for iPhone

littledan See the new decorators proposal here and in the upcoming TC39 meeting.

github.com/tc39/proposal-…

via Twitter Web App (retweeted on 8:23 AM, Sep 8th, 2020 via Twitter Web App)

@normankev141 @MrJamesFisher Yes there is: addons.mozilla.org/en-US/firefox/… (the URL creation is the same logic as on Chrome, but the matching needs a polyfill that’s currently still in development).

via Twitter for iPhone in reply to normankev141

What are the official version requirements for submitting an extension (and will there be docs for folks completely new to App Store submissions like me), and is this even possible yet? Thanks for your help!

via Twitter Web App in reply to tomayac

@xeenon Question on Safari 14 extensions: the docs developer.apple.com/documentation/… don’t include submission info. I’ve guess-clicked myself thru App Store Connect, but am apparently on a too old Xcode (tried Version 11.7 [11E801a] and Version 12.0 beta [12A6159] pic.twitter.com/7afIm89JOm

via Twitter Web App

@jaroslawjarosik Create a (or look for an existing) browser extension that injects the snippet mentioned here web.dev/prefers-reduce… into all websites.

via Twitter for iPhone in reply to jaroslawjarosik

Browsers may throttle `requestAnimationFrame()`. Some good digging into when browsers throttle the API. mattperry.is/writing-code/b…

via Twitter for iPhone

University COVID Model xkcd.com/2355/

via Echofon

pes10k Thanks to the @EFF for updating panopticlick.eff.org to reflect Brave’s randomization fingerprinting protections. We know you all are slammed, so thanks much for the time.

Hope we can keep working together to improve web privacy! pic.twitter.com/rf8Tste8Y7

via Twitter Web App (retweeted on 11:12 AM, Sep 5th, 2020 via Echofon)

@b1tr0t Oh, wow, little did I know, but it’s right there: crunchbase.com/person/peter-m…. Congratulations, PJ! 🎈

via Echofon in reply to b1tr0t

cramforce 🚨 New 🚨
I released eleventy-high-performance-blog
A blog template for @eleven_ty that implements a very wide range of performance best practices by default 🎉.
🖼 image lazy loading
🏘 srcsets
� blurry placeholders
🎄 CSS tree shaking
😻 you name it!
industrialempathy.com/posts/eleventy…

via Twitter Web App (retweeted on 4:58 PM, Sep 4th, 2020 via Echofon)

Standards Developing Organizations (SDOs) as de facto do-ocracies — how [Web] standards are really made, by @tobiee⁩: speaking.unlockopen.com/qulC58w

via Twitter for iPhone

The latest Chrome 86 is absolutely killing it: my favorite launched feature is the Native File System API 🎉 that now graduated after a successful origin trial following the Project Fugu 🐡 process. And there’s lots more, see ⁦@medleyjp⁩’s bloblog.chromium.org/2020/09/chrome…

via Twitter for iPhone

surfaceduodev Excited to introduce capabilities for @MSEdgeDev on . Learn how to build web apps for two screens using CSS and/or JavaScript! Edge Canary devtools has a Surface Duo “simulator” in the browser, so you can start today! devblogs.microsoft.com/surface-duo/bu…

via Twitter Web App (retweeted on 7:59 AM, Sep 4th, 2020 via Echofon)

DasSurma 📹New HTTP203 with @jaffathecake and me about everything weak in JavaScript.

And by that I mean WeakSets, WeakMaps and the brand new WeakRef & FinalizationRegistry that’s in Chrome84+!

youtube.com/watch?v=uygxJ8…

via TweetDeck (retweeted on 11:16 PM, Sep 3rd, 2020 via Echofon)

@WebReflection @firt @jensimmons @jonathandavis SVG icons cannot be added on the Android home screen for technical reasons outside of the browser’s scope. The browser, IMHO, could take care of the conversion from SVG to something like PNG automatically,

via Twitter for iPhone in reply to WebReflection

@mhartington @firt @jensimmons @jonathandavis To be fair, it’s a working draft w3.org/TR/appmanifest/ and there’s some outsourcing happening w3c.github.io/manifest-app-i…, but the icons parts have multi-implementor support by now: developer.mozilla.org/en-US/docs/Web….

via Twitter for iPhone in reply to mhartington

Snowden Seven years ago, as the news declared I was being charged as a criminal for speaking the truth, I never imagined that I would live to see our courts condemn the NSA’s activities as unlawful and in the same ruling credit me for exposing them.

And yet that day has arrived. twitter.com/ACLU/status/13…

via Twitter Web App (retweeted on 8:24 PM, Sep 3rd, 2020 via Twitter Web App)

This more than two years old tweet unfortunately still represents the status quo on the latest iOS 14 beta. Here’s the bug for it: bugs.webkit.org/show_bug.cgi?i…. Is this on someone’s radar, @jensimmons & @jonathandavis? Thanks! twitter.com/tomayac/status…

via Twitter for iPhone

@simevidas @KenjiBaheux clarified this on an internal thread:

Private DNS: Android OS feature. Uses DNS-over-TLS. Can easily be blocked (protocol wise).

Secure DNS: Chrome feature. Uses DNS-over-HTTPS. Not easy to block without collateral damage if offe

via Twitter for iPhone in reply to simevidas

@feross @Speakeasy_JS @mikeal @mafintosh This looks _super_ intriguing, but the time is a little prohibitive for my locale. Any plans on rotating through the various time zones of the planet, or (even better) recording the event?

via Twitter Web App in reply to feross

@simevidas @firt I have a local port of Service Worker Detector 👷 (github.com/google/service…) that works in Safari. Hopefully released officially soon.

via Echofon in reply to simevidas

ChromiumDev :focus-visible and the Quick Focus Highlight are new in Chrome 86!

:focus-visible helps developers build more accessible sites with improved focus states.

The Quick Focus Highlight gives users more control over when they see focus styles.

blog.chromium.org/2020/09/giving…

via TweetDeck (retweeted on 9:37 AM, Sep 3rd, 2020 via Echofon)

A recent post by Brave folks claimed that Web Bundles work against ad or content blockers. @jyasskin explains why this isn’t the case really: ⤵️ twitter.com/jyasskin/statu…

via Echofon

TensorFlow 🔋⚡️ Get supercharged with WebAssembly

In the latest update, supercharging the WebAssembly backend with SIMD and multi-threading can get up to a 10x performance boost for free.

Learn more → goo.gle/2YZ1r73 pic.twitter.com/HM3dyliTND

via Sprinklr (retweeted on 9:09 AM, Sep 3rd, 2020 via Echofon)

sw12 A safer and more private browsing experience on Android with Secure DNS: blog.chromium.org/2020/09/a-safe…

via Twitter Web App (retweeted on 9:06 AM, Sep 3rd, 2020 via Echofon)

@simevidas Without the market power of Apple who can just require apps to support their relay service, I wonder how long it takes until sites start disallowing “relay.firefox” in emails. It’s not a new concept: en.wikipedia.org/wiki/Disposabl….

via Echofon in reply to simevidas

@cemper @robertnyman @tyohan Oh, misunderstanding here. It’s @tyohan who is moving on from Google; nothing changed for me.

via Twitter for iPhone in reply to cemper

@ade_oshineye @Paul_Kinlan Oh, interesting. I’ve been using spectacleapp.com since forever, but it’s no longer being maintained and doesn’t have the magnetic snapping. Intrigued.

via Echofon in reply to ade_oshineye

@robertnyman @tyohan Thanks, @tyohan, for all the impact you had on the local and global ecosystem! Enjoy your next step of taking an office break and whatever comes next! 🤗

via Echofon in reply to robertnyman

codepo8 👉🏻 “Use advanced typography with local fonts
Learn how the Local Font Access API allows you to access the user’s locally installed fonts and obtain low-level details about them.”

🔗 web.dev/local-fonts/

by @tomayac - this is exciting stuff when you work on font tools :)

via Twitter Web App (retweeted on 3:49 PM, Sep 2nd, 2020 via Twitter Web App)

@jaffathecake @othermaciej Someone somewhere is optimizing for “engagement”. Lucky we don’t get this feature in our geoblocked bubble of the German Twitter (despite every language setting in the app, the site, and the device being set to en-US).

via Echofon in reply to jaffathecake

gregwhitworth Awe yeah!! The @wicg_ now has a proposal section for *well formed* proposals!! Love this idea rather than starting in discourse and then flowing into WICG. Thanks to the chairs for hearing the frustrations and removing friction. github.com/WICG/proposals

via Twitter Web App (retweeted on 8:17 AM, Sep 2nd, 2020 via Echofon)

@simevidas @sil @petele There’s a couple of things in the pipeline that are planned, but that we haven’t gotten to. Check out goo.gle/fugu-api-track….

via Echofon in reply to simevidas