Taming The Unicorn: Easing JavaScript Memory Profiling In Chrome DevTools
Taming The Unicorn: Easing JavaScript Memory Profiling In Chrome DevTools April 11, 2013 “The Unicorn has a special ability to help it's master when in trouble. When tamed, they will not attack humans or tamed creatures, but will attack anything else with negative karma" The DevTools Heap Profiler and Timeline Memory view can be used to diagnose memory leaks on both desktop and mobile (via remote
Chrome Developer Tools - monitorEvents - Brian Grinstead
I have been playing with the Chrome Developer Tools lately. Here is a cool feature I didn't know about. There are many times I have run some code in the console simply to bind to an event and simply log the result. $("body").bind("click mousedown", function(e) { console.log(e); }); There is a built in alternative called monitorEvents. Here is a quick demo on how to use it: Inspect an element (see
SourceMapを使って、効率の良いJavaScript開発生活/mixi Engineers' JS Advent Calendar 2012
【追記】 「mixiページ」サービス終了に向けてのスケジュールは、2020年8月31日に全てサービス提供終了としていましたが、以下の日程に変更します。 ・2020年9月7日11時頃 モバイル版mixiページ終了 ・2020年9月14日11時頃 PC版、スマートフォン版mixiページ終了 終了時刻は前後する場合がございます。 ダウンロード機能はPC版スマートフォン版mixiページ終了と同時の2020年9月14日11時頃に終了いたしますので、「mixiページ」データのダウンロードをご希望の方は、お早めにダウンロードをお願いします。 以上、どうぞよろしくお願いいたします。 【追記】 終了予定の「mixiページ」とは、SNSmixi全体の中の一部特定サービスの名称でございます。 SNSmixiの全てが終了するわけではございません。2020年8月31日以降も引き続きSNSmixiはご利用いただけます
Respond to change with Object.observe | Blog | Chrome for Developers
Lots of JavaScript frameworks using MVC or MDV need to respond to changes to the objects that model the state inside a web application. This capability is a fundamental part of a data-binding model. There are a number of different ways to monitor JavaScript objects and DOM properties to trigger some sort of action, but most of the techniques aren't ideal for various reasons such as performance, et
Build Apps with AngularJS | Chrome for Developers
This guide gets you started building Chrome Apps with the AngularJS MVC framework. To illustrate Angular in action, we'll be referencing an actual app built using the framework, the Google Drive Uploader. The source code is available on GitHub. About the app The Google Drive Uploader allows users to quickly view and interact with files stored in their Google Drive account as well as upload new fil
Lets Tincr: Bi-directional Editing And Saving With The Chrome DevTools
Lets Tincr: Bi-directional Editing And Saving With The Chrome DevTools August 10, 2012 Following on from my post last year on the Chrome DevTools AutoSave project, I’d like to share another useful extension Nikita Vasilyev brought to my attention called Tincr, by Ryan Ackley. We often find ourselves switching back and forth between the Chrome Developer Tools and a text editor while debugging. This
CoffeeConsole: A Chrome Extension
Harry Brundage, a co-worker of mine at Shopify, does a lot of CoffeeScript development and said he would love to be able to do CoffeeScript right from the console in Chrome's Web Inspector. I asked Paul Irish, a "dev relations guy" at Google, to point me in the right direction on building just such a thing. The result of today's pet project is CoffeeConsole, a Chrome extension that adds a new pane
Tumblr
はじめに JavaScript Advent Calendar 2011 (フレームワークコース) の7日目です。この記事では、Javascript で強力なクライアントサイド・アプリケーションを作成するための仕組みである Chrome Packaged Apps について説明します。 この話をフレームワークコースに入れていいか迷いましたが、人が少なそうなのでここに登録しました。 Chrome Packaged Apps とは何か Chrome Packaged Apps とは、Google Chrome にインストールして使うアプリケーションのことです。 実装面から言うと、Chrome Packaged Apps とは HTML+Javascript で作成したアプリケーションに manifest.jsonという名前のJSONファイルを付け足したものです。開発方法は通常のHTMLドキュメ
Chromeのconsole.logの謎 - はなちん C-x C-c
この記事を読んで、Chromeのconsole.logの動きが謎すぎる気がして確認してみました。 CoffeeScriptで、newするときのプロパティ変数の初期化ってどーなってんの？ - uzullaがブログ 検証 ソースコード var a = []; a.push('A'); console.log(a); a.push('A'); console.log(a); これをChromeのDeveloper toolのコンソールで実行してみました。 期待する出力 ["A"] ["A", "A"] 実際の出力 ["A", "A"] ["A", "A"] 調べてみた console.log lazy等でググるとStackoverflow等のサイトがでてきた。 Is Chrome's JavaScript console lazy about evaluating arrays? - Stack
Google ChromeをWebSocketで制御する - 箱入りあじゃらの日記
JavaScriptJavaScript Advent Calendar 2011 (Node.js/WebSocketsコース)の6日目。初参加です、緊張します。WebSocketネタということで、ChromeのWebKit Remote Debugging Protocolを使ってWebSocketでGoogle Chromeを操作する小ネタ。手順1.リモートデバッグを有効にしてChromeを起動Chromeの起動オプションに--remmote-debugging-portを付加してリモートデバッグを有効にする。 $ chrome --remote-debugging-port=9222 2.タブ一覧を取得今回はコントロールする側(Chrome)とされる側(node)が同一ホストで動いてるものとします。http://localhost:9222/jsonをGETで叩くとChromeのタ
はじめてのChrome extension
オフラインWebアプリの再到来で今、再び注目されるAPIの本命 ーJavaScript SQL-like database
コードDJ第9回 – Chrome Extensionに挑戦 - Fjord, Inc(株式会社フィヨルド)
毎週火曜日、Help me, hackers!に上がったコードを紹介していくコードDJ 第9回。 「あなだのコードがー しぬほどスキダカダー！」（＠チャン・ドンゴン） komagata a.k.a. DJです。 今回紹介するのはコレ。 Ham Cutlet Chrome Extension – Help me, hackers! HTMLのインデントを綺麗にする誰得サービスHam CutletのGoogle Chrome Extension。ブラウザの「このページのソースを見る」の代わりにインデントを綺麗にしたソースを表示するボタンをOmniBoxの右に追加するExtensionだ。 mongorian_chop a.k.a. 自由人が作ってくれた。ボタンのアイコンはmachida a.k.a. 漫★画太郎。軽いコラボ。 コードはココ。 mongorian-chop’s hamcutlet
Chromeでworkerプロセスが死ぬ問題 - hagino3000's blog
解決するのにここ2日間かかってしまったバグ。 WebWorkerでworkerプロセスを作る。workerの中でタイマーを回して5分毎にサーバーからデータを取得、そのデータをメインスレッドに返す、というのを実装したが、workerが5分~10分経つと死んでいるというもの。onerrorへの通知も無い。 いろいろ悩んだ末、もしかしてGCされてるんじゃあ……と思ったらその通りのようで、グローバルオブジェクトから参照できる所に突っこんでおいたら死ななくなった。 Operaだと動いているworkerが勝手に殺されたりしないのでChromeのバグかも*1。GCしてくれなくてもworkerを殺す手段としてterminateメソッドが用意されている。自分で作成したworkerは自分で殺した方がわかりやすい。 検証ページ(workerを2つ作って、片方のみglobalオブジェクトから参照可能にしておく)
Making Your First Google Chrome Extension
The Google Chrome web browser is slowly growing in popularity. This is no surprise, as it is a great browser, and is backed by no other than Google. It also provides great tools for web developers and I find myself using it more and more (actually Firebug is the only thing keeping me from crossing to the other side). With the introduction of extensions, Google Chrome became even more agile and pow
prototype.jsとChrome/Firefox組み込みのJSON.stringifyが衝突する - monthly gimite
最近のChromeやFirefoxはJSONオブジェクトが標準付属してるっぽいのですが、それとprototype.jsが干渉してJSON.stringifyの挙動がおかしくなるようです。 prototype.js 1.6.1をロードした状態で JSON.stringify({"a": ["b", "c"]}) とすると '{"a":"[\"b\", \"c\"]"}' が返ってきます。配列の部分が二重にJSON化されています。 このへんによるとprototype.jsとJSONオブジェクトが同じObject#toJSON()という名前を違う用途で使っているのが問題らしいです。 まあ今時prototype.jsなんて使うなよ、っていう話なのかもしれませんが。いい加減jQueryでも覚えようかな…。 ちなみにjson2.jsは組み込みのJSON実装があればそちらを使うようになっています。なので
Chrome Experiments
Chrome Experiments is a showcase of work by coders who are pushing the boundaries of web technology, creating beautiful, unique web experiences. You'll find helpful links throughout the site for creating your own experiments, and you can also explore resources like WebGL Globe and our workshop of tools.
第9回 Google Chrome拡張とHTML5 #3 | gihyo.jp
こんにちは、太田です。今回はGoogle Chrome拡張に使えるHTML5関連技術の3回目をお送りします。 前々回はcanvas、ドラッグ・アンド・ドロップ、前回はECMAScript5やCSS3の一部を取り上げましたが、今回はHTML5関連APIのWeb Storageと、HTML5とは外れますが、Desktop Notificationsを紹介します。Web StorageはHTML5関連の中でもIE8でサポートされているなど、実装が進んでいるAPIの一つです。Desktop Notificationsはウェブページや拡張からユーザーに積極的な通知を出すことができるAPIです。MacではGrowlというアプリケーションが有名ですが、Growlに相当する機能をブラウザベースで実現しています。 Web Storage Web Storageはブラウザ上で動作するキーバリューストアです。J
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Charming Python: Functional programming in Python, Part 3
GitHub - thom4parisot/grunt-crx: Grunt task used to package private Chrome Extensions.
Chrome拡張入門