Jen Simmons

Dear web developers & designers,

Now that you know what’s coming in Safari 17 — as well as what shipped in Safari 16.2-16.5 — what do you need in WebKit next?

Which web technology that’s already been standardized is highest priority? What brand new idea do you need invented?

Jun 14, 2023 at 3:09pmWeb
Show threadSnugugJun 14, 2023
@jensimmons style queries please! Even just custom property ones open up so many new and exciting possibilities
Show threadCharlie FishJun 14, 2023

@jensimmons I’d absolutely love to see more flexibility in terms of the search engines you can choose from.

The default list is ok. But allowing developers to create plugins to add their own search engine as a default option would be great.

Show threadOllie BoermansNov 13, 2023
@fishcharlie Yes! Annoying to install a plugin for this @jensimmons
Show threadcastastropheJun 14, 2023
@jensimmons I'd love to see the browser devs come together to create a really intuitive set of styling pseudos or methodologies for shadow dom! I get a ton of questions about slotted relationships and gotchas and would love to have a strong set of tools to offer themers.
Show threadcastastropheJun 14, 2023
@jensimmons I also think there's a real opportunity for webkit to lead in this space. It's an area with lots of opportunity for creative solutions and a misconception in the community that safari doesn't care about web components. We could totally correct that!
Show threadChristian "Schepp" SchaeferJun 14, 2023
@castastrophe @jensimmons I'd also love Apple to pick up on their idea of HTML Template Instantiation back from 2017: https://github.com/WICG/webcomponents/blob/gh-pages/proposals/Template-Instantiation.md
I think Web Components still could use better DX and that would help a lot.
webcomponents/proposals/Template-Instantiation.md at gh-pages · WICG/webcomponents

Web Components specifications. Contribute to WICG/webcomponents development by creating an account on GitHub.

GitHub
Show threadRenaud ChaputJun 14, 2023
@jensimmons a way for the user to grant access to some local files from file picker, so I can resule large uploads / delegate the upload to a worker.
Use case: online photo/video album (https://notos.co)
Breathe new life into your stories

Turn your memories into beautiful stories. Whether you went on a trip, attended a wedding, captured precious moments of your child growing up: create your album!

Notos
Show threadJeremy KeithJun 14, 2023

@jensimmons View transitions, please!

🔗 https://adactio.com/notes/20246

June 14th, 2023, 3:16pm

View transitions, please!

Show threadAsbjørn UlsbergJun 15, 2023
@adactio @jensimmons Yes! 💯
Show threadPelle WessmanJun 14, 2023
@jensimmons The handling of installing web apps is my top one I think, from within the web site itself, and maybe background sync to ensure better offline behavior
Show threadPelle WessmanJun 14, 2023
@jensimmons Also, the https://github.com/WebKit/standards-positions/issues/90
Web App Launch handler · Issue #90 · WebKit/standards-positions

Request for position on Web App Launch Handler Information about the spec Spec Title: Web App Launch Handling Spec URL: https://wicg.github.io/web-app-launch/ GitHub repository: https://github.com/...

GitHub
Show threadsara the ninth 💀Jun 14, 2023

@jensimmons on the topic of shooting for the moon on new ideas... I wish there was such a thing as pure CSS Shaders that could apply across elements like blend modes and filters. Not having to confine it to canvas. I want a box that could get a CSS Shader applied to its edges to look like a pencil sketch, or a series of text lines to get wavy grass treatment.

I know WebGL is there, but I want shaders outside canvas and without the necessity of JsvaScript to pull off.

Show threadsara the ninth 💀Jun 14, 2023
@jensimmons and IF it existed and could tie into CSS animations it’d make for some intriguing possibilities.
Show threadPaul RosenJun 14, 2023

@jensimmons native "combo box" - a select control where the user can type to filter the selections.

Also a richly-styled select control dropdown area.

Show threadDayton LowellJun 14, 2023
@paulrosen @jensimmons yes! A million times this!!
Show threadJon LunmanJun 15, 2023

@paulrosen @jensimmons

Isn't that a datalist?
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datalist

I'm with you on richly styling the dropdown area though.

<datalist>: The HTML Data List element - HTML: HyperText Markup Language | MDN

The <datalist> HTML element contains a set of <option> elements that represent the permissible or recommended options available to choose from within other controls.

MDN Web Docs
Show threadPaul RosenJun 15, 2023
@jlunman @jensimmons I've never used that! I'm going to experiment because that might do it. I wonder why it isn't more widely used.
Show threadJon LunmanJun 15, 2023
@paulrosen @jensimmons The datalist UX isn't that great. and it's inconsistent across browsers and devices. I feel that way about a lot of the HTML5 input types, actually. The browser implementations often feel half-baked, and confusing to use. It's probably why devs keep reinventing better versions of these inputs in JS.
Show threadChris De JabetJun 14, 2023
@jensimmons From an end-user perspective, WebUSB support in Safari would be great. A common use case is my son currently has to use Chrome to load updates and scripts from his Mac to his NumWorks graphing calculator. https://www.numworks.com
NumWorks Graphing Calculator

The graphing calculator that makes everybody a math person.

Show threadLewis DorigoJun 14, 2023

@jensimmons Honestly, browser updates that aren’t tied to OS updates.

One of the few things I like about Chrome is that it’s invisibly self updating, so that you can make a relatively safe assumption that most people will be on the latest version.

Show threadalwillisJun 14, 2023
@dorigo At least on macOS, the latest Safari runs on the newest and the previous two os versions. So Safari 17 will run on Sonoma, Ventura and Monterey.
Show threadOlliewJun 14, 2023
@jensimmons I’d love to see updates to the Typed OM to match the latest spec so that it works with colors. Import Attributes for CSS and JSON modules. Anchor positioning
Show threadOlliewJun 14, 2023
@jensimmons I noticed this in Safari Technology Preview but it doesn’t seem to do anything yet 😅
Show threadDerk-Jan 💙💛🇺🇦Jun 14, 2023

@jensimmons
Some new things id like to see:

- canplaytype for img elements
- Column styling of tables that doesn’t break when I use a sporadic colspan/rowspan (which breaks nth-child).
- Allow changing of themecolor after the page loaded (consider opening a black background imagegallery on a white background (and themed) page, which currently causes a very nice white frame around your black background)

Show threadJacob ParkerJun 14, 2023
@jensimmons improving spec compliance for flexbox
Show threadOlliewJun 14, 2023
@jensimmons i’d also like to see for-await-of loops work with streams
Show threadbigandyJun 14, 2023
@jensimmons sibling-count and sibling-index pseudo selectors. https://github.com/w3c/csswg-drafts/issues/4559 e.g. for use in https://codepen.io/bigandy/pen/JjapVgq
[css-values] Proposal: add sibling-count() and sibling-index() · Issue #4559 · w3c/csswg-drafts

Problem Currently we can query a child based on it's child index position or query on children length (with some complex syntax), but we can't use the index or length as values in our styles. Feels...

GitHub
Show threadbigandyJul 20, 2023
@jensimmons looks like its coming to CSS as part of css-values-5 https://twitter.com/bramus/status/1681804553677864960
Bramus on Twitter

“🤩 Exciting news from the @CSSWG F2F. We just resolved on adding sibling-count() and sibling-index() to css-values-5 ED! 🥳 This was the #1 request we heard from authors at @CSSDayConf. Yes, we *are* listening to you. https://t.co/GvdNnI8gtJ”

Twitter
Show threadTuomas Hämäläinen 🇺🇦Jun 14, 2023
@jensimmons Support for WebSerial would be super nice. A web browser is a terrific tool for prototyping digital experiences and being able to connect say an Arduino to extend them into the physical world is very helpful.
Show threadmiunauJun 14, 2023
@jensimmons definitely webm support in MediaRecorder and playback which would eliminate a lot of unnecessary server-side video pipelines eating up energy for nothing. And Web MIDI support would be really nice. A lot of synth folks are using it for communicating with hardware, including firmware updates, and it's supported by both chrome + firefox already.
Show threadOlliewJun 14, 2023
@jensimmons also if I’m being greedy: selectmenu, Web Transport, temporal, scroll linked animations
Show threadOlliewJun 14, 2023
@jensimmons and AV1 video
Show threadNikolas EversJun 14, 2023
@jensimmons font-face size-adjust https://caniuse.com/mdn-css_at-rules_font-face_size-adjust
CSS at-rule: `@font-face`: size-adjust | Can I use... Support tables for HTML5, CSS3, etc

Show threadJen SimmonsJun 15, 2023

@vintagesucks

Great news. `@font-face size-adjust` is in Safari 17 beta.
https://webkit.org/blog/14205/news-from-wwdc23-webkit-features-in-safari-17-beta/

News from WWDC23: WebKit Features in Safari 17 beta

It’s been a fantastic year for WebKit.

WebKit
Show threadNikolas EversJun 16, 2023

@jensimmons

Great, thank you!

I should read more carefully.

Show threadRoma KomarovJun 14, 2023
@jensimmons To fix the accessibility issues with the `display` on the table elements (https://adrianroselli.com/2022/07/its-mid-2022-and-browsers-mostly-safari-still-break-accessibility-via-display-properties.html#Update18)
It’s Mid-2022 and Browsers (Mostly Safari) Still Break Accessibility via Display Properties

It was late 2020 when I last tested how browsers use CSS display properties to break the semantics of elements. I had been waiting for Safari to fix how it handles display: contents for four years now, and was excited when the announcement came in June. Then I started testing…

Adrian Roselli
Show threadChristian "Schepp" SchaeferJun 14, 2023
@jensimmons I'd also love to see a few of the Open UI proposals get pushed forward by Apple.
Show threadBen DelarreJun 14, 2023

@jensimmons Web Codecs - sorely needed for performant video apps.

WebGPU - going to be a game changer next year.

Show threadJen SimmonsJun 15, 2023

@bendelarre We shipped support for video Web Codecs in Safari 16.4.

https://webkit.org/blog/13966/webkit-features-in-safari-16-4/#images-video-and-audio

WebKit Features in Safari 16.4

Today, we’re thrilled to tell you about the many additions to WebKit that are included in Safari 16.4.

WebKit
Show threadBen DelarreJun 15, 2023

@jensimmons Totally passed me by. But that's great news Jen! I'm sure our video teams are all over it already.

I can't wait for OffscrrenCanvas WebGL to land this fall, then it's full steam ahead to WebGPU I hope?

Show threadJeroen ZwartepoorteJun 16, 2023
@bendelarre @jensimmons if you look at the PRs in the WebKit repo on GitHub, then you can see it’s indeed full steam ahead on WebGPU!
Show threadAtropa BirdpersonJun 14, 2023
@jensimmons can you get ‘mask-border’ off vendor prefix and promote its use?
Show threadAtropa BirdpersonJun 14, 2023
@jensimmons in terms of invented we really need a css filter function that just tints the element. Multiply with a css color. NPM is full of hacky attempts to approximate this by misusing sepia() and hue-rotate()
Show threadDominicJun 14, 2023

@jensimmons at least every 8 weeks an new stabil release.

You have the manpower, you have the capacity. Your are Apple. Do it!

Show threadmarkusrubeyJun 14, 2023
@jensimmons wasmgc
Show threadjsnkuhnJun 14, 2023
@jensimmons been wanting CSS corner-shape since it was originally proposed back in 2013. https://drafts.csswg.org/css-backgrounds-4/#corner-shaping
CSS Backgrounds and Borders Module Level 4

Show threadBrad DoughertyJun 14, 2023
@jensimmons some way to set the "safe area insets" of native caption display so they can be moved out of the way of video controls would be really nice
Show threadRyan Townsend (old account)Jun 14, 2023
@jensimmons Navigation API, View Transitions and Scroll-Linked Animations 🙏
Show threadBrad DoughertyJun 14, 2023
@jensimmons full opus audio support
Show threadDerk-Jan 💙💛🇺🇦Jun 14, 2023
@brad @jensimmons yeah, multichannel opus and simple opus file support please !
Show threadBrad DoughertyJun 14, 2023
@TheDJ @jensimmons Safari does support Opus in webm right now, but we could really use Opus in mp4 for Vimeo!
Show threadAaron CzichonJun 14, 2023
@jensimmons Technical Standards on Safari are already pretty good. Good developer tools in safari would be awesome (but that’s a large project).
Show threadajkandyJun 15, 2023
@aaronzichon @jensimmons It's sort of a separate project, but yeah, I'd love to have something that's CodePen on the desktop, that uses the Safari engine (and/or other installed browsers) for live rendering, without having to install command-line Sass build tools, MAMP, etc.
Show threadRickyMarouJun 14, 2023
@jensimmons view transitions
Show threadBruce B AndersonJun 14, 2023
@jensimmons
HTML Modules
Show threadJoe PeaNov 9, 2023
@bahrus Being able to write custom elements purely in HTML and avoiding JS, especially if they don't need any logic, would be great! Declarative Shadow DOM and Declarative Custom Elements spec ideas may help with this.
Show threadRickyMarouJun 14, 2023
@jensimmons animation-timeline + scroll()
Show threadNeil MorrisonJun 14, 2023

@jensimmons

New spatial thing would be a scriptable 3D primitive format on the web - showing pre-made .usdz / .gltf files is neat but I don’t think there’s a “canvas” equivalent to the “img” of Quick Look & <model> etc.

To visualise charts / graphs dynamically in 3D, or stream in some dimensional data.

WebXR immersive session exists but that feels like _too much_ control & you lose the OS / Browser UIs. (Which is presumably why it’s behind a flag in Apple Vision’s Safari)

Show threadLuca Degasperi has movedJun 14, 2023
@jensimmons possibility to define a border between flex or grid items
Show threadJohannes OdlandJun 14, 2023

@jensimmons So much good stuff on the way already ✨

But since you asked:

View Transitions, Scroll-driven Animations and `text-wrap: balance`. 🙏🏻

Improving viewport units in IABs.

Fixing accessibility issues with scroll-snap on root.

Keep up the good work 🚀