JSer.info #212 - 元OperaのCEOによるChromiumベースのブラウザであるVivaldiのTechinial Preview版が公開されました。
- Meet Vivaldi, A New Browser From the Former CEO of Opera
- Former Opera CEO Launches Vivaldi, A New Browser For Power Users | TechCrunch
Opera 12ユーザーに向けての機能が多く搭載されている感じで、Chroniumをベースとしているのでレンダリングエンジンは現在のOperaと同じくBlinkが使われているようです。
lodash v3.0.0がリリースされました。
String関係のメソッドの追加、関数型スタイルで使うためのメソッドの追加などがされました。
またnpm instal lodash.foreachというように個々のモジュールとして入れることは以前から可能でしたが、この時の依存関係のツリーがシンプルになるように改善されました。
加えてパフォーマンス面でもlazy chainingの導入やES6のSet & WeakMapを利用することで大きく改善されたようです。
A Journey Through Client-Side Testing with JavaScript -Telerik Developer NetworkではJavaScriptテストについて幅広く書かれています。
JavaScriptのテストと言っても色々な役割を持つ組み合わせで動いてることが多く、AssertionやTest Runnerとはどういうものがあるかについて書かれています
またTodoMVCを例にテストの実行についても紹介していて、ユニットテストというよりIntegration Testsという感じの話となっています。
最近、Integration Testsの話としてTestiumについて書いたのでこちらも合わせてみるといいかもしれません。
JSer.infoをサポートするには
- 😘 知り合いにJSer.infoをおすすめする
- ❤️ GitHub Sponsorsで@azuのスポンサーになる
- 🐦 X(Twitter)で@jser_infoをフォローする
JSer.info Sponsors
JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。
ヘッドライン
Vivaldi - A new browser for our friends
元Opera CEOが始めたブラウザ。
Chromium(Blink)をベースにしていて、UIにReact等ウェブの技術を使用している。
Chromium Blog: Chrome 41 Beta: New ES6 Features and Improved DevTools for Service Workers and Web Animations
blog.chromium.org/2015/01/chrome-41-beta-new-es6-features-and.html
Chrome 41βリリース。
ES6 Template Literals、Web Animationsのデバッグ機能、image-rendering: pixelatedのサポート等
Release 2.5.0 · groupon-testium/testium
github.com/groupon-testium/testium/releases/tag/v2.5.0
Integration Testフレームワークのtestium 2.5.0リリース。
日本語などの入力ができない問題の修正やエラー表示の改善、Element.prototype.getElementの実装など
Release 3.0.0 · lodash/lodash
github.com/lodash/lodash/releases/tag/3.0.0
lodash v3.0.0リリース。
String関係のメソッドの追加、関数型スタイルで使いやすいメソッドの追加、個々のモジュールとして入れた時の依存関係をシンプルに、パフォーマンスの改善、lazy chainingの導入等
- Changelog · lodash/lodash Wiki
- How to Speed Up Lo-Dash ×100? Introducing Lazy Evaluation. | Filip Zawada
Release JSHint 2.6.0 · jshint/jshint
github.com/jshint/jshint/releases/tag/2.6.0
JSHint 2.6.0リリース。
ESLint 0.13.0 released - ESLint
eslint.org/blog/2015/01/eslint-0.13.0-released/
ESLint 0.13.0リリース。
Template strings、デフォルトパラメータ等のES6サポート改善、ブロックスコープの挙動を修正等
アーティクル
テストできないコードをE2Eテストを使ってリファクタリングしよう | Web Scratch
efcl.info/2015/01/24/testium-e2e-refactoring/
E2EテストフレームワークのTestiumの紹介とリファクタリングについて。
Mocha+Testium+power-assertでユニットテストと同じようにE2Eテストを書くための設定やサンプル
Fetch API in action
blog.gospodarets.com/fetch_in_action
Fetch APIについての紹介。
レスポンスのステータスコード、レスポンスのJSONパース、タイムアウトの問題、使い方、polyfillについて
Destructuring and parameter handling in ECMAScript 6
www.2ality.com/2015/01/es6-destructuring.html
ES6のDestructuring(分割代入、構造化代入)と引数時の扱いについて。
またSpread operatorを使った値の展開についても書かれてる
Strange JavaScript Errors and How to Fix Them
davidwalsh.name/fix-javascript-errors
JavaScriptのエラーメッセージとそれがどのようなときに起きてるエラーなのか、また修正方法について
addyosmani/es6-equivalents-in-es5
github.com/addyosmani/es6-equivalents-in-es5
ES6で書かれたものとES5で同等の事を行うコードを並べて、ES6の機能について紹介
Getting Literal With ES6 Template Strings
updates.html5rocks.com/2015/01/ES6-Template-Strings
ES6 Template Stringsについての解説
5分でわかる正しい Web サイト常時 SSL 化のための基礎知識 | WWW WATCH
hyper-text.org/archives/2015/01/full_time_ssl_website_quick_start.shtml
SSLの効果 - メリットとデメリット、SSL証明書の種類と取得方法、外部リソースの読み込みとMixed Content、HTTPSに接続を強制する方法 - HSTS、リダイレクト、CookieのSecure属性などについて
ES6 Module Gotchas | geedew
www.geedew.com/2014/12/26/es6-module-gotchas/
ES6 modulesのアンチパターンについて。
静的なものを扱うデザインであるという話、オブジェクトをexportした場合の問題、副作用を目的としたモジュールの読込方法、export defaultを出来るだけ使うべき等
New animation controls in Chrome Canary | Val Head - Designer
www.valhead.com/2015/01/06/quick-tip-chrome-animation-controls/
ChromeのCSS animationのデバッグ機能についての紹介
What the Virtual Viewport?
updates.html5rocks.com/2015/01/virtual-viewport
Chrome 39と40でviewportの仕組みが変わった。
40からLayout ViewportとVisual Viewportに分かれて処理されるようになった。(IEと同様)
ズーム時にposition: fixedな要素等の動作の違いがでる。
A Journey Through Client-Side Testing with JavaScript -Telerik Developer Network
developer.telerik.com/featured/journey-client-side-testing-javascript/
JavaScriptのテスト全体について書かれた記事。
テストフレームワーク、Assertionライブラリ、Test Runnerなどテストを構成する要素。
mocha-phantom、karma、DalekJS、Atomusでの実行方法について
スライド、動画関係
Functional programming in javascript (intro) // Speaker Deck
speakerdeck.com/geekingfrog/functional-programming-in-javascript-intro
JavaScriptと関数型プログラミングについてのスライド。
Web Componentsのアクセシビリティ
www.slideshare.net/mlca11y/web-components-43883982
Web Componentsとアクセシビリティについてのスライド。
既存要素があるケースと独自要素の場合はWAI-ARIAを使うことについて
サイト、サービス
CSS Flexbox Please!
CSS Flexboxのプロパティをその場で変更したりして動作を試せるデモページ
ソフトウェア、ツール、ライブラリ関係
Diet.js
Node.jsのウェブアプリケーションフレームワーク
yoshuawuyts/promise-each
github.com/yoshuawuyts/promise-each
Promiseと組み合わせて使えるeach、every、filter、map、reduce、some等の関数をそれぞれモジュール化したもの
Home | Aurelia
Durandalの次世代となるJavaScriptフレームワーク。 ES6(or AltJS) + jspm、two-way binding、DI、ルーティング等を盛り込んだフレームワーク。
元AngularJSチームの人が開発してる
shiwano/typhen
d.tsからJSON Schemaを作ったり、Handlebarsを使ったテンプレートでコードやドキュメントを出力できるツール
Wallaby - intelligent test runner for JavaScript
JetBrains IDE等と統合して使えるTest Runner。
Mocha、QUnit、Jasmine等が使えて、コードカバレッジをエディタ上に表示、テストケースを一部だけ実行などが出来る。
spy-jsの人が作ってる
