Logpointsを使おう Webフロントエンドの開発をする際、デバッグ目的で「特定の処理が実行された」ということを確認するために console.log() を使うことは多いと思います。しかし、Google Chrome や Microsoft Edge で利用可能な Logpoints を利用することで、 console.log() を使わずともコンソールにメッセージを出力することが可能です。 なぜLogpointsを使うの? Logpoints を使うのには以下のメリットがあります。 デバッグや動作確認のためにコードを変更する必要が無い console.log() を誤ってcommitに含めてしまう心配が無い console.log() を入れた後に再ビルドやホットリロードを待つ必要が無い どうやってLogpointsを使うの? logpoints は以下のように使用します。 Chr
Loading×Sorry to interruptCSS ErrorRefresh
macOS 14.0 SonomaではChromeでiCloud Drive上のフォルダを保存先に指定してファイルをダウンロードすると、ファイルが不可視になる不具合があるので注意してください。詳細は以下から。 Appleは現地時間2023年09月26日にリリースした「macOS 14.0 Sonoma」では、Google DriveやDropbox, OneDriveなどFile Providerフレームワークを利用したクラウドストレージアプリでファイルの同期が止まったり、全ファイルがダウンロード&インデックスの再構築が行われる不具合が確認され、 各サービスとも可能ならばSonomaの最初のアップデート(macOS 14.1)までアップグレードを控えるようユーザーに通知していますが、頂いたコメントによると、macOS 14.0 Sonomaでは、Appleのクラウドストレージサービスである
GoogleのChrome開発チームが2023年9月27日に、セキュリティの脆弱(ぜいじゃく)性に対処するためにデスクトップ版Chromeのアップデートを実施しました。今回のアップデートで修正された脆弱性には、ビデオコーデック「VP8」に関連するゼロデイ脆弱性が含まれており、すでにこの脆弱性が悪用された事例も確認されているとのことです。 Chrome Releases: Stable Channel Update for Desktop https://chromereleases.googleblog.com/2023/09/stable-channel-update-for-desktop_27.html Google fixes fifth actively exploited Chrome zero-day of 2023 https://www.bleepingcomputer.
スクロールをトリガーにしたCSSアニメーションは、どのようにデバッグしていますか? ブラウザの枠内で完結するアニメーションであれば、ブラウザ上ですべての挙動を確認できますが、枠外で開始や終了するアニメーションだと確認できません。 スクロールをトリガーにしたCSSアニメーションを視覚化し、デバッグが簡単にできるデベロッパーツールの機能拡張がリリースされたので、紹介します。 参考: Scroll-Driven Animations Debugger by Bramus! 記事の掲載にあたり、元サイト様にライセンスを得ています。 まずは、さっそく機能拡張のインストールから。 下記のページにChromeでアクセスし、「Chromeに追加」をクリックするだけです。起動方法や使い方は後述します。 Scroll-Driven Animations Debugger -Chrome ウェブストア この機能
先週リリースされたChrome 117でサポートされた、CSSの6つの新しい機能とプロパティを紹介します。 今までのCSSでは不可能だったことやJavaScriptを使用しないとできなかったことが、数行のCSSで実装できるようになります。たとえば、アニメーションで変化する前のスタイルを設定したり、最上位レイヤーとの間で要素をアニメーションさせたり、本文テキストのレイアウトを自動で最適化したりできます。 Chrome 117 beta 下記は各ポイントを意訳したものです。 ※元サイト様のライセンスに基づいて翻訳しています。基づいてというのは、貢献部分に関して同ライセンスも含みます。 はじめに @starting-styleルール overlayプロパティ transition-behaviorプロパティ CSS Gridのsubgrid値 text-wrap: pretty; contain
Webブラウザと拡張機能の組み合わせは便利だが、セキュリティホールを生み出してしまうこともある。Amazon.comやGmailのパスワードを第三者が盗む方法を研究チームが発見した。 Webブラウザと拡張機能を組み合わせることで利便性が増す一方で、セキュリティホールを生む原因にもなり得る。 あまりにも簡単にパスワードが手に入る ウィスコンシン大学マディソン校の研究チームが2023年8月30日に発表した論文によれば、Amazon.comやgmail.comが入力されたパスワードを一時的に保持する方法に欠陥があり、あるWebブラウザの拡張機能を使うと、第三者がパスワードを読み取れる可能性があるという。これは現実的な危険なのだろうか。 結論から言えば現実的な危険だ。理由は2つある。理由の一つはトラフィックの多いWebサイトの一部にセキュリティ設計が甘いものがあること。もう一つの理由は、悪意のある
米Googleは9月7日(現地時間)、Webブラウザの「Chrome」の15周年を記念して、デザインの変更と新機能追加を発表した。 Chromeは2008年9月2日にβ版としてリリースされた。 Material Youデザインに デザイン変更では、2021年のGoogle I/Oで発表のデザイン設計言語「Material You」を採用する。Material YouはこれまでPixel端末などで採用されてきたもの。大きな特徴は、ウィンドウやボタンのカーブや、サービス横断で色調を統一するパーソナライズ機能だ。 Pixel端末で提供しているものに似た、タブとツールバーのための新しいカラーパレットで、例えば仕事用と個人用のChromeを区別しやすくなる。
ITジャーナリスト/Publickeyブロガー。IT系の雑誌編集者、オンラインメディア発行人を経て独立。2009年にPublickeyを開始しました。 GoogleがChromebookで採用しているChromeOSは、LinuxカーネルをベースとしたセキュアなOSにシェルとしてWebブラウザのChromeを組み込むことで、高速に起動し、しかも起動後すぐにWebアプリケーションを利用できることを大きな特徴としています。 Googleは現在、このOSとWebブラウザが一体化していることを特徴とするChromeOSからWebブラウザのChromeを分離する、「LaCrOS」と呼ばれる新アーキテクチャへとChromeOSを進化させようとしています。 新アーキテクチャでは、ChromeはWindows版やMac版などほかのOS対応と同様に、ChromeOS対応のChromeとしてOSから独立したア
Google、ChromeOSからChromeを分離する新アーキテクチャ「LaCrOS」を年内に開始、Chromeは独立したアプリに GoogleがChromebookで採用しているChromeOSは、LinuxカーネルをベースとしたセキュアなOSにシェルとしてWebブラウザのChromeを組み込むことで、高速に起動し、しかも起動後すぐにWebアプリケーションを利用できることを大きな特徴としています。 Googleは現在、このOSとWebブラウザが一体化していることを特長とするChromeOSからWebブラウザのChromeを分離する、「LaCrOS」と呼ばれる新アーキテクチャへとChromeOSを進化させようとしています。 新アーキテクチャでは、ChromeはWindows版やMac版などほかのOS対応と同様に、ChromeOS対応のChromeとしてOSから独立したアプリケーションとな
著書に『宇宙世紀の政治経済学』(宝島社)、『ガンダムと日本人』(文春新書)、『教養としてのゲーム史』(ちくま新書)、『PS3はなぜ失敗したのか』(晋遊舎)、共著に『超クソゲー2』『超アーケード』『超ファミコン』『PCエンジン大全』(以上、太田出版)、『ゲーム制作 現場の新戦略 企画と運営のノウハウ』(MdN)など。 Googleはデスクトップ版のChromeブラウザに、新機能の「動画フレームをコピー」を追加しました。ブラウザ上の動画から簡単に静止画がコピーでき、スクリーンショットとして使えます。 これはGoogleが学生向けにブラウザ活用のノウハウをまとめた「大学生のためのChrome5つのヒント」内で紹介している機能です。手元のWindows 11版Chrome 116.0.5845.141にて、動作を確認しました。 「動画フレームをコピー」の使いかたChrome 116では、動画内で右
数年悩まされているが解決できていない問題。解決に向けて雑なメモ。固まるとGUIからの強制終了も効かずひたすら待つしかないのでかなりのストレス。 症状 MacOSのGoogle Chromeで下記のようなサイトで文字入力を行おうとするとレインボーカーソル状態のまま数秒から数十秒固まりブラウザが操作できなくなる コピペ操作でも起こる レインボーカーソルは表示されない場合もある 動き出すとタイプしていたキーが一気に入力されるような感じ 事象が発生すると別ウィンドウのGoogle Chromeも固まる Google Chrome以外のプロセスには影響してなさそう 常に発生するわけでもなく軽い時もある。ただ毎日は発生している 何をすると一時的にでも解消するのかは不明 Mac再起動直後は発生しない気がする Chrome再起動直後は発生しない気がする 発生するサイトと箇所 どのサイトとかは関係ない気もす
Google Chromeに、「動画のワンシーンを高解像度で撮影する機能」が追加されました。通常のスクリーンショット機能で動画のワンシーンを撮影すると、UIが写り込むなどしますが、Chromeの新機能を使えば動画のワンシーンを不要な要素なしにきれいに撮影可能です。 5 Google Chrome tips for college students https://blog.google/products/chrome/google-chrome-tips-college-students/ Chrome’s Copy Video Frame feature makes it easy to grab full-resolution stills - The Verge https://www.theverge.com/2023/8/31/23854302/google-chrome-cop
先日リリースされたChrome 116 デベロッパーツールの新機能で、正常に読み込まれなかったスタイルシートを簡単にデバッグできるようにするための多くの改良が加えられました。 What's New in DevTools (Chrome 116) 下記は各ポイントを意訳したものです。 ※元サイト様のライセンスに基づいて翻訳しています。基づいてというのは、貢献部分に関して同ライセンスも含みます。 正常に読み込まれなかったスタイルシートのデバッグ 正常に読み込まれなかったスタイルシートのデバッグ Chrome 116のデベロッパーツールでは、欠落しているスタイルシートの問題をより迅速に特定し、デバッグできるようにするために多くの改良を加えました。 「ソース」>「ページ」ツリーで、正常に読み込まれたスタイルシートのみが表示されるようになり、混乱が最小限に抑えられます。 「ソース」>「エディタ」で
「仕事を効率化したい」エンジニアさん必見! 仕事を効率化できるGoogle Chromeの拡張機能20選をご紹介します。 この拡張機能を入れると作業効率が爆上がりすること間違いなしです。 Chromeの拡張機能とは? Chrome拡張機能とは、Chromeブラウザに機能を追加することができるプログラムファイルのことです。 基本的には無料で使用できますが、中には有料のものもあります。 おすすめの拡張機能20選 1.CSSViewer 閲覧しているウェブサイトで、マウスオーバーによってCSSプロパティを表示できる優れもの 2.HTMLエラーチェッカー HTMLの開始・終了タグの過不足などを検出する拡張機能。エラーがある場合、数値が表示されルようになっています 3.DevTools Author KinzaやChromeデベロッパーツールのエディタのカラーやフォントを変更ができます 4.What
他Chrome拡張再生リストはこちら!! https://youtube.com/playlist?list=PL-IMu-2kQ0Lt3SfYa3fcCxkTrHJaOKaGI ■Twitter https://twitter.com/YukkuriAIch ■リンク ・Dark Reader https://chrome.google.com/webstore/detail/dark-reader/eimadpbcbfnmbkopoojfekhnkhdbieeh?hl=ja ・DeepL翻訳 https://chrome.google.com/webstore/detail/deepl-translate-reading-w/cofdbpoegempjloogbagkncekinflcnj?hl=ja ・Enhancer for Youtube https://chrome.go
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く