Buenos Aires SOS

Chromeブラウザ内で高速に動作する辞書ツールです。 以下のような特徴があります。 ・とにかく高速な体験を提供(たぶん理論上最速) ・単語や熟語の検出に超強い ・好きな辞書データをインポート可能 ・オフラインでも利用可能 ・表示を柔軟にカスタマイズ可能 ・YouTube字幕 …
…


By following users and tags, you can catch up information on technical fields that you are interested in as a whole, By "stocking" the articles you like, you can search right away.

YouTube等の英語字幕にも使える 2. https://github.com/wtetsu/mouse-dictionary/issues/25, テンプレートを編集するとリアルタイムでプレビューが変更されます。ただ、キーボードを高速に叩いた時など、1キーごとにプレビューを更新するのは無駄なので、高頻度で変更した場合は、そのうちの最後の一回に更新が入るようになっています。これはdebounceで実現しています。, iframe対応のために、Cross-extension messagingを活用しています。詳細はこちら。, 小窓を移動したりリサイズしたりする仕組みです。仕組みと行っても既存の軽くていい感じのライブラリは見つからなかったので、完全に自前で実装しています。自前で書いた分、自分の好きなように挙動をつくることができました。実は端っこをダブルクリックでワープする機能とかもあります。, ソースはこの辺: 複数単語から成る熟語の検出に強い(重要) 3.

Why not register and get more from Qiita? 好きな辞書データを簡単にインポートできる(英辞郎オススメ) 4. camelCaseとかsnake_caseみたいな表現も単語にバラして個々の意味を表示 ブラウザの辞書ツールは1と2の特徴が本当に重要だと思っていて、これができると知らない表現を覚えることができる機会が圧倒的に増えます。 その他、以下のような特徴もあります。 1. What is going on with this article?

Chrome拡張の高速な英語辞書ツールをつくりました https://github.com/wtetsu/mouse-dictionary/blob/master/src/lib/traverser.js, ルックアップして発見した説明文字列からHTMLを生成する際には、テンプレートエンジンを利用しています。, で、速度を計測してみたら(Mouse Dictionaryの用途においては)Hogan.jsが高速で、APIも一度コンパイルした結果を再利用できるようになっていてかつ使いやすかったので、速度重視の方針からHoganを選びました。もうほぼメンテされていないという点は気になりましたが、とくにセキュリティリスクが報告されているわけでもないので良しとしました。, ちなみに説明テキスト表示部分のテンプレートはこんな感じになっています。これはオプション画面からカスタマイズできるので、多少HTMLの知識があれば、たとえば見出し({{head}})をクリックするとその単語をGoogleで検索する、といったことも可能です。キミだけのMouse Dictionaryを作り上げろ！, ソースはこの辺: https://github.com/wtetsu/mouse-dictionary/wiki/HTML-templates, WebExtensionsはChrome専用ではなく共通規格のようなものなので、FirefoxでもEdgeでも動かすことができます。, ...という名目になっているのですが、同じビルドが複数ブラウザでなにもせずに動くとかそんなうまい話があるわけはないと確信していたので、Mouse DictionaryはChrome専用機能として開発していました。その予想は半分合っていて半分間違っていました。, 意外と互換性あるな！という感じで嬉しい誤算でした。ただ、ユーザ設定の保存がいまいち安定できていないので、いまのところFirefoxビルドではユーザ設定は利用できなくしています。, 他の落とし穴としては、Firefoxではmanifest.jsonのversionが"0.9.0Beta"みたいな表記も許されるのですが、Chromeだとアルファベットを混ぜることができないというものがあります。, Safari拡張は互換性ぜんぜんない模様。対応予定はないです。

https://github.com/wtetsu/mouse-dictionary/blob/master/src/lib/storage.js, asyncにするためとアプリケーションコードから使いやすくするために、軽くラップしています。, そんなchrome.storage.localですが、たくさんのデータが入っている状態でも参照は高速です。どのくらい高速かというと、私の環境では、200万件以上のデータが入った状態で、50件のデータを取り出すのに6msとかで完了できるようです。実用上、一度に50件も取り出す必要はないので、Mouse Dictionaryの目標(1/60秒=約16ms)を考えても十分に高速と言えます。, 注意点として、getのAPIがこんな感じなので、50件のデータを引く場合はgetを50回呼ぶのではなく、一回だけ呼ぶようにしましょう。それさえ守れば高速に処理できます。, 前述の通り、辞書データの参照は、見出し語候補が数十個あっても一度に引けば十分な速度が出ることが期待できます。, そのため、Mouse Dictionaryは「多少無駄になってもいいので、ルックアップ候補を雑にたくさん作って一度に引いてアタリだけ表示する」という方針を採用できます。アタリがありそうな候補を慎重に生成するよりも、この雑な方針の方がずっと高速で便利なためです。, ルックアップ候補をつくるというのは、動詞の過去形を原型に戻したり、myをsomeone'sとかone'sにしたりとか、そういうのです。たとえば以下のような感じになります。, 当たり前ですが、辞書データの見出しにはふつう"dealt with"とも"on my own"とも書かれていません。"deal with"や"on one's own"なら見出しにある可能性があります。そのため、ルックアップ前に自動的に変換をしています。, 各ルックアップ候補の優先順位は自明ではないのですが、Mouse Dictionaryは以下のルールで作っています。, よきにはからって変換した方の文字列は、優先度を下げてルックアップします。その上で、長い表現このルールなら、おかしな順序で説明が表示されると感じる場面はあまりないと思います。, たとえば、dealt withにカーソルを合わせた際に、dealtがdeal withより上に表示されているのは、このルールに従っているためです。, 「多く」から「多く」「多い」「多」と、活用もまあ扱えます。これはdeinjaを利用して実現しています。まあこれも私がつくったやつですが…。(いい感じの既存ライブラリが見つからなかった), あと、日本語の単語をちゃんと認識して、カーソル位置が最初の文字に合わさっていなくても良きにはからってくれます。たとえば↓はカーソルを端にかざしているのにもかかわらず「ウィキペディア」という語を第一に表示してくれているの図です。, これは、たまたまなんとなくうまく動いているわけではなく、上記のような場所でも動くように工夫して作られているためです。, たとえば以下のYouTubeの字幕に使用している画像を御覧ください。"get"と"a very good commission"は(場所的な意味でもDOM的な意味でも)離れているのに、問題なく"get a commission"の意味を表示することができていますね。, ※ついでにいうと"get a very good commission"から見出し語の"get a commission"をとれるよう、うまく判断していますね, ※動画はThis is what happens when you reply to spam email | James Veitchより, ※EvernoteやConcluence上で動かすには、Mouse Dictionary iframe supportのインストールが必要です。, ソースはこの辺: 下記の辞書データに対応しています。dictionaryフォルダに入れておくと起動時に読み込みます. https://github.com/wtetsu/mouse-dictionary おおまかにいうと、ただのWebExtensionsプロジェクトです。が、とくに速度を出すために、ちらほらバッドノウハウ的なものも必要になりました。 https://github.com/wtetsu/mouse-dictionary/blob/master/src/lib/shortcache.js. 辞書データ.

Mouse Dictionaryが最重視していること: 1. Mouse Dictionary is a super fast dictionary for Google Chrome. Help us understand the problem. https://qiita.com/wtetsu/items/c43232c6c44918e977c9, ブラウザ拡張の開発に関する情報は、ふつうのWebフロントエンドの情報と比較するとなかなか見つかりづらいため、役に立つかもしれないと思いここに書き残しておきます。, https://github.com/wtetsu/mouse-dictionary, おおまかにいうと、ただのWebExtensionsプロジェクトです。が、とくに速度を出すために、ちらほらバッドノウハウ的なものも必要になりました。, どれくらい一瞬かというと、マウスうごかす～小窓の表示更新完了まで、60分の1秒を越えないようにします。また、辞書機能は他サイトの上に追加で表示させるという性質上、60分の1秒を超えなくても、更に早くて負荷が少ないに越したことはない、という感じです。, なお最新版での計測では、テキスト解析～辞書データルックアップ～DOM生成処理まで、実用上数ms以内で完了できているようです。, どれくらい雑かというと、"dealt with it"の上にカーソルを乗せると、dealtを自動的に原型dealに変換し、"deal with"や"deal"もルックアップ候補になります。, "on my own"の場合は、"on one's own"や"on someone's own"もルックアップ候補になります。, 実際に小窓の説明としてなにが表示されるかは、インポートされている辞書データによって異なります。雑にルックアップした見出し語群の中で、アタリがあったものを優先順位に従って上から表示します。, オプション画面は初期化や動作が少し遅くなったところで問題ではないので、ライブラリ等はとくに遠慮せずに入れています。逆に辞書機能(小窓とその裏の処理)の方は初期化時間も動作速度も最重要な要素のため、ライブラリは極力利用していません(Hogan.jsのみ利用), webpackは、普通のWebのフロントと異なり当初Chromeしか対象にしていなかったので有り難みは限定的かと思ったのですが、結局なにかと大活躍でした。途中からReact使うことにしたり、途中からFirefox対応することにした上にChromeとFirefoxのビルドを分けるハメになったりしたのですが、そのような場合も難なく対応できました。, Reactは、オプション画面を楽に作るために利用しました。カワイイUIコンポーネントライブラリを使いたかったというのも動機でした(結局カラーピッカーしか使っていませんが), どちらもキーバリューなのですが、おおまかにという前者はたくさんのデータを格納することができて、後者は容量が限られているものの格納したデータはGoogleアカウント経由で共有することができます。, https://developer.chrome.com/apps/storage, 使い分けの理由は、localにたくさんデータが入っている状態でさらにlocalにデータを追加しようとすると、かなり時間がかかるためです(1件追加するのに数秒かかる)。, 一度インポートしたら殆ど変更しないであろう辞書データと比較し、利用中にしばしば更新される可能性があり、かつ小さいデータであるユーザ設定を高速に保存完了できるようsyncに格納することにしたという感じです。バッドノウハウ感はあります。, ソースはこの辺:

ejdic-handテキスト形式（UTF-8） パブリックドメイン、6万5600項目以上; 本ソフトに同梱; 英辞郎テキスト形式（Shift-JIS） ¥495、198万9500項目; おすすめ

オンマウスで英語辞書を表示するようになるブラウザー拡張機能「Mouse Dictionary」の評価とレビュー、ダウンロードや使い方を解説します。ウェブページ閲覧中に気になった英単語の意味をオンマウスで表示できるようにする Chrome / Firefox 対応のブラウザー拡張機能です。 今回は、Google Chrome・Firefoxで使用できる英語辞書ツール「Mouse Dictionary」の紹介と使い方を説明していきます。 Chromeに英和辞書機能を追加するChrome拡張「 Mouse Dictionary 」がとても便利です。 マウスカーソルを英単語に合わせるだけで、瞬時に訳語を表示してくれます。 https://github.com/wtetsu/mouse-dictionary/blob/master/src/main/generator.js, イメージ検索や類語検索に飛ばす例:

https://github.com/wtetsu/mouse-dictionary/blob/master/src/lib/draggable.js, 一回マウスが通ったテキストと、そこからいろいろ処理して生成したDOMの対応を、短期的にメモリにキャッシュする、ShortCacheという仕組みを動かしています。, これにより、カーソルが同じテキストを複数回通過したときは、ストレージへのアクセスも必要なしに超高速で処理が完了します。, という目的で作った処理だったのですが、そもそもキャッシュなしでも処理が一瞬で完了するので、幸か不幸か期待していたほどの効果はありませんでした。しかし前述の通りMouse Dictionaryの負荷は少なければ少ないほどいいという考えがあるため、この仕組は残しています。, ソースはこの辺:

ローカルに辞書データを持つので高速(重要) 2. ほとんどのArm IPが試し放題でスタートアップは年会費無料！？Arm Flexible Access, https://qiita.com/wtetsu/items/c43232c6c44918e977c9, https://github.com/wtetsu/mouse-dictionary/blob/master/src/lib/storage.js, This is what happens when you reply to spam email | James Veitch, https://github.com/wtetsu/mouse-dictionary/blob/master/src/lib/traverser.js, https://github.com/wtetsu/mouse-dictionary/blob/master/src/main/generator.js, https://github.com/wtetsu/mouse-dictionary/wiki/HTML-templates, https://github.com/wtetsu/mouse-dictionary/pull/1, https://github.com/wtetsu/mouse-dictionary/pull/3, https://github.com/wtetsu/mouse-dictionary/issues/25, https://github.com/wtetsu/mouse-dictionary/blob/master/src/lib/draggable.js, https://github.com/wtetsu/mouse-dictionary/blob/master/src/lib/shortcache.js, "dealt with"にカーソルを置く → ルックアップ候補は["dealt with", "dealt", "deal with", "deal"], "on my own"にカーソルを置く → ルックアップ候補は["on my own", "on my", "on", "on one's own", "on one's", "on someone's own", "on someone's"], you can read useful information later efficiently.

キングダム 監督 福田組 5, Nist Sp800 171 Rev2 4, ベテルギウス ガンマ線バースト 確率 8, ノーサイドゲーム 最終回 動画 15, あつ森 胡蝶しのぶ 髪飾り 作り方 8, ポケモン ダイヤモンド こう て つじ ま 5, アメブロ 携帯 ヘッダー 5, デュエマ キングウォーズ 特典 4, Nct Dream ブログ 4, 蒲田行進曲 階段落ち スタント 7, 自信 過信 慢心 16, 俺のキッチンスタジアム クリスマス 動画 16, Hey Say Jump ライブ2019 5, 何 もし てないのにブロック された Twitter 33, 資生堂 日焼け止め スティック 販売店 22, Pubg Mobile アカウント連携 7, 有吉の壁 2019 動画 5, ガラル 図鑑 Csv 4, The Song Of Praise 意味 18, パーフェクトワールド ネタバレ 54 5, とい ゆうや 奨励会 29, 超特急 カイ 彼女 12, 欅坂46 アンチ 2ch 4, Trans Innovation 口コミ 9, ば くさい 宮城 ぱちんこ 4, シュプレモ 子犬用 涙やけ 4, パワプロ2018 ウインドミル 出し方 33, Pubgモバイル 足音 方向 14, マンドラゴラ マンドレイク 違い 11, 西岡 因果 応報 13, V6 歌詞 パート分け 14, ルーキーズ その後 ヤングジャンプ 9, Skype アイコン フリー素材 25, 志田愛佳 ブログ 最後 9, ベイスターズ 壁紙 2020 47, Cheers My Dears 意味 5, 犬 角膜潰瘍 手術 15, スキルス胃癌 ブログ 永眠 9, 食物連鎖 ピラミッド 動物 5, ウィッチャー3 スキル スロット 21, サラ ユーチューバー アンチ 28, 福留 ピノ なんj 8, Hey Say Jump と Sixtones 4, グラブル 無属性 対策 12, おぐら ひさ のぶ 5, 新内眞衣 暗黒 時代 7, ストライク レイド 剣盾 24, 中川大志 バスケ 東山 6, 遭難 歌詞 意味 9, 51 プリウス アクセサリー 電源 23, ボルダリング 握力 回復 6, メッセンジャー 無視 オンライン 28, 阪神 2005 パワプロ 5, プラレール 2歳 早い 16, ピカブイ モンスターボール 足りない 15, 猫 抗 が ん 剤 食欲不振 20, Macbook ネットフリックス デスクトップ 23, イ ドンウクはトークがしたくて コンユ 13, サカナクション Aoi 歌詞 意味 6, 大公 法律事務所 梶山 27, 時をかける少女 千昭 声優 8, ,Sitemap