Fork me on GitHub

2016-06-13のJS: jQuery 3.0、Firefox 47.0、Web Audio API入門

Edit on GitHub 編集履歴を見る

JSer.info #283 - jQuery 3.0が正式にリリースされました。

幾つかの非互換性が含まれていますが、jQuery 1.xや2.xからアップグレードする場合のドキュメントも公開されています。
基本的にはjQuery Migrateという移行用のプラグインを入れて、警告を修正したら本体をアップグレードする流れになっています。

また、今回のjQuery 3リリースと同時に、ajaxeffectを取り除いたslimビルドが公開されています。


Firefox 47がリリースされました。

Widevine CDM(DRMなストリーミング)のサポート、Service Worker/Push APIのデバッグ機能の改善、 about:debuggingの追加、ES2017のObject.values()Object.entries()の実装など

開発者ツール周りは次の記事で解説されています。


web audio lessonでは、Web Audio APIについて基本的な話から応用な話までをレッスン方式で解説されています。

オンライン上でコードをそのまま実行できるようになっていて、それぞれのレッスンごとに課題が設定されています。
Web Audio APIに興味がある人は見てみるといいかもしれません。


ヘッドライン


jQuery 3.0 Final Released! | Official jQuery Blog

blog.jquery.com/2016/06/09/jquery-3-0-final-released/

jQuery ReleaseNote

jQuery 3.0リリース。
ajaxとeffectを取り除いたslimビルドの公開。
jQuery.DeferredがPromise A/+互換に、非推奨イベントの削除、再度requestAnimationFrameを利用するように変更など


Firefox 47.0 リリースノート

www.mozilla.jp/firefox/47.0/releasenotes/

firefox ReleaseNote

Firefox 47リリース。
Widevine CDM(DMRなストリーミング)のサポート、Service Worker/Push APIのデバッグ機能の改善、 about:debuggingの追加、ES2017のObject.values()Object.entries()の実装など


Release v6.10.0 · babel/babel

github.com/babel/babel/releases/tag/v6.10.0

babel ReleaseNote

Babel 6.10.0リリース。
--watch時に、初回はビルドしない--skip-initial-buildオプションの追加、バグ修正など


ESLint v2.12.0 released - ESLint - Pluggable JavaScript linter

eslint.org/blog/2016/06/eslint-v2.12.0-released

ESLint ReleaseNote

ESLint v2.12.0リリース。
JSCS互換のルールの追加、全てのビルトインルールを読み込むeslint:allの追加、パフォーマンスの改善など


Release Notes for Safari Technology Preview 6 | WebKit

webkit.org/blog/6531/release-notes-for-safari-technology-preview-6/

safari ReleaseNote

Safari Technology Preview 6リリース。
関数の引数におけるtrailing commasのドラフトをサポート、CSSのnormal値をサポートなど


Dev.Opera — What’s new in Chromium 51 and Opera 38

dev.opera.com/blog/opera-38/

Opera Chrome ReleaseNote

Opera 38(based on Chromium 51)リリース。
ES6 Symbol.hasInstanceSymbol.species、関数式のfn.name対応、querySelectorの返り値がiterableに、KeyboardEvent#keyのサポートなど


Chromium Blog: Chrome 52 Beta: CSS containment, simpler performance measurement, streamable responses from service workers, and more options for web push

blog.chromium.org/2016/06/chrome-52-beta-css-containment-simpler.html

Chrome ReleaseNote

Chrome 52 Betaリリース。
CSS containプロパティ、PerformanceObserverのサポート。
Fetch APIがreferrer policyをサポート。
metaタグでのX-Frame-Optionが無効となるなど


アーティクル


Open Sourcing CloudFlare’s UI Framework

blog.cloudflare.com/cf-ui/

React UI library

小さなReact Componentをmonorepoで管理して公開する話。
コンポーネントの粒度、テスト方法、デバッグ、アクセシビリティなどについて


DOM Features You Didn’t Know Existed (Video & Slides) | Impressive Webs

www.impressivewebs.com/dom-features-you-didnt-know-existed-video-slides/

JavaScript DOM

いろんなDOM APIについて紹介してる記事


Passive Event Listeners によるスクロールの改善 | blog.jxck.io

blog.jxck.io/entries/2016-06-09/passive-event-listeners.html

JavaScript performance

addEventListener(type, handler, options)の第三引数として追加されてた passiveオプションについて。
passive: true とした場合の効果、Feature detectの方法についてなど


Performance Observer - Efficient Access to Performance Data | Web Updates - Google Developers

developers.google.com/web/updates/2016/06/performance-observer

JavaScript API performance

PerformanceObserverについての解説記事。
ブラウザがアイドル時に、非同期でTiming情報を取る事ができる。


Memory Debugging with Web Inspector | WebKit

webkit.org/blog/6425/memory-debugging-with-web-inspector/

webkit safari debug

Safari TPの新しいメモリプロファイラについて


スライド、動画関係


Practical React with MobX - YouTube

www.youtube.com/watch?v=XGwuM_u7UeQ

JavaScript 動画 library

MobXについてのスクリーンキャスト。
MobXを使ってどのようにStateを管理するのか、どのようなサイクルで状態の変更を描画するのかについて


サイト、サービス、ドキュメント


web audio lesson

mohayonao.github.io/web-audio-lesson/

web audio tutorial document

Web Audio APIの基礎から応用までの課題付きチュートリアル。
コードをその場で実行できるようになっている。


npms

npms.io/

npm 検索

バックエンドにElasticsearchを使ったnpm検索サービス。
Quality、Maintenance、Popularity、Personalities(未実装)という指標も一緒に表示してくれる


ソフトウェア、ツール、ライブラリ関係


airbnb/hypernova: A service for server-side rendering your JavaScript views

github.com/airbnb/hypernova

React node.js rails

AirbnbのReactサーバサイドレンダリングモジュール。
Railsとの統合する設定も公開されている


Kakapo.js

devlucky.github.io/kakapo-js

HTTP testing library

HTTPモックライブラリ。
モックデータ入りの開発サーバを作れるライブラリ。


rill-js/rill: Isomorphic web application framework.

github.com/rill-js/rill

HTTP JavaScript library browser node.js

Browser、Node.jsで動くisomorphicなHTTPミドルウェアライブラリ。


benjamn/reify: Enable ECMAScript 2015 modules in Node today. No caveats. Full stop.

github.com/benjamn/reify

ECMAScript node.js Tools

ECMAScript moduleをNode.jsに変換/ランタイム変換するツール。


書籍関係


CSSシークレット ―ウェブデザイナーが知るべき47のキーポイント : Lea Verou, 牧野 聡 : 本 : Amazon.co.jp

www.amazon.co.jp/CSS%E3%82%B7%E3%83%BC%E3%82%AF%E3%83%AC%E3%83%83%E3%83%88-%E2%80%95%E3%82%A6%E3%82%A7%E3%83%96%E3%83%87%E3%82%B6%E3%82%A4%E3%83%8A%E3%83%BC%E3%81%8C%E7%9F%A5%E3%82%8B%E3%81%B9%E3%81%8D47%E3%81%AE%E3%82%AD%E3%83%BC%E3%83%9D%E3%82%A4%E3%83%B3%E3%83%88-Lea-Verou/dp/4873117666

CSS book

2016年6月25日発売
CSS Secretsの翻訳


この記事へ修正リクエストをする
記事を紹介する