kitak's blog

Kみたいなエンジニアになりたいブログ

Chrome

Puppeteer でページを自動操作するスクリプトを書く時に使うスニペット

画面が複数あったり、フォームの項目が多い場合に毎回最初から実行して試行錯誤するのは大変。以下のようなスニペットで、 REPL 環境を用意することで、DevTools でセレクタを調べたり、ひとつひとつの操作の挙動を確かめつつ、スクリプトにコードを書き足し…

getUserMedia でバックカメラを要求する

Andoid Chrome で動くQRコード・バーコードを読み取るアプリを書いていて知った。 navigator.mediaDevices.getUserMedia でカメラを要求すると、デフォルトではフロントのカメラになるのだけど、以下のようにすることでバックカメラを要求することができる。…

puppeteer で Speed Index を算出

puppeteer という Headless Chrome を Node から操作するライブラリが今日発表されたので、以前、記事を書いた WebPagetest を使わずに Speed Index を算出する - kitak's blog を puppeteer でやってみた。 puppeteer の良さ Chrome Developer Tools の開発…

Android ChromeでPhysical Webを試した

googledevjp.blogspot.jp を読んで、試してみることに。Physical Webってなに? iBeaconと何が違うの? という話は http://physicalweb.jp/ が詳しい。 送信側 送信側。ビーコンを飛ばすデバイスは http://direct.sanwa.co.jp/ItemPage/MM-BTPW1 で売ってる…

Chrome DevTools でコストの高い描画処理を探す流れ

先日、Chrome DevTools の「Enable paint flashing」を使う - kitak.blog で、Chrome DevTools の「Enable paint flashing」を使って不要な描画処理を検知する方法を紹介しました。 不要な描画処理は行わないほうがいいに決まっていますが、必要と思われる描…