Chrome Extension で作るクラウドいらずのMLモデル提供 - CADDi Tech Blog
TL;DR Chrome Extension経由で独自に学習したMLモデルを社内配布できるようにしました モデルはユーザのブラウザ上で実行するので余計な通信も発生せずクラウド代も不要です 背景 こんにちは。CADDi AI Lab MLOpsチームの中村遵介です。普段は機械学習エンジニアチームの作るモデルをVertex Endpointsを使用してAPIとして提供したり、パイプラインに組み込んで推論結果をデータ提供したりするお仕事をしています。モデルは様々な種類がありますが、一番多いのは図面画像から特定の値を推論したり、何らかのクラスに分類するようなモデルです。 そのような中で「API提供するとサーバ代かかるし、ユーザにAPI使ってもらうのもちょっと手間があるしなぁ」と考えることがあり、ふと「Chrome extensionでMLモデルを提供しちゃえば、ユーザはextensionを入れるだ
ブラウザにおけるメモリリークを解決するために読んでおけると良い資料 - mizdra's blog
最近趣味や仕事の Web アプリケーションでメモリリークに遭遇して、頑張ってメモリリークの原因を突き止めて修正する、ということがあった。その過程でメモリリークについて色々調べて知見が溜まったので、学習資料の紹介という形でアウトプットしてみる *1。 前置き 紹介する記事がかなり偏っていることに注意 冒頭で触れたメモリリークを解決するために読んだ記事をまとめただけなので、内容にそれなりの偏りがある 例えば id:mizdra が遭遇したメモリリークは全てブラウザ上で発生していたものだったので、これから紹介する内容も主にブラウザにおけるメモリリークに焦点を当てたものになる GC がどうメモリをどう解放しているか、何故メモリリークが発生するのかは全てカット 調べれば色々な記事が出てくるので、必要に応じて読んでください 基本的な知識を抑える まずメモリリークとメモリ撹拌の違いを学ぼう どちらも同じ
WebTransportとWebCodecsを組み合わせてビデオチャットを実装してみる - Qiita
この記事は？ こんにちは。NTTコミュニケーションズのyuki uchidaです。普段はSkyWayというWebRTCプラットフォームの開発やWebRTCリサーチャー(見習い)をしています。 この記事は NTTコミュニケーションズ Advent Calendar 2020 10日目の記事です。昨日はy-i さんの記事、 「グループ内プログラミングコンテストをオンライン上で開いた件」でした。 前回、 NTT コミュニケーションズのアドベントカレンダー3日目の記事として、「WebSocketの次の技術！？WebTransportについての解説とチュートリアル」という記事を投稿しました。 WebTransportが出てきた背景や、双方向通信の歴史について解説しているため、興味があれば是非ご覧ください。 今回の記事は、そのWebTransportとWebCodecsを組み合わせてビデオチャットを実
Google Chrome Labsが開発したオープンソースのデザイナー向けブラウザ拡張「VisBug」がSafari v14対応の機能拡張としてリリース。
Google Chrome Labsが開発したオープンソースのブラウザ・デザインツール「VisBug」がSafari v14対応の機能拡張としてリリースされています。詳細は以下から。 GoogleでChrome CSS Developerを務めるAdam Argyleさんは現地時間2020年11月04日、Google Chrome Labsがオープンソースで開発しているデザイナー向けChrome機能拡張「VisBug」をSafari v14の機能拡張に移植＆リリースしたと発表しています。 Open source web design debug tools built with JavaScript: a FireBug for designers. Point, click & tinker Edit or style any page, in any state, like it’s
Google Chrome 86正式版リリース、ファイルシステムAPIの安定版が利用可能に
ウェブブラウザ「Google Chrome」の最新安定版であるバージョン86.0.4240.75がリリースされました。ファイルシステムAPIが追加されてより高機能なウェブアプリを開発できるようになっています。 New in Chrome 86 | Web | Google Developers https://developers.google.com/web/updates/2020/10/nic86 V8 release v8.6 · V8 https://v8.dev/blog/v8-release-86 New in Chrome 86: File System Access, WebHID, new CSS features, and more! - YouTube ◆ファイルシステムAPIが利用可能に これまでも、「input」の「type="file"」を利用すること
Chrome拡張でマスタデータ管理ツールを作ったら開発に変化が起きた話（ツール公開しました） - Qiita
よくある運用 マスタデータの管理方法として多いのは、Excelなどの表計算ソフトを使ってデータを作成し、それをGitHubで管理しつつ、実際にDBなどへデプロイさせる方法かと思われます。 そしてこれを実現するにあたって、出来るだけエンジニアの負担を減らせるよう、データ作成者にGitクライアントの使い方やデプロイ方法をレクチャーします、が... マスタデータ管理ツールの誕生 ただ、そこで気になるのは、結果的にデータ作成者の負担が増えてしまうことです。 大体の場合、表計算ソフト以外のツールも触ることになり、もう少し手軽にできないかと考えていました。 そこで今回は、Chrome拡張とSpreadsheetを用いて、データ作成者がChromeだけでデータの作成から反映までできるツールを作成しました。 少し前から、Spreadsheetでデータを作成後にデプロイツール実行一つでデータを反映する、とい
開発体験を変える! Chrome DevTools Tips 7選 - Qiita
最近Chrome DevToolsについて調べていて発見した便利機能を紹介します。 誰もが使える最高便利な開発マシンChrome DevToolsを使いこなして開発体験を変えましょう！ 1. $0で選択中のDOM要素の取得 特定の要素に何かしたいという時には、要素のIDやclassを確認してConsoleでdocument.querySelector("#xxx")で取得するというのが一般的だと思います。実はそれはカーソル選択と$0で代替できます。 Classや、IDがついていない特定のDOMを取得したい時とかにも使えるので地味に便利です。 手順 カーソルで取得したい要素を選ぶ Consoleタブで$0を入力 最近知ったChrome DevToolsの便利機能① $0 での選択中のDOM要素取得 Elementsタブで選択状態のDOM要素は、Console上で $0 を入力することで取得で
3年かけてたどり着いた英語記事を読むための方法 - Qiita
2023/07/03 要約ツールに｢ChatGPTを利用する場合｣を追加し、サンプルの生成結果を記載しました。 以前は英語の記事の読み書きが苦手だったのを、このようにして克服した、という話を書きます。 成果を数値で測ってないですが、RSSフィードに登録している英語メディアの数が大幅に増えました。以前は全体の5%程度に対し、今は50%以上が英語メディアになっています。英語に対する心理的ハードルは大きく下がりました。 また、読む力を付けたことで自作のOSSのREADMEもほぼ自力で書けるようになりました。 https://github.com/goodwithtech/dockle/blob/master/README.md では始めます。 全体像 僕の場合、1000文字以上の英文記事を読む場合、STEP1に含まれる内容は必ず行います。 STEP2に含まれるものは、辞書なしで読めないときだけ行
すぐに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をインストールします。 $
carlo + parcelでお手軽デスクトップアプリケーション - Qiita
ウェブ技術でデスクトップアプリを開発するとなると、一番メジャーなのはやはりelectron/electronでしょう。ところがElectronは割と面倒です。配布ファイルのサイズ、セキュリティなど。 それとバンドラとして有名なWebpackですが、こっちも仰々しいです。 そこで今回はライトウェイトでゼロコンフィグな、carloとparcelの組み合わせについて書きます。 GoogleChromeLabs/carloは先日登場したばかりの headful Node app framework です。headlessならぬheadfulです。 中身はぶっちゃけると puppeteer-core の薄いラッパーです。 普通のPuppeteerはオープンソースのChromiumをダウンロードしてきて動作しますが、puppeteer-coreは既にローカルにインストールされているChromeなどを対
E2EテストをPhantomJSから、Puppeteer + Headless Chromeへ移行しました - LCL Engineers' Blog
Webエンジニアの森脇です。LCLでは、以前より「Capybara + PhantomJS」でE2Eテストを行っていましたが、「Puppeteer + Headless Chrome」へ変更しました。 元々は、軽くPuppeteerを触ってみるだけのつもりでしたが、できが良く本格的にE2Eテストへ導入することにしました。 本記事では、変更の経緯や、PuppeteerでE2Eテストを実装する上でのTIPSを紹介します。なお、Capybara + PhantomJSを利用したE2Eテストは、以下の記事でご紹介しております。 techblog.lclco.com 変更の経緯 PhantomJSは古めのWebkitをベースにしているため、一部のCSSがうまく適用されず、Headless Chromeへ移行を以前より考えていました。そんな中、PhantomJSの開発が終了したこともあり、移行すること
Google Chrome (Chromium)を自分でビルドする - ろば電子が詰まつてゐる
いろいろとやる必要があり、Chromiumを手元でコンパイルしたのでその記録。 (2018-06-23) @tzik_tackさんに指摘いただき、一部修正しました。ありがとうございます。 ChromeとChromium まず、予備知識。 Chromiumはオープンソースプロジェクト名であり、そのプロダクトがChromiumというWebブラウザ。そして、ChromiumをベースにGoogleが固有機能を追加したものが、我々がふだん使っているGoogle Chromeである。 https://www.chromium.org/ もっとも、Chromiumプロジェクト自体Googleが深く関わっているし、普通にそこでの実装の意思決定もGoogleのエンジニアによるものが多いので、実質どっちもGoogleがやってるという理解でおおむね問題ない。 Google Chrome自体はGoogleの著作物
英語の文章にルビをふってくれるGoogle Chrome拡張機能「Read Ruby」 | ライフハッカー・ジャパン
Microsoft CopilotをPowerPointで使ってみたら、一瞬で資料作成や要約ができた!使い方・料金・導入方法とは?
ヘッドレス Chrome スタートガイド | Blog | Chrome for Developers
要約 ヘッドレス Chrome は Chrome 59 でリリースされます。Chrome ブラウザをヘッドレス環境で実行する方法です。基本的には Chrome を使わずに Chrome を実行しますこれにより、Chromium と Blink レンダリング エンジンが提供する最新のウェブ プラットフォーム機能がすべてコマンドラインに組み込まれます。 なぜこれが有用なのでしょうか ヘッドレス ブラウザは、UI シェルを表示する必要のない自動テストやサーバー環境に最適なツールです。たとえば、実際のウェブページに対してテストを実行したり、そのウェブページを PDF 化したりできます。また、ブラウザが URL をどのようにレンダリングするかを検査することもできます。 Headless（CLI）の起動 ヘッドレス モードを開始する最も簡単な方法は、コマンドラインから Chrome バイナリを開くこと
Headless ChromeをDockerに入れてGebで遊んでみた - Mitsuyuki.Shiiba
昨日書いたんだけど、Kafkaを触ろうと思ってるんだよ？でも、触ろう触ろうと思ってると、違うものが目に入ってくるのであった。ということで Headless Chromeで遊んでみた Kafka一切関係なく、この記事を見かけたから。 Getting Started with Headless Chrome | Web | Google Developers この辺のこともあるので、ちょっと見とこうかなって。 Phantom.jsのメンテナー、プロジェクトの将来に疑問を呈し、その座を降りる ただ、今手元にある環境でごにょごにょするのもなんか嫌だなぁ・・・って思ったので、無駄にDockerに詰め込んでGebで遊んでみた。そして、そのせいで疲れた(ヽ´ω`) できあがったものは これ。 https://github.com/bufferings/sandbox-gebheadlesschr
WEB制作向けブラウザ「Blisk」を使った瞬間、恋に落ちた
それで、「そんなにいいのかな？」と半信半疑でインストールして、使ってみた瞬間、惚れました。 プログラミングをする人にとって、Sublime Textは、「恋に落ちるエディター」とよく言われていますけど、WEB開発者にとってBliskは「恋に落ちるブラウザ」といっても過言はないのではないかと思います。 以下では、そう思うに至った理由について述べたいと思います。 この記事は、2016年7月9日に書いたものです。2016年11月1日にversion 1.0.125.166が出たことにより、機能の一部が有償プランに加入しないと利用できなくなりました。ですので、無料で利用する場合は、30分で機能制限がかかったりするようになったのでご了承ください。 Blisk（ブリスク）とは Bliskは、WEB制作者がサイトの動作確認をする上で、便利な機能がデフォルトで備わっているWEBブラウザです。 現在は、Wi
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【西川和久の不定期コラム】 Chrome OS Flexと最新版Wine 7.0の組み合わせでWindowsアプリを動かしてみる
ノーコードでブラウザ上の作業を自動化！スプシの読み書きもお任せできるChrome拡張機能【今日のライフハックツール】 | ライフハッカー・ジャパン
商業誌を20冊以上書いたボクがたどり着いたChromebookのテキストエディタ
海外で3年間働いて、今でもめちゃ使っている英語の補助ツール活用3選 | 俺日記
