@aerotwist Massive congratulations 🎉! Working on this on the side, chapeau!
@m_yxnk It didn’t stop me, maybe I was typing faster than IntelliSense could sense… Potentially there could be a lint rule fo@geteslintnt or something?! FWIW, I have opened a PR fo@MozDevNetet so it gets highlighted as a pitfallgithub.com/mdn/content/pu…Sb
@WestbrookJ Luckily @MozDevNet is <del>a Wiki</del><ins>on GitHub</ins> 😃: github.com/mdn/content/pu….
@eisaksen Both “float” and “for” are reserved words in JavaScript. That’s why when you intuitively want to `.for`, you actually need to `.htmlFor`. It was the same for `.float`, where you needed to `.styleFloat`, but now `.float` (the intuitive
@WestbrookJ Right? It’s interesting that it was enabled for `HTMLElement.style.float`, with “float” being a reserved word in JavaScript. Search for “htmlFor” on developer.mozilla.org/en-US/docs/Web… for details.
Face palm 🤦 du jour: `HTMLLabelElement.for` sets a property, what you want is `HTMLLabelElement.htmlFor` in 99.99% of all cases: github.com/tomayac/SVGcod…. See developer.mozilla.org/en-US/docs/Web… for more.
@madebygoogle Hi there. I have pre-ordered the Pixel 6 Pro with @deutschetelekom, but they have delivery problems. How do I claim the Bose headphones offer if I don’t have the phone and thus no IMEI? Thanks for your help! twitter.com/tomayac/status…
@Telekom_hilft Hallo 🙋♂️. Ich habe bei euch das Pixel 6 Pro bestellt (Auftrag 4950106536)—u.A. wegen der Kopfhörer pixel-offers.com/headphones/de-…I). Nun fehlt wegen Lieferproblemen aber die IMEI, so dass ich das Angebot nicht einlösen kann. Habt ih
jasnell Very happy that AbortSignal.timeout() will be added to the web platform spec very soon: github.com/whatwg/dom/pul…
This utility will create an AbortSignal that will trigger automatically after a given number of milliseconds…
The race to being the first engine to reach 100 is open, but way more important is the point where all three engines reach 100/100/100: wpt.fyi/compat2021?fea…. Glad the technical issues were resolved and we can see the latest Safari TP now. #Compat2021 twitter.com/jensimmons/sta…
Building fast, offline-capable Microsoft 365 web applications (via @AaronGustafson). Fascinating to see such big ships move! techcommunity.microsoft.com/t5/microsoft-s…
tomayac I’m a bit of an @emscripten n00b 🙈 and could use help with a build issue: github.com/tomayac/esm-po…. My cobbled together build approach in the main branch works (see package.json), but my improvement attempt in the PR so far fails miserably. Thanks!
bramusblog SVGcode: a PWA to convert raster images to SVG vector graphics (by @tomayac)
🔗 bram.us/2021/11/29/svg…
🏷 #link #pwa #svg #tool #wasm pic.twitter.com/bU6zm47Vaq
@KevinKelchen @kennethrohde @diekus @AaronGustafson Shameless plug: web.dev/mediastreamtra….
@kennethrohde @KevinKelchen @diekus @AaronGustafson I was about to share the news… 😃 Thanks@reillyeonon, for working on this!
@kennethrohde @andreban @FlyingTigerUK @MishiPayApp I have looked at the Web app a bit: they use the Scandit Web SDK, which is based on Wasm: scandit.com/products/web-s…. In my tests it performed very well; definitely way better than the usual suspects open-s
@mischmerz Good idea, tracked as github.com/tomayac/SVGcod….
@mischmerz Thanks, that’s great to hear! I actually also quite like what it does with photographic images. (I’m sometimes surprised in contrast, though, how sometimes poorly it deals with [seemingly simple] non-photographic images. But that’s what a
I’m a bit of an @emscripten n00b 🙈 and could use help with a build issue: github.com/tomayac/esm-po…. My cobbled together build approach in the main branch works (see package.json), but my improvement attempt in the PR so far fails miserably. Thanks!
@gnyman @Jan_Ainali @WikidataEcho @Wikipedia @wikidata Processing some old ToDos: I have reported this as a bug to the Workplace team. Thanks for flagging in the first place!
@andreban @FlyingTigerUK @MishiPayApp This is one of their case studies: mishipay.com/casestudy/flyi….
googledevjp 📢 SVGcode のご紹介 : ラスター イメージ 🎨 を SVG ベクター グラフィック 📐 に変換する PWA です！
🔖 お知らせ : web.dev/svgcode/
📦 アプリ : svgco.de
🍿 動画 : youtube.com/watch?v=kcvfyQ…
@tomayac はこのアプリに Project Fugu🐡 の API をいくつ使ったでしょうか？ twitter.com/svgco_de/statu…
@AnaestheticsApp Sure. It’s done.
I know exactly who needs to hear this, so hear me out: if a “thought leader” or someone with a massive Twitter following (the overlap can well be zero) says/writes something outrageous, there’s no need to give’em more stage time. I unfollow and mo
@andreban @dalmaer Just dropping this here..web.dev/wake-lock/ty 💤 Works great from th@ChromeDevToolsls console, too!
Apple is now apparently working on adding `NavigationPreloadManager` support to @webkit: bugs.webkit.org/show_bug.cgi?i…. 👀
TheWebConf [CFP] Guess which #TheWebConf CFP is out?🧐
If you guessed “WebConf 2022 Developer and W3C Track”, you are right! Submit your papers before February 3, 2022. More information at: www2022.thewebconf.org/cfp/web-dev-w3…
@w3c @dontcallmeDOM @tomayac
#cfp #developer #pwa #web3 #solid pic.twitter.com/ECW2Z3vaWr
FrontendDaily SVGcode: A PWA to Convert Raster Images to SVG Vector Graphics - web.dev/svgcode/
@webmaxru @ChromiumDev @tunetheweb @drenzulli @andreban @rick_viscomi Looking at the overall picture, it doesn’t seem that unique of a drop: httparchive.org/reports/progre….
@webmaxru @ChromiumDev @tunetheweb @drenzulli @andreban Missing @rick_viscomi in your list of experts.
DasSurma I have been working on a CSS Container Query polyfill for all major browers.
It aims to cover the majority of CQ use-cases rather than 100% spec compat, which is why it’s only 1.6K brotli’d.
Please look at the README, play with it and help me test it!
github.com/GoogleChromeLa…
@hashseed I’m carefully optimistic, too. It’s definitely the elections I cared the most about, and I see promising signs of hope for this country to make the necessary changes. 🌱
🧑🎨 The @HeyDesigner newsletter featured SVGcode in their daily edition 329: heydesigner.com/newsletter/dai…. Happy the app is interesting to a design audience! 😃 twitter.com/HeyDesigner/st…
@equinusocio @rauschma Yes, in this particular case the custom element always fires the event that triggers the function.
@rauschma This demo github.com/GoogleChromeLa… swaps the favicon (`link[rel=”icon”]`), but the logic for swapping the manifest (`link[rel=”manifest”]`) would be exactly the same.
@schweinepriestr Yes, just added more detail: twitter.com/tomayac/status….
@ChromiumDev Yes, SVG icons are in some cases a way around that (see quoted tweet ⤵️ and blog.tomayac.com/2021/07/21/dar…), but this doesn’t work for `”theme_color”` and `”background_color”`. twitter.com/quicksave2k/st…
PWAs can soon specify light ☀️ and dark 🌒 mode colors in the Web App Manifest:
“`json
{
“theme_color”: “red”,
“icons”: […],
“user_preferences”: {
“color_scheme_dark”: {
“theme_color”: “blue”,
“icons”: […]
}
}
}
“`crbug.com/1271804
@patrickbrosset Super useful, thanks for building this! (Note that you need to migrate to manifest v3 in the future.)
@stradige_france Also available at svgco.de.
@Kankaristo I’ll pass this feedback on. Thank you for reporting this!
@cramforce @JohnMu I was aware (though rarely use it myself), but John’s is the best use case for this feature I have ever seen. 🤯
patrickbrosset New blog post 📃!
I created a small browser extension that lets you grab colors from 🌟 anywhere on your screen 🌟 (not just the webpage).
Learn more about it here patrickbrosset.com/articles/2021-… pic.twitter.com/twTyyctzEE
@Vjeux @steveruizok So did GitHub for issue texts for example.
phoboslab Lossless Image Compression in O(n) Time — introducing QOI, the Quite OK Image Format. 300 lines of C, single header library:phoboslab.org/log/2021/11/qo…wpic.twitter.com/5bllffJCzzz
🎉 Happy about SVGcode (app: svgco.de, article: web.dev/svgcode/) being featured in this week’s @FrontendDaily newsletter: frontendfoc.us/issues/518#:~:…. Thanks for including it!
@cramforce Malte!
henrylim96 🎉 g.dev/henry 🎉
Developer Profile URL Cover Generator: gdev.limhenry.xyz
GitHub: github.com/limhenry/gdev-… twitter.com/tomayac/status… pic.twitter.com/WAjwdrxyx2
@henrylim96 I hope @justynapolitans doesn’t see me… 🙈
@henrylim96 Exactly. I’m a GDE now. pic.twitter.com/XBU2Wa3OJS
If you really want to, you can now get SVGcode (svgco.de) from the @GooglePlay Store apart from simply the browser: play.google.com/store/apps/det… 🛍. This was mostly an excuse for me to play with @pwabuilder…
@henrylim96 Oh, this was a one-off by the social media team for early adopters. Making a generator could be a nice little Web app idea, though… :-)
You can now get a customized Google Developer Profile vanity URL. Mine is g.dev/tomayac. You can claim yours via developers.google.com/profile/u/me/s…. pic.twitter.com/AbsqlzgR7S
DanShappir Two years ago less than 4% of Wix websites had good #CWV. Now it’s over 30% (52% in the US). I wrote an article for @smashingmag on what we did to achieve this huge #performance improvement. This is practical advice that you can use as well: smashingmagazine.com/2021/11/improv… #webperf
slightlylate “Our work led to a greater than 100% increase in PWA installation and engagement.”
Amazing work by @Mustafa_x, @b1tr0t, @hwiilee, and the larger PWA team. Congrats, y’all.
developer.chrome.com/blog/pwa-insta….
I’d self-estimate myself to be striving for being a type 4 (tweet ⤵️) HTML author: valid (e.g., github.com/tomayac/blogcc…), and accessible (e.g., github.com/tomayac/blogcc…), but I say “striving” because I sttwitter.com/j9t/status/146…
@programmingart Beschuit met muisjes. 🎉
@Mustafa_x 🙏 Thanks for your passion for PWAs, it clearly showed! All the best for the next gig! 🍀
cjamcl I made a script that finds the new web platform features fully supported by the major browsers for every month. Ran it against 2021. Here are the results.
gist.github.com/connorjclark/8… twitter.com/develwoutacaus…
jaffathecake 📝 Cross-fading any two DOM elements is impossible right now. Here’s why, and…
➡️ How compositing works
➡️ Different compositing modes
➡️ What we need to make this work in CSSjakearchibald.com/2021/dom-cross…El
@bramus @bramusblog LOL at MILF, the, erm, missing items location finder.
A brilliant story by @bramus and how his blog came to be. Spoiler alert: it starts with fries 🍟. twitter.com/bramus/status/…
#TIL about the `networkQuality` tool in macOS Monterey: danpetrov.xyz/macos/2021/11/….
>$ networkQuality
==== SUMMARY ====
Upload capacity: 11.102 Mbps
Download capacity: 51.989 Mbps
Upload flows: 12
Download flows: 12
Responsiveness: High (1666 RPM)
agektmr JPGやPNGなど(ラスター画像)からSVG(ベクター画像)を生成することができるPWA by @tomayac svgco.de
解説記事はこちらから web.dev/svgcode/
😆 Quick release announcement post on my personal blog now after the “official” @svgco_de launch on Friday: blog.tomayac.com/2021/11/22/rel….
svgco_de Oh hai, Hacker News: news.ycombinator.com/item?id=292967…. 👋🧡
@DasSurma @slightlylate I’ve made the underlying library available (github.com/tomayac/esm-po…) and can see how it could fit the “reduce the file size” pattern of Squoosh for some images for sure. Might be a license issue, though (github.com/tomayac/esm-po…
@AfterWork_Lab 👋 Happy to answer questions.
@slightlylate No immediate plans. Squoosh is raster to raster, whereas SVGcode is raster to vector.
svgco_de Wow, an article about us in Chinese. The screenshot even contains translated strings 🤩. 你好 @ruancancom, want to contribute the translation? github.com/tomayac/SVGcode
(Alternatively, any of our followers speak Chinese and can verify and help?) twitter.com/ruancancom/sta…
@slightlylate I’m drumming up excitement for a React-based rewrite. 😂
slightlylate The image processing tools coming out of Chrome DevRel continue to be some of the most useful things in my development workflow. twitter.com/ChromiumDev/st…
@mashj10054944 What’s the URL?
@webmaxru @firt @HiCommunities Can you all hug it out and unite so there’s just one? 🤗
@jyasskin @briankardell It’s one of my “ready in the drawer, you’ll need this frequently” bugs: bugs.chromium.org/p/chromium/iss….
@AaronGustafson @HTTPArchive It’s not about the sites being designed for mobile or desktop, it’s about the crawling of those sites: “As of March 1, 2016, the tests are performed on Chrome for desktop and emulated Android (on Chrome) for mobile.” httparchive.org/faq#how-is-the…
svgco_de @dluzar @tomayac Learn everything about Window Controls Overlay in my article: web.dev/window-control…. It comes with a simple demo so you can follow along easily.
😆 SVGcode is a good showcase for Window Controls Overlay customization. Bonus points and added purity by toggling the “Desktop PWAs elided extensions menu” flag in `about:flags` to remove the puzzle piece 🧩. (Not yet toggled in the @svgco_de scrtwitter.com/stefanjudis/st…
justinfagnani The new URLPattern class is insanely great: developer.mozilla.org/en-US/docs/Web…
Building routers is getting a lot easier. Can’t wait for the App History API to land too! web.dev/app-history-ap…
Shout out to @wanderview and @domenic for these two!
mozhacks After years of development, Site Isolation is rolling out to Firefox 94 users and will be enabled for all by December.
250 people have fixed over 3,800 Fission-related bugs. 90K lines of code have been added and 460K lines of code have been modified. hacks.mozilla.org/2021/05/introd…
svgco_de You can see an introductory video 🍿about SVGcode or read 🔖 an introductory article about the app by following the links in the quoted tweet: twitter.com/chromiumdev/st….
svgco_de Thanks, @feross, for sharing us on @newsycombinator (news.ycombinator.com/item?id=292812…) and on @Reddit (reddit.com/r/programming/…). Community, be good to us. 😊
🤩 Thanks for covering the SVGcode launch, @corbindavenport, in this super nice article: xda-developers.com/svgcode-web-ap….
tinyhelpersdev New helper added: SVGcode – Convert raster images like JPG, PNG, GIF, WebP, AVIF, etc. to vector graphics in SVG format.svgco.deoh
@jeffposnick @AaronGustafson @jasonmcneill @thejohnjansen @petele shared this: petelepage.com/blog/2021/05/h…. Also this: youtu.be/baSiSIyTGSk (5:35 mark). The PR for the “translations” member is ready to go..github.com/GoogleChrome/w…Ni
@maxkagamine @ChromiumDev Thanks for the kind words! 😊
There’re still a couple of things left, though. Project Fugu 🐡 isn’t done yet. web.dev/fugu-status/.
ChromiumDev @tomayac 🧑💻 You can find the source code of SVGcode on GitHub: github.com/tomayac/SVGcode. Contributions welcome 🤗! See the list of open Issues for inspiration. Ping @tomayac for questions.
svgco_de 👋 just setting up my twttr…
SVGcode is a Progressive Web App that lets you convert raster images like JPG, PNG, GIF, WebP, AVIF, etc. 🎨 to vector graphics 📐 in SVG format.svgco.devT
ChromiumDev 📢 Introducing SVGcode: a PWA to convert raster images 🎨 to SVG vector graphics 📐!
🔖 Announcement: web.dev/svgcode/
📦 App: svgco.de
🍿 Video: youtube.com/watch?v=kcvfyQ…
How many Project Fugu 🐡 APIs did @tomayac use in this app?
twitter.com/svgco_de/statu…
@maxjpeters Thanks, filed github.com/GoogleChrome/w… on your behalf.
@maxjpeters Could you file an issue, please (github.com/GoogleChrome/w…) and post the link here? Ideally you include the tested URL if you can. Thank you!
@cramforce @benschwarz The server side: github.com/tomayac/blogcc…
The client side: github.com/tomayac/blogcc… (loaded here: github.com/tomayac/blogcc…)
Only baseline stats, but gets the job done without perf issues. Blind to folks who drop out early, but hopeful
intenttoship Blink: Intent to Ship: Pickling for Async Clipboard API groups.google.com/a/chromium.org…
@simevidas Sounds like Blokada to me. On iOS I use DNSCloak.
@briankardell There also is an API for that: web.dev/compute-pressu… 😂
@_zouhir @smfr Not the feedback you want to hear, but it loads perfectly fine here. Private Relay is off, but I have DNSCloak on (local VPN with a blocklist of URLs).
HTTPArchive @drenzulli 🆕 Chapter 4: Structured Data written by @jonoalderson and @cyberandy
😯 34% of pages contain JSON-LD markup
almanac.httparchive.org/en/2021/struct…
HTTPArchive Chapter 14: PWA written by @drenzulli
🔥 9% of the top 1,000 most popular websites use service workers
almanac.httparchive.org/en/2021/pwa
HTTPArchive 🚨 Today we’re releasing a preview of the 2021 Web Almanac with SEVEN chapters!
We’ll be publishing the rest soon in December, but for now we hope you enjoy this glimpse into the state of the web in 2021.
Read on for a highlight of each chapter…
almanac.httparchive.org/en/2021/
📢 Happy to announce the early release of the Capabilities chapter of the 2021 Web Almanac by the HTTP Archive, written by @christianliebel. What is the world’s most Fugu 🐡 site? Read on to learn more! 🥁 almanac.httparchive.org/en/2021/capabi…
@briankardell There’s an API for that: web.dev/wake-lock/.
abrax5 COLRv1 enables exciting new color vector font use cases on the web due its minimal file size and integration with OpenType Variations. It’s about to be enabled by default in Chrome. Here’s my BlinkOn 15 talk on shipping COLRv1. youtu.be/BmqYm5Wwz8M
kunte_ctf 🎉🎉My first paper “XSinator.com: From a Formal Model to the Automatic Evaluation of Cross-Site Leaks in Web Browsers”, recently got accepted at ACM CCS 2021 and now won best paper award! Find the paper and code at XSinator.com.
@JecelynYeen @Google Such unusual times… Well, welcome to Google then after all this time you work here. 🤗
@jaffathecake @firt To be fair, the flag is off by default, but of course I toggled it on like @firt, but came to the same conclusions when testing. It’s clearly work in progress.
@b1tr0t Be safe, Penny! Hoping for the best!
@lifelongdev @AnaestheticsApp @Justinwillis96 @Firebase Yeah, this would have been a good use case for Notification Triggers indeed. The next best thing (apart from remote pings) could be a `setTimeout()` that just shows a local notification, but this req
@lifelongdev @AnaestheticsApp @Justinwillis96 What’s your concrete use case? There might be an API better suited to it!?
@AnaestheticsApp @lifelongdev @Justinwillis96 Currently it looks less probable since I was told that Android is moving in a direction that makes the chosen approach no longer feasible in a future-proof way.
Good overview of various background APIs like Background Sync, Periodic Background Sync, and Background Fetch; all with nice demos: docs.microsoft.com/en-us/microsof…
ChromiumDev Chrome 96 is rolling out now!
The web app manifest lets you specify a unique ID for your PWA & register protocol handlers on installation. You can give priority hints for downloading resources with a new origin trial, & more.
@petele has the details at developer.chrome.com/blog/new-in-ch…
@denladeside Happy birthday, Lars! It’s 13min past midnight, but I hope it still counts! 🤗
@DasSurma Welcome to the fully remote club! (Not the mechanical keyboard club—you can pry my A1243en.wikipedia.org/wiki/Apple_key…l from my cold, dead hands.)
@nhoizey Feedback on the UX is welcome: github.com/GoogleChrome/w….
@EarthOrgUK @JohnMu Could I ask you to file this feedback as a new Issue, please? github.com/GoogleChrome/w…
@nhoizey It might be a staged rollout. See Ben’s tweet for how it looks like: twitter.com/benschwarz/sta….
@othermaciej @jensimmons @madebyfabian @csswg What are you all’s thoughts on the #VirtualKeyboard API: web.dev/virtualkeyboar…?
The lack of `onbeforeinstallprompt` (⤵️) is one of the most wanted PWA features for macOS, iOS, and iPadOS: docs.google.com/document/d/1ch…. twitter.com/slightlylate/s…
📢 PageSpeed Insights has a new, easier to remember URL, and also got a slight visual makeover, oh, and new features like showing you the testing location: pagespeed.web.dev
webkit Release notes for Safari Technology Preview 135 are available with accent-color, lazy image loading, requestVideoFrameCallback API, and new viewport units including: small svw/svh, large lvw/lvh, & dynamic dvw/dvh.
webkit.org/blog/12040/rel…
Image lazy loading via the `loading` attribute, the CSS `accent-color` property, and finally the new viewport units we’ve all been waiting for! 😆 Can’t wait for this Safari Technology Preview to become stable. More goodness in @jensimmons’ tweet:twitter.com/jensimmons/sta…
SaraSoueidan You know how we’ve been hacking our way to animate `height: auto` in #CSS over the last few years?
Now @nelsonmenezes has figured out a clever way to achieve auto height animation using CSS Grid that is just brilliant:
nemzes.net/posts/animatin…
(Works in Firefox only *for now*)
Paul_Kinlan Sorry Safari team.
We shared some incorrect data about the Compat 2021 project at Chrome Dev Summit. I’ve tried to document what happened and hopefully some next steps.
paul.kinlan.me/sorry-safari-t…
@kirti_vernekar @jsconfin Thanks for the kind feedback ☺️. You can check out the app’s source code at glitch.com/edit/#!/jsconf… and play with the app at jsconfin.glitch.me. #JSConfIndia
jsconfin Do you wanna know how to handle files on the web? Then don’t miss @tomayac ‘s tomorrow at #JSConfIndia where he will reveal the “The 2021 edition of dealing with files on the Web”
Register here: buff.ly/3mGIRNA pic.twitter.com/Yovebv0SdW
@SharedGameTimer @ChromiumDev Feedback is always welcome! Mention me directly if you don’t hear back. I try to monitor the shared account, but I may not always see everything.
@SharedGameTimer @ChromiumDev Working like a charm indeed 👏! The API was made for use cases like yours.
@denladeside Wishing you both strength! 😔
gabrielesvelto Alright folks, #WebMIDI is definitely coming to @firefox pic.twitter.com/BNEXgwf2eQ
@smfr @_zouhir If you use Blokada or DNSCloak or something similar I have experienced this when either a redirect chain ended up being blocked halfway through, or the local VPN wasn’t up yet (Blokada by default doesn’t show the VPN status bar icon).
@__jakub_g @chaz_6 @ericlaw Came here to say that I, too, would be interested to read such a blog post.
@mischmerz There are a couple of other white spot states in the US. Make some noise if you know interested people and apply.
@shubhie Yay, this is one of the toughest corners of the Web, good to have you on the team that tackles it! 🎈
@yamanoku こんにちは隣人！👋
I’ve the honor of running a group of Google Developer Experts (GDE) in Web Technologies specialized on PWAs & Project Fugu 🐡. We’ve decided to open the program to self-nominations (forms.gle/HATt7Bv8BuuriM…), focusing on typically underrepresented groupsdevelopers.google.com/community/expe…
@elmd_ Yes, track bugs.chromium.org/p/chromium/iss….
@dluzar @github I like it a lot, especially for small convenience functions like random number between n and m or the classic sleep function. It also occasionally blows my mind 🤯 when it actually seems to read my thoughts.
@slightlylate Is that, is that a subtweet?
@ericlaw @TheRealNooshu Great post, didn’t realize there’s so much behind. What a great way to react to all the FUD some very loud people spread about you, “view source killer”! 👏
(One sentence got mangled: “If the user navigates to an XML fi
ericlaw I’m delighted that so many of y’all are excited about View-Source, so I’ve taken the opportunity to describe how this feature works in Chromium.
textslashplain.com/2021/11/11/vie…
@johnwilander @Una FWIW, I work very hard to spread love ♥️ for @webkit: youtu.be/s5ASNwnBttQ and medium.com/dev-channel/pr… are just two examples.
@Rich_Harris @sveltejs @vercel Congratulations, this sounds like a great home for you and your project! 🎈
@_davideast Not to be confused with CSS module scripts: web.dev/css-module-scr….
webcomp_dev 📢 New! All the Ways to Make a Web Component - November 2021 Edition!
🤯 59 Web Components compared
⌨️ Code styles
📊 Bundle sizes
🏎️ Performance
🤩 All-in-one article!
👉 webcomponents.dev/blog/all-the-w…
#thread 🧵👇 #webcomponents #webdev
@Behzadhaghgoo vscode.dev Just dropping this here…
Project Fugu 🐡 FTW! ⤵️ twitter.com/levie/status/1…
@joegaffey @simevidas @jaffathecake @DasSurma Jake let me know that we do have an issue with… ⤵twitter.com/jaffathecake/s…9Y
argyleink 🆕 #GUIchallenges
Thinking on ways to build a 3D menu
Watch → youtube.com/watch?v=HCsV8u…
Read along → goo.gle/3c3oILb
Try a demo → goo.gle/3bWNSLz
Get the source → goo.gle/3wulnOO
Thought the Japanese translated version turned out super rad! pic.twitter.com/b60k9avMlm
jyasskin The W3C is working on machine-learning APIs. To go with them, @anssik has started a document on ethical considerations and ways to make ML more ethical: github.com/webmachinelear…
The WG doesn’t have a lot of expertise on ethical AI, so if you know stuff, please get involved.
johnwilander One of the coolest jobs on the planet is now open!
*WebKit Privacy Threat Analyst*
Help us monitor the tracking industry, reverse tracking scripts, evaluate emerging standards from a privacy perspective, and more: jobs.apple.com/en-us/details/… (California position)
@simevidas @jaffathecake @DasSurma Comments are definitely weird at YouTube. I can’t find my comment linking to web.dev/gamepad/ in the comments thread, but I got notifications about people liking it. pic.twitter.com/drXT3Zk0yM
@henrylim96 @jaffathecake @DasSurma @remoteforslides Nice slide deck you got there… 😂
tldraw The TLDraw extension for @code is now live! No sponsorship required ;) pic.twitter.com/vZ7GxxZdQm
bagder “This specification defines a new HTTP method, QUERY, as a safe, idempotent request method that can carry request content.”
ietf.org/archive/id/dra…
@simevidas @argyleink Not on macOS. Interestingly you can prefer increased contrast, but then bump it up even further via a slider.
CSSWeekly Patrick Brosset (@patrickbrosset) and Thomas Steiner (@tomayac) explain how the EyeDropper API enables you to use a browser-supplied eyedropper to construct custom color pickers. cssw.io/eyedropper-api… pic.twitter.com/2nLbKGO4BK
@argyleink I honestly wonder who (and why) would ever choose the “less” option?! Sure, for individual sites if they overdid it, but at a system level?
pwabuilder Looking for ways to make your PWA look more like a native app on Windows? Ever wish you could customize the default PWA title-bar? Check out this tutorial from @patrickbrosset that shows how to do this with the experimental Window Controls Overlay API! youtu.be/NvClp35dFVI
@mhartington 🙋♂️ Yepp, somewhat similar. Opened bugs.chromium.org/p/chromium/iss… to track this.
I’m super happy that Project Fugu 🐡 enables workflows like this: the VS Code PWA hosting the TLdraw PWA as an extension, and both can access local files through the #FileSystemAccess API. See the quoted tweet and the tweet it is a reply to for detailtwitter.com/seflless/statu…
rikschennink 🧪 Use CSS numeric factory functions instead of string concatenation to set style unit values.
developer.mozilla.org/en-US/docs/Web… pic.twitter.com/03I4xMTcS7
@OlivierJacquot3 @GoogleTrends Thanks for the kind words and reading this post in the first place. 😃
@FWeinb Wait. What? 🤯 This depends on a helper app that does the Bluetooth communication and opens a local server that the extension talks with, right? Or how did you do it?
@slightlylate It’s called airplane redundancy. There is nothing in an airliner that is necessary to flight which is not at least triple redundant. In case the built-in hardware implementation fails, the software implementation can take over. Solid engin
hochsays W3C Audio WG wants to hear your voices about the future of Web Audio API!
The survey: bit.ly/webaudio-surve…
cc/ @padenot @svgeesus @cwilso @toyoshim @tomayac
@Paul_Kinlan @jeffposnick 😮 Never gets old. Time for our next team offsite planning to start.
@xeenon Thanks a lot for the tip already. Logged out and in again, but same issue 😕. Not sure if this helps you identify the problem: STATE_ERROR.VALIDATION_ERROR.90283 for id cca9cf0a-603d-4080-9fb5-2b27d739f3fc. pic.twitter.com/btEHkZyTZ7
@xeenon @atannerhodges I keep running into invalid provisioning profile errors. Whenever I want to submit an update to my extension, it feels like I’m starting from scratch… :-( If you permit jumping onto this thread, any idea how to fix the issue? Thanpic.twitter.com/yFJt4IWzsz
tomayac 📢 New blog post “Things mode and strings mode in @GoogleTrends,” in which the #SemanticWeb geek in me helps you better understand what you see in Google Trends 📉 and in which I also teach you a fun trick to handcraft 🔨 Google search landing page URLs: blog.tomayac.com/2021/11/08/thi….
@atannerhodges No, I haven’t. Coincidentally I was struggling with the process as well earlier today, but unrelated to your issue. In the past, @xeenon has been very helpful when I had problems.
📢 New blog post “Things mode and strings mode in @GoogleTrends,” in which the #SemanticWeb geek in me helps you better understand what you see in Google Trends 📉 and in which I also teach you a fun trick to handcraft 🔨 Google search landing pageblog.tomayac.com/2021/11/08/thi…
@Sheepux @ChromiumDev Yes, this is tracked as github.com/WICG/file-syst….
samthor The <dialog> is coming to Safari, after 10+ years only in Chrome! Read about the superpowered modal dialog here:
whistlr.info/2021/in-defenc…
@agektmr @agl__ @samuelgoto @timcappalli Not sure. I’d guess something around scope extension, but that hasn’t been implemented yet as far as I know. Try checking out the manifest, if it is this, then you should see the URL from your screenshot somewh
DasSurma Chrome Canary just got structuredClone()! That means *all* browsers (yes, even Safari) and Deno now support structuredClone() in their nightlies (some even shipped it to stable already!)
Massive shoutout to @AndreuBotella (not a Chromie!) for implementing structuredClone() <3 pic.twitter.com/sdskbxjQr7
alexainslie Productivity tip: try out Tab Search in @googlechrome to jump quickly between your open tabs.
You’ll find it in the top right corner of the browser window and once open, you’ll see the keyboard shortcut you can use to summon it in the future.
A few other #littlebigdetails 👇 pic.twitter.com/R3AVe7K25V
@autiomaa @m_yxnk @nomadtechie Fingerprinting is the real evil nowadays if you ask me, on both Web and platform apps. twitter.com/tomayac/status…
@steveruizok @tldraw Thanks to all contributors (including you) for making it better and better! 🙏
steveruizok file system support is back in @tldraw 💾💾💾 pic.twitter.com/xuLCf9rgRB
@henrylim96 @HTTPArchive, paging you. 👋
@slightlylate Yepp, this is next level! 👏
@slightlylate I told ya to get some 🍿. It’s also a freakin’ nightmare.
Iconmap analyzed 425,909 favicons, and their findings are actually super interesting and entertaining. Prepare some popcorn 🍿! iconmap.io/blog#before-we…
@henrylim96 @kennethrohde @Twitch Hey @Twitch! Check out @samthor’s github.com/GoogleChromeLa….
@voxpelli @Twitch There’s the Digital Goods API (developer.chrome.com/docs/android/t…). @andreban can tell you (or @Twitch 😉) more about it!
Wow, @Twitch has started to position its PWA equally to their Android app:
① Go to twitch.tv, “engage” so the install banner appears at the bottom. It gives you choice (Android/Web).
② Install Web app and note how the top “Open in App” pic.twitter.com/PEtld1f6Sw
@RubenVerborgh The browser landscape is getting tighter and tighter. Also just leaving this here… ⤵twitter.com/tomayac/status…KA. For the record, I want this situation to massively improve, in the browser and in platform-specific apps.
@RubenVerborgh To be fair, Google has always rooted strongly for the Web (and, yes, advocated for apps, too). Selfishly so, sure, the article tells you why, but it’s definitely not a “turn of events”.
@patrickbrosset @rrelyea I’m aware of Stanford’s file naming best practices, but it’s mostly aimed at researchers: stanford.box.com/shared/static/… [PDF]
@rrelyea @patrickbrosset When you cover naming things, can you also cover cache invalidation? Always struggle with these three!
Demo of GeckoKit (think: the actual Firefox engine) running on iOS in 2015: youtu.be/VE-4b082Upw. 🤯
“Add a GeckoUIViewExample application which shows how you can use GeckoUIView. It contains a simple location bar with back/forward buttons.”-bugzilla.mozilla.org/show_bug.cgi?i…@snorptwitter.com/snorp/status/1…
“Google was insulated from the effects of Apple’s changes [to require apps to ask users if they want to be tracked] because many of its services are used heavily in web browsers and less as apps, which are subject to Apple’s rules.”—nytimes.com/2021/10/26/tec…
@MappingSupport @firt This is tracked as bugs.chromium.org/p/chromium/iss….
@rem This is tracked as bugs.chromium.org/p/chromium/iss….