You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
今業務でやってるプロジェクト、ジョインした時点では 普通のソーシャルゲーム 規模はそこそこ大きい MVCフレームワークなどは使ってない テスト0 運用中 フロントはこんな感じでした。 これはヤバいと思い開発の合間合間にテストを書いていったのですが、 その時にやったことの記録です。 使ったもの Mocha chai Sinon.js testem PhantomJS CasperJS DOMのテストもしたかったので実行環境はブラウザにしています。 Jasmineでも良かったのですがアサーションも自分で選びたかったので Mochaを使いました。 どのくらい書いたか 結論から言うと共通のメソッドやコンポーネントだけしか書いてません。 そもそもテストを書く事を全く考慮されていないコードで、 DOMと密結合しまくりだったり if (result) { resultDom += '<div class
MessageChannel / setTimeout / requestAnimationFrame / postMessageを使ったものより異様に速い。 というのも、setTimeout等は、次のサイクル(すなわちnextTick)の開始時に実行する関数を登録し、DOMや画面の更新後に実行されるのだが、 MutationObserverのコールバックは、現在の(同期的な)JS実行が完了した時点でコードを走らせるためである。さらに、MutationObserverは同じ実行サイクルでのDOM上の変更を次回のサイクルにすべてまとめてrecordsとしてコールバックに渡すので、これもsetImmediateの実装には非常に都合が良い。 MutationObserverのような実行タイミングをmicrotaskといい、setTimeout / postMessage / MessageCha
プログラミング (iOS, JavaScript, Jenkins, Sikuli) とMacやiPhoneなどの話題が中心のブログ CoffeeScriptなどの別言語からコンパイルしたり、ClosureコンパイラなどでMinifyしたりしたソースをデバッグしているときなどに、生成されたJavaScriptソースコードから変換前のオリジナルソースの場所を知りたいときがあります。 それを知るための技術がSource Mapです。これがどのようにオリジナルのソースを参照しているのか気になったので調べてみました。 CoffeeScriptをコンパイルしたときのソースマップ 簡単な例として、フィボナッチのCoffeeScript版をソースとして用います (fibonacci.coffee)。 fib = (n) -> if n == 0 or n == 1 n else (fib n - 1)
JavaScriptを使ってアニメーションを書くときに有用なテクニックの、基本中の基本をご紹介します。おそらく、このブログを見ている人のほとんどにとっては釈迦に説法だと思います。今回、requestAnimationFrameの話すらしません。その点、ご留意ください。 まず、JavaScriptでアニメーションをする場合に気をつけないといけないのが、一度JavaScriptの実行(Context)を抜けないとブラウザに描画が反映されないということです。簡単に言うと、 <html><head><title>bad sample</title><script> onload = function() { var e = document.getElementById("e"); for(var i = 0; i <= 100; i += 5) { e.style.left = e.style.
WebWorker は便利だけどデバッグしにくい。僕は根っからのプリントデバッガーなんだけど、WebWorker は console.log が使えなくて困る。しかし泣いてばかりもいられない。 WebWorker で console.log を使う WorkerConsole というやり方がある。下記は簡略版だけど、WebWorker側に console というグローバル変数を用意して、log とか error メソッドで呼び出し元に引数を postMessage する。そして、呼び出し元の onmessage でコンソールに表示する。 このやり方には若干問題があって、postMessage を通過出来るものしか表示できない。つまりオブジェクトを表示して DevTools で属性を確認したりとかできない。 // worker.js global.console = {}; ["log",
JavaScriptでは、初見の人にはさっぱりわからないけれども、ある程度慣れた人は当たり前に使うイディオムが結構たくさんあります。知ってしまえば何てことはないので、私の知っている限りのイディオムとその意味を解説します。 (7/3追記: twitter等で教えていただいた内容を追加しました) +v (数値化) var v = "123"; console.log(+v + 100) // 223 console.log(v + 100) // 123100 vを数値化する方法では最もメジャーです。parseFloat(v) に比べて高速なのに加えて、parseFloatとは細かい挙動が異なります(例えば空文字列の場合、parseFloatならば NaN になりますが、 +v の場合はゼロになります)。必ず数値になることが保証されており、文字列などで数値化出来ない場合はNaNが返ります。 v
Note: This article is based on the ECMAScript 5 specification. For the updated ES2015 version, see Valid JavaScript variable names in ES2015. Did you know var π = Math.PI; is syntactically valid JavaScript? I thought this was pretty cool, so I decided to look into which Unicode glyphs are allowed in JavaScript variable names, or identifiers as the ECMAScript specification calls them. Reserved word
imagesLoaded JavaScript is all like "You images done yet or what?" imagesloaded.desandro.com Detect when images have been loaded. imagesLoaded on GitHub 8,000 Edit this demo or vanilla JS demo on CodePen. Just to keep things interesting, there’s a 10% chance of adding a broken image. Install Download imagesloaded.pkgd.min.js minified imagesloaded.pkgd.js un-minified CDN <script src="https://unpkg.
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く