Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
impression of google chrome headless
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
teitei_tk
May 31, 2017
Programming
0
1.9k
impression of google chrome headless
teitei_tk
May 31, 2017
Tweet
Share
More Decks by teitei_tk
See All by teitei_tk
Claude Code × WebLLM:AI駆動開発で作る次世代PDF要約ツール
teitei
0
120
dive to Ruby on Rails module autoloading
teitei
1
4.7k
貴方はOmniAuth::AuthHashを知っていますか?
teitei
0
9.6k
myhome-progress
teitei
0
85
recommend parallel career
teitei
0
1.1k
嫁に怒られずにGoを書く技術
teitei
0
2.6k
AWS parking lot shutter hack project
teitei
2
4.1k
Other Decks in Programming
See All in Programming
守る「だけ」の優しいEMを抜けて、 事業とチームを両方見る視点を身につけた話
maroon8021
3
390
あなたはユーザーではない #PdENight
kajitack
4
340
AIとペアプロして処理時間を97%削減した話 #pyconshizu
kashewnuts
1
210
NOT A HOTEL - 建築や人と融合し、自由を創り出すソフトウェア
not_a_hokuts
2
680
日本だけで解禁されているアプリ起動の方法
ryunakayama
0
370
CSC307 Lecture 13
javiergs
PRO
0
310
The Ralph Wiggum Loop: First Principles of Autonomous Development
sembayui
0
3.7k
15年目のiOSアプリを1から作り直す技術
teakun
1
610
メタプログラミングで実現する「コードを仕様にする」仕組み/nikkei-tech-talk43
nikkei_engineer_recruiting
0
160
猫の手も借りたい!ので AIエージェント猫を作って社内に放した話 Claude Code × Container Lambda の Slack Bot "DevNeko"
naramomi7
0
260
ご飯食べながらエージェントが開発できる。そう、Agentic Engineeringならね。
yokomachi
1
290
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
420
Featured
See All Featured
Art, The Web, and Tiny UX
lynnandtonic
304
21k
SEO for Brand Visibility & Recognition
aleyda
0
4.3k
Impact Scores and Hybrid Strategies: The future of link building
tamaranovitovic
0
220
Reflections from 52 weeks, 52 projects
jeffersonlam
356
21k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
49
9.9k
Making the Leap to Tech Lead
cromwellryan
135
9.8k
Navigating Team Friction
lara
192
16k
Money Talks: Using Revenue to Get Sh*t Done
nikkihalliwell
0
170
How STYLIGHT went responsive
nonsquared
100
6k
Designing for Performance
lara
611
70k
Mobile First: as difficult as doing things right
swwweet
225
10k
More Than Pixels: Becoming A User Experience Designer
marktimemedia
3
340
Transcript
ChromeHeadless modeΛ৮ͬͨॴײ 2017/05/31 @teitei_tk
ࣗݾհ • @teitei_tk • ࠷ۙϋΠϥϧԦࠃΛฏʹ͢ΔͨΊʹؤுͬ ͯ·͢ɻ
ຊ
ͷલʹ
Chrome Headless ͱʁ
͍ΘΏΔHeadlessϒϥβ • ޡղΛঝͰݴ͑ɺGUIͷແ͍Chromeɻ • GUIͳ͍͕ɺ෦తʹϖʔδͷϨϯμϦϯά ͔ΒJavaScriptͷ࣮ߦɺϒϥβͬΆ͍͜ͱ͕ Ͱ͖Δ
Ͳ͏͍͏༻్͕͋Δͷ • WebApplicationͷςετ • ͍ΘΏΔE2E • WebPageͷΩϟϓνϟࡱӨ • WebαΠτͷεΫϨΠϐϯά •
DDoS߈ܸ
ͳͥ Chrome Headless͔
PhantomJSͷࢮ
PhantomJSͱ • HeadlessϒϥβͷҰͭ • ͓ͦΒ͘Ұ൪ਓؾ͕͋ΔͷͰͳ͍ͩΖ͏͔ • ͔͠͠ɺ2017/05/30ݱࡏͰissue1848ɺPull Request58ͱ։ൃఀ͍ͯ͠Δ • https://github.com/ariya/phantomjs/
PhantomJS is Dead • ͦͯ͠།Ұͷϝϯςφ͕ࠓޙΈͳChrome Headlessʹ Γ͑ΔͩΖ͏ͱϝϯςφΛࣙΛએݴɻ • https://groups.google.com/d/msg/phantomjs/9aI5d- LDuNE/5Z3SMZrqAQAJ
• ࠓޙͷߏ͋Δͷ͔ɺphantomiumͱ͍͏PhantomJS + ChromeHeadlessͷ୯ޠ͕Έ߹Θͬͨ͞ϨϙδτϦ͋ Δ • https://github.com/Vitallium/phantomium
ͱ͍͏ͷ͕എܠ
Կނ Chrome Headless͔
• Google͕։ൃ͍ͯ͠Δͱ͍͏҆৺ײ • Webඪ४ͷ४ڌ͕ૣ͍ͷͰɺ͍ͪૣ͘ػೳ͕͑Δɻ • ֤छAPIͷར༻͕Մೳ • ServiceWorker • IndexedDB
• Memory Heap Profiler • etc
ͱ͍͏Θ͚Ͱ ৮ͬͯΈͨ
Setup • Chrome Ver59Ҏ͕߱ඞਢ • ݱࡏ(2017/05/30)ͷChromeͷStable Version58 • Chrome CanaryΛ͏ͱྑͦ͞͏
؆୯ͳͷͳΒ͙͢ग़དྷΔ • ShellͰ͙͢ग़དྷΔ • DOMͷग़ྗ • PDF࡞ • Ωϟϓνϟͷऔಘ •
eg. $ chrome --headless --disable-gpu --dump- dom https://www.chromestatus.com/
దʹWrapperॻ͍ͨ • ΩϟϓνϟͷࡱӨ • https://wobfnz0lh2.execute-api.us- west-2.amazonaws.com/dev/chrome?url=https:// google.co.jp • PDFͷੜ •
https://wobfnz0lh2.execute-api.us- west-2.amazonaws.com/dev/pdf?url=https:// google.com/
• ݴޠɿNode.js • ओʹ༻ͨ͠ϥΠϒϥϦ • chrome-remote-interface • ChromeͷAPIΛୟ͘Node.jsϥΠϒϥϦ • lighthouse
• ChromeΛىಈ͢Δϔϧύʔ͕هࡌ͞Ε͍ͯΔ ϥΠϒϥϦ
ॴײ • ҆ఆԽ·Ͱ͏গֻ͔͠Γͦ͏ɻ • Ṗͷ--disable-gpu Option • API͕·ͩམͪண͍͍ͯͳ͍ͷͰຊ൪ೖ·ͩආ͚ͨ΄͏ ͕ྑͦ͞͏ •
ͱ͍͑PhantomJSͷޙ佂ʹ࠲Γͦ͏ɻ • ಈ͓͖ͬͯ·͢ɻ • Կ͔͋ͬͨΒهࣄͰॻ͍ͯڞ༗͠·͢ɻ