JSer.info #418 - Storybook 4.1がリリースされました。
PreviewエリアとMangerエリアを分離することでパフォーマンスの改善がされています。
また、Storybook 4.0ではReactのContext APIに依存していたため、React 16.3以降でしか動きませんでした。Storybook 4.1ではReact 15.xでも動作するように、後方互換性の修正が含まれています。
その他としてStorybook Addon Cssresourcesの追加などが行われています。
Babelで書かれたJavaScriptライブラリをTypeScriptへ移行する方法 | Web Scratchという記事では、TypeScriptへ段階的に移行する方法について書かれています。
Babelを使ってES2015で書かれていたライブラリを例に、ステップバイステップでTypeScriptへ段階的に移行する手順を紹介しています。
GitHubのスター数の増加数をまとめたJavaScript Rising Starsの2018年版が公開されています。
フロントエンドフレームワーク、フレームワークごとのエコシステム、Node.js、モバイル、コンパイラ(Transpiler)、ビルドツール、テストフレームワーク、エディタ、CSS in JS、静的サイト、GraphQLの項目別にまとめられています。
JSer.infoをサポートするには
- 😘 知り合いにJSer.infoをおすすめする
- ❤️ GitHub Sponsorsで@azuのスポンサーになる
- 🐦 X(Twitter)で@jser_infoをフォローする
JSer.info Sponsors
JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。
ヘッドライン
Storybook 4.1: Need for Speed – Storybook – Medium
medium.com/storybookjs/storybook-4-1-need-for-speed-b05fd5f1e83d
Storybook 4.1リリース。
パフォーマンスの改善、React 15.xの後方互換性を追加、 CSS Resources addonの追加など
Release Notes for Safari Technology Preview 73 | WebKit
webkit.org/blog/8555/release-notes-for-safari-technology-preview-73/
Safari Technology Preview 73リリース。
globalThisのサポート、Web Inspectorでm3u8の中身をテキスト表示できるようになるなど
Video.js 7.4 | Video.js Blog
blog.videojs.com/video-js-7-4/
Video.js 7.4リリース。
Live UIのサポート、VoiceOverの対応などアクセシビリティの改善など
Release v3.0.0 · juliangarnier/anime
github.com/juliangarnier/anime/releases/tag/v3.0.0
アニメーションライブラリのanime 3.0.0リリース。
新しいイージング関数の追加、ライフサイクル系のコールバックを追加、keyframesシステムの刷新など。
破壊的な変更点としてAPIが一部リネームされている
Release 1.1.0 · avajs/ava
github.com/avajs/ava/releases/tag/v1.1.0
AVA 1.1.0リリース。
実行中のテストファイルのパスなどを取得できるmetaオブジェクトの追加など
DoneJS 3
DoneJS 3リリース。
CanJS 5.0、StealJS 2.0へのアップデートなど
アーティクル
Babelで書かれたJavaScriptライブラリをTypeScriptへ移行する方法 | Web Scratch
efcl.info/2019/01/09/babel-to-typescript-library/
ライブラリのコードベースをTypeScriptへマイグレーションしていく方法について。
Babelで行っていたES2015からの変換処理をtscに移行し、コードベースをTypeScriptへと段階的に変換していくチュートリアル
TypeScript 2.8: Conditional Types — Marius Schulz
blog.mariusschulz.com/2019/01/09/typescript-2-8-conditional-types
TypeScript 2.8で導入されたConditional Typesについて。
Conditional Typesを使った型の分岐処理について、さまざまなコード例を紹介している。
NonNullable、Inferの利用例などについて
Computer science in JavaScript 2019: Linked list - Human Who Codes
humanwhocodes.com/blog/2019/01/computer-science-in-javascript-linked-list/
JavaScriptでLinkedListを実装しながら、そのデータ構造について学ぶ記事
Vue + Vue Router + Vuex + Laravelで写真共有アプリを作ろう (1) イントロダクション | Hypertext Candy
www.hypertextcandy.com/vue-laravel-tutorial-introduction
Vue.js + Vue Router + Laravelを使ったSPAアプリケーションを作成する連載記事。
写真共有アプリを例にクライアントサイドとサーバサイドをどちらも作成していくチュートリアル
How To Learn CSS — Smashing Magazine
www.smashingmagazine.com/2019/01/how-to-learn-css/
CSSをどのように学ぶかについての記事。
Selector、Boxモデル、Flow、Layout、Aligment、SizingなどCSSの基礎となる要素について解説やリソースを紹介している
Front-End Performance Checklist 2019 [PDF, Apple Pages, MS Word] — Smashing Magazine
www.smashingmagazine.com/2019/01/front-end-performance-checklist-2019-pdf-pages/
フロントエンドに関するパフォーマンスチェックリスト
Fast GIF parsing on the web with WASM + Wuffs - DEV Community 👩💻👨💻
dev.to/chromiumdev/fast-gif-parsing-on-the-web-with-wasm--wuffs-48l4
GIFパースをEmscripten + WebAssemblyで行う話。
どのようにbindingを作成し、デコード処理をして、Canvasで描画するかについて
サイト、サービス、ドキュメント
2018 JavaScript Rising Stars
JavaScript関係のプロダクトにおける、2018年のGitHubスター数の増加数ランキングが公開された
Markdown Driven な scaffolding ツールを作った - wadackel.me
blog.wadackel.me/2019/scaffdog/
Markdownの1ファイルに複数のファイルテンプレートを書いて、複数ファイルを出力できるファイル生成ツール
FromJS - An experimental data-flow analysis tool for front-end JavaScript
表示されている文字列がコードのどこで生成されているかをDOMインスペクトできるツール。
HTMLを生成するDOM APIを上書きして、トレースできるようにしたChromeを立ち上げデバッグできるようにしている。
ソフトウェア、ツール、ライブラリ関係
DominicTobias/keshi: A better in-memory cache for Node and the browser
github.com/DominicTobias/keshi
ブラウザとNode.jsで動くインメモリキャッシュライブラリ
