Fork me on GitHub

2016-03-29のJS: Safari 9.1、Backbone.jsの近況、Web Performance API

Edit on GitHub 編集履歴を見る

JSer.info #272 - Backbone.js 1.3.2がリリースされていますが、
The Sad State of the Backbone Ecosystemという記事では近年のBackbone.js周りのエコシステムについて書かれています。

Backbone.js本体のPulseやMarionette.js、他の関連ライブラリの状況について書かれています。

JavaScript情報ってなんだっけ?でもGitHubリポジトリのPulseを見ることで、状況はある程度分かるという話をしました。
Backbone.jsの場合は枯れているというのもありますが、これ以上大きな進化をするのが難しい状況にも見えます。

Backbone.jsを使っている人は状況を把握するのに読んでみると面白いかもしれません。


Safari 9.1がリリースされました。

Safari 9.1で使えるようになった機能について上記の記事では解説されています。
CSS Custom Properties、CSS Will-Change、<picture>要素、Fast Tapの対応など新しい機能も色々増えています。


ブラウザのPerformance APIの話というスライドでは、ブラウザで利用できるパフォーマンス計測のAPIについて書かれています。

スライド内でも紹介されていますが、Timing APIについてはA Primer for Web Performance Timing APIsというドキュメントによくまとめられています。

またパフォーマンス関連して、Google等が主導のAccelerated Mobile Pages (AMP)に対抗して、Content Performance Policy (CPP)の提案などがありました。

CPPはまだアイデアに近い話ですが、この話に加えてSandbox Policyという提案が@igrigorikから出されています。

これは既存の<iframe sandbox>を拡張した概念(オプトイン、オプトアウトな違いはある)で、document.writeを禁止するディレクティブの追加などが含まれています。

どの話も、開発側がある種サブセットのような制限を受け入れてより高速な表示などが出来るようにするためのルールを決めている形です。

パフォーマンスに興味がある人はこの辺も見てみると面白いかもしれません。


ヘッドライン


Backbone.js

backbonejs.org/

backbone.js ReleaseNote

Backbone. 1.3.2リリース。
findIndexfindLastIndexの追加、component.jsonのサポートを終了


Release v1.0.0 · mozilla/sweet.js

github.com/mozilla/sweet.js/releases/tag/v1.0.0

JavaScript Tools

JavaScriptにhygienic macrosを導入するsweet.js 1.0.0リリース。


ESLint v2.5.0 released - ESLint - Pluggable JavaScript linter

eslint.org/blog/2016/03/eslint-v2.5.0-released

JavaScript Tools ReleaseNote

ESLint 2.5.0リリース。
依存してるライブラリもESLintのパッケージに含めて配布できるbundledDependenciesを利用するように、ルールの追加/修正など。


アーティクル


Safari 9.1

developer.apple.com/library/mac/releasenotes/General/WhatsNewInSafari/Articles/Safari_9_1.html

safari ReleaseNote

Safari 9.1の変更点について。
<picture>要素のサポート、Web Inspectorの改善、Fast Tap、CanvasがimageSmoothingQualityプロパティ、CSS Custom Propertiesのサポートなど


CSS Variables in WebKit | WebKit

webkit.org/blog/5989/css-variables-in-webkit/

CSS

Safari 9.1でサポートされたCSS Custom Propertiesについての解説
--nameで変数を定義し、CSS内からvar(--name)で参照できる。
JavaScriptからもgetPropertyValue/setPropertyで読み書きができる


Safari on iOS 9.3, Responsive Images, iPhone SE, shrink-to-fit and other new APIs | Breaking the Mobile Web

www.mobilexweb.com/blog/safari-on-ios-9-3-picture-shrink-fit-iphone-se

ios safari ReleaseNote

iOS 9.3のSafariについて。
<picture>、Fast Tap、CSS Custom Properties、ダイアログの変更、shrink-to-fit、Remote Inspectorなど


JSDocをランタイムassertに変換するBabelプラグインを書いた | Web Scratch

efcl.info/2016/03/25/jsdoc-to-assert/

JavaScript testing Tools babel

JSDocをassertに変換するBabelプラグインについて。
JSDocの型をランタイムassertにすることで、定義されてる型と実際の値が一致しているかを検証できる


Shadow DOM CSS Cheat Sheet

robdodson.me/shadow-dom-css-cheat-sheet/

CSS

Shadown DOMのCSS(:hostなど)、CSS Custom Properties(--var)についてのチートシート


Status of Static Typing in ECMAScript | ECMAScript Daily

ecmascript-daily.github.io/pages/status-of-static-typing-in-ecmascript/

ECMAScript proposal まとめ

ECMAScriptにおける静的型関連Proposalのステータスまとめ。


Gordux.js - The redux pattern in vanilla.js

k94n.com/gordux-js-the-redux-pattern-in-vanilla-js

JavaScript redux

Reduxのようなデータフローを素のJavaScriptで実装してみるという話。
EventにはCustom Eventを使ってPub/Subを行っている


The Sad State of the Backbone Ecosystem

benmccormick.org/2016/03/07/the-sad-state-of-the-backbone-ecosystem/

backbone.js

Backbone.jsのエコシステムのアクティビティについて。
Backbone.js本体やMarionette、関連するライブラリの状況についてまとめてる


GitHub - benoitvallon/computer-science-in-javascript: Computer science reimplemented in JavaScript

github.com/benoitvallon/computer-science-in-javascript

JavaScript algorithm

JavaScriptでデータ構造やソートアルゴリズムの実装例


Sinon Tutorial: JavaScript Testing with Mocks, Spies & Stubs

www.sitepoint.com/sinon-tutorial-javascript-testing-mocks-spies-stubs/

JavaScript testing library

Sinon.jsを使ったテストについて。
Sinon.jsのmock, stub, spyについて


Promise-based functions should not throw exceptions

www.2ality.com/2016/03/promise-rejections-vs-exceptions.html

JavaScript ECMAScript Promises

Promiseをベースとしてるasync/awaitを見据えながら、Promiseを返す関数は例外を投げないでrejectしたPromiseオブジェクトを返すべきという話


スライド、動画関係


ng-japan 2016 セッション資料まとめ - Qiita

qiita.com/nyamogera/items/b83833d1e15a55d0bb66

AngularJS イベント

ng-japan 2016の動画とスライドまとめ


The Case for CSS Modules

markdalgleish.github.io/presentation-the-case-for-css-modules/

CSS スライド

CSS Modulesについてのスライド


Fluent Conf 2016: Jeremy Fairbank - The rise of async JavaScript - YouTube

www.youtube.com/watch?v=QtgR94Q2pt4

JavaScript 動画

async/awaitがどのように動くのかをPromiseをベースとして解説してる。
エラーハンドリングの動作やasync functionがどのように動くのかを見ていく話


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


A Primer for Web Performance Timing APIs

w3c.github.io/perf-timing-primer/

web performance document

Web Performance Timing APIの概要をまとめたドキュメント


WebpackBin

www.webpackbin.com/

JavaScript webpack webservice

http://requirebin.com/ のwebpack版。
HTML/CSS/JavaScriptを書いて公開出来るサービス


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


GitHub - ozkxr/match: An JavaScript library to test JSON with some nice features.

github.com/ozkxr/match

JavaScript library JSON

JSONなどのオブジェクトに対してpredicate関数の結果を使ったmatchライブラリ


tusharmath/funjector: Dependency injection for functional paradigm

github.com/tusharmath/funjector

JavaScript library testing

関数に対するDIライブラリ。
部分適応した関数を作り、それに対してinjectできる仕組みを提供する


pmdartus/snapline: Unleash your screenshots stored in Chrome Devtool timeline files

github.com/pmdartus/snapline

Chrome debug 画像

Chrome開発者ツールのタイムラインをGIFアニメーション画像に変換出来るツール


書籍関係


Majesty Of… by Alex Kyriakidis et al. [Leanpub PDF/iPad/Kindle]

leanpub.com/vuejs/

JavaScript book

Vue.jsについての書籍


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