Chrome仕事術 - 詩と創作・思索のひろば
いろいろ工夫した結果、最近 Chrome さばきが良くなってきた気がするので、やっていることを書いておく。 タブが必要になる時刻でグループ化しておく 忙しい一日の予定を立てる際に、あらかじめ必要な資料・会場をタブで開いて時刻を打っておくと便利。終わったらまとめて閉じることもできる。 Chromeのタブを必要になる時刻でグループ化しておくライフハック pic.twitter.com/P8RQLy7h9K— 美顔器 (@motemen) 2022年8月22日 ページのブックマークタイトルを自分用に変更する ブラウザのブックマークはあまり有効活用してなかったけど、タイトルを自分用につけておくとロケーションバーからの検索に便利なことを体感している。<プレフィクス> | <検索用ワード>, ... という感じでタイトルを設定していて、プレフィクスは ミーティングの議事録など会場: mtg 1on1
Chrome拡張 つくりかた 令和最新版
数年ぶりにChrome拡張のつくりかたを調べた。 本当に何も分からなかったので、Twitterで「2022年にChrome拡張つくりたかったら何見て学べばいい？」とつぶやいてみたところ、何人かの人が教えてくれた。教えてもらった中から幾つかのリンク先を紹介するような形で記述していく。 Create a Vite-React Chrome Extension in 90 seconds - DEV Community 2022年時点だと比較的新しめのフロントエンド向けツールであるviteと、viteのChrome拡張向けプラグインである@crxjs/vite-pluginを使ってChrome拡張をつくってみよう、という記事。今回自分は主にこれを参考にしながら開発を進めた。Reactと言っているが、自分のChrome拡張ではUIは存在しなかったので、Reactに関する部分は読み飛ばして、vite
Rustでブラウザを操作する「rust-headless-chrome」を試してみた | DevelopersIO
こんにちは。MAD事業部のきんじょーです。 最近Rustの入門書を読んだので、何かに使ってみようと模索していました。 その中で、Rustでヘッドレスブラウザを動かすライブラリを検証したのでこの記事にまとめます。 ヘッドレスブラウザとは ヘッドレスブラウザはGUIを持たないWebブラウザです。 一般的なブラウザと同じく、HTMLを解析しJavaScriptを実行できますが、GUIを持たないため、CLIやプログラム上から操作を行います。 主に以下のような用途で用いられます。 WebアプリケーションのE2Eテストの自動化 Webページのスクリーンショット取得 JavaScriptの自動テスト Webページで行うワークフロー処理の自動化 Webページのクローリング 古くはPhantomJSやCasperJSなどを用いていましたが、現在では主要なブラウザもネイティブでヘッドレスモードを搭載しています
ブラウザでTCPを直接送受信できるDirect Sockets APIについて - ASnoKaze blog
ブラウザから直接TCP・UDPで送受信する「Direct Sockets API」という仕組みが議論されています。 実験段階ですが、Chromeでは起動時にオプションを付けることでこの機能を有効にできます。今回はTCPの方で簡単に動作を見てみます。 Direct Sockets API Direct Sockets APIは、TCP・UDPで直接送受信可能にするAPIです。既存のアプリケーションプロトコル(SSHやIRC)、P2Pのような機能を実現可能になります。 もちろんセキュリティ上の問題もあるので、Chromeでは現状デフォルトでは有効になっていない機能です。 セキュリティ面についてはだいぶGithubリポジトリで議論されておりますので目を通すと良いでしょう。ローカルネットワークへの通信やSame-Origin-Policy(CORS)回避の話が上がっていますが、今回は細かくは紹介し
Rust より C++ が優れている 12 のポイント - uchan note
若干釣りタイトルですが，私が「Rust にはない C++ の良さ」を募ったところ，12 個ほどの優れている点が報告されたので，まとめてみます． 背景 私は 2018/10/08 開催予定の技術書典5で，『C++でできる！OS自作入門』と題して，Clang+LLD で C++ を使って OS 開発する際の注意点とか C++ の活用例を解説する同人誌を書こうと思っています． その下調べもかねて，このようなツイートをしました． C++好きな人！ぜひ，RustにはないC++の良さを教えてください！— C++でOS自作 技術書典5 お05 (@uchan_nos) 2018年8月24日 そうしたら知り合いからこんなリプが飛んできました． これ、まとめてblogにして！— shoma (@shoma) 2018年8月24日 一部の人に参考になるかもしれないのでまとめることにしました．ただしネタ多めです
JavaScript で print デバッグ時に変数名を出力する - mizdra's blog
数列の和を求めるプログラムを作成することになり、意気揚々と以下のようなプログラムを書いたという状況を想像して下さい。 function sum(nums, acc = 0) { if (nums.length === 0) return 0; if (nums.length === 1) return nums[0]; return sum(nums.slice(1), acc + nums[0]); } const nums = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; console.log(sum(nums)); // expected: 55 一見すると何も問題なさそうに見えるプログラムですが、実はバグがあります (皆さん分かりますか?) *1。実際に上記プログラムを実行すると 55 ではなく 10 が出力されます。 こうした場面に遭遇すると、自然と sum
Chrome OS 10周年 - Nothing ventured, nothing gained.
子供たちが僕たちが作ったChromebook (ChromeOS) でプログラミングを学んでいる (Codemonkey)。涙が出そうになった。 #STEAM前原小 pic.twitter.com/uhqUvpgSDT — 及川卓也 / Takuya Oikawa (@takoratta) November 26, 2016 Chrome OSが10周年を迎えたようだ。おめでとう。 Chromebook turns 10 東京にChromeチームが立ち上がりかけていた頃、将来計画などを説明に来ていた本社マウンテンビューのディレクターからOSを作ることを考えているという話を聞いた。Webに最適化されたOSが必要だと熱く語ったそのディレクターは東京のChromeチームの設立の支援者でもあり、東京にもそのOS開発チームを作りたいと言っていた。六本木ヒルズ近くの居酒屋だったと思う。2009年の頃だ
WebUSBとは何か、何を引き起こしたか、今どうなっているか
これは WebUSBでレイヤーが低まるWeb開発 ( https://speakerdeck.com/fadis/webusbdereiyagadi-maruwebkai-fa-shibuya-dot-xssban ) にその後起こった問題についての話を書き足したものです
ChromeとFastlyのEarly Hintsの効果計測に貢献する — HACK The Nikkei
この記事は Nikkei Advent Calendar 2020 20 日目の記事です。 日経電子版 Web チームの阿部です。今回は HTTP/2 の目玉機能の 1 つであった Server Push の事実上の終焉と、現在 Chrome チームや Fastly 社が実験中の 103 Early Hints について、日経電子版 Web での取り組みを紹介させていただきます。 HTTP/2 Server Push HTTP/2 Server Pushは HTTP/2 で策定された、一言で言ってしまうと「必要なリソースがリクエストされる前にサーバーからクライアントに送ってしまおう」という技術です。 これによりクライアントがリクエストするリソースを先回りしてサーバーが送ることで、必要なリソースが揃うまでにかかる時間を短縮できるため、パフォーマンスの向上が期待されていました。 Server
Web 技術の調査方法 | blog.jxck.io
Intro 「新しい API などを、どうやって調べているのか」「仕様などを調べる際に、どこから手をつければ良いのか」などといった質問をもらうことがある。 確かにどこかに明文化されていると言うよりは、普段からやっていて、ある程度慣れてきているだけなものであり、自分としても明文化していなかったため、これを機に解説してみる。 やり方は一つではない上に日々変わっていくだろうが、頻繁にこの記事を更新するつもりはない。また、筆者は実務で必要になるというよりは、ほとんどを趣味でやっているため、このやり方が合わない場面は多々有るだろう。 スコープとしては、ライブラリ、ツール、フレームワークなどではなく、 Web プラットフォーム関連の標準やブラウザの実装状況などに限定している。 Scope 従来からあり、広く認知された API については、情報も多く調査の敷居はそこまで高くないため、今回は議論が始まって
Using Chrome to generate more accessible PDFs
$200K 1 10th birthday 4 abusive ads 1 abusive notifications 2 accessibility 3 ad blockers 1 ad blocking 2 advanced capabilities 1 android 2 anti abuse 1 anti-deception 1 background periodic sync 1 badging 1 benchmarks 1 beta 83 better ads standards 1 billing 1 birthday 4 blink 2 browser 2 browser interoperability 1 bundles 1 capabilities 6 capable web 1 cds 1 cds18 2 cds2018 1 chrome 35 chrome 81
Webブラウザ上で純粋なHTTPだけで単方向リアルタイム通信を可能にするHTTPのストリーミングアップロードが遂にやってくる - nwtgck / Ryo Ota
Web標準のHTTPクライアントfetch()でストリーミングしながらアップロードできるようになる。
電子情報学特論：Chromiumのアーキテクチャを解き明かす
電子情報学特論： Chromium のアーキテクチャを解き明かす 〜 EEIC の授業が生きるプロダクトの世界〜 Kentaro Hara 2020 April (๑>ᴗ<๑) * * * *
NFCタグをWebアプリで読み書きできる「Web NFC」、Chrome 81ベータで実装開始
Googleは現在開発中のChrome 81ベータ版に、Web NFCの機能を試験的に組み込んだことを明らかにしました。 Web NFCは、WebアプリケーションからNFC（Near Field Communication：近距離無線通信規格）タグの読み書きを行うための仕様および機能です。NFCに対応したICタグとデバイスを数センチの距離に近づけると非接触で通信ができます。 スマートフォンの多くにはすでにNFCリーダー／ライターの機能が備わっているため、Web NFCの機能を組み込んだWebブラウザを利用することでアプリケーションからスマートフォンのNFC機能を利用可能です。 ただし現時点でのWeb NFCの対応範囲はNDEF（NFC Data Exchange Format）と呼ばれる軽量なメッセージ交換までで、ISO-DEP、NFC-A/B、NFC-F、HCEなどへの対応はスコープ外と
Chrome に、邪魔にならない通知許可 UI を導入します
.app 1 .dev 1 #11WeeksOfAndroid 13 #11WeeksOfAndroid Android TV 1 #Android11 3 #DevFest16 1 #DevFest17 1 #DevFest18 1 #DevFest19 1 #DevFest20 1 #DevFest21 1 #DevFest22 1 #DevFest23 1 #hack4jp 3 11 weeks of Android 2 A MESSAGE FROM OUR CEO 1 A/B Testing 1 A4A 4 Accelerator 6 Accessibility 1 accuracy 1 Actions on Google 16 Activation Atlas 1 address validation API 1 Addy Osmani 1 ADK 2 AdMob 32 Ads
Chrome 80 から Web Worker (Dedicated Worker) で ES Modules が使えます
Chrome 80 から Web Worker (Dedicated Worker) で ES Modules が使えるようになります。本記事はその宣伝です。 前提知識 ES Modules って何？ ざっくりいうとスクリプトファイルをモジューラブルに読み込む仕組みです。 他の方が解説した記事がいっぱいあるのでそっちを見てください。 Web Worker って何？ ざっくりいうと Web でスレッドを使うための API です。 MDN の解説（これとかこれ）を読むか、詳しく知りたい人は「JavaScript のスレッド並列実行環境」を読んでください。 スクリプトファイルの読み込みについては以前「JavaScript のスクリプトインポートを正しく使い分けようという話」に詳しくまとめたのでそちらも併せて読んでください。 使い方 Dedicated Worker で ES Modules (M
すぐにChrome拡張機能開発できるオープンソースのテンプレート「Chrome Extension CLI」
◆ Chrome Extension CLI https://github.com/dutiyesh/chrome-extension-cli 紹介 「Chrome Extension CLI」は、npmを使って簡単にChrome拡張機能の初期セットアップができるオープンソースのテンプレートです。 $ npm install -g chrome-extension-cli /usr/local/bin/chrome-extension-cli -> /usr/local/lib/node_modules/chrome-extension-cli/index.js + chrome-extension-cli@0.2.0 added 21 packages from 11 contributors in 2.879s まずは、Chrome Extension CLIをインストールします。 $
Chrome(Canary) の Native File System API で ローカルファイルの読み書きをする - mizchi's blog
ブラウザ上でローカルファイルの読み書きができる Native File System API が ChromeCanary で実装された。 前々から欲しかった機能なので、自分が作ってる markdown preview ツールに実装してみた。 Intent to ship https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/noan0cgEBGQ/t8DuK8_hDwAJ 仕様 http://wicg.github.io/native-file-system/ 動かすとこんな感じ https://mdbuf.netlify.com/ で Meta+O/Meta+S のキーバインドを振ってる。 有効化 https://www.google.com/intl/ja/chrome/canary/ をダウンロード chrom
ブラウザでマイク入力から書き起こしを行うツールを作った - mizchi's blog
Chrome でマイクからの音声を録音して、その音声認識で書き起こしも同時に行うツールを作った。 recording-studio.netlify.com で遊べる。 Chrome に搭載されてる Web Standard Proposal? の SpeechRecognition API を使っている。 developer.mozilla.org Chrome のみだが、 PC Chrome だけではなく Android Chrome でも動作確認済み。 ブラウザをオフラインにすると動作しないので、このAPI の 中身はたぶん Google Speech to Text API だと思われる。 出力 録音したものは webm ファイルとしてダウンロードできる。認識されたテキストも、タイムスタンプ付きのプレーンテキストなので、適当にもっていって、ぐらいの気持ち。 クラウドで音声認識してるこ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
新規タブリンクの恐ろしい仕様、Chrome 88で変更へ ～Safari/Firefoxに合わせた安全な仕様に／“rel=noopener”を付け忘れても大丈夫【やじうまの杜】
