はてなブックマーク

Build with Chrome Learn how Chrome works, participate in origin trials, and build with Chrome everywhere.

Recorder supports export to Puppeteer for Firefox As part of WebDriver BiDi support, the Recorder panel can now export recordings to Puppeteer for Firefox. With Puppeteer's support of Firefox, you can now record user flows using the Chrome DevTools Recorder panel, export them, and run them against both Firefox and Chrome. For more information, see WebDriver BiDi - The future of cross-browser autom

Styling form controls like the <select> element has been reported as a top developer pain point for years, and we've been working on a solution. While this work is complex and has taken a long time to get right, we're getting very close to landing this feature. A customizable version of the select element is officially in Stage 2 in the WHATWG, with strong cross-browser interest and a prototype fo

Digital Credentials API のオリジン トライアルは、Chrome 128 以降開始されます。Digital Credentials API は、デジタル ウォレットに保存されている運転免許証や国民 ID カードなどのデジタル認証情報を使用して、ウェブサイトがユーザーに関する検証可能な情報を選択的にリクエストできるようにする新しいウェブ プラットフォーム API です。 背景 多くの公的機関や民間団体がデバイスにバインドされたデジタル認証情報を発行し始めており、現実世界のデジタル ID が現実のものとなりつつあります。たとえば、米国の一部の州（アリゾナ州、カリフォルニア州、コロラド州、ジョージア州、メリーランド州など）では、モバイル デバイスの Google ウォレットなどのデジタル ウォレット アプリにモバイル運転免許証と身分証明書をプロビジョニングできるようになりま

Hints: Hints give relying parties (RPs) better control over WebAuthn UI in the browser. They are especially helpful for enterprise users who want to use security keys. Related origin requests: With related origin requests, RPs can make passkeys valid on multiple domains. If you own multiple sites, you can now enable your users to reuse their passkey across your sites, eliminating login friction. J

From Chrome 129 you can use the scrollSnapChange and scrollSnapChanging events from JavaScript. By implementing built-in snap events, the previously invisible snap state will become actionable, at the right time, and always correct. This is not a convenience you had without these events. Before scrollSnapChange, you could use an intersection observer to find what element was crossing the scroll po

Just last week, together with BrowserStack, we announced WebDriver BiDi becoming production-ready in BrowserStack. This week the summer of WebDriver BiDi continues with Firefox 129 and Puppeteer 23 each getting production-ready support for WebDriver BiDi! Mozilla has been a strong collaborator on WebDriver BiDi for over four years now, initially helping to shape the new standard and then gradually

HTML の <ruby> 要素は、特に東アジア言語のテキスト表示を改善するための強力なツールです。この要素を使用すると、ベーステキストの上または横に発音の注釈やその他の補足情報を表示できます。Chrome 128 以降では、Ruby アノテーションが改行可能になり、ruby-align CSS プロパティを使用して Ruby テキストのスタイルを設定できるようになります。 <ruby> 要素は 2 つの主要な部分からなります。ルビーベース（メインテキスト）とルビーテキスト（アノテーション テキスト）は、<rt> 要素でマークアップされています。Ruby テキストは、次の例に示すように、ルビーベースの上または下に表示できます。 <ruby style="ruby-position: under;"> 강남대로 <rt>江南大路</rt> </ruby> <ph type="x-smartl

The View Transition API is a web development game changer. Whether your website is single or multi-page, this powerful API lets you create seamless transitions between views, resulting in native-like experiences that captivate users. Currently available in Chrome, with same document view transitions soon to be available in Safari. With more and more people starting to look into the View Transition

使用許可を求めるための命令的な方法は多数ある ウェブアプリでの位置情報へのアクセスなどの 強力な機能が必要ですこれらのメソッドには、 そこで Chrome の権限チームは、さまざまな課題の解決を 新しい宣言型の方法である、専用の HTML <permission> 要素に置き換えます。この 要素は Chrome 126 のオリジン トライアル段階にあり、最終的には 標準化します。 権限をリクエストするための命令型メソッド ウェブアプリが 強力な機能がある一方で、 許可を求める必要があります。たとえば Google マップでは、 Geolocation API、 ブラウザはユーザーにプロンプトを表示し、多くの場合、その判断内容を保存するオプションが用意されています。 これは をご覧ください。 事前リクエストではなく、初回使用時に暗示的に求める Geolocation API は強力な API

There are a number of imperative methods for asking for permission to use powerful features like location access in web apps. These methods come with a number of challenges, which is why the Chrome permissions team is experimenting with a new declarative method: a dedicated HTML <permission> element. This element is in origin trial from Chrome 126, and ultimately we hope to standardize it. Imperat

ウェブ上で AI モデルを使用して特徴を構築する場合、大規模なモデルにはサーバーサイド ソリューションを利用することがよくあります。これは、生成 AI に特に当てはまります。生成 AI では、小さなモデルでも、ウェブページのサイズの中央値の約 1, 000 倍の大きさになります。モデルが数十メガバイトから数百メガバイトまでにわたる他の AI ユースケースにも当てはまります。 これらのモデルはウェブサイト間で共有されないため、各サイトがページの読み込み時にモデルをダウンロードする必要があります。これはデベロッパーやユーザーにとって 実用的ではないソリューションであり サーバーサイド AI は大規模モデルに最適な選択肢ですが、オンデバイス アプローチとハイブリッド アプローチには独自の魅力的な利点があります。これらのアプローチを実現するには、モデルのサイズと提供方法に対応する必要があります。

When we build features with AI models on the web, we often rely on server-side solutions for larger models. This is especially true for generative AI, where even the smallest models are about thousand times bigger than the median web page size. It's also true for other AI use cases, where models can range from 10s to 100s of megabytes. Since these models aren't shared across websites, each site ha

Build with Chrome Learn how Chrome works, participate in origin trials, and build with Chrome everywhere.

The Chrome team is keen to see an implementation of masonry type layouts on the web. However, we feel that implementing it as part of the CSS Grid specification as proposed in the recent WebKit post would be a mistake. We also feel that the WebKit post argued against a version of masonry that no one was proposing. Therefore, this post aims to explain why we at Chrome have concerns about implementi

Chrome 130 以降、スクローラーにキーボード フォーカスがない場合、デフォルトでキーボード フォーカスが可能 キーボードのフォーカス可能な子要素です 背景 スクローラーはいたるところにあります。利用規約に定められている場合があります。ボックス 下にスクロールし、[送信] ボタンをクリックします。または オプションとして選択できるアイコンが縦長のメニューバーに表示される場合があります。 このような場合、多くのウェブユーザーはマウスまたは 要素内をスクロールします。ただし、ポインティング デバイス、トラックパッド、 タッチスクリーンが、すべてのユーザーにとって最適なページ操作方法であるとは限りません。一部のユーザー フォーカス可能なすべての要素にアクセスするには、HTML ページ内を移動し、 キーボードのみを使用できます。これにはさまざまな理由が考えられます。提供元: マウスの操作を困

対応ブラウザ <ph type="x-smartling-placeholder"></ph> 109 回 <ph type="x-smartling-placeholder"></ph> 109 回 <ph type="x-smartling-placeholder"></ph> × <ph type="x-smartling-placeholder"></ph> × Chrome チームは、ユーザーが移動しそうな将来のページを完全に事前レンダリングする機能を再開しました。 事前レンダリングの歴史 これまで Chrome は <link rel="prerender" href="/next-page"> リソースヒントをサポートしていましたが、これは Chrome 以外では広くサポートされておらず、それほど表現力豊かな API ではありませんでした。 リンク rel=prerender

Core Web Vitals イニシアチブは発足以来、ウェブサイトの作成方法や読み込み方法の技術的な詳細ではなく、ウェブサイトの実際のユーザー エクスペリエンスを測定することを目指してきました。Core Web Vitals の 3 つの指標はユーザー中心の指標として作成されました。DOMContentLoaded や load などの既存の技術指標から進化したものであり、ユーザーがページのパフォーマンスを認識する方法とは無関係なタイミングを測定していました。そのため、サイトの構築に使用されているテクノロジーがスコアに影響を与えることはありません。 現実は常に理想よりも少し複雑であり、一般的なシングルページ アプリケーション アーキテクチャは、Core Web Vitals の指標によって完全にサポートされているものではありません。これらのウェブ アプリケーションでは、ユーザーがサイト内

Resuming the transition to Manifest V3 Published on Thursday, November 16, 2023 In December of last year, we paused the planned deprecation of Manifest V2 in order to address developer feedback and deliver better solutions to migration issues. As a result of this feedback, we’ve made a number of changes to Manifest V3 to close these gaps, including: Introducing Offscreen Documents, which provide D

Service Worker Static Routing API Origin Trial Published on Friday, November 10, 2023 Service workers are a powerful tool for allowing websites to work offline and create specialized caching rules for themselves. A service worker fetch handler sees every request from a page it controls, and can decide if it wants to serve a response to it from the service worker cache, or even rewrite the URL to f

New in Chrome 119 Published on Tuesday, October 31, 2023 • Updated on Wednesday, November 1, 2023 Translated to: Español Here's what you need to know: There’s an update to the expiration date upper limit for cookies already in storage.CSS has new pseudo-classes, relative color syntax and more.Fenced Frames added improvements like ad size macros and others.And there’s plenty more.I’m Adriana Jara.

WebAssembly Garbage Collection (WasmGC) now enabled by default in Chrome Published on Tuesday, October 31, 2023 There are two types of programming languages: garbage-collected programming languages and programming languages that require manual memory management. Examples of the former, among many more, are Kotlin, PHP, or Java. Examples of the latter are C, C++, or Rust. As a general rule, higher-