Cache Storage がめちゃくちゃ肥大化する問題について調べる | ぴんくいろにっき
Cache Storageがめちゃくちゃ肥大化する問題 TBSのニュースサイト、TBS NEWS DIGがめちゃくちゃブラウザのストレージを消費しているという話がはてブや増田で話題になっています。 TBSのニュースサイトヤバない？ – はてな匿名ダイアリー 同・はてなブックマーク 確かに、手元でも同様の状況を観測できる。 当該サイトのストレージ使用状況 はたして、これは真実なのだろうか。本当に1.4GBも食うことがあるのだろうか…… そんなわけない、ということで調査 まずは再現性を確認するためにChromeのゲストモードで当該のサイトのDevtoolを開いてましょう。すると、StorageのUsageは386MBになっていました。（適当なページを開き、リロードした時点で340MB程度であった） 当該サイトのストレージ割合 上記のスクリーンショットをよく見ていただけるとわかると思いますが、こ
【Selenium】Chromeの拡張機能を起動する方法(Python) - ゆうきのせかい
Python × Selenium × ChromeDriverでGoogle Chromeを起動すると、通常だと拡張機能はまっさらな状態で起動してしまいます。 でも、↓こんなふうに「拡張機能も同時に起動したい」ということがあったので、方法をメモしておきます。 ChromeDriverに"拡張機能実行オプション"を与えることで、実現できました。 【Selenium】ChromeDriverを拡張機能あり状態で起動する起動する拡張機能のIDを調べる拡張機能が保存されているフォルダーパスを調べる"拡張機能起動オプション"を与えてコード実行この3ステップです。順番に説明していきます。 1. 起動する拡張機能のIDを調べるまず、chrome拡張機能のIDを確認しましょう。 chromeを開き、右上三点マーク > その他のツール > 拡張機能 をクリック。 拡張機能ページが開くので、右上の「デベロッ
The Fixed Background Attachment Hack | CSS-Tricks
What options do you have if you want the body background in a fixed position where it stays put on scroll? background-attachment: fixed in CSS, at best, does not work well in mobile browsers, and at worst is not even supported by the most widely used mobile browsers. You can ditch this idea completely and let the background scroll on small screens using media queries. Or get around it with a small
Chrome Github Points - GitHubのIssueでストーリーポイントを管理
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 開発すると必ず工数がかかります。そのため、やらなければならない数あるタスクの中からなるべく小さなコストで大きな成果を達成できるものを選択する必要があります。その際に使われるのがストーリーポイントです。 ストーリーポイントを使うことで各タスクの相対的な大きさが可視化されます。そしてGitHub Issueとストーリーポイントを連携させる機能拡張がChrome Github Pointsです。 Chrome Github Pointsの使い方 各Issueに対してポイントを指定できます。 一覧ではIssue、Pull Requestそして合計でのポイントを確認できます。 プロジェクト機能でも同様にポイントが確認できます。 オプションです。 Chrome Github Pointsを使う
Chromeに実装される新機能『loading属性』について解説、ついにブラウザがネイティブで遅延ロードをサポート
Google ChromeのEngineering ManagerであるAddy Osmani氏による、Chrome 75でリリース予定のloading属性についての解説を紹介します。 loading属性とはブラウザがネイティブで遅延ロードをサポートするもので、img要素やiframe要素を簡単に遅延ロードさせることができます。以前は、lazyload属性として開発されていましたが、loading属性という名前に変わる、とのことです。 Native image lazy-loading for the web! by Addy Osmani 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 Chrome 75でリリース予定のloading属性 ブラウザがネイティブで遅延ロードをサポート loading属性とは loading属性の
新しいユーザエージェント表現 User Agent Client Hints の提案仕様 - ASnoKaze blog
20200116追記 chrome://flags/ より、「Experimental Web Platform features」を有効にすることで使用できます 20191210追記 モバイルブラウザを示すブーリアン値をもつSec-CH-UA-Mobileヘッダが仕様に追加されました。 ユーザエージェントは歴史的背景により、複雑な文字列が使用されています。 iOSでは User-Agent: Mozilla/5.0 (iPhone; CPU iPhone OS 12_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) CriOS/69.0.3497.105 Mobile/15E148 Safari/605.1Edgeでは User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64
合字とCSS | 株式会社 エヴォワークス -EVOWORX-
先日、某案件で題字にletter-spacing:0.2emを指定したところ、 ChromeとSafariで表示が違っていました。 cssは以下の通りです。 font-family: "Noto Sans Japanese"; // https://fonts.googleapis.com/earlyaccess/notosansjapanese.css letter-spacing: 0.2em; Chrome Safari SafariでProfileの「f」と「i」の表示が近い。 このような「ft」「fi」「fl」など、くっついた文字を「合字」と言います。 恥ずかしながら、知りませんでした。 合字については、書体デザイナーの小林章氏のブログが詳しく、面白かったです。 デザインの現場 タイプディレクターの眼 合字（１） デザインの現場 タイプディレクターの眼 合字（２） デザインの現場
ブラウザの廃止される機能を使っていることを検知する Deprecation Reports (+ Intervention reports ) - ASnoKaze blog
20180713追記 Intervention reports について追記しました ブラウザのバージョンアップは定期的に行われており、その度に廃止される機能もあります。 廃止されることは公式にアナウンスされますが、そもそも自分が使っているかどうかすべてを把握することは難しいでしょう。JavaScriptのAPIであったり、HTTPヘッダだったりとその範囲は非常に広く、ライブラリの特定のバージョン以下だと問題になるといったケースも有るかと思います。 このような場合に役に立つ、廃止される機能が使用されていることをWebデベロッパー側で検知する仕組みが「Deprecation Reports」です。 Blink開発者メーリングリストでも議論されていますが、すでにChrome Canaryで動作するので、簡単に動作確認してみます。 Reporting API 表示してるページのエラーなどを指定し
Chromeデベロッパーツールの機能が、すごく簡単で便利！ローカルサーバーを1分もかからずにすぐ構築できる
Chromeデベロッパーツールはいろいろ便利ですが、お手軽にローカルサーバーも構築することもできるんですね。簡易的なサーバーですが、HTML, CSS, JavaScriptのWebページであれば充分な機能を備えています。 Chromeデベロッパーツールを使用して、ローカルのWebサーバーを構築する方法を紹介します。もちろん、WindowsでもmacOSでもどちらでも簡単にできます。 1分もかからずに用意することができ、切り替えは1クリックでOKです。 What's New In DevTools (Chrome 65) デベロッパーツールのバージョン Step 1: ファイルを用意 Step 2: デベロッパーツールの設定 Step 3: ローカルのWebサーバーにアクセス デベロッパーツールのバージョン ローカルのWebサーバーを構築するには、デベロッパーツールの「Local Over
DevToolsでz-index一覧できるやつ作ったよ。 | Ginpen.com
Chrome用とFirefox用です。 GitHubでソースコード公開してます。 ginpei/devtools-z-index 見た目 Chrome版。 Firefox版はサブペインじゃなくてパネルとして追加するのでちょっとアレです。仕方なかった。 はじまり コードスニペット版。これはこれで手軽でよろしいね。 ページ中の要素を `z-index` の数字が大きい順に一覧表示するやつです。https://t.co/gNGkdP03ta pic.twitter.com/v0VRNKCKel — 高梨ギンペイ (@ginpei_jp) June 11, 2018 Chrome版について https://chrome.google.com/webstore/detail/bcnpmhefiohkpmjacfoanhbjhikegmoe/ Elementsパネル内に “z-index” ペインを追
【VR】Oculus GoをPCへミラーリングさせる(無線) - helloworlds
先日Oculus Goが家に届きました！ 私が購入したのは、これ。 www.oculus.com 64GBの方を選びました。 俗に言うスタンドアローン型というVR機器になるようです。 カートに入れて、購入完了して数時間で発送しますね！というメールがきました。 大体到着まで5日間ほどで手元に届きました。 「けっこうはやいな！」 中身を見てみるとけっこうシンプルにまとまっていました。 メガネを日頃かけている方でも安心。 メガネをかけている人用のアクセサリーみたいなのも付いていて、 スマホのアプリからOculusの設定をする時に、装着ムービーも丁寧に紹介されていました。 (※ わかりやすいように、画像を載せようかと思っていたのですが、この記事では割愛します。が、その分丁寧に書いてくつもりです！ また、後日画像を掲載させていくかもしれません。合わせて詳細も追記していければと思います。) ここから、
Puppeteer (Chrome の自動操作ライブラリ) を Python に移植してpyppeteerという名前で公開しました - Blank File
Puppeteer というJavaScriptでchromeを自動操作するライブラリが最近話題になっていました。 私もPythonでSeleniumの代わりに使えるものがほしかったので、puppeteerをPythonに移植し、pyppeteerという名前で公開しました。 Puppeteerについては下記Qiitaの投稿が参考になるかと思います。 –headless時代の本命？ Chrome を Node.jsから操作するライブラリ puppeteer について - Qiita 使用上の注意 まだ作ったばかり＆テスト不十分なのでバグがあると思います。 なので試す時は「うまく動いたらラッキー」くらいの人柱精神でお願いします。 特にwindowsでは全くテストしていないので動かないかもしれません。 一応自分でwdomのテストに使ってみましたが、Webページのテストに使う分には意外と大丈夫です。
Welcome Insight.io to the Elastic Team
Search and analytics, data ingestion, and visualization – all at your fingertips.
Learn How To Debug JavaScript with Chrome DevTools
As a new developer, finding and fixing bugs can be difficult. You may be tempted to randomly use console.log() in an attempt to get your code working correctly. Not Anymore! This article is all about debugging the correct way! You’ll learn how to use the Chrome Developer Tools to set up breakpoints and step through your code. This workflow is often a much more efficient way to find and fix bugs in
Chrome 61 Beta: JavaScript modules, Payment Request API on desktop, Web Share API, and WebUSB
$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
[ツール] Postmanを利用したAPIの試験 [機能の紹介] | DevelopersIO
こんにちは。こむろ＠北の大地です。関東の方はそこそこ暑く梅雨にも突入したと聞きますので、しばし札幌の爽やかな写真をお楽しみください。 上から、北大、限定のサッポロクラシック、夜の赤れんが庁舎、おまけのリゾッテリア ガクの美味しいトマトリゾット（チーズ焼きをプラス） はじめに 皆さんはAPIの試験をどのように行ってるでしょうか？ Webサービス？単体のアプリを使って？それともスクリプトを自前で書いて？ 今回関わっている案件で Posmtan を利用して、APIの疎通確認や負荷テストを実行しました。なかなか良く出来たサービスだったたので、どのような機能を持っているか、どのように利用できるかを軽くご紹介します。 Postman Postmanは、Web APIのテストクライアントサービスのひとつです。色々なクライアントの動きをテストできるようスクリプト拡張や、テストスイートシナリオの作成などの機
![[ツール] Postmanを利用したAPIの試験 [機能の紹介] | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/860b85d0e0ad6310c39c48f54a6cd830fea12687/height=288;version=1;width=512/https%3A%2F%2Fdevio2023-media.developers.io%2Fwp-content%2Fuploads%2F2016%2F06%2Flogo-postman-512-551cff77v1_site_icon.png){kind=icon}
Automated testing with Headless Chrome | Blog | Chrome for Developers
If you want to run automated tests using Headless Chrome, look no further! This article will get you all set up using Karma as a runner and Mocha+Chai for authoring tests. What are these things? Karma, Mocha, Chai, Headless Chrome, oh my! Karma is a testing harness that works with any of the most popular testing frameworks (Jasmine, Mocha, QUnit). Chai is an assertion library that works with Node
Getting Started with Headless Chrome | Blog | Chrome for Developers
TL;DR Headless Chrome is shipping in Chrome 59. It's a way to run the Chrome browser in a headless environment. Essentially, running Chrome without chrome! It brings all modern web platform features provided by Chromium and the Blink rendering engine to the command line. Why is that useful? A headless browser is a great tool for automated testing and server environments where you don't need a visi
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
画像の最適化 | Web | Google Developers
Webページで使用されているスクリプト・プラグイン・テクノロジーが何なのかがすぐに分かるChromeの機能拡張 -WhatRuns
