JSer.info #133 - Windows7向けにIE11 Developer Previewがリリースされました。
多少Win8版と差異がありますが、早速IE11DPのドキュメントも翻訳されているのでInternet Explorer 11 Preview 開発者向けガイド (Preliminary)を見てみるといいです。
F12 開発者ツールについてや、IE11 Preview における互換性の変更点 (Preliminary)に削除されたAPIやUA、文字エンコード、参考例自体が少ないMutationObserverについて等色々書かれています。
ECMAScript 6 modules: the future is now という記事では、ES6 modulesの文法についてまとめられています。
まだ、実装ブラウザはないですが知っておいて損はないと思います。
Object Playground: The Definitive Guide to Object-Oriented JavaScript というサイトでは、
JavaScriptのオブジェクト指向、prototypeチェーンやthisの動きなどについて、わかりやすい動画で解説されています。
また、入力したコードからオブジェクトの構造をダイアグラムで表示する機能がついていて、見た目でわかりやすいです。
(中の人はLet’s Code: Test-Driven JavaScriptの人です)
これと一緒にJavaScriptのコンストラクタ関数について書かれたIn defense of JavaScript’s constructorsを見ると、newの動きについて分かりやすくなると思います。
A Brief Introduction To Local Storage というスライドでは、LocalStorageの基本的な機能や使い方、シリアライズした時のパフォーマンスについて等よくまとまっています。
Node v0.10.15 (Stable)
http://blog.nodejs.org/2013/07/25/node-v0-10-15-stable/
Node v0.10.15リリース
Announcing jQuery Mobile 1.4.0 Alpha | jQuery Mobile
http://jquerymobile.com/blog/2013/07/25/announcing-jquery-mobile-1-4-0-alpha/
jQuery Mobile 1.4.0 Alphaリリース。
デフォルトテーマが新しく、SVGアイコンの採用
IE11 Developer Preview for Windows 7: Enabling Next Generation Sites and Apps - Faster - IEBlog - Site Home - MSDN Blogs
http://blogs.msdn.com/b/ie/archive/2013/07/25/ie11-developer-preview-for-windows-7-enabling-next-generation-sites-and-apps-faster.aspx
Windows7向けにIE11 Developer Previewリリース。
「Windows 7」向け「Internet Explorer 11」、デベロッパープレビュー版がリリース - CNET Japan などを見るとわかりますが、
Widnwos7向けのIE11はSPDYがサポートされてない等少しWin8向けとは違う所があります。
modern.IEをアップデート - Internet Explorer ブログ (日本語版) - Site Home - MSDN Blogs
http://blogs.msdn.com/b/ie_jp/archive/2013/07/26/10437228.aspx
modern.IEのサイトがアップデートされた。
IE11のイメージが追加されてる。
Bootstrap 3 RC1 · Bootstrap Blog
http://blog.getbootstrap.com/2013/07/27/bootstrap-3-rc1/
Bootstrap 3 RC1リリース。
変更点やロードマップについてはPullRequestにまとまってる
Bootstrap3で何が変わるのかをまとめてみた | Pimp My Site
http://pimpmysite.net/archives/501
RCが出る前の段階に書かれたものだけど、
Twitter Bootstrap 3 の変更点概要
ECMAScript 6 modules: the future is now
http://www.2ality.com/2013/07/es6-modules.html
AMDやCJSに対するES6 modulesのメリット。
基本構文 import/export/default exports/inline modules/Module loadersについて。
今日から使うためのツールについて
プログレッシブレンダリングでUXを向上させるJS非同期読み込みのベストプラクティス | ゆっくりと…
http://tokkono.cute.coocan.jp/blog/slow/index.php/xhtmlcss/best-practice-of-truly-async-js-loading/
スクリプトの遅延ロード.
async/defer属性やinsert、XHR、
iframe内にスクリプトを読み込ませて、親ドキュメントのブロックを防ぐ方法
オブザーバーパターンと安易な使い方をした時の問題について
オブザーバーパターンのアンチパターン
Part 1: Backbone.js Deconstructed - Tech.Pro
http://tech.pro/tutorial/1367/part-1-backbonejs-deconstructed
Cody LindleyによるBackbone.jsの入門チュートリアル。
実際に動かせるサンプルと一緒に機能の解説が書かれている
Internet Explorer 11 Preview 開発者向けガイド (Preliminary)
http://msdn.microsoft.com/ja-jp/library/ie/bg182636(v=vs.85).aspx
IE11Previewの開発者向けガイド.
開発者ツールやAPIの互換性情報、削除されたAPI、グラフィックス等
戻るナビゲーションのキャッシュ (Preliminary)
http://msdn.microsoft.com/ja-jp/library/ie/dn265017(v=vs.85).aspx
IE11の戻るボタンで戻った時に、ページからロードをしないでキャッシュから読み込まれる条件(bfcache)について並べられてる。
bfcache について覚えて帰ってもらいます。 も一緒に読むといいい
あとから線の編集が可能なお絵描きツールの描画高速化 : document
http://blog.livedoor.jp/imaya_js/archives/6682567.html
Canvasとオフスクリーンバッファと再描画について。
一度描いたものを再描画する際に処理コストを小さくするテクニック、
function 生成での高速化について。
Testing Array Contents with Array
http://designpepper.com/blog/drips/testing-array-contents-with-array-every
Array#everyの使い方。
Unit testing JavaScript with Promises and Jasmine « El blog de Carlos Ble
http://www.carlosble.com/2013/03/unit-testing-javascript-with-promises-and-jasmine/
Jasmineの非同期テストを、spyOnとPromiseを使って行う
HTML5 components: Implement standard components
http://www.ibm.com/developerworks/web/library/wa-html5components3/index.html
Shadow DOMとWeb Componentstについて
In defense of JavaScript’s constructors
http://www.2ality.com/2013/07/defending-constructors.html
JavaScriptでconstructor関数を書く時のパターンについて。
constructorを使う利点、newをオプショナルにするのを避ける理由とstrict mode、ES6のclass syntaxを見据えた話
Design Elements - Chrome V8 — Google Developers
https://developers.google.com/v8/design
JavaScriptエンジンのhidden classという仕組みについて。
new コンストラクタ関数で値を代入する場合に、操作の差分を持ったHidden classを作成しておき、
次回インタンス化するときに、それを再利用する + lookupが減る事で高速化される。
In defense of JavaScript’s constructors でConstructorを使う利点にも挙げられている実装的な仕組み。
Announcing a New and Improved Node.js Debugger | StrongLoop
http://blog.strongloop.com/announcing-a-new-and-improved-node-js-debugger/
StrongLoop Nod distributionに含まれてるNode-inspectorについて。
バックエンドはBlinkになり、breakpointや値の編集、SourceMap、関数の再実行等Nodeのデバッガーとして利用できる
CoffeeScript, Meet Backbone.js: A Tutorial
http://adamjspooner.github.io/coffeescript-meet-backbonejs/
CoffeeScriptとBackbone.jsを使ったTodoアプリを作るチュートリアル。
チュートリアル自体がDoccoのコードと説明を併記した形で読みやすい
JavaScript - じゃあ this の抜き打ちテストやるぞー - Qiita [キータ]
http://qiita.com/KDKTN/items/0b468a07410d757ac609
JavaScript Quiz.
thisの挙動についてのクイズ
Array modification · Rich-Harris/Ractive Wiki
https://github.com/Rich-Harris/Ractive/wiki/Array-modification#performance-and-ui-benefits
Ractive.jsは配列の変更をPrototype chain injectionを使って検知して、
配列元にDOMを生成している場合、その配列の変更の差分を考えてDOMの操作を行なっている.(DOMの変更範囲を抑えてる)
insertAdjacentHTMLが高速になるのと似てる感じがする。
最近のJavaScript開発まとめ : アシアルブログ
http://blog.asial.co.jp/1187
最近良く見る感じのフレームワーク、ライブラリ、コーディングルール、Lint、メトリクス、デバッグ、テスト、Grunt、Node.jsについて。
似ている感じの趣旨のスライド => High-Quality JavaScript Code ツールまとめ | JSer.info
日付を便利に操作するためのJavaScriptライブラリ色々 | Mach3.laBlog
http://blog.mach3.jp/2013/07/js-libraries-for-date.html
日付操作ライブラリまとめ
Unit Testing: Minutes Now Will Save Hours Later - Eric Mann - YouTube
http://www.youtube.com/watch?v=_UmmaPe8Bzc
ユニットテストについての発表。
http://eamann.com/slides/unit-testing/
なぜ、なにを、どうやって、ツール、自動化について。
コード全体が匿名関数で囲まれてる場合にどうするか等
High-Quality JavaScript Code
http://www.slideshare.net/denodell/highquality-javascript-code
JavaScriptのコードクオリティのツールやサービスなどについてのスライド
リンクまとめ => http://jser.info/post/56525802407/high-quality-javascript-code
A Brief Introduction To Local Storage
http://www.slideshare.net/garyfromchina/a-brief-introduction-to-local-storage
LocalStorageについてよくまとまってるスライド.
Store.js、StorageEvent、容量制限のまとめ、use caseと実例、オブジェクトのSerializeとパフォーマンスについて
Functional JavaScript
http://functionaljavascript.blogspot.com/
関数型JavaScriptについて書かれてるブログ
Object Playground: The Definitive Guide to Object-Oriented JavaScript
http://www.objectplayground.com/
JavaScriptのオブジェクト指向について学べるサイト。
JavaScriptのオブジェクトのダイアグラムを表示できる機能があり、視覚化して把握できる
Web Tools Weekly | A weekly newsletter for front-end developers
http://webtoolsweekly.com/
Web Toolについての週刊のメールマガジン
HTML5 Hub
http://html5hub.com/
Intelが関わってるHTML5コミュニティ
Try Sass
http://trysass.com/
Sass playground.
Sassを入力してCSSをその場で見られる
Ractive.js - next-generation DOM manipulation
http://www.ractivejs.org/
Mustachesなテンプレートとデータバインディングして、AngularJSみたいにDOM等を扱うライブラリ.
名前の通り値を変更した時点で反映するリアクティブスタイル.
チュートリアルがよく出来てる
JointJS - JavaScript diagramming library.
http://www.jointjs.com/
インタラクティブなダイアグラムを作れるライブラリ。
ERD, Org chart, FSA, UML, PN, DEVS等の要素は別途用意されてる
Voyeur.js
http://dunxrion.github.io/voyeur.js/
defineProperty/getterを使ってDOMの操作をプロパティを辿る感じでできる機能などを持ったDOM操作ライブラリ
DOM Traversal and Manipulation with Voyeur | Flippin’ Awesome
http://flippinawesome.org/2013/07/22/dom-traversal-and-manipulation-with-voyeur/
Voyeur http://dunxrion.github.io/voyeur.js/ を使ったDOM操作についての解説
ryanackley/git-html5.js
https://github.com/ryanackley/git-html5.js
JavaScriptのGitクライアント実装ライブラリ。
FileSystem APIを使ってる
Moment.js | Timezone support for Moment.js
http://momentjs.com/timezone/
MomentsのTimeZoneを扱うライブラリ。
TimeZoneのルールを http://momentjs.com/timezone/data/ で追加できる
8th713/DOM-Promises-polyfill
https://github.com/8th713/DOM-Promises-polyfill
DOM Promisesのpolyfillライブラリ
lz-string: JavaScript compression, fast! - pieroxy.net
http://pieroxy.net/blog/pages/lz-string/index.html
文字列を圧縮するライブラリ
jspm.io - Get Started
http://jspm.io/
ES6 / AMD / CJS などで定義されたモジュールを読み込むことができるJavaScriptローダーライブラリ.
Table-to-JSON
http://lightswitch05.github.io/table-to-json/
TableタグをJSONにして取得できるライブラリ
kendo-labs/kendo-bootstrapper
https://github.com/kendo-labs/kendo-bootstrapper
Kendo UI Bootstrapper
Bone.io - Realtime HTML5 Framework
http://bone.io/
WebSocketを使って、サーバとクライントを連携してデータのやり取りするアプリを作るBackbone.jsライクなライブラリ
Mergely - Online diff, merge documents
http://www.mergely.com/
JavaScriptなDiff/Mergeアプリとライブラリ
jasmine JS testing Cheat Sheet by CITguy - Cheatography.com
http://www.cheatography.com/citguy/cheat-sheets/jasmine-js-testing/
Jasmineのチートシート
alexyoung/ico @ GitHub
http://alexyoung.github.io/ico/
Raphaelベースなグラフライブラリ。