[B! Chrome][slide] efclのブックマーク

efcl id:efcl

Chromeとslideに関するefclのブックマーク (30)

ブラウザ自動操作技術の深層へ、直接触れて学ぶ WebDriver と Chrome DevTools Protocol
ウェブアプリケーションの開発においてE2Eテストの自動化は身近なトピックです。SeleniumやPuppetter、PlaywrightやAppiumなどがブラウザ・ネイティブアプリの自動操作のOSSとしてよく挙げられます。しかし、それらの裏側はご存知でしょうか？本トークではこれらのツールの背後にいるWebDriver、Chrome DevTools Protocolsに焦点を当てます。 WebDriver、CDPとはなにか、その違い、仕様について、PHP エンジニアに身近な言語を用いて"直接"実装することを通じて解説します。本トークを通じて直接触れることでライブラリでwrapされている裏側まで知ることできます。E2Eテスト自動化の課題に出会ったときに「裏側がこうだからたぶんこういうことだよね」と想像できるようになる、少し世界の見え方が変わる時間を提供します。
efcl 2022/03/29
WebDriver APIとChrome DevTools Protocol(CDP)についてのスライド。それぞれのAPIを使ってブラウザ操作を自動化する処理をどのように書くのかについて

testing

webdriver

Chrome

slide

php
リンク
電子情報学特論：Chromiumのアーキテクチャを解き明かす
電子情報学特論： Chromium のアーキテクチャを解き明かす〜 EEIC の授業が生きるプロダクトの世界〜 Kentaro Hara 2020 April (๑>ᴗ<๑) * * * *
efcl 2020/04/14
Chromiumのプロセスアーキテクチャについてのスライド。マルチプロセスアーキテクチャ、埋め込みコンテンツでのSpectreのメモリ読み取り、iframeでのSite Isolation、ChromeのGCの実装についてなど。またレンダリング処理がParsing

Chrome

slide

architecture

security
リンク
PuppeteerでいらないCSSを消す
@pirosikick の発表資料です。 https://mentaico-js.connpass.com/event/132416/
efcl 2019/06/20
PuppeteerでCSSカバレッジを取って使ってないコードを把握する話

Chrome

slide
リンク
Web Platform Security PhD Summit @ Google Munich
Web Platform Security. The threats browser vendors are exploring at the moment, and some mitigations thereof.
efcl 2018/07/17
CORB、Cross-Origin Resource Policy、Cross-Origin Window Policy、Sec-Metadata、Early Hintなどについて

browser

Chrome

security

slide
リンク
Life of a Pixel
This is the evergreen copy of "Life of a Pixel". Video of the presentation at Chromium University (Nov 2020): http://bit.ly/loap-2020-video LIFE OF A Steve Kobes skobes@chromium.org Nov 2020 slides: bit.ly/lifeofapixel with special thanks to past presenters dknox@, chrishtr@, pdr@ "The unexamined...
efcl 2018/07/16
Chromeのレンダリングの仕組みについてのスライド。 DOM、Style、Layout、Paint、Rasterization。変更があったときに再レンダリングやCompositingなどの処理の流れなどについて。

browser

Chrome

slide
リンク
PWA Beginners 勉強会 #4 A2HSのちょっと深い話v2
PWAの必須要素であるAdd to homescreenの説明。 Web App Manifestや、Android/iOSでの挙動の差異、ハマりどころなどを解説。
efcl 2018/05/27
Add to HomeScreenについてのスライド。対応方法、App Install Bannersの制御やユースケースについて。またAndroid/Chromeでの動作とiOS/Safariでの動作の違いなどについて

ios

Android

Chrome

slide

PWA
リンク
リアル調査案件で使ったPuppeteer - Qiita
Meguro.es #15 @ Drecom 2018年5月22日自己紹介ちきさん Twitter/GitHub/Qiita: @ovrmrw 市ヶ谷のオプトという会社で働いています。初心者です。今回のGitHubリポジトリ今日話すこと実際に降り掛かってきた調査案件でPuppeteerを使って地獄を回避した話。日々降りかかる調査案件「計測タグの発火タイミングを調べて」＿人人人人人人人人人人＿＞　ふわっとした依頼　＜￣Y^Y^Y^Y^Y^Y^Y^Y^Y￣課題「発火タイミング」と一口に言ってもページ上の他の要素も絡んで結構ばらつきがあるので、何十回も計った上で平均を取る必要があった。色々な調査パターンの組み合わせがあり、その数は72もあった。 72パターン x 10回としても合計720回。「ツールで自動化した数値はあてにならないから手動でやって」 by PM ＿人
efcl 2018/05/25
Puppeteerを使ったレシピ集

Chrome

slide
リンク
Web Packaging - Use cases and Loading
For #webpackaging_study Feb 23, 2018 https://web-study.connpass.com/event/78978/Read less
efcl 2018/02/27
Web Packagingについて

Chrome

slide
リンク
New Web Platform APIs
A look at new (stable + experimental) Web platform APIs that we can already use nowadays.
efcl 2017/12/02
最近増えた色々なWebplatform APIについてのスライド。 Broadcast Chennel、Network Information、Web Share、Credential Management、Payment API、Resize Observerなど

JavaScript

WebPlatformAPI

Chrome

slide
リンク
https://cdn.jsdelivr.net/gh/chromium/mus-preso@9433b180/blinkon8/index.html
efcl 2017/09/25
Chromeのレンダリングパイプラインについて。今までMain ProcessでやっていたLayerのCompositionをVizプロセスの中で行えるようになる

Chrome

slide
リンク
State of Loading : BlinkOn 8 [PUBLIC @chromium]
State of Loading 2017 2018 KenjiBaheux@, Kinuko@ + team BlinkOn 8 September 20-21st 2017
efcl 2017/09/25
ローディングパイプラインの改善について https://docs.google.com/document/d/10yFcHyq4ddheoJrEmyLMnCkzYvI7ioayPwH4ivDXTwg/preview ユーザーインタラクション開始までの時間を短くする

Chrome

blink

slide
リンク
Deprecating features (is hard)
Deprecating features (is hard) Takayoshi Kochi Sep. 21, 2017 - Blink On8 Tokyo Launching a new feature, implementing a new feature is an exciting, but deprecating is also a part of our engineering (and fun?). Let me share some stories about deprecating old Web Components feat...
efcl 2017/09/23
deprecatedなものを消すのは大変

Chrome

slide
リンク
SF WebPerf Meetup: Building for Resilience & Performance
Building for Resilience & Performance SF WebPerf Meetup Shubhie Panicker, Google Chrome @shubhie
efcl 2017/08/29
Client HintとRUMについてのスライド。クライアント/デバイスの状態に合わせてコンテンツを提供するためのHint APIとRUMについて。 Device MemoryやNetInfo Extension、RUMを計測する方法と低スペックなデバイスではLong Taskがロードタイ

Chrome

browser

slide
リンク
V8 Stats in Chrome
Stats in Chrome Camillo Bruni / cbruni@chromium.org Michael Lippautz / mlippautz@chromium.org
efcl 2017/02/12
`chrome://tracing/` の使い方。チュートリアル的にステップバイステップで、Runtime call stats tableやHeapを見る手順について

Chrome

V8

performance

slide
リンク
Optimise your web development workflow 2016
Chrome DevTools Optimise your Web Development Workflow Originally given at ffconf 2016, watch the talk here Umar Hansa / @umaar You might also like these slides on browser automation in JavaScript About Me Current A few things I like... People leave on time Hack days are not just fixing technical debt Open Source github.com/springernature github.com/springernature/frontend DevTools Tips A develope
efcl 2016/12/31
Chromeの開発者ツールについてのスライド。主にCSS、アクセシビリティ、パフォーマンスについて豊富なGIFアニメーションと共に紹介している。

Chrome

CSS

debug

slide

accessibility
リンク
Blink Memory Reduction (BlinkOn5)
Blink Memory Reduction (@BlinkOn5) * * * * {haraken, bashi, tasak, hajimehoshi}@chromium.org 2015 Nov
efcl 2015/11/12
BlinkのメモリとGC

blink

Chrome

slide
リンク
Service Workerとその周辺API 駆け足紹介
2015/06/13 HTML5オールスターズ用 ① Service Worker (とその細かいUpdates) ② Cache API ③ Fetch API ④ Streams API (ReadableStream) ⑤ Push API ⑥ Background Sync APIRead less
efcl 2015/08/14
`--unsafely-treat-insecure-origin-as-secure=`で特定のURLをhttps扱いな感じにできるのか

ServiceWorker

Chrome

slide
リンク
Work with V8 memory leaks
These slides are about specific work with memory in JavaScript, patterns and antipatterns, best practices and tools for analyse emory usage.Read less
efcl 2015/05/31
メモリリークの見つけ方。 Gmailとかの話とかに近いやつ

Chrome

JavaScript

slide
リンク
Memory team 2015
Memory team 2015 haraken@chromium.org
efcl 2015/03/25
BlinkのGC整理、BlinkのObjectsをabout:tracingで見られるようになる予定

Chrome

V8

slide
リンク
DevTools: State Of The Union 2015
As the complexity of the web apps you build keeps moving, so do the Chrome DevTools. In DevTools State of the Union, Addy will give you the latest update on your favourite companion; exploring new features like paint profiling, animation inspection and updates to the JavaScript editing workflow with V8. * Note: these are annotated slides aimed at making it easy to read and follow along with what I
efcl 2015/03/21
Chromeの開発者ツールの新しい機能や実際のパフォーマンス計測、問題の見つけ方について。 WikipediaとjQueryの例、一つの処理が100ms取ってるなら危険、`hide()`のボトルネック、まずは計測することから始めるという話

Chrome

debug

Tools

slide
リンク
1 2 次のページ

お知らせ

もっと読む

公式Twitter

@HatenaBookmark
リリース、障害情報などのサービスのお知らせ
@hatebu
最新の人気エントリーの配信

キーボードショートカット一覧

j次のブックマーク

k前のブックマーク

lあとで読む

eコメント一覧を開く

oページを開く

設定を変更しましたx