Chromeに入るRecorder機能の利用と注意点 - 虎の穴開発室ブログ
こんにちは。虎の穴ラボのH.Hです。 今回は先日発表されたChromeの開発中の新機能であるRecorder機能について使用方法や利用する際の注意点などをまとめました。 Recoder機能とは ブラウザのChrome97で追加される予定の機能で、ブラウザの画面上で操作した記録を取得してくれる機能になります。 この記事を書いている2021年11月17日では一般に提供されているChromeの最新版は96となり、開発中の「Chrome Dev」もしくは「Chrome Canary」でRecorder機能を使用することができます。 利用している時の様子はChromeの開発者向けのページに公開されています。 developer.chrome.com 主な機能は以下の通りです。 ・操作の記録及び再実行(リプレイ)できる ・再実行時にパフォーマンスの記録・確認できる ・記録した内容の編集ができる ・操作
PDF出力ボタン制作時のハマった話
行程さんというサービスを運営しています。共有したくなる旅のしおりを簡単に作成できるサービスです。 このサービスで、しおりを印刷してもらいたいために、前回、段組の話を書きました。今回は、どんな環境でもウェブページを見たままのPDFを出力するためにPDF出力ボタンの機能を作ったときの話をします。 ウェブページを見たままPDF出力する 問題 印刷プレビューページがあるが、PCのChromeでしか再現できない iPhoneからでもコンビニ印刷できるように、PCのChromeで再現できている見た目のままPDF出力をしたい 解決案 サーバーサイド側でライブラリを用いてPDFを出力する（easyPDF、TCPDF、mPDFなど） しかしこれらのフレームワークは、見たままを出力できない 実際に取った方法 ヘッドレスChrome＋Puppeteer＋Node.js これであれば、Chromeで見たままを出力
Puppeteerで不要なCSSを消す - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは。フロントエンドエキスパートチームの穴井（@pirosikick）です。福岡在住で、普段は福岡のweworkで働いています。他のメンバーは皆、東京に居てリモートで仕事をしていますが、モブでわいわい開発していますし、weworkが快適すぎて、毎日楽しいです！ フロントエンドエキスパートチームでは、サイボウズの各プロダクトが抱えるWebフロントエンドの課題を解決するのが仕事の一つです。 blog.cybozu.io 最近の取り組みとして、Puppeteerで不要なCSSを消した事例を紹介します。 このブログは、6/19に福岡で開催した「Google I/O '19のWebをまとめる会」で登壇したときの内容を詳細に説明しつつ、アップデートした部分もあるので、発表見たぞ、スライド見たぞという方も見ていただけますと幸いです。 speakerdeck.com きっかけ とあるプロダクトのCS
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
