DevTools の使い方を可能な限りスクショ付きで解説してみる
以下の公開計測会でやったものを個別に解説してみる。 細かいテクニックが多いのだが、それを可能な限りテキストとスクショで解説したい。使い方の解説が中心で、どういう意味があるかは解説しない。 Chrome131時点のスクリーンショットで、後で読む場合は頻繁にUIが変わっている点に注意。大事なのは意図。 宣伝: これを御社のサイトで解説する仕事をやっています。 デモのURL これに意味はなく、今日偶然見ていただけで意図はない。関係ないがエッジランナーズは最高のアニメ。 DevTools を開く F12 or 右クリックから「検証」 DevTools > Lighthouse この状態で計測 このとき、新しいプロファイルを作ったりして、可能な限り Chrome拡張が入ってない状態にすること。Chrome拡張による処理も計測に含まれてしまう。 Lighthouse レポートの読み方 点数部分にマウス
GitHub - danielb2/purdy.js: Print things real purdy
Prints anything indented, and with arrays with index keys, and different types in colors such that it's very easy to get an overview of what object you're dealing with. object - anything, number, object, array, etc. options - optional object with the following keys. plain - when true, prints result without colors. Defaults to false with tty, true when not. path - when true, prints result with a pa
JavaScript 祭で発表してきました - 若くない何かの悩み
秋のJavaScript祭 in mixi で、「バグの見つけ方」について発表してきました。 speakerdeck.com 過去二つのスライドをくっつけたものなので、既視感があるかもしれませんが気のせいです。 さて、前の発表を終えてから、いくつか直したかった点があったので、その点だけ修正してあります。 例えば、「ステップ実行」→「手動動作確認」のあたりですね。 ステップ実行でバグを見つけるというより、見て触っておかしいと気づいて、ステップ実行へ突入するはずですから、「手動動作確認」の方がふさわしいと思ったためです。 あと、次の2つの感想が特に嬉しかったです。ありがとうございました。 スライドめっちゃすてきだしリントやテストの大事さがすごくわかりやすい… #jsfes— nao (@naoi109) October 15, 2016 これまでの人生で一番簡潔に型検査やリントやテストの重要性
debugCSS : (X)HTML debugging tool built with CSS
debugCSS: (X)HTML debugging tool built with CSSdebugCSS is meant to be loaded on an existing page to highlight potentially broken, malformed or legacy (X)HTML. Not all "errors" are created equally, so they are color coded to highlight severity. Green is "probably not a big problem", yellow is "worth looking at" and red is "you really should fix this." Click and drag the link below to your bookmark
Comprehensive Overview of Storage Scalability in Docker
Try Red Hat products and technologies without setup or configuration fees for 30 days with this shared Red Hat OpenShift and Kubernetes cluster.
プログラム実行点の概念に基づく デバッグパターンの抽出と自動化
� � � ��� � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � ��� � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � ��� � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � ��� � � � � � � � � � � � � � � � � � � � � � � � � � � � � ��� � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � � ��� � � � � � � � � � � � � � � � � � � � � � � � � � � � � �
Delta Debugging - Lehrstuhl für Softwaretechnik (Prof. Zeller) - Universität des Saarlandes
Dies ist ein Archiv des alten Softwaretechnik Lehrstuhls der Universität des Saarlandes. Es ist nicht länger aktuell. Für die aktuelle Arbeit von Andreas Zeller und seiner Gruppe besuchen Sie andreas-zeller.info. Für den aktuellen Softwaretechnik Lehrstuhl besuchen Sie www.se.cs.uni-saarland.de. The Delta Debugging project at Software Engineering Chair, Saarland University investigates an automate
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
FireDBG - 🔥 Time Travel Visual Debugger for Rust
GitHub - ktock/buildg: Interactive debugger for Dockerfile, with support for IDEs (VS Code, Emacs, Neovim, etc.)
GitHub - zthxxx/react-dev-inspector: jump to local IDE code directly from browser React component by just a simple click
GitHub - skanehira/yd: YAML Incremental Digger.
GitHub - hediet/vscode-debug-visualizer: An extension for VS Code that visualizes data during debugging.
GitHub - infinitered/reactotron: A desktop app for inspecting your React JS and React Native projects. macOS, Linux, and Windows.
GitHub - maierfelix/Iroh: Dynamic code analysis tool - Exploit, record and analyze running JavaScript
reactvt.io - Registered at Namecheap.com
GitHub - danvk/source-map-explorer: Analyze and debug space usage through source maps
GitHub - samccone/drool: Automated memory leak detection and analysis
GitHub - square/leakcanary: A memory leak detection library for Android.
GitHub - JakeWharton/hugo: Annotation-triggered method call logging for your debug builds.
Rollbar | Error logging & tracking service for software teams
