Cookie Store API による document.cookie の改善 | blog.jxck.io
Intro JS から Cookie を操作する document.cookie の改善を目的とした Cookie Store API についてまとめる。 document.cookie document.cookie は、ブラウザの API における代表的な技術的負債の一つと言える。 HTML Standard https://html.spec.whatwg.org/multipage/dom.html#dom-document-cookie 基本的な使い方は以下だ。 document.cookie = "a=b" console.log(document.cookie) // a=b まず、この API の問題を振り返る。 同期 API 最も深刻なのは、 I/O を伴いながら、同期 API として定義されているところだ。 この API は古くから実装されているため、I/O は非同期
Cache Storage がめちゃくちゃ肥大化する問題について調べる | ぴんくいろにっき
Cache Storageがめちゃくちゃ肥大化する問題 TBSのニュースサイト、TBS NEWS DIGがめちゃくちゃブラウザのストレージを消費しているという話がはてブや増田で話題になっています。 TBSのニュースサイトヤバない？ – はてな匿名ダイアリー 同・はてなブックマーク 確かに、手元でも同様の状況を観測できる。 当該サイトのストレージ使用状況 はたして、これは真実なのだろうか。本当に1.4GBも食うことがあるのだろうか…… そんなわけない、ということで調査 まずは再現性を確認するためにChromeのゲストモードで当該のサイトのDevtoolを開いてましょう。すると、StorageのUsageは386MBになっていました。（適当なページを開き、リロードした時点で340MB程度であった） 当該サイトのストレージ割合 上記のスクリーンショットをよく見ていただけるとわかると思いますが、こ
XMLHttpRequest とはなんだったのか | blog.jxck.io
Intro Fetch API の実装が広まり、 IE もリタイアを迎えたことで、今後忘れ去られていくことになるだろう XMLHttpRequest について。 どのように始まり、どのように広まり、どのように使われなくなっていくのか。その間に残した多大な功績を残す。 XMLHttpRequest の始まり この名前は非常に長いため、通常 XHR と略される。 この API は、現在の Web API のように W3C/WHATWG による標準化を経て策定された API ではない。 Microsoft によるいわゆる独自実装の API として始まり、後追いで標準化される。 したがって、 Web API の中でもかなり異質な命名である XHR が、 XmlHttpRequest でも XMLHTTPRequest でもなく XMLHttpRequest である理由も、 Microsoft の命
Denoよどこへ行く - keroxpのScrapbox
最近めっきりDenoに触ってない。一言で言うと飽きてしまった。 とはいえどうなってるかくらいの情報は追っているのだが、どうも使いたいと言う気分にならない。 今自分はDenoコントリビューターではないのでいち開発者としての外から見たDenoの現状を語ってみる 最近のDenoはWeb標準に追従している 具体的には、fetch APIの実装に始まり、ブラウザに実装されているAPIの実装を頑張っている windowオブジェクトもあるし、webcryptoやWebGPUのような、ブラウザでも誰も使ったことのないようなAPIまで実装している 自分はどうもこの流れに乗れなかった この方針は現在のDenoコアチームの強い姿勢であり、最近JavaScriptの標準化団体であるTC39に参加したという だがDenoがサーバーサイドの言語である以上、ブラウザに存在する様々なブラウザ的問題を解決するための仕組みや
Navigation API による「JS での画面遷移」と SPA の改善 | blog.jxck.io
Intro 従来の History API を改善する Navigation API の仕様策定と実装が進んでいる。 これは、 History API の使いにくかった部分を補うだけではなく、「JS で画面遷移をする」という現状のミッシングピースに取り組み、 SPA が抱える多くの問題だけでなく MPA すら改善する可能性がある。 この API の目的と仕様を解説しつつ、実装のメモを残す。 画面遷移と SPA の軌跡 Web は HTML の取得と描画を繰り返す、画面遷移(Navigation)を前提としたアーキテクチャ(のちに SPA からの逆算で MPA と呼ばれる)が基本であり、ブラウザなどの実装もそれに最適化されている。 一方「アプリケーション」の設計手法をそのまま Web に持ち込んだ SPA は、この Navigation によってもたらされる UX の低下を防ぐ部分がある一方
BB2Cが5ch仕様変更で書き込み不可になるが制作者は更新しない意向。広告を増やすよう5ch側に要求され萎えた模様「5chは人生の無駄」
BB2C @BB2C さらにもっとガッツリ嫌な感じで広告を入れないといけないかも知れないのだけれど、そうして自分用には広告入れないバージョンをビルドして使えるわけだけど、そうして(続く) 2021-09-13 05:48:38 BB2C @BB2C (続き。また酔ってます) それでも広告が目障りで利用者が減ってくれればそれはそれで良いことだと思うのだけれども、おそらく多くの人は広告をスルーして通信会社や広告会社が儲かるだけという確実な推定。 2021-09-13 05:53:43
はてなスターをリニューアルしました - はてなスター日記
インターネットをいっそう楽しくする「はてなスター」を本日、リニューアルしました。 はてなスターは、ブログにかんたんに★がつけられるサービスとして2007年のリリース以来、便利に楽しくご利用いただいておりますが、長らくインターフェース部分には大きな変化なく提供してまいりました。 今回、スマートフォンでの利便性や、モダンブラウザへの対応、また安全性向上のため、主にデザインとインターフェースについてアップデートをおこないました。 どうぞご利用ください。 ここが変わった、はてなスター はてなスターのつけ方 カラースターのつけ方 スターの一覧 スターの消し方 モバイルデバイスでの利用法 よりくわしくは 背景とお願い リニューアル記念Tシャツ販売 【追記】キャンペーン開始しました ここが変わった、はてなスター 多様なサイトに設置されるはてなスターボタン、いろんな状況にしっくり馴染むようデザインを現代的
Node.js や deno に Web Standard な API をなんでも取り入れるのが良いことなのかについて - from scratch
この記事は Node.js Advent Calendar の 11 日目の記事です。 qiita.com Web API と Node.js ES2015 以前の Node.js は Web Standard な API の中で足りないものを自分で補う形で進化を続けてきた。 Callback や Event 主体での非同期処理や Common JS な形でロードできる独自のモジュールの仕組みがその筆頭だと思う。ただ逆に Web Standard な API が流行ると今度はそれに追従していかないといけなくなってきた。 ES2015 以後に流行ったものといえば、 Promise 主体での非同期処理であり、 async-await での処理だと思う。また、 ES Modules の台頭もあり、今日では Node.js でも普通に呼び出すことが可能になった。 今ではどちらも Node.js で
OSのIME関連APIとWebブラウザは相性が悪い
Life with Web Browser Engine (Gecko, WebKit and etc), Mobile and etc. 今どきのWebブラウザは複数のプロセスで動くことが前提になっている。Chromeで言えば、メイン(UI)プロセスとレンダラープロセス。Firefox用語であればChromeプロセスとコンテンツプロセスという感じで別れて動作している。Webコンテンツはコンテンツ用のプロセスで表示され、文字入力はUI用プロセスで動作している。だから入力された文字はコンテンツ用のプロセスへプロセス間通信で送られ、コンテンツ用プロセスで内部的に描画されるいることになる (実際に画面上に描画されるのがGPUプロセスだったりUIプロセスだったりするけど)。 今どきのOSで使われるIMEのためのAPIは入力された文字をただアプリケーションに渡すだけではなく、様々なことを要求してくる
Firefoxは危険なJavaScriptに対応しない - Qiita
Firefox / Safari MozillaはMozilla Specification Positionsというリストを公開しています。 IETFやW3C、TC39などが提唱しているWeb技術に対して、Mozillaはどのように評価しているかという立ち位置を表明したものです。 あくまで現時点での評価であり、もちろん今後の仕様変更などに伴い評価は変わる可能性があります。 Mozilla's Positions Mozillaはどのように評価しているかの分類。 under consideration 評価の検討中。 important 優れた概念であり、Mozillaにとっても重要である。 worth prototyping 優れた概念であるが、プロトタイプを作成し、フィードバックを得て磨きをかける必要がある。 non-harmful 有害ではないが、良いアプローチではなく、取り組む価値
Apple、Google、Microsoft、MozillaがWebブラウザ拡張機能改善グループ結成
Apple、Google、Microsoft、Mozillaは6月4日（米国時間）、W3CでWebブラウザの拡張機能を改善するためのコミュニティグループ「WebExtensions Community Group」（WECG）を立ち上げたと発表した。 Appleは「Safari」、Googleは「Chrome」、Microsoftは「Edge」、Mozillaは「Firefox」というWebブラウザを提供している。WECGは他のWebブラウザメーカーや開発者などにも参加を呼び掛けた。 拡張機能の共通のビジョンに沿って、将来の標準化に向けて取り組むことを目指す。開発者が簡単に共通の拡張機能を作成できるよう、一貫性のあるモデル、機能、API、アクセス許可の共通コアを指定することや、悪用されにくいアーキテクチャの概要を説明していく。 まずは、各Webブラウザの既存のモデルとAPIを基盤とし、仕様
Update on User-Agent String Reduction in Chrome
$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
LunascapeとSleipnirに報告した脆弱性の話(スマホアプリではとにかくHTTPSを使え2021)
2021_browser_mitm_vuln.md LunascapeとSleipnirに報告した脆弱性の話(スマホアプリではとにかくHTTPSを使え2021) 前置き この文章と、それに含まれる考察や各サービスへの脆弱性報告などはmala個人の活動であり、所属している企業とは関係ありません。 執筆時点で未修正の不具合や、過去に修正済みで運営元が開示していない脆弱性情報なども含みますが、公益を意図しています。 概要 2020年の年末に、スマホ向けのLunascapeとSleipnirに対して、以下の問題を脆弱性として報告した。 入力途中も含む検索キーワードが、平文で開発元または検索サービスのサーバーに送られる。 利用者が閲覧しようとしたURLが、平文で開発元または検索サービスのサーバーに送られる経路がある。(閲覧URL全部送られたりするわけではない) 2021年の1月に修正されて、修正内容
JavaScript 長いループ 分割 - hitode909の日記
ブラウザで長いループや、重い処理をともなうループを回したいとき、同期的にJavaScriptを実行するとメインスレッドがブロックしてしまうので、ちょっとずつ細切れに分割して実行したい、ということがある。 昨日久しぶりに書いたら新たなパターンと出会ったので、これまでにどう書いてて今回どうなったかメモ。 setTimeoutする 以前(10年前とか)はこんなのをよく書いていた。 itemsがでかいArrayで、console.logがすごく重い処理だとして読んでください。 function iterateHeavyTask(items) { const startAt = new Date(); while (items.length > 0 && new Date().getTime() - startAt < 10) { console.log(items.shift()); } if (
ITPのCNAMEクッキー規制について｜AD EBiS マーテック研究会
ご無沙汰しております。11月6日に、CNAMEレコードを使って付与された1st-party cookieの規制機能を搭載したiOS14.2がリリースされましたので、その内容をまとめます。いつものことですがマーケティングよりブラウザの細かい話です。正式発表前なので誤りの可能性がありますがご了承またはご指摘ください。 規制の仕組みまず規制されるのは、AppleのWebKitエンジニアJohn Wilanderさん（ITPの発明家）が「Third-party CNAME cloaking」として定義するものです。 Third-party CNAME cloaking means a first-party subdomain resolves to a third-party domain which does not match the resolution for the top frame
JavaScript によるパフォーマンス計測 | murashun.jp
Navigation Timing API を利用することで、ブラウザの各段階の処理時間を計測できます。例えば、ドメインの名前解決、TCP ハンドシェイク、TLS トンネルの確立、HTTP リクエストの送信、HTTP レスポンスの受信、DOM ツリーの構築、スタイル情報の解決などです。 Navigation Timing API では window.performance.timing オブジェクトと window.performance.navigation オブジェクトを利用します。 window.performance.timing オブジェクトからは、各段階の処理時間のタイムスタンプが得られます。これらのプロパティには、アクションが完了したときのミリ秒単位のタイムスタンプが格納されています。 Navigation Timing API のタイムスタンプダイアグラムvar timin
Latest topics > なぜMozillaはXULアドオンを廃止したのか？（翻訳） - outsider reflex
Latest topics > なぜMozillaはXULアドオンを廃止したのか？（翻訳） 宣伝。日経LinuxにてLinuxの基礎？を紹介する漫画「シス管系女子」を連載させていただいています。 以下の特設サイトにて、単行本まんがでわかるLinux シス管系女子の試し読みが可能！ « 「同調圧力は忌むべきものだ」と思考停止していたことに気付いた話 Main 「なぜMozillaはXULアドオンを廃止したのか？」に寄せられていた反応を見て、「甘い……甘すぎる……」と思って、W3C信者時代からの価値観に行き着いた話 » なぜMozillaはXULアドオンを廃止したのか？（翻訳） - Aug 22, 2020 （原著：David Teller, 2020年8月20日、CC BY-NC 4.0で公開されている内容の全訳。Qiitaにもクロスポストしています。） 要約：Firefoxはかつて、XUL
Latest topics > Chrome Extensionsのマニフェストのバージョン3とアメリカの銃規制 - outsider reflex
Latest topics > Chrome Extensionsのマニフェストのバージョン3とアメリカの銃規制 宣伝。日経LinuxにてLinuxの基礎？を紹介する漫画「シス管系女子」を連載させていただいています。 以下の特設サイトにて、単行本まんがでわかるLinux シス管系女子の試し読みが可能！ « ツリー型タブでタブの並び順が壊れる問題との格闘 Main Chrome Extensions Manifest V3とFirefoxアドオンの死（の可能性） » Chrome Extensionsのマニフェストのバージョン3とアメリカの銃規制 - Jan 29, 2019 ちょっと前に話題になったChromeの拡張機能のAPIの新バージョンの案の概要を把握するために、変更点のまとめの部分だけを読んでみた。全訳するのも大変なので、適宜つまみながら。 動機 APIや権限の仕組みに対して大規模
Chrome で保存したパスワードをウェブサイト側から利用する | tech - 氾濫原
Aliexpress を利用しているとサインイン時に自動的にログインする仕組みが導入されていることに気付く。知らない人のために説明すると、以下のような挙動をする。 ログインページにいくと「Google Smart Lock で保存したアカウントを使ってログイン」というブラウザのUIが表示される そのまま「ログイン」ボタンを押すと自動的にサイトにログインしてページ遷移する セッション切れのときに My Orders などにアクセスしようとすると、一度ログインページに遷移した後、自動的にログインして My Orders ページに遷移しなおす (ログイン済みになって見れるようになる) あまり他のサイトだと見ない挙動なので最初は驚いたけど、便利。 仕組み これは Credential Management API という仕組みを使うと実現できる。現状では Chrome しか対応していないようだ。G
進化するWeb ～Progressive Web Appsの実装と応用～(de:code2018より)
2018年5月に開催された日本マイクロソフト主催のイベントde:code 2018で「進化するWeb ～Progressive Web Appsの実装と応用～」というセッションを担当しました。 イベントに参加できなかった方に向けてセッションの内容を記事にまとめましたので、ぜひご覧ください。 進化する Web ～ Progressive Web Apps の実装と応用 ～ from Osamu Monoe この記事では、昨今話題に上ることが多いPWAことProgressive Webアプリケーションについて、実際の作り方を解説しながら、それがいったいどういったものであるかを詳(つまび)らかに紹介することを目的としています。 Webでは、「ネイティブアプリと同じことができる」「ネイティブアプリを置き換える」など、期待に胸を膨らませずにいられない浪漫に満ちた噂がありますが、それが本当かどうか記事
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
