![input[type="number"]における全角入力対応をChromium/WebKitへ提案と実装をした話](https://cdn-ak-scissors.b.st-hatena.com/image/square/55ecc0e848ab90d979de1992913f8c379dc838f4/backend=imagemagick;height=288;version=1;width=512/https%3A%2F%2Fblue-sea-697d.quartiers047.workers.dev%3A443%2Fhttps%2Fwww.fourier.jp%2Fstorage%2Fblog%2Fpost-outline%2F72p4chSEDv2ghmnU9xADoSgwBWvhGumO.jpg)
このブラウザ バージョンのサポートは終了しました。サポートされているブラウザにアップグレードしてください。
このブラウザ バージョンのサポートは終了しました。サポートされているブラウザにアップグレードしてください。
キャッシュは、CPUのバスやネットワークなど様々な情報伝達経路において、ある領域から他の領域へ情報を転送する際、その転送遅延を極力隠蔽し転送効率を向上するために考案された記憶階層の実現手段である。(引用: フリー百科事典『ウィキペディア（Wikipedia）』) こんにちは、@kaa_a_zu です。私たちエンジニアは、「キャッシュ」というワードをよく口にしています。それはインフラの設計をしている時かもしれないし、表示されるコンテンツが変わらない時かもしれないし、パフォーマンスの改善をしている時かもしれません。普段何気なく使っている「キャッシュ」とは一体何なのでしょうか。この記事は、そんな「(Webフロントエンドを触るエンジニアが知るべき)キャッシュ」について、どんなものがあるのかがちょっと分かったという状態になることを目的に書いています。
Cache Storageがめちゃくちゃ肥大化する問題 TBSのニュースサイト、TBS NEWS DIGがめちゃくちゃブラウザのストレージを消費しているという話がはてブや増田で話題になっています。 TBSのニュースサイトヤバない？ – はてな匿名ダイアリー 同・はてなブックマーク 確かに、手元でも同様の状況を観測できる。 当該サイトのストレージ使用状況 はたして、これは真実なのだろうか。本当に1.4GBも食うことがあるのだろうか…… そんなわけない、ということで調査 まずは再現性を確認するためにChromeのゲストモードで当該のサイトのDevtoolを開いてましょう。すると、StorageのUsageは386MBになっていました。（適当なページを開き、リロードした時点で340MB程度であった） 当該サイトのストレージ割合 上記のスクリーンショットをよく見ていただけるとわかると思いますが、こ
WindowsやmacOS、Linuxなどのクロスプラットフォーム対応のデスクトップアプリ開発を容易にするフレームワークとして高い人気を持つフレームワークが「Electron」です。 ElectronはChromiumとNode.jsを用いることで、HTML/CSS/JavaScriptのWebテクノロジーによってデスクトップアプリケーションを開発できるのが最大の特徴です。 いまやElectronは、Visual Studio CodeやMicrosoft Teams、Slack、GitHub Desktop、そして最近話題のNotionなど、さまざまなアプリケーションに採用されています。 このElectronの優れた特徴を備えつつ、よりメモリ消費量が小さくファイルサイズもコンパクトで、高いセキュリティを備え、柔軟なライセンスを実現しようと開発されたのが「Tauri」です。 Tauriは、
WebAssembly製のx86仮想マシン「WebVM」が登場、Webブラウザ上でLinuxや各種コマンド、アプリがそのまま実行可能 Leaning Technologiesは、Webブラウザ上でx86バイナリをそのまま実行できるWebAsesmbly製の仮想マシン「WebVM」を発表しました（同社による紹介記事「WebVM: server-less x86 virtual machines in the browser」）。 Google ChromeやMicrosoft Edge、Firefox、Safariなどのモダンブラウザであれば、上記のURLにアクセスすることで誰でもWebブラウザ上にx86仮想マシンを走らせることが出来ます。 WebVMではx86仮想マシンの上でLinux OSのDebianがバイナリが変更なしにそのまま稼働し、さまざまなコマンドも実行可能。 Linuxアプリ
Treeherderは、Mozillaの開発するソフトウェアのテスト結果や、ウェブサービスや外部ツールで取り込んだデータを抽出・加工するETL機能などを有するウェブサイトです。このTreeherderに、Google ChromeとFirefoxのベンチマークテスト結果をまとめたデータが公開されました。これによると、FirefoxはChromeよりも高いスコアを出している、つまりは高速なブラウジングが可能なブラウザということのようです。 Perfherder https://treeherder.mozilla.org/perfherder/graphs?timerange=31536000&series=mozilla-central,3735773,1,13&series=mozilla-central,3412459,1,13 Firefox has surpassed Chrome
このスライドはSlidevで作られており、以下のレポジトリで公開しています https://github.com/riya-amemiya/amemiya_riya_slide_data/tree/main/frontend_conf_tokyo_2025
Electron代替を目指す「Tauri 2.0」正式版に到達。デスクトップアプリとモバイルアプリ開発の両方に対応 Electronの代替を目指すRust製の軽量なアプリケーションフレームワーク「Tauri」の開発チームは、「Tauri 2.0」正式版の公開を発表しました。 Tauri 2.0 Stable. Out now. Read more:https://t.co/wbxWxFpUCj — Tauri (@TauriApps) October 2, 2024 Web技術を用いてアプリケーションを開発できるフレームワークとしては、Elecronが代表的な存在です。 ElectronはChromiumとNode.jsを用いている一方、Tauriは実行環境のOSが備えるWebViewを用い、Rustでバックエンドを記述することで、ChromiumもNode.jsも組み込むことなく軽量なフ
Google広告費の影響を受けない新たなWebブラウザが必要だと、スクラッチからWebブラウザを開発する「Ladybird Browser Initiative」、元GitHub創業者らが立ち上げ スクラッチから新たにWebブラウザの開発をオープンソースとして行う非営利団体「Ladybird Browser Initiative」の設立が発表されました。 Ladybird Browser Initiativeは、Webブラウザ「Ladybird」およびそのためのレンダリングエンジン「LibWeb」、JavaScriptエンジン「LibJS」などの開発を行います。 Web開発の資金源が広告であるべきではない Ladybird Browser Initiativeを設立したのは、元GitHub創業者兼CEOのChris Wanstrath氏と、NokiaおよびAppleでWebKit開発チーム
Intro Chromium にコントリビュートするためには、ソースコードを理解する以外にも、もろもろ必要な周辺知識がある。 ドキュメントはかなり整備されている方ではあるが、そのドキュメントにたどり着くのが難しい場合もある。 レビュアーなどが親切に教えてくれるものをローカルにメモしているが、それも散らばってきたため、ここにまとめることにする。 まずは初期状態で公開するが、どんどん更新していき、長くなっても分割しないで追記を繰り返そうと考えている。 関連サイト 初めて取り組もうとすると、まずどこを見ればいいかわからないところから始まる。 似たようないくつかのサイトがあり、使い分けがされているからだ。 code search https://source.chromium.org/chromium/chromium/src コードをインタラクティブに検索するためのサイト Workspace 風
ソフトウェアエンジニア 石井 宏治（いしい・こうじ） 1965年生まれ。「Word」の日本語組版プログラムマネージャーや楽天Koboでの電子書籍リーダー開発を経て、Googleに参画。Chromiumのレンダリングエンジンの開発を行う。W3Cでは、縦書きの「CSS Writing Modes」、文字処理系の仕様に関する「CSS Text」、文字装飾の「CSS Text Decoration」などのエディタ（仕様の責任者）を、Unicodeでは、縦書きについて定めた「UAX#50」のエディタを務める。Chromiumへのコントリビューション数は、GitHubのランキングを見る限り世界12位。 GitHub:kojiishi 一体、誰がどんな思いで私たちにとっての「当たり前」を築いたのか？ 現在、私たちがWebブラウザ上で当たり前のように読んでいる日本語の「縦書き」や、美しい「ルビ」、禁則処理
米Googleは3月29日（現地時間）、Webブラウザ安定版のアップデートとなる「Chrome 100」（バージョン100.0.4896.60）をWindows、Mac、Linux向けに公開したと発表した。数日かけてロールアウトしていく。 2008年9月1日に最初のβ版をリリースしてから約13年でバージョン100を迎えた。 一般ユーザー向けの新機能としては、ロゴのデザイン変更、Webアプリでのマルチディスプレイ対応、［設定］→「プライバシーとセキュリティ」の「安全確認」の改善などが追加された。
Today we’re happy to announce Chrome for Testing, a new Chrome flavor that specifically targets web app testing and automation use cases. This article explains why the Chrome team felt this was needed, and walks through concrete examples where Chrome for Testing might benefit you as a developer. Background Browser testing is a vital component of creating a high-quality web experience, regardless o
Meet Dia, the next evolution of ArcWeekly security updates, SOC 2 certification, and the Arc DNA you know (and love). Try Dia Arc is the Chrome replacement I've been waiting for.Arc is the Chrome replacement I've been waiting for. FYI: Arc receives Chromium updates only. For active security patches and enterprise-grade protection, download Dia instead.
As you can see from the table above, it is easy to be confused about which products will support which Debian/Raspbian ports. Using arm6hf (Raspbian’s derivative of armhf with ARMv7-only instructions removed but floating-point instructions retained) provides us with an operating system which will run on every device we have ever manufactured, all the way back to 2011. But we’ve come to realise tha
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
Googleによって開発とメンテナンスが行われているウェブブラウザのオープンソースプロジェクト「Chromium」を用いることで、Microsoft EdgeやOperaなど、さまざまなウェブブラウザを作り出すことができます。エンジニアのアレクサンダー・フリック氏は、Chromiumを基に、Googleのウェブブラウザ「Chrome」よりも高速なウェブブラウザである「Thorium」を開発しています。 Outline of benefits of Thorium over vanilla Chromium. https://alex313031.blogspot.com/2022/01/outline-of-benefits-of-thorium-over.html Thorium Browser https://thorium.rocks/ ウェブブラウザのThoriumは原子番号90の
Intro Chrome 126 で筆者が実装した URL.parse が Ship された。 Chromium にコントリビュートしたことは何回かあったが、単体機能を Ship したのは初めてだった。 invalid URL の処理 new URL() によって、文字列の URL をパースすることができるようになって久しいが、この API は invalid な場合に例外を投げる。 例外処理をするよりも、先に URL としてパース可能かどうかを知るための URL.canParse() が提案され、先に実装が進んだ。 URL.canParse(str) // boolean しかし、これでは二回パースが必要になるため無駄が多い。 if (URL.canParse(str)) { // 1 回目のパース return new URL(str) // 2 回目のパース } そこで、失敗したら
はじめに 画像圧縮アプリ、みんな困ってません？ 個人開発やWebサービスを運営していると、画像の圧縮は避けて通れません。ブログに載せる写真、OGP画像、アプリのアセット...。でも、まともな圧縮アプリって意外とないんですよね。 TinyPNG → Webアップロードが面倒、枚数制限あり ImageOptim (Mac) → 古い、Windows版なし Squoosh → ブラウザ限定、バッチ処理できない Windowsユーザーはもっと悲惨で、まともなGUIアプリがほぼ存在しません。 そもそも、既存の圧縮アプリはアルゴリズムが古い。 「もっと視覚的な品質を保ちつつ、圧縮率を上げられるはずだ」と思って論文を漁ったら、やっぱりありました。それを使うにはRustとの相性が良く、デスクトップアプリとして実装する必要がありました。 また個人的には圧縮だけでなく、クロップとかの機能もついたAll in
JavaScript Registry(JSR)やDenoの開発者であるLuca Casonato氏が、Google純正のウェブブラウザであるGoogle ChromeにはGoogle関連のウェブサイトしかアクセスできないAPIがプリインストールされていると指摘しています。 Casonato氏によると、Google ChromeはすべてのGoogle関連サイトにシステムおよびタブ上でのCPU使用率・GPU使用率・メモリ使用率といった情報への完全なアクセス権限を付与しています。他にも、より詳細なプロセッサ情報へのアクセス権限や、ログを記録するバックチャンネルへのアクセス権限も付与しているそうです。これらを実現するAPIは、他のウェブサイト向けには公開されておらず、Googleが自社サイトでのみ利用しているものであると、Casonato氏は指摘しています。 So, Google Chrome
macOS 12 Montereyがリリースされました。また2021年09月にはiOS 15もリリースされています。 2020年にリリースされたiOS 14 / macOS 11ではWebPのサポートを開始し、macOS 12ではOpusのサポートを開始しました。 また最近ではGoogle Chrome、FirefoxがAVIFのサポートを開始するなど、新たなメディアフォーマットも登場しています。 そこで2021年現在、Webにおける最適なメディアフォーマットを整理しようと思います。 TL; DR 画像: WebP もしくは SVG 音声: AAC - .mp4 動画: H.264 - AAC - .mp4 もしくは VP9 - AAC - .mp4 最適とは なるべく多くのデバイスとOSとブラウザでデフォルトで使える macOS: Chrome、Firefox、Safari、Edge (
オープンソースのコミュニティに関わる人々から、なぜ Vivaldi ブラウザは完全なオープンソースではないのかと、よく訊かれます。このブログ記事で Vivaldi の立場を詳しくご説明したいと思います。 見方によっては、Vivaldi ブラウザのソースコードをオープンソースライセンスの下でリリースするのは、とても簡単なことのように思えるかもしれません。 Vivaldi は無料で提供されており、検索やパートナーとの提携で収益を得ています。そう考えると、Vivaldi の開発に役立つ可能性があるのに、なぜソースコードにアクセスできるようにしないのか？という疑問がわきますよね。 Vivaldi としては、そのような観点があることも理解していますし、Vivaldi 社内でもオープンソースやオープンソースのソフトウェアの使用を支持する人が多くいるのは事実です。この点は社内でもよく議論されています。
Privacy-first browser without distractions Helium blocks ads and trackers, puts you in control, and has a clean, minimal interface. By default. Download Helium Built around privacy and consent Helium blocks ads, trackers, cookie banners, third-party cookies, and tampers with fingerprinting. By default. No data collection, no browser ads, and no background requests without consent. No need to "opt
We’re excited to announce Vercel OG Image Generation – a new library for generating dynamic social card images. This approach is 5x faster than existing solutions by using Vercel Edge Functions, WebAssembly, and a brand new core library for converting HTML/CSS into SVGs. Try it out in seconds. Link to headingDynamic with limitsThe engagement rate of Tweets that embed a card is 40% higher. While cr
savanna.ioの開発をお手伝いしている masa-iwasaki です。現在進行中の案件で調査が甘いところもあるのですが、表題の件について同じく行き詰まってる or 今後行き詰まる人が居るかもしれないので自分が試行錯誤した結果を共有します。ちなみにsavanna公式ブログでは初の開発エントリのようです。 tl;dr Docker Desktop for Apple silicon では linux/amd64 なDockerイメージではGoogle Chromeが動かない QEMUのバイナリエミュレーションが完璧では無くcore dumpする arm64 Linux向けのGoogle Chromeは存在しない Chromiumを使いたいのだが 最新バージョンのChromiumを使おうとするといろいろある 回避策・解決策の検討 背景 savannaではRailsを利用して作られていて、
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに 社員の皆さんはこんな奴が最近エンジニアになって頑張ってるんだなと暖かい目で読んでいただければと思います。 社外の方やエンジニアを目指している方は少しでも学習の参考や、コネクター・ジャパンに興味を持っていただければと思います。 自己紹介 建築の営業→未経験から独学でプログラミング学習し5ヶ月でLaravelでポートフォリオを作成しました。そして現在は自社開発企業に入社し、WEBエンジニアとしてプロダクト開発に携わっています。 概要 あなたは普段どんなブラウザを利用していますか？ ほとんどの方がGoogleChromeで、Fire
自社Webサービス上にボタンを配置して、PDFをダウンロードできるようにしたいという要望がありました。しかも 表などのリッチな表現を活用したい 動的に表示する内容が変化し、内容に応じてページ送りをしたい これらは自社Webサービス上のページとしても表示している（しかも認証が必要なページ） という条件でした。react-pdf や html-pdf を使えばできなくはなさそうですが、できるだけスタイルを楽に・デバッグをかんたんに行ないたかったので、別の方法を考えました。 そう、みんな大好きヘッドレスブラウザを活用した方法です。この手の課題のときにはよく手段として上がりますよね。@media print などを使って印刷用に表示する内容の調整もできるし、サービス上のコンポーネントを使ってスタイルできるので非常にかんたんにPDFのコンテンツのスタイルが行なえます。 ただ、問題は認証です。Webサ
電子情報学特論： Chromium のアーキテクチャを解き明かす 〜 EEIC の授業が生きるプロダクトの世界〜 Kentaro Hara 2022 April (๑>ᴗ<๑) * * * *
Chromium fork for Linux, Windows, MacOS, Android, and Raspberry Pi named after radioactive element No. 90. Highlights Compiler optimizations include SSE4.2, AVX, AES, and modifications to CFLAGS, LDFLAGS, thinLTO flags, import_instr_limit flags, and PGO, as well as other compiler flags. LLVM LOOP optimizations as -mllvm flags Learn more about these compiler optimizations and how they work Here. UI
Chromeブラウザ、バージョン100のリリースが新たな2000年問題の引き金に？ 2021 12/24 Chromeブラウザは世界中で最も多く使われているWebブラウザであり、積極的なバージョンアップがおこなわれています。 現在のバージョンは96であり、もうじきバージョン100がリリースされるとみられますが、このリリースが新たな2000年問題の引き金になる可能性があるとのことです。 2桁のバージョンしか読み取れないサイトが多数存在 この問題は、Chromeブラウザがバージョン100で革命的な新機能を搭載することが原因ではありません。 Webサイトの中に、アクセスしているWebブラウザのバージョンを2桁しか読み取れないものが多数存在していることが問題とされています。 Webサイトは一般的に、アクセス時にブラウザのユーザーエージェント文字列を読み取り、使用しているWebブラウザの種類やバージ
前提知識 これから書くことがナンノコッチャわかる自信がない方は、Ubuntu Weeky Recipe 第717回を読んでください。 2年以上前の記事ですが、現状もあまり違いはありません。snap版Firefoxは現在はネイティブWaylandで動作するようにはなりました。すばらしいですね。 概要 前提知識にもあるように、ChromiumはデフォルトでXwaylandで動作します。この状態でスケールをいじると文字がぼやけます。これはどちらかといえばXwayland側の制限です。 ChromiumのツールキットであるところのOzoneはWaylandにも対応していますが、そうすると今度は日本語入力に問題が発生します。ただしこれはGNOME（正確にはウィンドウマネージャーのMutter）マターの話で、KDE Plasmaでは特に問題ありません。これは単純にGNOMEではtext-input-v
TL;DR コードエディタZedは、Electronの限界を克服。RustとGPU描画で高速化、AI機能も搭載。1.0リリースは完成ではなく、技術的賭けの成功を示す。 コードエディタは「テキストを速く表示するだけのツール」のはずだった。それがいつの間にかブラウザエンジンを丸ごと内包し、画面を描くたびにDOMと格闘し、スクロールのたびにCPUが唸るような代物になった。VS Codeを使う開発者の多くが「重さ」を許容コストとして払い続けてきたのは、拡張機能と生態系の引力が大きすぎたからだ。その現状に、かつてAtomとElectronを生み出した当事者たちが正面から挑んだ。2026年4月29日のZed 1.0リリースが意味するのは、「完成」ではなく、5年間の技術的賭けが「通用する」と証明されたということだ。 01.Atomの反省から始まった5年：GPUとRustを選んだ理由02.1.0が意味する
はじめに こんにちは、Repro Booster のプロダクトマネージャーの Edward Fox（@edwardkenfox）です。 HTTP 304 Not Modified というステータスコードをご存知でしょうか。ブラウザがキャッシュ済みのリソースを再検証する際、サーバーが「変更されていないのでキャッシュを使ってください」と応答するためのステータスコードです。レスポンスボディが省略されるため転送量が削減され、結果としてページの読み込みが速くなる、というのが一般的な説明かと思います。 304 レスポンスには転送量の削減以上のメリットがあります。それは Chrome （Chromium）の JavaScript エンジンである V8 のコードキャッシュが再利用される、という点です。これにより JavaScript のコンパイル処理がスキップされ、スクリプトの実行開始が早まります。 少し
前回のechoサンプルを少し改良しました。 前回はechoサンプルを動くようにしましたが、 今回はHTML側に切断処理を入れ、WebTransportのセッションが閉じられた時にQUICのイベントログを出力するようにしました。 今回はそのログも合わせてプロトコルを理解していきます。 ソースコードはこちら WebTransport? HTTP/3?? QUIC??? 何それおいしいの? WebTransportに何となくワクワクと闇の気配を感じている皆様こんにちは。 今回は前回のechoサンプルとドラフトを睨めっこしながらプロトコルについて理解していきたいと思います。 ここではChrome M97に実装されている WebTransport over HTTP/3について調べていきます。 どうしてWebTransportが必要なの? ブラウザで双方向通信がしたい けどWebSocketはTCP
Forking Chrome to turn HTML into SVG November 11, 2022 I've been working on a program called html2svg, it converts web pages to SVG. It's based on a fork of Chromium to support modern web standards. This post explains most patches. Take a picture SkiaBlinkPDF<div style="width: 50px; height: 50px; background: red" />canvas->drawRect(0, 0, 50, 50, SkPaint { .fill = SkColor::Red })(GPU)GaneshRaster(C
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
