JSer.info #315 - webpack 2.xの正式版としてwebpack v2.2.0がリリースされました。
公式サイトも2.xに対応したものとなっています。
設定ファイル周りの細かい変更が多いですが、v1からv2への移行ガイドも公開されているので合わせて見ると良いです。
また、webpack 2では、TreeShakingと呼ばれる機能が追加されています。
今後の機能追加や改善については、投票ツールを通じて決定していくようです。
(投票の重み付けに利用されているOpen Collectiveについてのスライドを書いたので、併せてみるといいかもしれません)
投票のサイトを見ると今のところ次の開発候補としてはScope Hoisting(Rollupインスパイアな最適化)、Typescript周りの改善などが上がっているようです。
Modern JavaScript概観、そしてElectronへという記事では、JavaScriptの開発環境設定について書かれています。
型、Babelのエコシステム、Lint、テスト、UIフレームワーク、CSS、アーキテクチャ、ビルドなど幅広い内容を扱っています。
また、どのような選択肢からなぜそのツール/ライブラリを選んだのかという点について詳しく書かれています。
2016 JavaScript Rising Starsというサイトでは、2016年においてGitHub Starの増加率でランキングした結果がまとめられています。
それぞれのリポジトリ(ライブラリやツールなど)に対する説明が書かれているので、一度見てみると良いかもしれません。
ヘッドライン
Release v2.2.0 · webpack/webpack
github.com/webpack/webpack/releases/tag/v2.2.0
webpack 2.2.0正式版リリース。
TestCafe v0.12.0 Released | TestCafe
devexpress.github.io/testcafe/blog/testcafe-v0-12-0-released.html
TestCafe v0.12.0リリース。
ベーシック認証/NTLM認証のサポート、CIでの動作改善、テストのスキップ、test.beforeとtest.afterの追加、ESLintプラグインの追加など
アーティクル
Modern JavaScript概観、そしてElectronへ
blog.satotaichi.info/modern-javascript_201701/
JavaScriptの環境設定をめぐる試行について。
TypeScriptやFlowなどの型システム、Babelのエコシステム、Lint、テストフレームワーク、UIフレームワーク、CSS、アーキテクチャ、ビルドなど。
幅広いツール/ライブラリの中で、どのような考えで何を選んだかについて書かれている。
アメブロ2016 ~ Isomorphic JavaScriptの詳しい話 | CyberAgent Developers Blog | サイバーエージェント デベロッパーズブログ
developers.cyberagent.co.jp/blog/archives/3513/
クライアントサイドとサーバサイドのどちらでも動くIsomorphicなJavaScriptを書くために気をつける点について。
Reactコンポーネント、Fetch、スタイルシート、環境変数、ルーティング、表示領域の扱い，パフォーマンス計測についてなど
Making transpiled ES modules more spec-compliant
www.2ality.com/2017/01/babel-esm-spec-mode.html
ES Modulesの仕様と現在のTranspilerの挙動について。
ECMAScriptとNode.jsのモジュールのInteroperabilityについて
Module Bundling and Webpack in Simple Terms
arianv.com/post/Module-Bundling-and-Webpack-in-Simple-Terms/
webpackがどのようにモジュールをbundleしているかを丁寧に解説した記事
TypeScript 2.1: Mapped Types | Marius Schulz
blog.mariusschulz.com/2017/01/20/typescript-2-1-mapped-types
TypeScript 2.1で入ったMapped Typesについて。
Object.freezeなどを例にMapped Typesの使い方を解説している
Dragons when upgrading from Angular 2.1.x to 2.4.x – Medium
medium.com/@abookone/dragons-when-upgrading-from-angular-2-1-x-to-2-4-x-530de5a763cb
Angular 2.1から2.4へのアップデートにおけるハマりどころについて
Vue + Vuex — Getting started – Medium
medium.com/@bradfmd/vue-vuex-getting-started-f78c03d9f65
Vuexについての導入チュートリアル
Server-side Rendering Shootout with Marko, Preact, Rax, React and Vue
hackernoon.com/server-side-rendering-shootout-with-marko-preact-rax-react-and-vue-25e1ae17800f
UIライブラリ/テンプレートエンジンであるMarkoのサーバサイドレンダリングの高速化手法について。
Marko v4ではブラウザとサーバで出力方式を変えている。
クライアントサイドではVirtual DOMを使い、サーバサイドでは文字列結合をベースとした出力を使い分けている。
- Marko v4 Multiple Compilation Targets
- feat: add marko by mlrawlings · Pull Request #11 · taobaofed/server-side-rendering-comparison
- marko/ROADMAP.md at master · marko-js/marko
3 New CSS Features to Learn in 2017
bitsofco.de/3-new-css-features-to-learn-in-2017/
最近のブラウザで利用できる新しいCSSの機能について。
Feature Queries、Grid Layout、CSS Variables
ES2016 / ES2017の最新動向を追ってみた - Qiita
qiita.com/yuyake0084/items/3c901f37ed7333d4da16
ES2016、2017で追加された構文や機能について
Introduction to WebAssembly — Rasmus Andersson
WebAssemblyの中身を見ていく話。
セマンティクス、type section、メモリアドレス、JavaScriptのAPIについて
Functional Programing in Javascript | Lifelong Learning
vmayakumar.wordpress.com/2017/01/17/functional-programing-in-javascript/
JavaScriptでの関数型プログラミングについて。
Adequate/mostly-adequate-guideを元にしている
サイト、サービス、ドキュメント
2016 JavaScript Rising Stars
2016年にGitHubのstarの増加率でランキングをつけた結果について。
それぞれのライブラリやツールについても簡単に解説されている
ソフトウェア、ツール、ライブラリ関係
Voca: The JavaScript string library
文字列操作系のUtils集ライブラリ
lorenzofox3/zora: A less than 200 lines of code javascript test harness for nodejs and the browser
Generatorを使った小さなテストフレームワーク
alibaba/rax: A universal React-compatible render engine.
ReactライクなAPIを持つUniversalなViewライブラリ。
ブラウザだけではなく、アプリ(Weex)やサーバでも動作させることが目的。
- rax/difference-with-react.md at master · alibaba/rax
- Weex
- (question) Inferno/Preact comparison · Issue #81 · alibaba/rax
