argyleink #JS
Coming to Javascript near you, currently in @chromecanary:
🎉 optional chaining 🎉
Here’s Chrome status chromestatus.com/feature/566824…
Gif shows optional chaining in Canary devtools console working with eager evaluation, so sick! pic.twitter.com/pOhVs9Vwta
`SameSite` cookie recipes, by @rowan_m: web.dev/samesite-cooki… 🍪
@argyleink I rolled back to (the latest) bash: itnext.io/upgrading-bash….
Wow, this is an incredibly cute #a11y video introduction: youtu.be/HE2R86EZPMA (via the quoted tweet). In order to put your insights into practice, I recommend @MozDevNet’s guides on accessibility: developer.mozilla.org/en-US/docs/Lea…. twitter.com/Mandy_Kerr/sta…
@simevidas @mathias @jaffathecake Or video shot segmentation: www2012.universite-lyon.fr/proceedings/no…. In 2012, we worked with 1 frame per second split into tiles to speed up the processing. It worked surprisingly well; the demo is still up on my server: tomayac.com/youpr0n/index.…
jaffathecake This is why we need an API that can unpack a video into frames. twitter.com/rauchg/status/…
Just leaving this here with the rest of the fire..twitter.com/seaotta/status…pb
@argyleink @firt I maintain ios-a2hs-demo.glitch.me that tries to figure out which manifest features they support. Maybe helpful in this context.
Oh, neat, progress on the Async Clipboard API in @webkit (bugs.webkit.org/show_bug.cgi?i…) and support for `image/apng` (but not `image/webp` yet). twitter.com/webkit/status/…
anssik ✨Remote Playback API w3c.github.io/remote-playbac… is about to land in WebKit webkit.org/b/162971 I guess you’ll be able to use your iPad as a second screen for your web apps with Sidecar in the near future with this API. support.apple.com/en-il/HT210380
Some more background: techcrunch.com/2019/10/30/git….
In the context of its government takedown transparency effort (github.com/github/gov-tak…), @github has published the takedown request of the Spanish government (github.com/github/gov-tak…) regarding the @tsunami_dem (en.m.wikipedia.org/wiki/Democrati…) repo github.com/s3rrallonga/ts…
Focusing on focus: blog.whatwg.org/focusing-on-fo…. An in-depth post on focus behavior in HTML.
Clipping, Clipping, and More Clipping! css-tricks.com/clipping-clipp…. I kind of like the brand cut zoom effect in this demo: codepen.io/ainalem/pen/Yb….
A Guide to New and Experimental CSS DevTools in Firefox: smashingmagazine.com/2019/10/guide-… 🦊
Nice summary of writing asynchronous tasks in modern JavaScript: smashingmagazine.com/2019/10/asynch….
Pseudo “random” number generation in pure CSS: css-tricks.com/are-there-rand…. A nice trick from the “because you can” department. 🎲
addyosmani Safari shipped native image resizing in iOS13! Users can heavily reduce file sizes when <input type=”file”> is used.
⭐️ this bug if you think we should add a similar feature to Chrome :) crbug.com/1018022 pic.twitter.com/lUzaOckWx6
slightlylate Do you live in chrome://inspect for devtools over USB to your slow phones? Do you hit the limits of devtools and which you could get back to chrome://tracing for that littttle bit of extra insight?
Try chrome://inspect?tracing today!
paul_irish Join my team! 👐 Care about web performance, and want to help make the web better?
Apply via this super-generic Software Engineer job posting and then email chromejobs@google to let us know! (Mountain View, CA only—sry!) 💚careers.google.com/jobs/results/6…a
@kennethrohde @AaronGustafson @nambi_r The latest (alongside the previous) spec is implemented in wake-lock-demo.glitch.me.
@argyleink 🚢 it!
@nambi_r Please see github.com/w3c/wake-lock/… on some background on adding this feature as a functionality of the Wake Lock API.
wesbos 🔥 Took a look at the Air Pods pro website. Some interesting stats about a media-heavy site:
(apple.com/ca/airpods-pro/)
meduzen New (messy) article: “#watchOS, the wrist and the web for smaller screens”.
dev.to/meduzen/watcho…
If you follow some common #frontend good practices, your website is maybe already usable on very small viewports.
@alexey_rodionov @agektmr @Firebase @mbleigh @lmoroney @CodingDoug @ThatJenPerson @_davideast @ChromiumDev CC: @peterfriese
kdzwinel WebKit is experimenting with blocking *all* third party cookies, not only those flagged by ITP, for sites w/o prior user interaction.
bugs.webkit.org/show_bug.cgi?i…
MarcoInEnglish My very first post on @mozhacks has just been published. In it, I write about all the cool new #accessibility #auditing features in the @FirefoxDevTools, like contrast, color vision deficiency simulator, keyboard/focus and text labels. #a11y #webdev hacks.mozilla.org/2019/10/auditi…
Interesting, @UCBrowser is now the first third-party browser option on @KaiOStech. Is this a full @firefox 48 replacement based on Chromium (unlikely), or just a Firefox 48 WebView with a UC Browser look & feel and curated content (likely)? kaiostech.com/uc-browser-joi…
neuland Nächste Woche Dienstag trifft sich die @GDGBremen in unseren Büroräumen. Vortrag des Abends: „Dark Mode in Web” von @tomayac
Hier gehts zur Anmeldung 👇
meetup.com/de-DE/gdg-hb/e…
This fear of clicking a link that might lead to a site that doesn’t support dark mode 🌒. In German, we call it Blendungslinkklickangst. Learn how not to be that site: web.dev/prefers-color-…. twitter.com/pbakaus/status…
domenic The new two-value syntax for CSS’s display property makes so much sense. Good refactoring, @csswg. hacks.mozilla.org/2019/10/the-tw…
@aaranged LOL, that’s next level trolling.
@RReverser @DasSurma @kosamari @slightlylate Sqip Primitive Art would also make for a cool Squoosh plug-in: axe312ger.github.io/sqip/.
bibydigital I wrote about navigating DevTools and using it to understand how rendering works! 💻🎨 There’s examples, diagrams and neat shortcuts, all on @calibreapp 🆒🆕🆓🤓👉
calibreapp.com/blog/investiga…
PixelAmbacht If you use variable fonts in CSS you might have ran into the font-variation-settings inheritance problem, where axis values don’t naturally cascade down. Luckily there’s a workaround!
“Boiling eggs and fixing the variable font inheritance problem” → pixelambacht.nl/2019/fixing-va… pic.twitter.com/AV2CacPQ5M
@Justinwillis96 Thanks for writing about it! 😊
@johnwilander @simevidas Thanks for the open web link, it was a good read on important works!
Great that Apple News is apparently tasked to break the filter bubble (iphone.appleinsider.com/articles/18/11…). It would probably make for a great “unwalled garden” Progres
@JoubranJad @GoogleDevExpert 🐡 ❤️
@argyleink Made in Germany 🇩🇪
en.wikipedia.org/wiki/Rimowa 🧳
@GavrielYariv @ChromiumDev You have to manage the state (i.e., which files are opened) yourself, but from what I understand based on the information in the tweet, your use case sounds feasible. Feel free to ask follow-up questions here, or open issues on
csswg CSSWG is planning to automatically apply EXIF orientation to all images, and to deprecate ‘image-orientation’.
Please make sure your images have correct orientation!
Also if you have use cases for ‘image-orientation’ other than fixing mis-oriented images, let us know!
@anssik I just tried pixel.new, and no new phone. Not even an old phone. Giving the whole experience one out of five stars.
Web Board (webboard-app.web.app ) by @Justinwillis96 is a cool Progressive Web App that uses the native file system API when the browser supports it. Some background on the app: medium.com/@justinwillis/…. #NativeFS
@johnwilander This link (apple.news/AJFqXqhysQ8KjL…) is a dead end for me in Germany, because Apple News isn’t a thing here. The App Install Banner is visible for a split second until the JavaScript figures it out. Not the #WebWeWant. pic.twitter.com/5BdDfIzL4a
Service Workers at #w3cTPAC: jakearchibald.com/2019/service-w…. The working group chair @jaffathecake summarizes the Service Workers meeting. Great read!
Cascading Cache Invalidation: philipwalton.com/articles/casca… by @philwalton. A great in-depth article on one of the two hardest problems in computer science. 👍
Not_Woods Initial support for the Web Share Target API in #FirefoxPreview pic.twitter.com/spDqP1tEC4
WebPlatformNews 🕵️♂️ The European Union is financing the development of a client-side page translation service (powered by machine learning) that will ultimately be open-sourced and integrated into Firefox.
Prototype running in Firefox: youtube.com/watch?v=_ha59D…
More info: zdnet.com/article/firefo…
AaronGustafson 🔖 I love how deep @hj_chen goes in her posts on CSS features! Check this one on CSS counters chenhuijing.com/blog/the-wondr…👾
Display Locking (github.com/WICG/display-l…) is an exciting API proposal with a likewise fascinating history (read upward from the quoted tweet). ⤵️ twitter.com/rakinazata/sta…
stefanjudis The web is not an application platform?
I just came across this planing document of Project Fugu (chromium.org/teams/web-capa…), and wow! There is so much stuff coming to the web! 😲
docs.google.com/spreadsheets/d…
mathias Puppeteer v2.0.0 is out! 🔥
➡️ Emulate CSS media features such as dark/light mode or prefers-reduced-motion
➡️ Emulate timezones
➡️ Improved page.screenshot
github.com/GoogleChrome/p… pic.twitter.com/V1ECWgswfH
ChromiumDev Automatic lazy-loading of images and iframes yields a ~10% reduction in bytes downloaded per page for Lite Mode on Android:
blog.chromium.org/2019/10/automa… ⚡️
mathias The #ChromeDevSummit web app lets you view the schedule in your own timezone: developer.chrome.com/devsummit/sche… Super handy!
With Puppeteer v2, you can now write automated tests for this functionality. This script takes a screenshot of the schedule as viewed from Buenos Aires. pic.twitter.com/4M05EgGsr3
Remember my 🌒📸 dark mode screenshot script from a couple months ago? @mathias has just implemented `page.emulateMediaFeatures(features)` in Puppeteer, which makes the script a lot lighter.
Needless to say, the PR that updates the script to use it wa@mathiastwitter.com/tomayac/status…
othermaciej The WebKit team at Apple is hiring! Want to help define the future of layout and rendering in the engine that powers Safari, and many other first and third party apps on macOS and iOS?
No browser engine experience required.
jobs.apple.com/en-us/details/…
bocoup We’ve worked with @MozDevNet to bring Test262 results to MDN! Read the full details of the announcement in our launch post: bocoup.com/blog/launching… pic.twitter.com/lN2dEoSxOY
@rowan_m Yeah, it’s a known limitation on Twitter’s end for GIFs and videos, and I just found it is (or at least was) a limitation of Tweetbot (twitter.com/tomayac/status…).
Ah, also apparently not all Twitter clients support the native feature, I haven’t thought of this. Apparently Tweetbot is one of them (according to some blog posts, but I have never used it). This would be a reason for me to switch to a new client.
@tkadlec Oh, interesting, thanks. I have never used such GIFs (it’s actually mentioned as a limitation in bullet 4 on help.twitter.com/en/using-twitt…). Then it’s probably a feature request for @TwitterA11y to enable it for GIFs and videos.
Are there screen readers that don’t handle Twitter’s native image descriptions at all, incorrectly, or not well enough? Don’t people know it’s an option in the first place? Or am I missing something else?
🤔 Meta Twitter question—What’s this recent trend of folks providing “alt: [desc]” image descriptions in a reply instead of using Twitter’s native feature help.twitter.com/en/using-twitt…9)?
I use the native feature and find manual descriptions make Tw
WikiResearch A visualization of 12M @WikiCommons
pictures allows to search by image, filter by tags, colors and licenses,and browse by visual similarity.
wikiview.net
(Barthel et al, 2019)
@ACMMM19 Paper: arxiv.org/abs/1910.06005 pic.twitter.com/b4WehkUq1P
agektmr Get Ready for New SameSite=None; Secure Cookie Settings
blog.chromium.org/2019/10/develo…
@smfr @gsnedders @foolip There’s github.com/web-platform-t….
@shauntrennery @petele There’s some external, third-party data available, for example gs.statcounter.com/browser-versio… or clicky.com/marketshare/gl….
Wow, Samsung now allows PWAs to be added to their Galaxy Store. They’re all listed in a “Web Apps” category, which still stigmatizes them a bit, but maybe over time they’ll be fully blended in. Listing PWAs in the first place is a great step. 👏medium.com/samsung-intern…twitter.com/samsunginterne…
dancwilson Oh. Hi!
I spoke today with the wonderful people at @ThunderPlains about that wonderful API centered around Web Animations that is named the Web Animations API!
Slides: noti.st/danwilson/TUJd…
CodePen Demos: codepen.io/collection/AMZ…
umaar Dev Tips - DevTools: View CSS information with the CSS Overview Panel: umaar.com/dev-tips/209-c… - An experimental feature currently in Canary pic.twitter.com/TkA4wBMFJk
Chrome 78 is out, and with it two exciting Project Fugu 🐡 APIs as an origin trial: the Native File System and SMS Receiver APIs! @petele’s article has all the pointers. ⤵️ twitter.com/ChromiumDev/st…
workingdraft Revision 399: Project Fugu mit @tomayac workingdraft.de/revision-399-p…
@RahulGu24395058 I don’t know, but maybe @gmail can help?!
slightlylate It’s infinitely frustrating to see press coverage of HKmap.live that doesn’t *actually link to HKmap.live* which is a real, bona-fide website that does the job.
@RahulGu24395058 Gmail uses a custom darkening heuristic that I haven’t looked into in detail but that definitely doesn’t consider `prefers-color-scheme` at the moment.
@polip123 @v8js See twitter.com/tomayac/status…, please.
@chicoxyzzy @v8js Thanks for filing and finding this issue. @mathias or @RReverser are on it. Good catch indeed.
@tuananh_org @v8js That’s the service worker doing its job updating its caches :-)
@approxhuman @CryZe107 @v8js If you see the site in a web view like Twitter’s, the app needs to have opted in this web view to auto-darkening. Try in Chrome/Firefox/… (a real browser) directly.
@approxhuman @v8js Yes, works universally. On iOS web views like Twitter’s, they need to be compiled against the iOS 13 SDK.
@v8js Shout out to @mathias and @RReverser who have helped golf ⛳️ down the size (bundlephobia.com/result?p=dark-…) of `<dark-mode-toggle>`: github.com/GoogleChromeLa….
Now with this having landed, back to the fishing rod… 🎣 </online>twitter.com/tomayac/status…F
@v8js Method ① (github.com/GoogleChromeLa…), ie, different stylesheets, would’ve worked w/o JS (for the default color scheme, not the toggling), but because @v8js is about JS, and multiple CSS files would’ve meant touching the service worker logic, we
tomayac @v8js @v8js’ dark mode is powered by `<dark-mode-toggle>` (github.com/googlechromela…) and uses method ② (github.com/GoogleChromeLa…), ie, a `dark` class. Usually, we recommend different stylesheets (web.dev/prefers-color-…), but for v8.dev it wasn’t worth it (small files).
@v8js @v8js’ dark mode is powered by `<dark-mode-toggle>` (github.com/googlechromela…) and uses method ② (github.com/GoogleChromeLa…), ie, a `dark` class. Usually, we recommend different stylesheets (web.dev/prefers-color-…), but for v8.dev
v8js Let’s [not] keep you in the dark anymore… Introducing dark mode for v8.dev!
By default we’re going to display the blog according to your system theme, but feel free to override the preference using a toggle in the footer. (h/t @tomayac) pic.twitter.com/67rH8su3yU
Gone fishin’ 🎣 until the last week of October. Offline, mostly.
@Oliver41618769 The intrinsic size drafts.csswg.org/css2/conform.h….
jesper_vos Finally a way to read the viewport height when the keyboard is up in iOS13 with the Visual Viewport API 🤩
developer.mozilla.org/en-US/docs/Web… pic.twitter.com/dBhVDWlewT
@kennethrohde @firt Just sent you a DM, Max… :-) You belong!
SEAINFL Caret Browsing is now enabled by default in chromium-based Edge in canary channel. You can activate it by pressing F7. If you don’t know what it is - bit.ly/2AKKxwt
Let us know what you think!
cc: @kylealden pic.twitter.com/X12xGdr8b2
@soMelanieSaid @eleven_ty Start with github.com/11ty/eleventy-… :-)
@rmondello Congratulations! 🎈
@RReverser @hashseed @mathias @v8js If only there was something like a, *cough*, switch that I could, *cough*, toggle to enlighten you…
@raymondcamden @slightlylate @webkit @jonathandavis Parts of their web apps docs leave a fair bit to be desired, though. Luckily @firt covers regularly what’s happening (as you likewise said in the talk). Just wanted to make sure people who see this san
@slightlylate @raymondcamden To be fair, Apple has release notes for Safari releases (e.g. developer.apple.com/documentation/…) and @webkit Technology Preview releases (e.g. webkit.org/blog/9600/rele…). The #FronteersConf talk seems to be based on raymondcamden.com/2018/06/07/kee…@jonathandavis
Mandy_Kerr Good points by @_munter_ at Fronteers!
Don’t ruin the hard work of font creators when improving performance. Ligatures, kerning they matter for readability and ledgibility of different characters and people who make fonts put a lot of effort into achieving this! #fronteers pic.twitter.com/GRa9Rp5T3u
jaffathecake All browsers ship with gzip & deflate. This proposal lets you use them via JavaScript. twitter.com/TypeSong/statu…
jaffathecake This is an incredible deep dive from someone who really knows the subject twitter.com/htmlparserbook…
Fun hack session with @mathias and @RReverser today. Something neat is coming to @v8js (well, v8.dev to be precise) some time in the not too distant future. 🌒
Such an honor and privilege to work with these folks! ☺️
AndyDavies If you’ve ever wondered how to read a WebPageTest waterfall, @TheRealNooshu has you covered.
nooshu.github.io/blog/2019/10/0…
@0xcea5ed1015 @Apple @webkit Push notifications per se *can* be useful. Starting fresh can mean Apple can improve upon the status quo and learn from everyone’s faults and really set their implementation apart.
“The conflict was never about Web Components, it was about where you are on this continuum between ‘standard’ and ‘proprietary’.”—@aerotwistt at#FronteersConffpic.twitter.com/OeSdbqmG4YY
@patrick_h_lauke @Apple @webkit It’s over the top for sure. The “this escalated quickly” bit from my tweet probably wasn’t clear enough to convey that I was being ironic.
100% pure CSS Mario Kart: codeburst.io/mario-kart-css…. Mind blown by @StephenCookDev at #FronteersConf. Because you can definitely means you should in this case! 👏
Secrets of native-like PWAs (warning: large PDF), by @JoubranJad at #FronteersConf. 🐈 jadjoubran.io/fronteers19/sl…
CC: @jonathandavis 👋
😳 Wow—This escalated quickly: someone created aChange.orgc petition for the bug to@Applee that I’ve filed:@webkitt 182566—Feature Request—Add support for the ServiceWorkerRegistration’s PushManager interfacbugs.webkit.org/show_bug.cgi?i…97change.org/p/tim-cook-app…
The most accessible introduction to ES proxies that I have seen so far: deliciousinsights.github.io/fronteers-es-p… by @porteneuve at #FronteersConf. Brilliant! 👏
A deep dive into images on the web, by @hj_chen at #FronteersConf. chenhuijing.com/slides/71-fron…
marcosc State of the @w3c’s Web Applications WG: a summary of where all your favorite W3C specs are along the Standards Track, and what progress have been made in the last year!
Links to GitHub Issues where you can follow up with spec Editors if needed.
lists.w3.org/Archives/Publi…
The `width` and `height` attributes are soon going to be meaningful again, despite everyone styling with `width: 100%` and `height: auto`. This issue comment by @jensimmons explains the “how” and the “why”: github.com/WICG/intrinsic…. 📐 twitter.com/intenttoship/s…
This website’s design is amazing! ⤵️ twitter.com/AshKyd/status/…
davrous You now better understand why we’re working on this: github.com/MicrosoftEdge/… to let PWAs target foldable devices ;) #SurfaceNeo #SurfaceDuo
Evaluating JavaScript code via `import()`: 2ality.com/2019/10/eval-v…. I see what you did there, @rauschma.
Also the halting problem(in the hover text).
College Athletes xkcd.com/2210/. Finally I understand what currying is. 🤯 Thanks, #xkcd!
natfriedman 🔥Multi-line comments are here! Click and drag to comment on multiple lines in a pull request diff. ✨
These little quality-of-life improvements are at the heart of what we love doing at GitHub. 🥰 pic.twitter.com/g4eXaPihv8
@marcosc Probably need to add some Fugu APIs 🐡 to the detector at some point. /me takes mental note.
@marcosc @ericlaw The “unlock more Assistant features” thing starts a wizard that tries to make you share more data like your location so that it can provide you with more targeted suggestions. Probably somewhere you have blocked something in your pri
@marcosc @ericlaw Just say “always use Fahrenheit for weather”. pic.twitter.com/zZ8suRIKTc
@marcosc For Android, I suggest you run tomayac.github.io/pwa-feature-de… and fill the ‘❌’. For your Firefox for iOS users, I suggest you encourage (by commenting) Apple to work on the bugs listed at the end of medium.com/dev-channel/pr… (and let WKWebView use s
@digitarald Sure! Happy to learn more. I will try to find you during the next break. ☕️
The @webwewantfyi lightning talk session at #ViewSourceConf is great:
1) `media` attribute for <video>’s <source>s
2) Automatically force-fix #a11y issues like readability, zooming, contrast, focus
3) Performance impact of extensions
4) Debugger save p@ChromeDevToolspic.twitter.com/m8GdVwwpYS
slightlylate Via @kinu, this is *such* cool work by MSFT: medium.com/pwabuilder/bri…
Great #ViewSourceConf talk by @KenjiBaheux and @tyohan on web experiences in India 🇮🇳 and Indonesia 🇮🇩 compared to Japan 🇯🇵. Always great reminder to see how completely underpowered even recently released lower end devices are. These devpic.twitter.com/V9JsPSxeKu
Things you can target your ads on: IAB7-30 infertility, IAB7-29 incontinence,..support.aerserv.com/hc/en-us/artic…s2. Fro@selenamarieie’#ViewSourceConfnf talk o#privacycy.
12 years at Google today. There were many ups and some downs, but it’s mostly been a fun ride. Moving into Developer Relations was for sure the best move of my career that I’d have made earlier hadn’t there been location constraints for way too long. Ther#Googleversarypic.twitter.com/FKSjMyFPmb