00:04
はい、9月24日土曜日、地獄ワーサック寺を回りました。
あいにく土曜日の台風15号がまた近づいてきていて、こちらも雨が続いている感じですね。
はい、おはようございます。ひめみのkeethこと桑原です。
じゃあ本日も朝活を始めていきたいかなと思います。
先日昨日はちょっとバタバタしてたので、スキップさせていただきましたけど、今日からやっていきたいと思います。
今日はですね、前述通りですけども、
WWDCだっけ?違うわ、Appleのイベントですね。
いろんなものが発表になって、その中にWebKit、Safariのお話があるので、そこの記事を早速また読んでいこうかなと思います。
以前もSafari 16 Betaの記事を2,3回分けて読んだんですけど、改めてリリースになったというところで、
何がどうなったのかというのをまとめてみようかなと思っています。
では行きましょう。WebKit FeaturesにSafari 16.0という記事ですね。
9月12日なので、2週間近く前に出た記事ですけど、それを読んでいこうかなと思っています。
おはようございます。プテノードさんですね。
今日もご参加いただきありがとうございます。
タイトルのある記事をダラダラと読んでいこうかなと思っています。
では行きましょう。
本日、iOS 16、Mac OS、また読み方がわからない。
Mac OS Big Sur向けのSafari 16.0のリリースをお知らせします。
このリリースにはWebデベロッパーがサイトやWebアプリケーションをより良くするために使用できる新しいWebテクノロジーがかなり含まれています。
Mac OS 16、MontereおよびMac OS Big SurでSafari 16.0にアップデートするには、
システム環境設定ホゲホゲからアクセスしてください。
iOSでSafari 16にアップデートするには、iOS 16.0をインストールします。
Safari 16 for Mac OS VenturerとiPad OS 16は今年10月にリリースされ、
Mac OS VenturerではWebプッシュが搭載される予定です。
まだ今の段階ではWebプッシュ通知はできていないと。
ブラウザ的にはWebプッシュ通知の準備はできているので、
あとはOS対応ができればという感じですかね。
その辺を読んでいこうかなと思います。
でもWebプッシュ通知がブラウザ、Safariの方からできるようになるということは、
より僕らアプリケーション開発のエンジニアとしては幅が広がったり、
お客さんへのビジネス提供もできるようになるので、ここは大きいなとやっぱり思っていますね。
で、Safari 16の中身については、他の記事ですね。
WWDC 22のニュース、Safari 16βのWebKit機能ってですね。
これが多分僕が以前読んだ記事かな。
とか、まだWWDC 22のセッションですね。
What's new in Safari and WebKitという32分のビデオがあるそうですけども、
こっちで多くの詳細を発表していますので、見てみてくださいと。
しかしこれだけでももちろんなくて、
そのWWDCから数ヶ月の間に私たちはさらに多くの機能を追加にしてますよというところですね。
03:02
それからまださらに多くの機能追加しているというところで、
その辺の差分がこの前の記事で読めたらいいのかなとちょっと思っていました。
では早速一個一個入っていきたいと思いますが、
まずはニュースシンスSafari 16β1って書いてますので、
Safari 16β1からのさらに新機能というところからですね、記事が始まっています。
iOSの16用Safariというのは、AVIF形式で圧縮された静止画というのをサポートしています。
Alliance for Open Mediaによって開発されたAVIFというものは、
JPEG、PNG、GIFというのかGIFというのかどっちか分からないですけど、
WebPですね、などの画像フォーマットの代替となるものです。
複数の色空間、可逆圧縮と非可逆圧縮などの機能も備えています。
非可逆圧縮もちゃんと備えてるんですね。これでかい。
AVIFのサポートというのは10月にMacOS VengelaとiPadOSにも提供される予定です。
まだ入ってないと思うんですね。
WebKitはResolution Media Queryを完全にサポートするようになりました。
このMedia Queryというのは、Webデベロッパーが画面のピクセル密度に基づいて、
条件付きでCSSを適用する方法というのを提供しています。
例えば、ソースコード的に、
メディア括弧、min-resolution,326dpi、括弧みたいな感じですね。
そういう書き方ですね。
メディアクエリとほとんど書き方は一緒ですね。
というのがサポートになってますよと。
Resolution Media Queryと僕は実は全然触ったことないので、
これはちょっとこの後気になるんですけど、調べてみようかなと思います。
あとWebKitはText Align Lastというのをサポートになりました。
Text Align Last。
これはテキストブロックの最終行の配置を設定できるCSSプロパティです。
例えば、ある段落のほとんどの行にText Align Centerというのを適用して、
その段落の最終行はText Align Last、コロンライトとかで右予選することができます。
これ、欲しいやつだな。
これは嬉しいですね。
今まで、例えば引用文とか書いてて、
引用者の名前だけ最後右端にしたかったりするんですけど、
やっぱりそこだけ別のタグですね。
最終行だけタグで挟んでおいて、そこだけの特別なCSSを書いたんですけど、
そこは別に特に何もしないままText Align Lastっていうので書いておけば、
自動的にSafariがその辺を監視して、
最終行だけをやってくれるという感じですね。
これは嬉しいですね。
前回からもそうなんですけど、
メインブラウザーをガチでSafariに移すか悩み始めたんですよね。
Chromeが重いっていうのも正直あったりしてて、
悩ましかったんですけど、
開発者ツールですよね。
Chromeも開発者ツールは別にいいんですけど、
Safariの開発者ツールって実は結構いい感じなんですよ。
Chromeにはない機能もたくさんあるので、
乗せ替えを本気で今検討してたんですけど、
改めて今日のこの記事を聞いて、
本当にここでドーンとゴーしちゃうかもしれないです。
06:00
余談でした。
続いていきましょう。
続いてWebKitのコロンハズ記事グラス。
コロンハズ記事グラスがターゲットをサポートするようになりました。
CSSのターゲット記事グラスは、
URL内のフラグメントと一致するIDを持つ要素を選択します。
例えばユーザーがリンクをクリックして、
例えばexample.comのスラッシュ、
シャープチャプター2みたいな、
ハッシュタグ的にアクセスすることがありますよね。
その時にシャプター2に移動して、
そのページ上の要素がIDチャプター2を持つ場合、
ターゲット記事グラスはその要素を選択します。
サファリ26では、
ハズ括弧、コロンターゲットみたいな書き方ができますけど、
そういう書き方によって、
フラグメントを含むURLを使用する際の新しい可能性が開かれるようになります。
ハズの詳細については、
CSSの親セレクターとしてハズを使用するなどのリンクがあるので、
その辺を見てみてくださいということでした。
これは、なるほど、
MDNじゃなくてWebKitのブログにありますね。
CSSハズ記事グラスという記事がありますので、
その辺を見てみてくださいということでした。
はい。
これが、サファリ16β1での追加のあった機能だそうです。
はい。
続いていきましょう。
続いては、パスキーズというものだそうです。
これはちょっと動画が入っていますね。
どんな動画か。
12秒なので見てもいいですけど、
僕しか見ていないので、
今回はちょっと割愛します。
はい、パスキーですね。
iOS16のサファリではパスキーというのがサポートされます。
パスキーを使うとログインが驚くほど簡単になると同時に、
セキュリティが大幅に向上しますよというふうに言っています。
ログインが驚くほど簡単になるというのは、
いわゆる何だっけ、
ワンパスみたいに近いようなのを、
サファリとかOSレベルで提供してくれるのかな。
分からないですけど、ちょっと読んでいきましょう。
パスキーを実装する技術というのは、
FIDO、何て読むか分からないですけど、
FIDOアライアンスやW3Cのオープンスタンダードで定義されており、
Webオーソン企画というのは、
すでにブラウザで広くサポートされています。
パスキーというのは業界全体の取り組みであり、
パスキーは誰でも使えるように、
普通名刺になっています。
既存の認証オプションと並行して、
パスキーを提供することができますよと。
まずバックエンドにその公開書きの保存と、
認証チャレンジの発行を教えます。
次にウェブサイトやウェブアプリで、
新しいパスキーを作成するためのAPIというのを採用し、
ユーザーが自分のパスキーでサインインできるようにすることで、
パスキーをユーザーに提供します。
ウェブサイトやウェブアプリで、
すでにWebオーソンを使用したプラットフォーム認証というのを
サポートしている場合、
パスキーのサポートを追加する際に、
いくつか注意する点があります。
つまりユーザーが特定のデバイスでキーをセットアップしたことで、
クッキーで記憶させないようにしますと。
ああ、なるほどね。
これは大きいですね。
また、条件付き頂点を採用して、
既存のサインインフォームのユーザー名フィールドが
09:00
オートフィルと互換性があることを確認してください。
最後にパスキーを参照するようにし、
サインインの主要な方法として扱うようにします。
はいはいはい。
オートフィルは何らかんだ便利だから使っちゃいますけど、
それだけだとというところがあるので、
そこにさらにパスキーというのもセットで参照するようにして、
本当にちゃんと押すできているかというのを
確認してください。
はい。
はい。
このようにちゃんと押すできているかというところを
確認する感じですね。
詳しくはそのWWDCの22のセッション、
Meet Passkeyという27分のビデオがまたあるそうですので、
これを見て頂くか、
サポーティングパスキーというのをお読みください。
その記事のリンクがあるよということでした。
10月にはMacOS MontereyとMacOS Big Sur、
そしてMacOS VentureとiPadOSで
パスキーのサポートが開始されるようになるそうです。
はい。
というところでした。
パスキーのサポートが来るようなので、
そこを見てみてください。
よりセキュアな感じの実装ができるということですね。
これは。
今までクッキーとかにボーンと放り込んでいたんですけど、
それだけだと何らかんだ不安とかもあったので、
そこにもう一段階、
分厚くできたという感じですね。
印象回りのところ。
これはこれでやっぱり嬉しい話ですね。
はい。
どうなっていくのかは分からないですけど、
Safariでそれが提供できて、
でもパスキー自体は各ブラウザでも
全然入ると思うんですけどね。
はい。
ただまあこれによって
よりセキュアなことができるようになるし、
その認証とかサインインというのが
より簡単になるようということですね。
これちょっと今動画、
僕手元で流してるんですけど、
ちゃんとあれですね、
顔認証とかの時にも全然使えるように
しっかりなっているので、
これはかなり便利になるんじゃないかなと思ったりしましたね。
いやー、でもiPhone Safariを使うユーザーは
やっぱり日本人は、
確かまだ過半数を超えていたはずなので、
やはり注目されるし、
逆に言うとWeb開発者で
やっぱりiPhone対応をする人たちは、
これ多分知っとかなきゃいけないんじゃないかな
と思ったりもしました。
はい。というところですね。
これもこれでちょっとちゃんと
キャッチアップしとかなと僕も思いました。
あとそのWebオーソンという
W3Cの企画をお恥ずかしながら
今初めて知ったので、
ここはちゃんと復習というか
ちゃんと勉強しようかなとも思いました。
しかもこれも別に、
明日の朝活動までちょっと軽く調べておいて
しましたね。
ちょっとどうするか悩ましいですけど。
ついでに余談をしたので、
そのまま余談をするとですね、
明日読む記事どうしようか悩んだんですけど
Webhooksという記事のリンクがあって、
Webhooksのドキュメントがですね、
まとめてあるサイトがあってですね、
すごくわかりやすそうだったし、
ちゃんとイントロダクションからガーッと書いてあって、
HMACもあるし、
OS2とかJotとかもやるし、
JWKのほうもやるそうなので、
ここもちょっと見たいなというふうに思ってて、
悩ましい感じがあります。
どっちにしろそういう、
アプリケーション開発でメインに使う、
JavaScript側とかCSS側とかフレームワーク側、
12:00
みたいな話ではなく、
ちょっと俯瞰した、
機能要件に近いような技術的なお話の記事を
読もうかなと思っています。
というのだけお伝えしておいて、
続いていきましょう。
続いてApple Payですね。
これもなんだかんだ注目Apple Payです。
はい、来ました。
Safari16では定期的な支払いをより効率的にサポートする
マーチャントトークンのApple Payサポートと、
1回の取引で複数の記録マーチャントに支払いを行う方法である
マルチマーチャントペイントのサポートが追加されています。
また、Safari16では
ウェブ上の加盟点というのがウォレットで、
詳細な注文と配送情報を提供できるようにする
オーダートラッキングをサポートしています。
オーダートラッキングは
人によっては気持ち悪いと言われる気もしまして、
便利なんだけど、
そこまでトラッキングされたくないという人も
いる気がするので、
どうなんだろうなって気はしますけど、
選択肢が増えたということは、
技術の進歩として素晴らしいというところで
一旦とどめておきます。
全てのWKWebViewでは
Apple Payを利用できるようになりましたよ
というところです。
これはもうすでにできるようになったということですので、
Safari16に上げるだけで
使えそうですね、これは。
というところでした。
やっぱりApple Payは
何やかんや使っている人多いですし、
使い勝手いいですからね。
ここにいろいろできるようになったし、
トラッキングをして
便利にできるようになる。
そういう機能の提供ができるようになったのが
結構大きいのかなと思いましたね。
続いていきましょう。
Web Inspector Extensionですね。
Safari16では
Web Inspector Extensionがサポートされ、
Safariに組み込まれている
Web Developer Toolを強化できるようになりました。
macOSでこれらの拡張機能をダウンロードするには、
Safariのエクステンションで進んでいただいて、
App Storeで
Web Inspector Extensionを探します。
最近サポートを発表した
Angular DevToolsを含め
そうなんや、Angular DevToolsを
実装したんや。
こういうのは大体リアクトから入るイメージだったんですけど、
先にAngular対応したんですね。
というわけで結構Safariというか
Appleはその辺のWeb技術について
Googleとちゃんと
手を組むまでいた語弊がありますけど、
連携をしているのかなというような聞こえがしますね。
Angularから言ったんですね。
はい、戻ります。
お気に入りのサードパーティーデベロッパーサービスとか
テストスイート、フレームワークから
デベロッパーツールというのも
たくさんあるので
結構豊富にありますので
検索してくださいということでした。
このような拡張機能の作り方を知りたい場合は
WWDC22のセッション
Create Safari Web Inspector Extension
というビデオが
18分のビデオがあるので
そこを見てみてくださいと言うことだそうです。
これもこれでちょっと気になりますね。
要はChrome拡張と同じようなことが
Safari拡張できるようになったということですね。
これは以前の
サーバー版のほうの記事でも
同じこと書いていましたし
WebKitの説明とかリンクも
貼ってあったので
どうやって作るかみたいなところは
その辺からも探れるようになりましたけど
ここはこのままGoになって
実装されたって感じですね。
15:01
で、Safari 16では
iOS、iPadOS、MacOSで
どのエクステンションズが有効になっているかを
同期する機能。
すげーな、同期しちゃうんですね。
いや、素晴らしいわ。
これなんやかんや便利ですからね。
で、Safari 16では
マニフェストバージョン2と
マニフェストバージョン3の
両方もサポートしています。
はー、モダンだ。
で、WWDC22で発表された
Safari Web Extensionsの新機能を見てください。
その違いとかエクステンションの
アップグレード方法についても
確認してください。
Safari 16のWeb Extensions
Web拡張ですね。
というのは
Declarative New Request with Host Access権限と
Render.Runtime.GetFrameIDのサポートも
なってますよということで。
はー、なるほどですね。
いろいろできるようになったし。
割とWeb拡張だけど
アクセスできるんですね。
この辺使えばというところで。
いやいやいやいや。
ちょっと驚きですね。
はい、ということでした。
Chrome拡張作ってみたい方は
全然注目していいと思いますし
SafariでChrome拡張まだ作ったよ
みたいな記事ってそんなにないので
全然出してもらったら
ブランディングができるかもしれないですね。
はい、というところでした。
では続いていきましょう。
コンテナクエリですね。
これは僕も前から読んでた記事の中で
見つけたけど
コンテナクエリはちょっと
注目もしたいところですね。
はい。
じゃあいきましょう。
メディアクエリと同様に
コンテナクエリではViewportのサイズではなく
コンテナのサイズに基づいて
Webページ上の特定のアイテムの
サイズを設定することができます。
Safari 16はサイズクエリと
コンテナクエリユニットを
サポートしていますと。
サイズクエリはWebデベロッパーが
コンテナクエリについて話すときのみに
想像するもので
コンテナが特定のタイトルである場合にのみ
適用されるCSSを記述する
というようなものでありますと。
コンテナクエリのユニットっていうのは
Viewportユニットに似ていますが
Viewportの代わりに
コンテナクエリの寸法に相対する長さを
指定することができますと。
CQCQHCQI
CQBCQMINCQMAX
みたいな感じですね。
CQはコンテナクエリの略です。
WHはいつも通り
WidthとHeightみたいな感じですね。
IとBなんだったっけ
すみません、それは忘れました。
MINMAXはそのまんまって感じですけど
やっぱりこれすごく便利で
ここのコンテナクエリは
他のブラウザーもあるかは
ちょっとまだ僕は調べてないですけど
もしあるんだったら
他のブラウザーでも
実装してほしいなって思うぐらいに
僕はこのコンテナクエリ
めっちゃ便利で楽やなって思いましたので
期待してたりします。
続いていきましょう。
続いてコンテナクエリと
ちょっと紐づく話だった気がしますけど
サブグリッドですね。
CSSグリッドっていうのは
ウェブ上のレイアウトデザインに
18:00
革命を起こしました。
何だっけ、名前出てこない。
Flexboxか。
Flexbox出た時も
CSSグリッドでしたね。
CSSよくわからんってなったけど
とりあえずFlexboxさえ使えば
ある程度レイアウトも簡単になったり
調整ができるようになったので
これ嬉しかったんですけど
そこにさらにCSSグリッドが入って
よりレイアウトすることが
簡単になりましたね、CSSでの。
かなり強くなりましたし。
おめでたくIEが
お仕事を終了してくださったということで
もうグリッド全然使っていいよ
みたいな話がめちゃめちゃ熱いんですよね。
Flexboxの唯一の欠点というか
横方向もしくは縦方向という
単方向だけの観点で
スタイリングとかレイアウトを決めるのが
Flexboxだったんですけど
グリッドってのは本当に
縦と横、両方含めた
本当にレイアウトができるようになったので
ぶっちゃけると上位互換といっても
過言ではないと僕は感じてますけどね。
語弊招いてますし
色々警察に怒られそうな発言ですけど
そんな風に僕は感じてますね。
でもそんなCSSグリッドというのが
ウェブ上のレイアウトデザインに
異常革命を起こしたという風に
言われてます。
サブグリッドというのは
そのグリッドをさらにレベルアップされて
グリッドコンテナの間号を
そのグリッド上に簡単に配置する方法でも
提供してます。
これによってHTML構造の制約
違う、HTMLの構造に制約されることなく
複雑なレイアウトでも
アイテムを並べることができるようになりました。
というところです。
より複雑かつより凝ったような
レイアウトがあったとしても
このサブグリッドを使えば
それが表現できるようになりましたよ
ということですね。
さらにSafariのグリッドインスペクターでは
好きなグリッドのオーバーレイを
オンにすることができるので
サブグリッドをコーディングする際にも
特に役に立ちますよと。
しっかり開発者のところの目線も含めて
ブラウザとしては
機能を入れたいということですね。
熱いですね。
僕はやっぱりこのグリッド
サブグリッドはかなり熱いなと思ってます。
続いていきましょう。
続いてWebインスペクターですね。
改めてWebインスペクターの称号で
昨年のグリッドインスペクターの追加に続き
Safari16では
Flexboxインスペクターでも
もちろん追加になりました。
Safari15.4で追加された
アライメントエディターとは
完全に対になっていますよということですね。
Flexboxのインスペクターというのが
Safari16にもついに入りました。
これ確かChromeは既に入っていて
それに多分追従したんだろうなと思いますね。
コンセプト的には開発者にとっては
結構嬉しい話ではあるし
Flexboxは大量に使われているので
いろんなサイトでも
使えるようになっています。
続いていきましょう。
SafariのFlexboxインスペクターというのは
余分な空きスペースと
Flexのギャップを視覚的に区別しますと。
アイテムの境界線も表示され
Flexboxコンテナの主軸と
横軸の両方におけるアイテムの分布
というのが明らかになります。
いやーありがたい。
切り替え可能な順序番号というようなものがあって
21:00
それのオプションを付けると
コンテナ内の要素のレイアウトの順序を表示し
順序プロパティというのを使用する際に
Flexboxコンテナを使いますと。
また昨年のグリッド用オーバーレイと同様に
スクロールのパフォーマンスに影響を与えることなく
好きなだけFlexboxのオーバーレイを
同時に表示することができます。
チェックボックス一つで
全てオンにできるようになりますよ
ということでした。
あとタイムラインですね。
タイムラインタブには
参照ドキュメントへのリンクが追加され
コンテンツの変更が描画されるときに
ビューポートのスクリーンショットをキャプチャする
新しい実験的なスクリーンショットタイムライン
が追加されています。
タイムラインタブっていうのは
このSafariの拡張機能じゃなくて
開発者ツールか
の中の一つですね。
タイムラインタブっていうのがあります。
続いて要素タブ。
エレメントタブですね。
スタイルサイドバーでのコンテナクエリの表示が
サポートされましたよってことですね。
いいですね。
ちゃんとコンテナクエリの表示もできるようになりました。
続いてソースタブですね。
ソースタブには
リダイレクトURLに正規表現マッチを使用する
URLのファイルにマッピングできるようになった
レスポンスのローカルオーバーライトなど
新しい改善点があります。
もうここいさぎよいですね。
URLに対して正規表現マッチができるようになった
ということで
これは実装としては
割とそんなに難しくない気がしてますけどね。
分かんないです。
僕は何か見てないから分からないですけど
なんだかんだ正規表現で
そういう細かいのは全部
欲しい人がやってくれっていう風に
こっちに投げてきたっていうのは
そういうことをしたい人がそもそも
僕らみたいな開発者のはずなので
開発者は自由に表現できるっていう意味で
正規表現を僕らに委ねてもらえるのは
なんやかんやありがたいですよね。
そういうことができるようになりましたよ
ということです。
ラスト、ネットワークタブですね。
ネットワークタブには
新しいプロキシインジケーターというのが含まれて
ネットワークリクエストを完全にブロックする方法も
提供されましたというところです。
なので途中止めて検査したりとか
調べたりということも
より柔軟にできるようになったよ
こうやって見ていくと
本当にサファリ16って
かなり開発者によった機能っていうのが
たくさん入ってきたなっていうのが
すごくびっくりしてます。
ちゃんとウェブの方向に目を向けた
機能追加っていうのが入ってきたな
っていう風には感じますね。
続いていきましょう。
あともういくつかですね。
そうですね。
もういくつかなんだけど
長いっすね。
長い。
お休みだしちょっと
時間もオーバーしてしまいますけど
このまま今日はちょっと
オーバーしていきたいと思います。
雨だし台風も来てるし
割と家に引きこもられる方も
多いと思われるので
知らんけど僕は引きこもるので
今日はちょっとこのまま
時間オーバーしていきたいと思います。
続いてアクセシビリティの向上です。
サファリ16ではMacOSにおける
WebKitのアクセシビリティサポートの
リアーキテクチャというのを導入しています。
分離ツリーモードの追加によって
アクセシビリティ作業を
24:01
セカンダリースレッドに
オフロードすることで
ボイスオーバーのハングアップを減らして
パフォーマンスと応答性を向上させました。
いやこれいいっすね。
サファリとかMacOSですけど
ボイスオーバーって結構使って
WebKitじゃないわ
アクセシビリティの機能とか
改善というのを結構見てたんですけど
この辺がより
セカンダリーツリースレッドという風に
使うことで
ハングアップを減らすというのは
この変更によって
WebKitはボイスオーバーのような
クライアントからの
より多くのアクセシビリティ要求に
以前より短時間で対応できました。
いくつかの複雑なWebページでは
2倍のアクセシビリティリクエストを
25%短い時間で処理できることが
確認されています。
いいですね。
サファリ上陸では
ディスプレイコンテンツというのを持つ要素が
アクセシビリティツリーで
適切に表現されるように
アクセシビリティサポートも
今後はしっかり見ていかなきゃいけないので
この辺の話は
注目していいと思いました。
続いていきましょう。
アニメーションの改良です。
WebKitではCSSオフセットパス
別名モーションパスを
サポートするようになり
Webデベロッパーは
任意の形状のカスタムパスに沿って
オブジェクトをアニメーション化できるようになりました。
オフセットパスをプロパティによって
アニメートさせる
機械学的なパスを定義できます。
オフセットアンカー
オフセットプロパティ
これらはアニメートされる
オブジェクトの動きを正確に指定するために
追加機能等提供しています。
オフセットプロパティ
はこれらのプロパティを組み合わせるための
省略機法として機能します。
ガツンと一発でやることもできるし
細かく細かく一個一個で
個別に定義することもできます。
サファリ16では
CSSグリッドのトラックサイズをアニメーション化し
行と列のサイズを
動的に変更できるようになりました。
なんだと?
サファリ16では
複合操作のサポートも追加になり
要素のアニメーションがその基礎となる
プロパティ値にどのような影響を与えるか
という解決策になりました。
さらに39のCSSプロパティに対して
理算的なアニメーションのサポートも
追加になりましたよと。
そんなにあるのに。
それについても
記事のリンクが貼られていますし
モジュラのリンクもあるので
その辺を考慮した実装が
サファリ16では入っていますよ
ということを出しました。
続いていきましょう。
ここからちょっと細かい
小さいのがダダダッと続きますね。
翻訳がしたい。
ネットワークが遅い。
翻訳がしたい、僕は。
どんどん行きます。
続いてオーバースクロールの動作ですね。
CSSオーバースクロール
ビヘビアというのがありまして
これはユーザーがスクロールして
スクロール業界の境界線に到達した時の
動作というのを決定するようなものですね。
一応オーバースクロールビヘビア
27:00
という記事のリンクも
別の外部サイトですね。
リンクも貼られていますので見てください。
これはモジュラーですね。
記事がありますと。
ユーザーがボックス内のをスクロールして
境界に到達した時に
ページの残りの部分のスクロールを
停止または許可するように制御することができます。
続いて共有ワーカーですね。
シェアドワーカーズです。
シェアドワーカーズも別の記事のリンクですけど
これもモジュラーですね。
記事のリンクが貼られているので見てくださいと。
WebKitはシェアドワーカーズを
サポートするようになりましたと。
シェアドワーカーズと似ていますが
その寿命が若干異なる様子ですね。
シェアドワーカーズというのは
ユーザーがあなたのドメインに対して
何らかのタブを開いている限り
実行されますと。
同じドメインで開いている
全てのタブというのは
同じシェアドワーカーを共有できます。
確かに若干違いますけども
サービスワーカーと結構似てますね。
ただ共有がしっかりできる
タブ間で共有できて
しかも同期ができているのは
結構いい話だなと思いましたね。
名前の通りシェアしていますね。
いやーこれいい話でしたね。
続いていきましょう。
追加機能です。
他の追加機能ですね。
Safari 16では
シャドウレルムズと
フォームドットリクエストサブミットと
ACMリンプット要素の
ショーピッカーメソッドと
およびワーカーソースコンテンツ
セキュリティポリシーディレクティブの
サポートが追加になりました。
これはちょっと
一個一個見ていくしかないなって
それ自体の全の記事を
全て書いてもいいんじゃないかと思ったり
しましたね。
だからこそ全然みたいな
ダジャレではないです。
続いていきましょう。
フィックス&ポリッシュの改良と修正ですね。
Safari 16では多くのバグフィックスの機能の
改良が行われてますよってことです。
Z CSSとフォームズのところに
フィックスとかリムーブとか
パブリッシュとか
たくさんの記事とか
どういうものが行われましたかって
リンクがパッと貼ってます。
例えば
フィックスと
チェンジングザバリュー
ステップアップ&ステップダウン
ウィズアウトオブレンジバリュー
というような感じです。
こんな感じで
いろんなものが並べられてます。
主にCSS、フォームズ、セキュリティ
WebGL2
Webインスペクター
Webドライバー
Safari Web Extension
みたいなところですね。
というところに細かく分けて
一個一個見たい方は見てみてください。
どんな修正とかどんな改良が行われた
っていうのをちゃんと書いてます。
これ多分コミットメッセージかな
と思いますね。
イシューのタイトルか
プルリクエストか分かんないですけど
それがざっと並べてて
かなり多くのものが入ってるんで
Safari 16はかなり期待していいんじゃないか
と思ったりはしました。
というところで記事としてはラストで
あとはフィードバックのところですね。
30:03
行きましょう。
あとはご意見・感想というところで
私の声を聞くのが大好きです。
Safari 16に関する意見を
WebKit
ジェンナントラ・カントラ
またはジェンナっていうところに
ツイートしてください。
普通にツイッターのリンクですね。
何か問題が発生した場合は
Safari UIに関するフィードバックや
Webテクノロジー・インスペクターに関する
WebKitのバグレポートもお待ちしています。
問題を報告することで
実際に変化は起こりますよということですね。
最新のSafariテクノロジープレビューを
ダウンロードして
最も関心のあるWeb機能に関する
最新情報を確認することができます。
Webデベロッパー向けのSafari 16の内容については
詳しくはSafari 16のリリースノートを
見てくださいということでした。
ざーっと書いてましたけど
いろいろ記事のリンクもあったりとか
ページのリンクも貼られているので
見てみてくださいということでした。
改めてWebKit 16ですね。
Safari 16の記事を読んでみましたけど
めちゃめちゃ僕は未来を感じましたね。
本当にもうChromeじゃなくて
Safariに本格的に乗り換えようかなって
思い始めましたね。
それくらいSafariの
開発者に向けた
本当は機能追加だったりとか
拡張というのが増えたなって思います。
Webインスペクター周りのところの進化が
かなり重要しかったので
今までSafariを使っていなかった方も
この辺見てみていただければいいんじゃないかな
と思ったりしています。
あとは認証周りのところですが
僕地味にやっぱりあそこ気になっているので
認証周りのところでやっていこうと思います。
続いて別の記事のリンクが貼られていて
Release Notes for Safari Technology Preview 154
ってありますので
これも気になるんですけど
ちょっと明日以降はこれじゃなくて
別の記事を読んでいこうかなと思いますので
興味ある方は見てみてくださいということでした。
はい、じゃあ今日の朝発はこちらで
以上にしたいかなと思います。
土曜日、ちょっと天気が悪かったり
台風が近づいているので
3連休、あんまり遊びに行けない方が
いらっしゃると思うので
せっかくなんで新しい記事とか
技術のところをガード触ってもいいですし
のんびり過ごしていただければなと思います。
ではこちらで終了にしたいと思います。
