Version 100 in Chrome and Firefox – Mozilla Hacks - the Web developer blog
Chrome and Firefox will reach version 100 in a couple of months. This has the potential to cause breakage on sites that rely on identifying the browser version to perform business logic. This post covers the timeline of events, the strategies that Chrome and Firefox are taking to mitigate the impact, and how you can help. User-Agent string User-Agent (UA) is a string that browsers send in HTTP he
Spectre の脅威とウェブサイトが設定すべきヘッダーについて
長い記事なので先に結論を書きます。 Spectre の登場で、ウェブサイトに必要とされるセキュリティ要件は増えました。具体的に必要な対策は下記の通りです。 すべてのリソースは Cross-Origin-Resource-Policy ヘッダーを使って cross-origin なドキュメントへの読み込みを制御する。 HTML ドキュメントには X-Frame-Options ヘッダーもしくは Content-Security-Policy (CSP) ヘッダーの frame-ancestors ディレクティブを追加して、cross-origin なページへの iframe による埋め込みを制御する。 HTML ドキュメントには Cross-Origin-Opener-Policy ヘッダーを追加して popup ウィンドウとして開かれた場合の cross-origin なページとのコミュニ
Smoozサービス終了に寄せて
202012_smooz.md Smoozサービス終了に寄せて 前置き この文章と、それに含まれる考察や各サービスへの脆弱性報告などはmala個人の活動であり、所属している企業とは関係ありません。 一方で私は、企業が閲覧履歴を収集して何をしたいのか、所属してる企業や他社事例について、ある程度詳しい当事者でもあります。 一般論として書けることは書けるが、(業務上知り得た知識で開示されてないものなど)個別具体的なことは書けないこともあり、また観測範囲に偏りがある可能性もあります。 Smoozに報告した脆弱性2件 最近、Smoozというスマホ向けのブラウザアプリに2件脆弱性の報告をした。 この記事を書いている時点で、Smoozの配布が停止されていて、修正バージョンの入手が出来ない。 2件目についてはまだ返事が来ていない。 脆弱性情報の開示にあたって特段の許可は得ていないが、開発元からも利用停止す
最新のブラウザで変わるCookieの取り扱いやPrivacyの考え方
2020/02/13 DevSumi 発表資料
prefers-color-scheme を用いた Dark Mode 対応と User Preference Media Features | blog.jxck.io
Intro macOS Mojava は OS レベルで Dark Mode に対応した。 しかし、 Web コンテンツは依然として白背景黒文字ベースのデザインが多く、結果ブラウザの中だけ眩しいという問題がある。 Safari TP69 では、これにメディアクエリで対応するための prefers-color-scheme が実装された。 これを用いた DarkMode 対応と、本ブログの DarkMode 対応、および策定中の User Preference Media Features について解説する。 Update 画像の対応について追記した Code Block の対応について追記した 2019/1 に Chrome の Intents が出された。 Intent to Implement: Media Queries: prefers-color-scheme feature I
W3C Workshop for Permissions and User Consentに行ってきた (2) 本編 - そんなことはさておいて
本編です。思ったよりめちゃめちゃ長くなってしまった。2000文字くらいであることが多いのに11000文字とか出てるんですが？？？ 背景 本ワークショップに至る特に重要な背景として、Cambridge Analytica事件とGDPRの施行という2つのできごとがある。これらのできごとによって、Webにおける情報共有とそれへの同意・許諾のあり方への企業やユーザーの見方が大きく変わり、今までのあり方を見直さざるを得なくなった、ということが本ワークショップにつながっていると考えられる。 Cambridge Analytica事件 2018年3月に表面化した、選挙活動へのコンサルティングなどを行うCambridge Analytica社がFacebookユーザーの個人情報を同意なく政治利用していた、という事件。 もともとGlobal Science Research社がthisisyourdigit
off-the-main-thread の時代 - mizchi's blog
off-the-main-thread は今フロントエンドで熱いテーマの一つです。日本語圏では今ひとつ話題になってないので紹介しておきます。 off-the-main-thread の概念の大まかな概要については、Chrome 開発者の nhiroki さんの日本語の記事があるので、こちらを参照してください。 nhiroki.jp speakerdeck.com ここまでのあらすじ 従来のウェブブラウザーでは、一つの画面につき一つ割り当てられる、UI スレッドと呼ばれる名前空間で様々な処理を行ってきました。DOMセマンティクスの評価, CSS による rendering / painting、JSのScripting…。もちろん裏側ではブラウザが様々なバックグラウンドサービスに処理を委譲し、スレッドで実行され、その非同期な結果を受け取っているわけですが、少なくともUIスレッドで走るJSから
Inside look at modern web browser (part 1) | Blog | Chrome for Developers
CPU, GPU, Memory, and multi-process architecture In this 4-part blog series, we'll look inside the Chrome browser from high-level architecture to the specifics of the rendering pipeline. If you ever wondered how the browser turns your code into a functional website, or you are unsure why a specific technique is suggested for performance improvements, this series is for you. As part 1 of this serie
Layered APIs と High Level API の標準化指針 | blog.jxck.io
Intro Extensible Web Manifest 以降、標準化作業は Low Level API にフォーカスし、一定の成果が出ている。 そこで、これらをベースとし、よりアプリレイヤの需要を満たすための High Level API をどう標準化するか、という点について指針が提案された。 基本は、 Low Level API を元に Polyfill を作り、そこからのフィードバックにより策定を進めるという方針だ。 合わせて ES Modules の Import を用いて、 polyfill とネイティブ実装をスムーズに切り替える拡張が提案されている。 本記事では Layered APIs (LAPIs) と呼ばれる、この一連の枠組みについて解説する。 また、同等の話を 東京 Node 学園 #tng30 で行った資料は以下である。 Web over Layered APIs
puppeteerでフロントエンドISUCONのためのパフォーマンス計測ツールを作りたい - Qiita
この記事は、 Recruit Engineers Advent Calendar 2017 の2日目です。 リクルートテクノロジーズで パートナーとして働いてる mizchi です。ここでの仕事は、 yosuke_furukawa が忙しくて調べられないことを、勝手に調べてくることです。 今までリクルートでやったことは Next.js, AMP, PWA, Puppeteer って感じ。今回は Puppeteer を使ったE2Eテストの自動化やパフォーマンス評価の話をします。 puppeteer とは リポジトリ名でわかりますが、GoogleChrome チームが公式に提供する Chrome の Headless Driver です。 スペルがとにかく覚えづらい クロスブラウザテスト以外にはかなり万能なツールです。E2Eテスト、スクレイピング、日々の作業の自動化、なんでもござれ。 他のブラ
ブラウザの脆弱性とそのインパクト
セキュリティ・キャンプ全国大会2017の講義資料です（Masato Kinugawaさんとの共同制作です）。
レンダリング ツリーの構築、レイアウト、ペイント | Articles | web.dev
レンダリング ツリーの構築、レイアウト、ペイント コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。 CSSOM ツリーと DOM ツリーを組み合わせてレンダリング ツリーを作成し、表示可能な各要素のレイアウトを計算し、画面にピクセルをレンダリングするペイント プロセスへの入力として使用します。これらの各ステップを最適化することは、最適なレンダリング パフォーマンスを実現するうえで重要です。 オブジェクト モデルの構築に関する前のセクションでは、HTML と CSS の入力に基づいて DOM ツリーと CSSOM ツリーを構築しました。ただし、どちらもドキュメントのさまざまな側面をキャプチャする独立したオブジェクトです。1 つはコンテンツを記述し、もう 1 つはドキュメントに適用する必要があるスタイルルールを記述します。この 2 つを統合して、ブラウザが画面上
ECMAScript modules in browsers
ES modules are now available in browsers! They're in… Safari 10.1. Chrome 61. Firefox 60. Edge 16. <script type="module"> import {addTextToBody} from './utils.mjs'; addTextToBody('Modules are pretty cool.'); </script> // utils.mjs export function addTextToBody(text) { const div = document.createElement('div'); div.textContent = text; document.body.appendChild(div); } Live demo. All you need is typ
知っておきたいブラウザについての基礎入門
知っておきたいブラウザについての基礎入門 at サポーターズ京都勉強会 https://supporterz.connpass.com/event/51220/
なぜサポートが終了した Web ブラウザーを使うと危険なのか? | Microsoft Docs
なぜサポートが終了した Web ブラウザーを使うと危険なのか? 10/08/2015 2 minutes to read 前回の記事でも紹介させていただいたように来年 (2016) の 1 月 12 日をもって、IE9 以前の Internet Explorer はサポートが終了します。 しかし、機能が停止したりするわけではありませんので、事情を知らないユーザーはそのままサポートが切れたバージョンの Internet Explorer を使用し続けてしまう可能性があります。もしくは、サポートが切れていることを知っていても、アップグレードが面倒でそのまま使用し続けてしまう人もいるでしょう。 しかし、それは非常に大きなセキュリティ的なリスクを背負うことになります。 それでは、サポート期間の過ぎた Internet Explorer = ソフトウェアを使用し続けることはなぜ危険なのでしょうか?
This browser tweak saved 60% of requests to Facebook
Over the past two years Facebook has been working with browser vendors to improve browser caching. As a result of this work, both Chrome and Firefox recently launched features that make their caches significantly more efficient both for us and for the entire web. These changes have helped reduce static resource requests to our servers by 60% and as a result have dramatically improved page load tim
Template:ウェブブラウザにおけるTLS/SSLの対応状況の変化 - Wikipedia
ウェブブラウザにおけるTLS/SSLの対応状況の変化 ウェブブラウザ バージョン プラットフォーム SSLプロトコル TLSプロトコル 証明書のサポート 脆弱性への対応[注 1] プロトコル選択[注 2] SSL 2.0 (安全ではない) SSL 3.0 (安全ではない) TLS 1.0 TLS 1.1 TLS 1.2 TLS 1.3 EV[注 3][1] SHA-2[2] ECDSA[3] BEAST [注 4] CRIME [注 5] POODLE (SSLv3) [注 6] RC4 [注 7] FREAK [4][5] Logjam Google Chrome (Chrome for Android) [注 8] [注 9]
Land Lines
Satellite images provide a wealth of visual data from which we can visualize in interesting ways. Land Lines is an experiment that lets you explore Google Earth satellite imagery through gesture. “Draw” to find satellite images that match your every line; “Drag” to create an infinite line of connected rivers, highways and coastlines. Using a combination of machine learning, optimized algorithms, a
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - GoogleChrome/rendertron: A Headless Chrome rendering solution
Transform JSX in the browser · Issue #5497 · facebook/react
