[{"meta":{"title":"JSer.infoをTumblrからGitHub Pagesに移行しました","author":"azu","layout":"post","category":"Article","tags":["Jekyll","GitHub"],"date":"2014-08-03T00:00:00.000Z","url":"https://jser.info/2014/08/03/renewal/"},"items":[]},{"meta":{"title":"2014-08-04のJS: traceur-compiler入門、Eloquent JavaScript第二版","category":"JSer","author":"azu","layout":"post","tags":["ES6","traceur","book","JSer.info"],"date":"2014-08-04T00:00:00.000Z","url":"https://jser.info/2014/08/04/traceur-eloquentjavascript/"},"items":[{"category":"Headline","title":"Announcing Scala.js 0.5.3","url":"http://www.scala-js.org/news/2014/07/30/announcing-scalajs-0.5.3/","tags":["JavaScript","scala","ReleaseNote"],"content":"Scala.js 0.5.3 リリース。\n\nパフォーマンスの改善","relatedLinks":[]},{"category":"Headline","title":"V8 Memory Corruption and Stack Overflow (fixed in Node v0.8.28 and v0.10.30)","url":"http://blog.nodejs.org/2014/07/31/v8-memory-corruption-stack-overflow/","tags":["node.js","ReleaseNote","セキュリティ"],"content":"Node 0.10.xと0.8.xのsecurity fix.","relatedLinks":[]},{"category":"Headline","title":"Vue.js 0.10.6, and what&#x27;s next - vue.js","url":"http://vuejs.org/2014/07/29/vue-next/","tags":["JavaScript","ReleaseNote","library"],"content":"Vue.js 0.10.6リリース。\n\nVue-nextについても書かれている。\n\nスクラッチで書きなおしている理由として、デザインの問題とコードの質の改善を上げてる。","relatedLinks":[]},{"category":"Headline","title":"Brackets 0.42 Release (Themes!) – Brackets Blog","url":"http://blog.brackets.io/2014/08/01/brackets-0-42-release-themes/","tags":["JavaScript","IDE","ReleaseNote"],"content":"Brackets 0.42リリース。\n\n言語切替とテーマのサポート","relatedLinks":[]},{"category":"Article","title":"JavaScript and V8 TurboFan","url":"http://ariya.ofilabs.com/2014/08/javascript-and-v8-turbofan.html","tags":["JavaScript","V8"],"content":"V8にlandedしたばかりの新しいOptimizing compilerであるTurboFanについての解説。\n\nCrankshaftの後任的なものでまだ開発が始まったばかり","relatedLinks":[{"title":"[","url":"https://groups.google.com/forum/#!msg/v8-dev/ab8V5Z58_70/5-05DvysCt8J"}]},{"category":"Article","title":"3 New JavaScript APIs You May Want to Follow","url":"http://www.sitepoint.com/3-new-javascript-apis-may-want-follow/","tags":["WebPlatformAPI","JavaScript"],"content":"最近ドラフトがリリースされたWeb Alarms API, Presentation API, Standby APIについて","relatedLinks":[]},{"category":"Article","title":"Event listeners popup, @media sidebar, Cubic bezier editor + more – Firefox Developer Tools Episode 33 ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2014/07/event-listeners-popup-media-sidebar-cubic-bezier-editor-more-firefox-developer-tools-episode-33/","tags":["firefox","debug","tools"],"content":"Firefox33に入る開発者ツールの機能紹介。\n\nDOMから関連するイベントリスナーの表示、media queryのルール表示、イージングエディタ、コマンドの追加、min.jsをデバッグの対象外にする機能等","relatedLinks":[]},{"category":"Article","title":"Using ECMAScript 6 today","url":"http://www.2ality.com/2014/08/es6-today.html","tags":["JavaScript","ECMAScript","Tools"],"content":"今日から使えるES6について。\n\nES6の機能のハイライトやライブラリやツール、Traceur等のTranspilerについて。","relatedLinks":[]},{"category":"Article","title":"traceur-compiler 入門 - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2014/07/31/093041","tags":["ECMAScript","JavaScript","tools","google"],"content":"traceur-compilerについての解説。\n\nES6のコードをES5で実行出来るように変換(要runtime)、対応してるES6の構文、ExperimentalなES7の機能、メリット・デメリット、類似ツールについて。","relatedLinks":[]},{"category":"Article","title":"Atom Shell vs Node-Webkit - 牛角堂","url":"http://blog.iwege.com/posts/atom-shell-vs-node-webkit.html","tags":["atom","node-webkit"],"content":"Atom Shellとnode-webkitの比較(中国語)\n\nentry-pointの違い、Chromiumアップデートの対応(ビルドシステム)、マルチコンテキスト、プロセス分離とコミュニケーション、パッケージ管理などについてよくまとまってる。","relatedLinks":[]},{"category":"Article","title":"EcmaScript 6 Template Strings | mozintern","url":"http://mozintern.wordpress.com/2014/07/31/ecmascript-6-template-strings-2/","tags":["firefox","JavaScript"],"content":"Firefox34あたりで入るTemplate Stringsについて","relatedLinks":[]},{"category":"SlideVideo","title":"AngularJS入門の巻","url":"http://www.slideshare.net/itokami1123/angularjs-34533999","tags":["AngularJS","スライド"],"content":"AngularJSのデータバインディング、モジュール、スコープとデータの反映についてのスライド。","relatedLinks":[]},{"category":"WebsiteDocument","title":"CSS Triggers...","url":"http://csstriggers.com/","tags":["CSS","検索","まとめ"],"content":"CSSプロパティ別にreflowやrepaintの発生、Compositeが可能かどうかが一覧出来る。\n\nChrome DevToolsで調べた結果を元にしてる。","relatedLinks":[{"title":"Aerotwist - CSS Triggers","url":"http://aerotwist.com/blog/css-triggers/"}]},{"category":"WebsiteDocument","title":"Opinionated AngularJS styleguide for teams","url":"http://toddmotto.com/opinionated-angular-js-styleguide-for-teams/","tags":["AngularJS","JavaScript"],"content":"AngularJSのコーディングスタイルガイド。","relatedLinks":[{"title":"AngularJS styleguide 日本語訳 - AngularJS Ninja","url":"http://angularjsninja.com/blog/2014/07/29/angularjs-styleguide-in-Japanese/"}]},{"category":"WebsiteDocument","title":"Highlights from recent Chromium, Blink, Skia and v8 commits","url":"http://commits.peter.sh/","tags":["Chrome","blink","V8","git"],"content":"Chromium,Blink,Skia,V8のコミットハイライトをまとめてるpeterさんのサイト。\n\nRSSも追加された","relatedLinks":[]},{"category":"SoftwareLibrary","title":"flerro/jop","url":"https://github.com/flerro/jop","tags":["JSON","console","Tools"],"content":"Node.js製のJSONを扱うコマンドラインツール。\n\n整形表示、データのフィルタリング、カウント、グループング、変換等。jq的なツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"facebook/immutable-js","url":"https://github.com/facebook/immutable-js","tags":["JavaScript","関数型プログラミング","library"],"content":"immutableなVector、Map、Set等を提供してくれるライブラリ。\n\nそれぞれ同名のオブジェクトと同じメソッドを提供してくれるのと、遅延シーケンスに対応してる。\n\nES6で書かれていて、変換したものを配布している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"DOM Event Delegation without jQuery | Matt Andrews","url":"https://mattandre.ws/2014/08/small-beautiful-dom-delegation/","tags":["DOM","JavaScript","library"],"content":"依存がないシンプルなDOM delegateライブラリ。\n\nelementを取って、そこに対してイベントを設定出来る","relatedLinks":[{"title":"ftlabs/ftdomdelegate","url":"https://github.com/ftlabs/ftdomdelegate"}]},{"category":"Book","title":"Eloquent JavaScript","url":"http://eloquentjavascript.net/","tags":["JavaScript","book"],"content":"Eloquent JavaScript第二版がリリースされた","relatedLinks":[]},{"category":"Book","title":"Amazon: 入門Backbone.js (Programmer&#x27;s SELECTION): James Sugrue","url":"http://www.amazon.co.jp/dp/479813712X?tag=amazon0abac-22","tags":["backbone.js","翻訳","book"],"content":"2014年8月29日発売\n\n<a href='http://www.apress.com/9781430263340'>http://www.apress.com/9781430263340</a> の翻訳本","relatedLinks":[]}]},{"meta":{"title":"2014-08-11のJS: WebStorm 9 EAP、Server Sent Events、IEのサポートサイクル","category":"JSer","author":"azu","layout":"post","tags":["JavaScript","WebStorm","SSE","IE","Windows"],"date":"2014-08-11T00:00:00.000Z","url":"https://jser.info/2014/08/11/WebStorm9EAP-SSE-IE/"},"items":[{"category":"Headline","title":"wu.js 2.0","url":"http://fitzgeraldnick.com/weblog/58/","tags":["ECMAScript","関数型プログラミング","JavaScript","library","ReleaseNote"],"content":"mapやreduceのような高階関数を提供するwu.js2.0リリース。\n\nES6に対応してGenerator関数なども受け取って処理することが出来るようになった。","relatedLinks":[{"title":"wu.js 2.0","url":"http://fitzgeraldnick.com/weblog/58/"}]},{"category":"Headline","title":"WebStorm 9 EAP is Open! | JetBrains WebStorm Blog","url":"http://blog.jetbrains.com/webstorm/2014/08/webstorm-9-eap/","tags":["WebStorm","ReleaseNote"],"content":"WebStorm 9 EAPリリース。\n\nLive Editの強化、JavaScriptのトレーシングを行うSpy-jsがNode.jsに対応、PhoneGap対応、`.if`などを末尾から補完出来る、Postfix templates の追加、EditorConfig、Web Componentsの対応","relatedLinks":[]},{"category":"Article","title":"Server Sent Events(SSE)の使いどころと使い方 | GREE Engineers&#x27; Blog","url":"http://labs.gree.jp/blog/2014/08/11070/","tags":["JavaScript","W3C","XHR","WebSocket"],"content":"Server Sent Eventsについての解説。\n\nCometと違い標準仕様が定義されている点や、WebSocketと違いHTTPを使うため通信的な互換性が高くあり、Polyfillが作れる事や現状の問題点について書かれている","relatedLinks":[{"title":"Server Side Events","url":"http://www.slideshare.net/thepilif/server-side-events"},{"title":"リアルタイムWebの栄光を願い","url":"http://0-9.sakura.ne.jp/pub/HTML5han/start.html"},{"title":"Fanout Blog » You might not need a WebSocket","url":"http://blog.fanout.io/2014/06/24/you-might-not-need-a-websocket/"}]},{"category":"Article","title":"The State of the Componentised Web - Blog - Events, News, and Videos for Web Designers and Developers","url":"http://www.futureinsights.com/home/the-state-of-the-componentised-web.html","tags":["JavaScript","MVC","WebComponents"],"content":"ウェブにおけるコンポーネントの流れについて。\n\nAngularやEmberなどがもつコンポーネントを作る機能の紹介とWeb Componentsについて簡単にまとまってる","relatedLinks":[]},{"category":"Article","title":"Why Web Components Are Ready For Production -Telerik Developer Network","url":"http://developer.telerik.com/featured/web-components-ready-production/","tags":["WebComponents"],"content":"Web Componentsは複雑で現時点ではpolyfillは難しいが、Custom Elementに関してはシンプルなAPIであるためPolyfillが簡単で、現実に使うことができるという話","relatedLinks":[]},{"category":"Article","title":"Best Practices for Building Angular.js Apps with BrowerifyModern Web","url":"http://medium.com/@dickeyxxx/best-practices-for-building-angular-js-apps-266c1a4a6917","tags":["AngularJS","browserify"],"content":"Angular.JSにはmodule機能があるため、BrowserifyやRequire.JSのようなビルドを使わなくてもconcatするだけでも問題ないという話。\n\nconcatでもsourcemapは対応できて、何よりシンプル。","relatedLinks":[]},{"category":"Article","title":"Stay up-to-date with Internet Explorer - IEBlog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/ie/archive/2014/08/07/stay-up-to-date-with-internet-explorer.aspx","tags":["IE","ReleaseNote"],"content":"2016年1月12日からWindows OSとIEのバージョンのサポートサイクルが変更される。\n\nOSごとの最新版のIEのみをサポート対象として、後方互換性はエンタープライズモードを使えという方針になった","relatedLinks":[{"title":"Internet Explorer のサポートライフサイクルが変更されます ","url":"http://hebikuzure.wordpress.com/2014/08/08/lifecycle-change-on-internet-explorer/"}]},{"category":"Article","title":"Speeding up AngularJS apps with simple optimizations - Tutorial - Binpress","url":"http://www.binpress.com/tutorial/speeding-up-angular-js-with-simple-optimizations/135","tags":["AngularJS","performance"],"content":"AngularJSパフォーマンス改善Tips.\n\n一度きりのバインディング、$scope.$apply() と $scope.$digest()の違い、ng-repeat、ディレクティブ内でのDOM操作について","relatedLinks":[]},{"category":"Article","title":"Using PDF.js web worker cross domain (CORS) | ColonelPanic","url":"http://colonelpanic.net/2014/08/using-pdf-js-web-worker-cross-domain-cors/","tags":["JavaScript","webworker"],"content":"WebWorker内でXHRをして取得したリソースを、`URL.createObjectURL`でblob URLにして、blob URLを受け取って使うという話","relatedLinks":[]},{"category":"SlideVideo","title":"tc39-notes/es6/2014-07 at master · rwaldron/tc39-notes","url":"https://github.com/rwaldron/tc39-notes/tree/master/es6/2014-07","tags":["ECMAScript","資料"],"content":"2014年7月度のECMAScriptの仕様策定に関するTC39 Meeting Notesが公開された。\n\ntest262の大幅な改善、SIMD-128、指数演算子についてなど","relatedLinks":[{"title":"bterlson/test262-harness","url":"https://github.com/bterlson/test262-harness"},{"title":"simd-128-tc39.pdf","url":"http://esdiscuss.org/notes/2014-07/simd-128-tc39.pdf"},{"title":"Exponentiation Operator: ","url":"https://gist.github.com/rwaldron/ebe0f4d2d267370be882"}]},{"category":"SoftwareLibrary","title":"trek/pretender","url":"https://github.com/trek/pretender","tags":["JavaScript","library","HTTP","testing"],"content":"HTTPモックライブラリ。\n\nXHRをFakeXHRにすり替えておき、リクエストに対するレスポンスを定義して、任意のリソースへのリクエストをテストするモックライブラリ。","relatedLinks":[{"title":"trek/FakeXMLHttpRequest","url":"https://github.com/trek/FakeXMLHttpRequest"}]},{"category":"SoftwareLibrary","title":"github/time-elements","url":"https://github.com/github/time-elements","tags":["github","WebComponents"],"content":"GitHubで使われている`<time>`のCustom Elementsライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Wisembly/basil.js","url":"https://github.com/Wisembly/basil.js","tags":["JavaScript","library"],"content":"localstorage, cookie, session storage, in memoryにおいて統一的なAPIで扱えるメソッドを提供してくれるライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rakuten-nlp/rakutenma","url":"https://github.com/rakuten-nlp/rakutenma","tags":["JavaScript","library"],"content":"形態素解析器ライブラリ。\n\n日本語と中国語の文から単語単位に分割し、品詞を付与出来る","relatedLinks":[{"title":"Twitter / rakuten","url":"https://twitter.com/rakuten_tech/status/496913434668064768"}]}]},{"meta":{"title":"2014-08-19のJS: Sass 3.4、Compass 1.0、IE11/F12開発者ツール","category":"JSer","author":"azu","layout":"post","tags":["JavaScript","Sass","Compass","IE","debug"],"date":"2014-08-19T00:00:00.000Z","url":"https://jser.info/2014/08/19/sass-compass-ie11/"},"items":[{"category":"Headline","title":"Sass 3.4 is Released « Sass Blog","url":"http://blog.sass-lang.com/posts/221239-sass-34-is-released","tags":["Sass","ReleaseNote"],"content":"Sass 3.4 リリース。\n\nparent selector `&`の扱いを改善、Selector Functionsで`&`を使えるように。`@error` ディレクティブの追加、sourcemapの生成がデフォルトになるなど","relatedLinks":[{"title":"File: SASS","url":"http://sass-lang.com/documentation/file.SASS_CHANGELOG.html"},{"title":"@error directive · Issue ","url":"https://github.com/sass/sass/issues/747"}]},{"category":"Headline","title":"Compass 1.0 is Released! | Compass Documentation","url":"http://compass-style.org/blog/2014/08/15/omg-compass-1-0/","tags":["Sass","library","ReleaseNote"],"content":"Compass 1.0リリース。\n\nベンダーprefixはcaniuseを利用、コマンドラインツールなしにライブラリとして利用可能に、sourcemapサポート、import-onceでのパフォーマンス改善等","relatedLinks":[]},{"category":"Headline","title":"Release JSHint 2.5.4 · jshint/jshint","url":"https://github.com/jshint/jshint/releases/tag/2.5.4","tags":["JavaScript","Tools","ReleaseNote"],"content":"JSHint 2.5.4リリース。","relatedLinks":[]},{"category":"Headline","title":"August updates for Internet Explorer - IEBlog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/ie/archive/2014/08/13/august-updates-for-internet-explorer.aspx","tags":["IE","ReleaseNote"],"content":"2014年8月のIE11のアップデートについて。\n\nF12開発者ツールの改善、WebGLの改善、WebDriverのサポート","relatedLinks":[{"title":"Announcing new F12 dev tools features in August update - IEBlog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/ie/archive/2014/08/14/announcing-new-f12-dev-tools-features-in-august-update.aspx"}]},{"category":"Headline","title":"jQuery UI 1.11.1 | jQuery UI Blog","url":"http://blog.jqueryui.com/2014/08/jquery-ui-1-11-1/","tags":["jQuery","UI","ReleaseNote"],"content":"jQuery UI 1.11.1リリース","relatedLinks":[]},{"category":"Headline","title":"Knockout 3.2.0 released - Steve Sanderson’s blog - As seen on YouTube™","url":"http://blog.stevensanderson.com/2014/08/18/knockout-3-2-0-released/","tags":["JavaScript","MVC","library","ReleaseNote"],"content":"Knockout 3.2.0リリース。\n\nComponents、Custom Elements、textInputのバインディングなどの追加。\n\nIE6のサポートは維持","relatedLinks":[]},{"category":"Headline","title":"Release v0.8.0: Release 0.8.0 (2014-08-12) · twada/power-assert","url":"https://github.com/twada/power-assert/releases/tag/v0.8.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"power-assert 0.8.0リリース。\n\nespowerのオプションでアサーションの指定がescallmatchを使ったパターンを渡す方法に変更。デフォルト設定を使っている場合はそのまま維持される。","relatedLinks":[{"title":"twada/escallmatch","url":"https://github.com/twada/escallmatch"}]},{"category":"Article","title":"長期かつ修正頻度の高いPJでのCSSメンテ - ワザノバ | wazanova","url":"http://wazanova.jp/items/1484","tags":["CSS","設計","翻訳"],"content":"大規模プロジェクトでのCSSのメンテナンスビリティについて。\n\n- DRYより修正する時に迷わず消せるような疎結合なコンポーネントである方が長期的にはよかった\n- プロジェクトにおける命名ルールを持つことはいいこと\n- コンポーネントに名前空間をもたせると分かりやすいこと\n- ファイルの管理について\n- ライブラリmixinの問題について\n\n等、実践的な事について書かれていて参考になります。","relatedLinks":[{"title":"Enduring CSS: writing style sheets for rapidly changing, long-lived projects - Author and responsive web developer Ben Frain","url":"http://benfrain.com/enduring-css-writing-style-sheets-rapidly-changing-long-lived-projects/"}]},{"category":"Article","title":"Opinionated Rundown of JS Frameworks | Blog","url":"http://blog.andyet.com/2014/08/13/opinionated-rundown-of-js-frameworks","tags":["JavaScript","MVC","まとめ"],"content":"HumanJSの人によるJavaScript MV*のまとめ\n\nAngular/Ember/React/Polymer/Backbone.js/Vanilla/Ampersand.js","relatedLinks":[{"title":"シングルページアプリづくりのJavaScriptフレームワーク比較 - ワザノバ ","url":"http://wazanova.jp/items/1474"}]},{"category":"Article","title":"Web Reflection: PointerEvents No More","url":"http://webreflection.blogspot.com/2014/08/pointerevents-no-more.html","tags":["Chrome","event"],"content":"BlinkはPointerEventsを実装しないことにした事について。\n\n- touch eventsが既にある\n- hit-testモデルがパフォーマンス的に不利\n- 複雑すぎる\n\n等が主な理由。","relatedLinks":[{"title":"Issue 162757 - chromium - Implement pointer events in Chrome behind experimental flag - An open-source project to help move the web forward. - Google Project Hosting","url":"https://code.google.com/p/chromium/issues/detail?id=162757#c64"},{"title":"PSA: PointerEvents and PointerGestures are being replaced by polymer-gestures, breaking changes for pointer","url":"https://groups.google.com/forum/#!topic/polymer-dev/ba4aDyOozm8"}]},{"category":"Article","title":"Announcing new F12 dev tools features in August update - IEBlog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/ie/archive/2014/08/14/announcing-new-f12-dev-tools-features-in-august-update.aspx","tags":["IE","debug"],"content":"IE11のF12開発者ツールの変更点について。\n\nカラーピッカー、sourcemapの選択機能、補完の強化、Asyncコールスタック、パフォーマンス、メモリパネルでセッションをimport/exportが可能になる等","relatedLinks":[{"title":"米MS、8月のIE11更新で強化された「F12開発者ツール」の新機能を紹介：CodeZine","url":"http://codezine.jp/article/detail/8034"}]},{"category":"Article","title":"古めかしいCGを描くためのライブラリ gretro です - 音の鳴るブログ","url":"http://mohayonao.hatenablog.com/entry/2014/08/12/111859","tags":["JavaScript","canvas","library"],"content":"Canvasで描くとどうしてもモダンな感じになってしまうという問題を解決するライブラリ。\n\n色やパターンを絞ってレトロな感じのCanvasを描画出来る","relatedLinks":[]},{"category":"SlideVideo","title":"ESNext for humans - LvivJS 16 August 2014","url":"http://www.slideshare.net/janjongboom/esnext-for-humans-lvivjs-16-august-2014","tags":["ECMAScript","JavaScript","スライド"],"content":"ES6についてのスライド。\n\n新しい構文についての紹介がメインでGeneratorについて詳しく説明してる","relatedLinks":[]},{"category":"SlideVideo","title":"JavaScript Test-Driven Development with Jasmine 2.0 and Karma","url":"http://www.slideshare.net/cebartling/javascript-38057372","tags":["JavaScript","testing","library","スライド"],"content":"Jasmine2.0とKarmaについてのスライド。\n\njasmine spyについて紹介されてる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"arian/partition-bundle","url":"https://github.com/arian/partition-bundle","tags":["browserify","plugin","library"],"content":"Browserify内にAMD的な動的ロードを持ち込むplugin。\n\n動的に読み込みたいjsファイルを定義した設定ファイルを作り、動的に読み込むようにrequireではなく`loadjs`関数を使って読み込む。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Rome","url":"http://bevacqua.github.io/rome/","tags":["JavaScript","UI","library"],"content":"依存がないDate/Time Picker UIライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gwendall/way.js","url":"https://github.com/gwendall/way.js","tags":["DOM","JavaScript","library"],"content":"HTML formで入力した内容をStorageに保存したり、JSONにしたり、監視や値のやり取りが出来るライブラリ。\n\nフォームに属性を指定しておくだけで、フォーム内容の保存的な事が出来る","relatedLinks":[]},{"category":"SoftwareLibrary","title":"thlorenz/browserify-devdupe · GitHub","url":"https://github.com/thlorenz/browserify-devdupe","tags":["browserify","npm","library"],"content":"browserify bundleを作るときにnpm dedupeみたいな事をするモジュール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mizchi/bower-build","url":"https://github.com/mizchi/bower-build","tags":["JavaScript","Tools"],"content":"bowerの`main`で指定されているファイルをconcatしたものを生成するツール","relatedLinks":[{"title":"bower-buildでbowerで入れたファイルを一つにconcatする - Qiita","url":"http://qiita.com/mizchi/items/67fcaf92ef3e8e5ac393"}]}]},{"meta":{"title":"2014-08-25のJS: Autoprefixer 3.0、JavaScriptのオブジェクト、Next Component","author":"azu","layout":"post","date":"2014-08-25T13:09:00.000Z","category":"JSer","tags":["CSS","JavaScript","パッケージ管理","Components"],"url":"https://jser.info/2014/08/25/autoprefixer-js-object/"},"items":[{"category":"Headline","title":"Release 3.0 “Liberté, Égalité, Fraternité” · postcss/autoprefixer","url":"https://github.com/postcss/autoprefixer/releases/tag/3.0.0","tags":["CSS","node.js","Tools"],"content":"Autoprefixer 3.0リリース。\n\n`autoprefixer()`のAPIの変更、coreは分離、CoffeeからES6で書き直し、リポジトリがpostcssに移動した","relatedLinks":[]},{"category":"Headline","title":"Node v0.10.31 (Stable)","url":"http://blog.nodejs.org/2014/08/19/node-v0-10-31-stable/","tags":["node.js","ReleaseNote"],"content":"Node v0.10.31 リリース。","relatedLinks":[]},{"category":"Article","title":"Sass 3.4 is Out!","url":"http://www.sitepoint.com/sass-3-4-is-out/","tags":["Sass"],"content":"Sass3.4の更新内容について。\n\nparent selector 、selector function、 `@error` ディレクティブなどについて","relatedLinks":[]},{"category":"Article","title":"Advanced objects in JavaScript","url":"http://bjorn.tipling.com/advanced-objects-in-javascript","tags":["JavaScript","ECMAScript","tutorial"],"content":"JSのオブジェクトについて幅広く解説されてる。\n\ngetter/setter、definePropertyとPropertyDescriptor、Object.create、valueOfとtoString、ES6のProxyとSymbolについて","relatedLinks":[{"title":"Web Reflection: What Books Didn","url":"http://webreflection.blogspot.jp/2014/03/what-books-wont-tell-you-about-es5.html"},{"title":"ES5, Property Descriptor解説 - 枕を欹てて聴く","url":"http://constellation.hatenablog.com/entry/20101205/1291564928"},{"title":"Revisiting JavaScript Objects | LakTEK (Lakshan Perera)","url":"http://www.laktek.com/2012/12/29/revisiting-javascript-objects/"}]},{"category":"Article","title":"ストリーム表現とその変換 - ✘╹◡╹✘","url":"http://r7kamura.hatenablog.com/entry/2014/08/21/113654","tags":["JavaScript","library"],"content":"リアクティブプログラミングにおけるストリームの実装ライブラリと、ストリームについての解説。\n\nストリームの作成、ストリームを変換するmap、filter、scanについて","relatedLinks":[{"title":"【翻訳】あなたが求めていたリアクティブプログラミング入門 - ninjinkun","url":"http://ninjinkun.hatenablog.com/entry/introrxja"}]},{"category":"Article","title":"WebStorm+Spy-jsの使い方 - Qiita","url":"http://qiita.com/laco0416/items/985044f0019ebef6cb2c","tags":["WebStorm","Tools"],"content":"WebStormから使えるspy-jsの機能や使い方について","relatedLinks":[{"title":"WebStorm - Node.jsでもSpy-jsを使ってみる - Qiita","url":"http://qiita.com/laco0416/items/6a45b08da45385dda746"}]},{"category":"Article","title":"WebRTC で動く Chord DHT の実装 webrtc-chord を公開しました - tsujio’s blog","url":"http://ntsujio.hatenablog.com/entry/2014/07/03/221023","tags":["JavaScript","WebRTC"],"content":"WebRTCを使った分散ハッシュテーブル (DHT: Distributed Hash Table) の実装","relatedLinks":[{"title":"tsujio/webrtc-chord","url":"https://github.com/tsujio/webrtc-chord"}]},{"category":"WebsiteDocument","title":"bevacqua/js","url":"https://github.com/bevacqua/js/","tags":["JavaScript"],"content":"&quot;JavaScript Quality Guide&quot;\n\nJavaScriptコーディングスタイルガイド。","relatedLinks":[]},{"category":"WebsiteDocument","title":"ECMAScript 6 support in Mozilla - JavaScript | MDN","url":"https://developer.mozilla.org/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_6_support_in_Mozilla","tags":["firefox","ECMAScript","まとめ"],"content":"FirefoxのES6サポート状況についてまとまってるページ","relatedLinks":[]},{"category":"WebsiteDocument","title":"5 Minutes of JavaScript - The latest news in the JavaScript community","url":"http://five-js.envylabs.com/episodes/42-episode-41-august-21st-2014","tags":["podcast","JavaScript"],"content":"週間JavaScriptなPodcast","relatedLinks":[]},{"category":"SoftwareLibrary","title":"slap-editor/slap","url":"https://github.com/slap-editor/slap","tags":["node.js","console","editor"],"content":"node.js製のターミナル上で動くテキストエディタ。\n\nSublimeText的なファイルリスト、マウス対応、キーバインドの対応などデフォルトでもそのまま使えるような感じで面白い","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Duo","url":"http://duojs.org/","tags":["JavaScript","Tools","GoLang","browserify"],"content":"Componentライクなパッケージ管理ツール。component.jsonでまとめられたコンポーネントからビルドしたjsやcssを生成出来る。またGo言語のようにrequireに直接GitHubのレポジトリを指定して使うことも出来る","relatedLinks":[{"title":"the future of component? · Issue #594 · component/component","url":"https://github.com/component/component/issues/594"},{"title":"duo? · Issue #27 · normalize/discussions","url":"https://github.com/normalize/discussions/issues/27"}]},{"category":"SoftwareLibrary","title":"normalize.io - an ES6 module, Web Component, and SPDY/HTTP2 Push frontend development worfklow","url":"https://normalize.github.io/","tags":["node.js","CSS","JavaScript","Tools"],"content":"ES6 moudle/HTML Import/CSS importで書いてimportしたものをビルド出来るパッケージ管理ツール。\n\nnpm、URL、components等に対応してて、パッケージをURLで指定するという原則を持ってる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Ment.io examples","url":"http://jeff-collins.github.io/ment.io/#/","tags":["JavaScript","library","AngularJS"],"content":"Content Editableとかテキストエリアにおいて、GitHubのような@によるmentionの補完が出来るライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"styledown/styledown · GitHub","url":"https://github.com/styledown/styledown","tags":["CSS","Markdown","document"],"content":"CSSスタイルガイド生成ツール。 \n\nコメントにmarkdownで書いてスタイルガイドを生成する事が出来る。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"hail2u/node-csswring","url":"https://github.com/hail2u/node-csswring/","tags":["CSS","Tools"],"content":"CSSから余分な記述を取り除いたり、書き換える事で圧縮するツール。\n\nSourceMapに対応してる","relatedLinks":[{"title":"CSSWring v1.1.0 - Weblog - Hail2u.net","url":"http://hail2u.net/blog/webdesign/node-csswring-v1.1.0.html"}]},{"category":"SoftwareLibrary","title":"soliton4/nodeMirror","url":"https://github.com/soliton4/nodeMirror","tags":["node.js","editor","JavaScript","library"],"content":"node.js + CodeMirrorなブラウザで動くIDE。\n\nローカルサーバを立ち上げて、ブラウザで使う。hexエディタ、ターミナル、HTMLの表示などが出来る","relatedLinks":[]},{"category":"SoftwareLibrary","title":"joyent/node-vstream","url":"https://github.com/joyent/node-vstream","tags":["node.js","stream","library"],"content":"node streamをラップして、データのダンプやチェック機能等を付けられるモジュール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"browserify-loader 介绍 - 寸志 - SegmentFault","url":"http://blog.segmentfault.com/zhicun/1190000000640242","tags":["browserify","AMD","CommonJS","library"],"content":"<a href='https://github.com/island205/browserify-loader'>https://github.com/island205/browserify-loader</a> についての紹介記事。\n\nrequrejsのように`main`属性で読み込むものを指定して使うローダーライブラリ","relatedLinks":[]}]},{"meta":{"title":"2014-09-01のJS: Underscore 1.7.0、Browserify入門、Gravit","author":"azu","layout":"post","date":"2014-08-31T23:19:00.000Z","category":"JSer","tags":["JavaScript","Broserify","Design","software","node-webkit"],"url":"https://jser.info/2014/09/01/underscore-browserify-Gravit/"},"items":[{"category":"Headline","title":"Announcing Sencha Touch 2.4 | Blog | Sencha","url":"http://www.sencha.com/blog/announcing-sencha-touch-2-4/","tags":["Sencha","ReleaseNote"],"content":"Sencha Touch 2.4リリース。\n\nBlackBerry 10のサポート強化とtoast コンポーネントの追加","relatedLinks":[]},{"category":"Headline","title":"Underscore.js","url":"http://underscorejs.org/","tags":["JavaScript","library","ReleaseNote"],"content":"Underscore 1.7.0 リリース。\n\nArrayのネイティブ関数では無く独自の実装を使うように変更し高速化、`_.iteratee`がカスタマイズ可能に、`_.before`のメソッド追加、`_.extend`の挙動がES6 `Object.assign`にあわせた形へ変更するなど。\n\n&quot;Sparse&quot; arrays、extend、union、template等破壊的な変更も多く含まれている。","relatedLinks":[{"title":"Release Underscore 1.7.0 by akre54 · Pull Request #1799 · jashkenas/underscore","url":"https://github.com/jashkenas/underscore/pull/1799#issuecomment-53577944"}]},{"category":"Headline","title":"CoffeeScript","url":"http://coffeescript.org","tags":["CoffeeScript","ReleaseNote"],"content":"CoffeeScript 1.8.0リリース。\n\nsourcemapのファイル名が.js.mapに変更、CLIの改善、`require(\"coffee-script/repl\")`をrequire出来るように","relatedLinks":[]},{"category":"Headline","title":"harmony:specification_drafts [ES Wiki]","url":"http://wiki.ecmascript.org/doku.php?id=harmony:specification_drafts#august_24_2014_draft_rev_27","tags":["ECMAScript","ReleaseNote"],"content":"ECMAScript 6 Draft Rev 27リリース。\n\nArray/generator comprehensionsの削除、Array.prototype.sortの実装依存についての明文化等","relatedLinks":[]},{"category":"Headline","title":"Dart News &amp; Updates: Dart 1.6 adds support for deferred loading","url":"http://news.dartlang.org/2014/08/dart-16-adds-support-for-deferred.html","tags":["dart","ReleaseNote"],"content":"Dart 1.6リリース。\n\nloadLibraryというDeferred loadingを提供するlibraryが入った。","relatedLinks":[{"title":"Deferred Loading in Dart | Dart: Structured web apps","url":"https://www.dartlang.org/docs/spec/deferred-loading.html"}]},{"category":"Headline","title":"MooTools - 1.5.1 is out!","url":"http://mootools.net/blog/2014/08/29/mootools-1-5-1-release/","tags":["JavaScript","ReleaseNote"],"content":"MooTools 1.5.1リリース。\n\nパッケージ周りの改善","relatedLinks":[]},{"category":"Headline","title":"Release 1.6.0 · jscs-dev/node-jscs","url":"https://github.com/jscs-dev/node-jscs/releases/tag/v1.6.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"コードスタイルチェックツールのjscs 1.6.0リリース。\n\nGoogleプリセットの改善やバグ修正等","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember 1.7.0 and 1.8 Beta Released","url":"http://emberjs.com/blog/2014/08/23/ember-1-7-0-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember 1.7.0 と 1.8 Betaリリース","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 38 Beta: New primitives for the next-generation web","url":"http://blog.chromium.org/2014/08/chrome-38-beta-new-primitives-for-next.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 38βリリース。\n\npicture要素、Map/Set、`for...of`、Symbol、Math周りの追加。\n\n[Network Information API](http://w3c.github.io/netinfo/ \"Network Information API\")、 [Screen Orientation API](http://www.w3.org/TR/screen-orientation/ \"Screen Orientation API\")、[Encoding API](http://updates.html5rocks.com/2014/08/Easier-ArrayBuffer---String-conversion-with-the-Encoding-API \"Encoding API\")でXHRでバイナリを取得しながらデコードが出来るようになるなど。","relatedLinks":[{"title":"Collecting and Iterating, the ES6 Way - HTML5Rocks Updates","url":"http://updates.html5rocks.com/2014/08/Collecting-and-Iterating-the-ES6-Way"},{"title":"Easier ArrayBuffer ","url":"http://updates.html5rocks.com/2014/08/Easier-ArrayBuffer---String-conversion-with-the-Encoding-API"}]},{"category":"Headline","title":"Introducing Meteor 0.9.0 and the official Meteor packaging system","url":"https://www.meteor.com/blog/2014/08/26/meteor-090-new-packaging-system","tags":["JavaScript","ReleaseNote"],"content":"Meteor 0.9.0リリース","relatedLinks":[]},{"category":"Article","title":"Important Announcement Regarding YUI | Yahoo Engineering","url":"http://yahooeng.tumblr.com/post/96098168666/important-announcement-regarding-yui","tags":["YUI","ReleaseNote"],"content":"YUIは新規開発を終了し、今後はYahoo内部向けの修正に留めるとの事。","relatedLinks":[{"title":"Yahoo stopping all new development of YUI | Hacker News","url":"https://news.ycombinator.com/item?id=8243523"}]},{"category":"Article","title":"Unicode-aware regular expressions in ES6 · Mathias Bynens","url":"https://mathiasbynens.be/notes/es6-unicode-regex","tags":["ECMAScript","JavaScript","正規表現"],"content":"ES6で導入された正規表現の`u`フラグについての解説とES5でも使えるようにするtranspilerについて。\n\n正規表現でユニコード文字を正しく扱うためのフラグ。\n\nES5やES6でのユニコード文字の扱いについては以下のスライドと動画で詳しく解説されてる。","relatedLinks":[{"title":"Hacking with Unicode // Speaker Deck","url":"https://speakerdeck.com/mathiasbynens/hacking-with-unicode"}]},{"category":"Article","title":"Virtual DOMを持つMV*ライブラリのmercuryについて | Web Scratch","url":"http://efcl.info/2014/08/28/mercury/","tags":["JavaScript","DOM","library","MVC"],"content":"mercuryのModel(State)、View(Virtual DOM)、Controller(Event)について。\n\nモジュールを組み合わせた構造と関数型プログラミング的なアプローチがベースのライブラリ","relatedLinks":[]},{"category":"Article","title":"A Gentle Browserify Walkthrough - Pony Foo","url":"http://blog.ponyfoo.com/2014/08/25/a-gentle-browserify-walkthrough","tags":["JavaScript","browserify","tutorial"],"content":"Browserifyについての丁寧なチュートリアル。\n\nCommonJSとは何か、Browserifyの基本的な使い方、利点としてnpmのモジュールが使える点やCJS以外のモジュールをbrowserify-shimで扱う事について等","relatedLinks":[{"title":"Browserify All The Things // Speaker Deck","url":"https://speakerdeck.com/bevacqua/browserify-all-the-things"},{"title":"substack/browserify-handbook","url":"https://github.com/substack/browserify-handbook"}]},{"category":"Article","title":"Journey from browserify to webpack — Medium","url":"https://medium.com/@tomchentw/why-webpack-is-awesome-9691044b6b8e","tags":["browserify","JavaScript","Tools"],"content":"webpackを使ったビルドについて。 Browserifyとの比較\n\nwebpackがデフォルトでwebpack-dev-serverや差分コンパイル、bower統合、js以外を読み込めるloaderを持ってる点について書かれている","relatedLinks":[]},{"category":"Article","title":"aster","url":"http://rreverser.com/aster-ast-based-code-builder/","tags":["JavaScript","Tools","AST","library"],"content":"JavaScript ASTを処理するビルドツール。\n\nGruntやGulp等はtaskごとにパースと生成を繰り返すため非効率な部分がある。\n\nasterはASTに対して変換の処理をパイプラインで行うため無駄な処理が減る。","relatedLinks":[{"title":"asterjs/aster","url":"https://github.com/asterjs/aster"}]},{"category":"SlideVideo","title":"Forward JS","url":"http://forwardjs.com/","tags":["JavaScript","イベント","動画"],"content":"Forward JSの動画が公開されている","relatedLinks":[]},{"category":"SlideVideo","title":"JavaScript Memory Management Masterclass // Speaker Deck","url":"https://speakerdeck.com/addyosmani/javascript-memory-management-masterclass","tags":["V8","JavaScript","browser","debug","スライド"],"content":"JavaScriptでのメモリリークとそもそも何故起きるのかについてのスライド。 \n\nDOM leakやV8のメモリ管理の方法、世代別GC、DevToolsを使っての見つけ方、Performance Toolsの使い方についてなどかなり詳しく紹介されている。","relatedLinks":[{"title":"JavaScript Memory Management Masterclass のメモ | wIssue Note","url":"http://efcl.wordpress.com/2014/08/31/javascript-memory-management-masterclass-%e3%81%ae%e3%83%a1%e3%83%a2/"}]},{"category":"WebsiteDocument","title":"Run CasperJS scripts online - CasperBox","url":"https://www.casperbox.com/","tags":["JavaScript","testing","webservice","library"],"content":"CasperJSのコードをオンラインで書いて実行、REST APIとAPIを使って実行出来るライブラリを提供してるサービス","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mathiasbynens/regexpu","url":"https://github.com/mathiasbynens/regexpu","tags":["JavaScript","正規表現","Tools"],"content":"ES6の正規表現の`u`フラグをES5でも使えるように変換するtranspiler","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Chartist - Simple responsive charts","url":"http://gionkunz.github.io/chartist-js/","tags":["JavaScript","SVG","グラフ","library"],"content":"SVGベースのレスポンシブなグラフライブラリ。\n\nmedia queriesを使って指定","relatedLinks":[]},{"category":"SoftwareLibrary","title":"twistdigital/es6-promisify","url":"https://github.com/twistdigital/es6-promisify","tags":["node.js","JavaScript","library"],"content":"nodeスタイルのコールバックを受け取る関数のPromiseラッパーを作るモジュール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Gravit – unlock your design potential.","url":"http://gravit.io/","tags":["JavaScript","illust","software"],"content":"Illustratorライクなデザインツール。\n\nドローやレイヤー等の機能を持ってる\n\nブラウザで動かすこともできるオープンソースなアプリ。\n\n<a href='https://github.com/quasado/gravit'>https://github.com/quasado/gravit</a>","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Cheerp homepage","url":"http://leaningtech.com/cheerp/","tags":["C++","JavaScript"],"content":"C++からJavaScriptのコードへのコードコンパイラ。\n\nLLVMを使用、DOM等扱うC++のラッパライブラリ的なのを持っている","relatedLinks":[]},{"category":"Book","title":"O&#x27;Reilly Japan - モダンWeb","url":"http://www.oreilly.co.jp/books/9784873116921/","tags":["web","book"],"content":"2014年09月10日 発売","relatedLinks":[]},{"category":"Book","title":"大規模開発でも小規模開発でも使える TypeScript実践入門：書籍案内｜技術評論社","url":"http://gihyo.jp/book/2014/978-4-7741-6711-4","tags":["TypeScript","book","windows"],"content":"2014年9月12日発売\n\nTypeScriptについての書籍","relatedLinks":[]},{"category":"Book","title":"The Pragmatic Bookshelf | Dart 1 for Everyone","url":"https://www.pragprog.com/book/csdart1/dart-1-for-everyone","tags":["dart","book"],"content":"2014年10月10日発売\n\nGoogle Dartについての書籍","relatedLinks":[]},{"category":"Book","title":"Manning: Firefox OS in Action","url":"http://www.manning.com/jongboom/","tags":["firefox","OS","book"],"content":"2015年春発売\n\nFirefox OS本","relatedLinks":[]},{"category":"Book","title":"Amazon: JavaScript逆引きレシピ jQuery対応","url":"http://www.amazon.co.jp/dp/4798135461?tag=amazon0abac-22","tags":["JavaScript","book"],"content":"2014年8月29日発売\n\n電子版も同時リリース","relatedLinks":[{"title":"JavaScript逆引きレシピ jQuery対応（9784798139470）：翔泳社の電子書籍","url":"http://www.shoeisha.co.jp/ebooks/detail/9784798139470"}]}]},{"meta":{"title":"2014-09-08のJS: Chrome 37/Opera 24、Firefox 32、ESLint 0.8.0","author":"azu","layout":"post","date":"2014-09-08T12:38:00.000Z","category":"JSer","tags":["Chrome","Opera","Firefox","AST","ECMAScript"],"url":"https://jser.info/2014/09/08/chrome-opera-firefox-eslint/"},"items":[{"category":"Headline","title":"Dev.Opera — Opera 24 released","url":"https://dev.opera.com/blog/opera-24/","tags":["Opera","ReleaseNote"],"content":"Opera 24リリース。\n\nWindowsでのフォントレンダリングの改善、CSSの`all`プロパティのサポート、`navigator.hardwareConcurrency`でCPUコア数の取得、Web Cryptography APIのサポート等","relatedLinks":[]},{"category":"Headline","title":"Firefox — Notes (32.0) — Mozilla","url":"http://www.mozilla.org/en-US/firefox/32.0/releasenotes/","tags":["firefox","ReleaseNote","セキュリティ"],"content":"Firefox 32リリース。\n\nposition:stickyがデフォルト有効に、imgのsrcset属性を試験サポート、`Array.from()`、Public Key Pinningの対応","relatedLinks":[{"title":"Firefox 32 が正式リリース、position: sticky; や srcset 属性への対応、開発ツールの機能追加など | WWW WATCH","url":"http://hyper-text.org/archives/2014/09/firefox_32_release.shtml"},{"title":"Firefox 32 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/docs/Mozilla/Firefox/Releases/32"}]},{"category":"Headline","title":"Release SCSS-Lint 0.28.0 · causes/scss-lint","url":"https://github.com/causes/scss-lint/releases/tag/v0.28.0","tags":["Sass","ReleaseNote"],"content":"SCSS-Lint 0.28.0リリース。\n\nSass 3.4に対応","relatedLinks":[]},{"category":"Headline","title":"Brackets 0.43 Release – Brackets Blog","url":"http://blog.brackets.io/2014/09/04/brackets-0-43-release/","tags":["editor","ReleaseNote"],"content":"Brackets 0.43リリース。\n\nSass/Lessのサポート、検索UIの改善、シンタックスの言語切替ができるように","relatedLinks":[]},{"category":"Headline","title":"mathjs/HISTORY.md at v1.0.0 · josdejong/mathjs","url":"https://github.com/josdejong/mathjs/blob/v1.0.0/HISTORY.md","tags":["JavaScript","library","ReleaseNote"],"content":"既存のMathと互換性のある関数や数値演算、数式のパーサを持つライブラリであるmath.js 1.0.0リリース","relatedLinks":[]},{"category":"Headline","title":"ESLint 0.8.0 released - ESLint","url":"http://eslint.org/blog/2014/09/eslint-0.8.0-released/","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 0.8.0リリース。\n\nプラグインの仕組みがstableになって、作り方、テスト方法、命名ルール等が公開された。\n\nignorefileの`node_modules/`と書いた時の挙動を変更、パフォーマンスの改善等","relatedLinks":[{"title":"Working with Plugins","url":"http://eslint.org/docs/developer-guide/working-with-plugins.html"}]},{"category":"Headline","title":"Release v0.9.0: Release 0.9.0 (2014-09-02) multi-stage sourcemaps · twada/power-assert","url":"https://github.com/twada/power-assert/releases/tag/v0.9.0","tags":["JavaScript","library","testing","ReleaseNote"],"content":"power-assert 0.9.0リリース。\n\nAltJS等を使っている時に、元ファイルの正しいエラー行数を表示するために多段SourceMapに対応","relatedLinks":[{"title":"多段SourceMapの対応方法とライブラリ | Web Scratch","url":"http://efcl.info/2014/09/03/multi-stage-sourcemap/"}]},{"category":"Headline","title":"Socket.IO — Socket.IO 1.1.0","url":"http://socket.io/blog/socket-io-1-1-0/","tags":["node.js","library","ReleaseNote"],"content":"Socket.IO 1.1.0リリース。\n\nnamespaceの指定が`/`から始まるかどうかはどちらでも良くなった。バグ修正等","relatedLinks":[]},{"category":"Article","title":"A Fond Farewell to YUI | Blog | Sencha","url":"http://www.sencha.com/blog/a-fond-farewell-to-yui/","tags":["JavaScript","歴史","library"],"content":"Ext JS 1.0より前はYUIに依存してて、その後は3.0までアダプタ的なものを提供していた。\n\nまたエンタープライズウェブアプリの今後についてや、AngularJS等とExt JSがカバーしてる範囲の違いと用途への適正等の話","relatedLinks":[{"title":"YUI との別れを惜しむ | 株式会社ゼノフィ","url":"https://www.xenophy.com/sencha-blog/11463"},{"title":"Enterprise Web Development: From Desktop to Mobile","url":"http://enterprisewebbook.com/"}]},{"category":"Article","title":"多段SourceMapの対応方法とライブラリ | Web Scratch","url":"http://efcl.info/2014/09/03/multi-stage-sourcemap/","tags":["sourcemap","JavaScript","library","node.js"],"content":"多段SourceMapといわれてるものについての問題と、それをマッピングし直すことでその問題を解決するモジュールについて","relatedLinks":[]},{"category":"Article","title":"Making the web “just work” with any input: Mouse, Touch, and Pointer Events - IEBlog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/ie/archive/2014/09/05/making-the-web-just-work-with-any-input.aspx","tags":["IE","browser","mobile"],"content":"IE 11のアップデートでTouch Eventsのサポートが入り、Mouse/Touch/Pointerの3つのモデルが存在するようになった。\n\nそれらのモデルの比較とfeature detectによる互換性のない実装がよくみられる事について等","relatedLinks":[{"title":"The Mobile Web should just work for everyone - IEBlog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/ie/archive/2014/07/31/the-mobile-web-should-just-work-for-everyone.aspx"},{"title":"IE11: 現在そして将来の Web に対応するタッチ ブラウジング - IEBlog 日本語 - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/ie_ja/archive/2013/08/06/ie11-touch-browsing-for-todays-web-and-beyond.aspx"},{"title":"Issue 162757 - chromium - Implement pointer events in Chrome behind experimental flag - An open-source project to help move the web forward. - Google Project Hosting","url":"https://code.google.com/p/chromium/issues/detail?id=162757#c64"}]},{"category":"Article","title":"From AngularJS to React: the isomorphic way","url":"http://blog.risingstack.com/from-angularjs-to-react-the-isomorphic-way/","tags":["JavaScript","AngularJS"],"content":"SEO的な視点からAngularJSからReactにした話。\n\nAngularではkoa-prerenderでプリレンダリングをしていた。\n\nReactを使うことでクライアントもサーバも同じコード(Isomorphic JavaScript)を使ってViewができるようになった","relatedLinks":[]},{"category":"Article","title":"ECMAScript 6 modules: the final syntax","url":"http://www.2ality.com/2014/09/es6-modules-final.html","tags":["JavaScript","ECMAScript"],"content":"ES6 modulesの構文について。\n\n構文の仕様は固まり、CommonJSのような同期的な形とAMDのような非同期的な呼び出しどちらでも使える。\n\nES6 modulesの構文、基本的な使い方、default exportやSystem.importについて等まとまってる","relatedLinks":[]},{"category":"Article","title":"An Introduction to WebDriver Using the JavaScript Bindings - Tuts+ Code Tutorial","url":"http://code.tutsplus.com/tutorials/an-introduction-to-webdriver-using-the-javascript-bindings--cms-21855","tags":["Selenium","webdriver","node.js"],"content":"WebDriverJSのバインディングについて。","relatedLinks":[]},{"category":"SlideVideo","title":"Supersonic JavaScript // Speaker Deck","url":"https://speakerdeck.com/ariya/supersonic-javascript","tags":["JavaScript","performance","スライド"],"content":"JavaScriptエンジンの最適化についてのスライド。\n\nコンストラクタ関数の最適化(Shape、Hidden class)を妨げない書き方、短絡評価、段階的なアプローチ、GCについてなど","relatedLinks":[{"title":"JavaScript Memory Management Masterclass // Speaker Deck","url":"https://speakerdeck.com/addyosmani/javascript-memory-management-masterclass"}]},{"category":"WebsiteDocument","title":"コーディングガイド by @mdo","url":"http://kia-king.com/code-guide/","tags":["HTML","CSS","JavaScript","翻訳"],"content":"<a href='http://codeguide.co/'>http://codeguide.co/</a> の訳\n\nHTMLやCSSやJavaScriptそれぞれを書く時のルールの統一感を持つためのガイドライン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"macbre/phantomas","url":"https://github.com/macbre/phantomas","tags":["JavaScript","browser","performance","Tools"],"content":"PhantomJSを使ったパフォーマンスメトリクス、モニタリングツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"TimBeyer/html-to-vdom","url":"https://github.com/TimBeyer/html-to-vdom","tags":["JavaScript","DOM","library"],"content":"HTML文字列をVirtual DOM(vTree)に変換するライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"btwael/locallydb","url":"https://github.com/btwael/locallydb","tags":["JavaScript","library"],"content":"node、node-webkitで使えるNoSQLなデータベースライブラリ。\n\nJSONファイルベース","relatedLinks":[]},{"category":"SoftwareLibrary","title":"zendesk/cross-storage","url":"https://github.com/zendesk/cross-storage","tags":["JavaScript","Promises","library"],"content":"postMessageを使ったクロスドメインでデータを共有出来るlocalStorageラッパライブラリ。\n\nES6 Promisesを使ったPromiseベースのAPIになってる","relatedLinks":[{"title":"DailyJS: Cross-Storage: Share Local Data Across Domains","url":"http://dailyjs.com/2014/09/05/cross-storage/"}]},{"category":"SoftwareLibrary","title":"RReverser/acorn-csp","url":"https://github.com/RReverser/acorn-csp","tags":["JavaScript","library","AST"],"content":"acornのCSP対応版を生成するツール。\n\n`new Function`を使っている所に対して、AST変換を使ったインライン展開的な事をして対応していて興味深い","relatedLinks":[{"title":"Acorn-cspのできた流れ - efcl’s blog","url":"http://efcl.hatenablog.com/entry/2014/09/07/022914"}]},{"category":"SoftwareLibrary","title":"pioneer.js - javascript integration testing","url":"http://pioneerjs.com/","tags":["JavaScript","testing","Selenium","webdriver","library"],"content":"Cucumber的なDSLと、そのDSLに対応した処理をJavaScriptで書けるStep、どこをテストするのかのDOMをラップしたWidgetsの3層構造のテストフレームワーク。\n\nWebDriverを使ってブラウザ自動テストが出来る","relatedLinks":[{"title":"Pioneerのお試しステップ - efcl’s blog","url":"http://efcl.hatenablog.com/entry/2014/09/08/212101"}]},{"category":"Book","title":"Amazon: AngularJSリファレンス","url":"http://www.amazon.co.jp/dp/4844336681?tag=amazon0abac-22","tags":["AngularJS","book"],"content":"2014年9月5日発売\n\nAngularJSの脱初心者〜中級者向けの書籍\n\n<a href='http://zoetrope.hatenablog.jp/entry/2014/09/01/201056'>http://zoetrope.hatenablog.jp/entry/2014/09/01/201056</a>","relatedLinks":[]},{"category":"Book","title":"O&#x27;Reilly Japan - 実践 Selenium WebDriver","url":"http://www.oreilly.co.jp/books/9784873116952/","tags":["Selenium","book","ios","Android"],"content":"2014年9月18日発売\n\nSeleniumについての書籍。\n\nブラウザやiOS/Androidのテストについて扱う","relatedLinks":[]}]},{"meta":{"title":"2014-09-15のJS: JavaScriptエンジンの最適化、ビルドツールBroccoli","author":"azu","layout":"post","date":"2014-09-15T12:24:00.000Z","category":"JSer","tags":["JavaScript","V8","ビルド","Tools","イベント","Performance"],"url":"https://jser.info/2014/09/15/v8-react-broccoli/"},"items":[{"category":"Headline","title":"Intern 2.1 released | Blog | SitePen","url":"http://www.sitepen.com/blog/2014/09/12/intern-2-1-released/","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Intern 2.1リリース。\n\nHTMLレポーター/JUnit XMLレポーターの追加。","relatedLinks":[]},{"category":"Headline","title":"Release 3.1 “Satyameva Jayate” · postcss/autoprefixer","url":"https://github.com/postcss/autoprefixer/releases/tag/3.1.0","tags":["CSS","Tools","ReleaseNote"],"content":"autoprefixer 3.1リリース","relatedLinks":[]},{"category":"Article","title":"V8 Installation and d8 shell usage","url":"https://gist.github.com/kevincennis/0cd2138c78a07412ef21","tags":["V8","console","Tools","tutorial"],"content":"d8コマンドをインストールして、最適化/非最適化、プロファイリング、GCのトレース、Hidden Class等のチェック方法などについてまとまってるチュートリアル","relatedLinks":[]},{"category":"Article","title":"V8の最適化とIRHydraでの可視化とベンチマークについてのメモ | Web Scratch","url":"http://efcl.info/2014/09/13/v8-optimization-memo/","tags":["JavaScript","V8","performance","Tools","まとめ"],"content":"V8のHidden Class等のJavaScriptの最適化やhot codeについて。\n\nIRHydra2を使った最適化されてない事の可視化や参考リソースについて。","relatedLinks":[]},{"category":"Article","title":"「for やめろ」またはイベントループと nextTick() - Block Rockin’ Codes","url":"http://jxck.hatenablog.com/entry/for-with-eventloop","tags":["JavaScript","node.js"],"content":"node.jsにおけるイベントループとブロックについて。\n\nsetTimeout、process.nextTick、setImmediateの意味の違い。\n\nI/Oイベントとそれぞれの実行タイミングについて分かりやすく解説してる。","relatedLinks":[]},{"category":"Article","title":"Integrating D3.js visualizations in a React app - Nicolas Hery","url":"http://nicolashery.com/integrating-d3js-visualizations-in-a-react-app/","tags":["d3.js","DOM"],"content":"D3.jsのデータ・ドリブンのデータ更新とReactのVirtual DOMを組み合わせた話","relatedLinks":[{"title":"D3.js の Data-Driven な DOM 操作がおもしろい - てっく煮ブログ","url":"http://tech.nitoyon.com/ja/blog/2013/10/24/d3js/"}]},{"category":"Article","title":"Firefox Add-on Enables Web Development Across Browsers and Devices ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2014/09/firefox-tools-adapter/","tags":["firefox","debug","Chrome","addon"],"content":"Firefoxの開発者ツールを使ってChromeやSafariで表示してるページをデバッグするアダプタのアドオン。\n\nremotedebug.org と似ているが、共有のプロトコルの提供ではなく、Firefoxのプロトコルをベースとしてる","relatedLinks":[{"title":"Firefox Tools Adapter - Firefox Developer Tools | MDN","url":"https://developer.mozilla.org/en-US/docs/Tools/Firefox_Tools_Adapter"}]},{"category":"SlideVideo","title":"Intro to Broccoli","url":"http://aexmachina.info/assets/talks/intro-to-broccoli/#1","tags":["JavaScript","Tools","スライド"],"content":"ビルドツールであるBroccoliについてのスライド。 Railsで言えばBroccoliはasset pipelineで、GruntやGulpはrakeに当たるツール。\n\nビルドに焦点をおいているという特徴がある","relatedLinks":[]},{"category":"SlideVideo","title":"Talk talks_12C5ADD371A9A5D4 - Ember Fest!","url":"https://emberfest.eu/talks/talks_12C5ADD371A9A5D4","tags":["JavaScript","Tools","動画"],"content":"JavaScriptベースのビルドツールであるBroccoliについての動画\n\n<a href='https://github.com/broccolijs/broccoli'>https://github.com/broccolijs/broccoli</a>\n\nBroccoliがどのようなプロセスでファイルを処理するかについて話されてる","relatedLinks":[]},{"category":"SlideVideo","title":"9 anti-patterns for node.js teams","url":"http://www.slideshare.net/jeharrell/9-antipatterns-for-nodejs-teams","tags":["JavaScript","node.js","スライド"],"content":"node.jsにおける9つのアンチパターンについてのスライド <a href='http://efcl.hatenablog.com/entry/2014/09/11/212846'>http://efcl.hatenablog.com/entry/2014/09/11/212846</a>","relatedLinks":[]},{"category":"SlideVideo","title":"2014-09-09-performance-in-css-hikalab-yuya-saito.pdf • Droplr","url":"http://d.pr/f/sP4H","tags":["CSS","browser","performance","スライド"],"content":"CSSとパフォーマンスについてのスライド。CSSのスタイル変更がどのようなレンダリングツリーの変更/再描画を起こしてるか、それを計測する方法、回避する方法について詳しく書かれてる","relatedLinks":[]},{"category":"SlideVideo","title":"OSCON - React Architecture // Speaker Deck","url":"https://speakerdeck.com/vjeux/oscon-react-architecture","tags":["JavaScript","DOM","スライド"],"content":"Reactの歴史とReactのDOM Diffについてのスライド\n\n<a href='https://www.youtube.com/watch?v=eCf5CquV_Bw'>https://www.youtube.com/watch?v=eCf5CquV_Bw</a>\n\nReactのVirtual DOM = DOMのバージョン管理という話やVirtual DOMのdiffの仕組みについて解説されてる","relatedLinks":[{"title":"JavaScript’s History and How it Led To ReactJS | The New Stack","url":"http://thenewstack.io/javascripts-history-and-how-it-led-to-reactjs/"}]},{"category":"SlideVideo","title":"Building high quality services at Uber","url":"http://raynos.github.io/nodeconfeu2014-talk/#/","tags":["JavaScript","node.js","スライド"],"content":"Uber社のnode.jsを使ったプロダクションを運用するにあたってのスライド。\n\nログ、モニター、設定の管理、例外のログ、プロファイル、初期設定のscaffolding等のツールについて。","relatedLinks":[]},{"category":"SlideVideo","title":"Asynchronous JavaScript &amp; Promises","url":"http://www.innoarchitech.com/asynchronous-javascript-promises/","tags":["JavaScript","Promises","スライド","動画"],"content":"JavaScriptの非同期処理、Promiseについての動画とスライド。\n\nPromiseとはどういうものかについて","relatedLinks":[{"title":"Asynchronous JavaScript ","url":"http://slides.com/alexcastrounis/async-js-promises#/"}]},{"category":"SlideVideo","title":"BSidesLA Managing Content Security Policy // Speaker Deck","url":"https://speakerdeck.com/oreoshake/bsidesla-managing-content-security-policy","tags":["セキュリティ","CSP","browser","スライド"],"content":"CSPについてのスライド。\n\nCSPとは何か、どうやって適応するか、どうやって管理するかについてTwitterの人が発表した内容。\n\nCSP Lv2のscript hashについてやCSPレポート解析と <a href='http://caspr.io/'>http://caspr.io/</a> について","relatedLinks":[{"title":"Caspr","url":"http://caspr.io/#/"},{"title":"This blog uses CSP level 2 script hash support | blawg","url":"https://blog.matatall.com/2014/08/this-blog-uses-csp-level-2-script-hash-support/"}]},{"category":"WebsiteDocument","title":"Polyfill service","url":"https://cdn.polyfill.io/v1/","tags":["JavaScript","library"],"content":"polyfillライブラリを配信してくれるCDNサービス。\n\nクエリでfeaturesやuaを指定してそれに対するpolyfillをまとめくれたものを配信してくれる","relatedLinks":[{"title":"Polyfills as a service | FT Labs","url":"http://labs.ft.com/2014/09/polyfills-as-a-service/"}]},{"category":"WebsiteDocument","title":"srcset と sizes","url":"http://terkel.github.io/srcset-sizes/","tags":["HTML","画像","CSS","翻訳"],"content":"srcset と sizes 属性の入門の翻訳\n\n<a href='http://ericportis.com/posts/2014/srcset-sizes/'>http://ericportis.com/posts/2014/srcset-sizes/</a>","relatedLinks":[{"title":"Srcset and sizes の日本語訳 · terkel.jp","url":"http://terkel.jp/archives/2014/09/srcset-sizes/"}]},{"category":"WebsiteDocument","title":"thlorenz/v8-perf","url":"https://github.com/thlorenz/v8-perf","tags":["Chrome","V8","performance","まとめ"],"content":"V8のパフォーマンスに関するレポートや資料のまとめ。\n\nData type、コンパイラ、最適化、GC、メモリ、CPUプロファイリング。\n\nまたfast objectであるかどうかの確認方法やプロファイルの取り方などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Speed Hall of Fame - The Chromium Projects","url":"http://www.chromium.org/developers/speed-hall-of-fame","tags":["V8","Chrome","まとめ"],"content":"ChromiumやV8のパフォーマンスの最適化/向上のIssue(内容)とその結果についてまとめられてるページ","relatedLinks":[]},{"category":"WebsiteDocument","title":"DartLanguageSpecification_Japanese.pdf","url":"http://www.cresc.co.jp/tech/java/Google_Dart/DartLanguageSpecification_Japanese.pdf","tags":["dart","spec","翻訳"],"content":"Dartの仕様書日本語訳\n\nECMA-408版","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ES6 right now","url":"http://johnkpaul.github.io/presentations/jqcon/2014/es6-now/#/","tags":["ECMAScript","JavaScript","スライド"],"content":"ES6の動かせるサンプルと共に機能紹介と今スグ使う設定についてのスライド\n\ntraceur(+grunt/gulp/broccoli/browserify)やes6-shimの紹介","relatedLinks":[]},{"category":"SoftwareLibrary","title":"davidmarkclements/decofun","url":"https://github.com/davidmarkclements/decofun","tags":["JavaScript","debug","Tools"],"content":"無名関数を自動的にそのコンテキストに応じた名前を付けるデバッグツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"GraftJS/jschan · GitHub","url":"https://github.com/GraftJS/jschan","tags":["JavaScript","library"],"content":"libchanのJavaScriptポート。\n\nネットワークを超えてChannel同士でやり取りをする。\n\nWebSocketsとSPDYをサポートしていて、msgpackを使う","relatedLinks":[]},{"category":"SoftwareLibrary","title":"uupaa/WMCache.js","url":"https://github.com/uupaa/WMCache.js","tags":["JavaScript","library","Chrome","safari"],"content":"FileSystem, IndexedDB, Quota Management APIを使って100MB超えのテンポラリなストレージを管理するライブラリ","relatedLinks":[{"title":"WMCache · uupaa/WMCache.js Wiki","url":"https://github.com/uupaa/WMCache.js/wiki/WMCache"}]},{"category":"SoftwareLibrary","title":"hello.js - Javascript API for OAuth2 authentication and REST services","url":"http://adodson.com/hello.js/","tags":["JavaScript","OAuth","library"],"content":"OAuth 2対応のアプリの認証やAPIを叩く機能を持ったライブラリ。\n\n<a href='https://auth-server.herokuapp.com/'>https://auth-server.herokuapp.com/</a> という認証のサーバを使っていて、クライアントサイドを書くだけでGitHubやFacebook等のAPIを利用できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"BlackDice/lill","url":"https://github.com/BlackDice/lill","tags":["JavaScript","library","node.js"],"content":"es6-symbolを使った linked-listの実装ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ブラウザ内で安全に文字列からDOMを組み立てるためのRickDOMというライブラリを書いた - 葉っぱ日記","url":"http://d.hatena.ne.jp/hasegawayosuke/20140912/p1","tags":["JavaScript","DOM","library"],"content":"DOMParserやcreateHTMLDocumentを使って文字列から安全にDOMを組み立てるライブラリ","relatedLinks":[{"title":"hasegawayosuke/rickdom","url":"https://github.com/hasegawayosuke/rickdom"}]},{"category":"SoftwareLibrary","title":"thlorenz/proxyquireify","url":"https://github.com/thlorenz/proxyquireify","tags":["browserify","plugin","testing","library"],"content":"`require`をラップして読み込んだモジュールのメソッドのstubを行えるbrowserify plugin。\n\n変換によってDIが行われるので元モジュールに特殊な仕組みが必要ない","relatedLinks":[]},{"category":"Book","title":"JavaScript: Novice to Ninja - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/9780992461225.do","tags":["JavaScript","book"],"content":"2014年10月 発売\n\n基礎から学ぶJavaScript","relatedLinks":[]}]},{"meta":{"title":"2014-09-23のJS: npm 2.0.0、iOS8 WKWebView、Node.jsとPromise","author":"azu","layout":"post","date":"2014-09-23T07:58:00.000Z","category":"JSer","tags":["node.js","npm","iOS","Promises"],"url":"https://jser.info/2014/09/23/npm2-ios8-promises/"},"items":[{"category":"Headline","title":"The npm Blog — npm@2.0.0","url":"http://blog.npmjs.org/post/98131109725/npm-2-0-0","tags":["npm","ReleaseNote"],"content":"npm 2.0.0リリース。\n\nリリースプロセスのドキュメント化、semverの挙動の変更、企業など社内モジュールの管理等に使えるscopeという機能を追加、npm runが引数を取れるようになるなど","relatedLinks":[{"title":"Release Process · npm/npm Wiki","url":"https://github.com/npm/npm/wiki/Release-Process"},{"title":"npm-scope","url":"https://www.npmjs.org/doc/misc/npm-scope.html"}]},{"category":"Headline","title":"WinJS Everywhere","url":"http://blogs.windows.com/buildingapps/2014/09/17/winjs-everywhere/","tags":["JavaScript","library","ReleaseNote"],"content":"WinJS 3.0リリース。\n\nクロスプラットフォームのデザイン互換性周りの修正が中心","relatedLinks":[{"title":"WinJS3.0 がリリースされました。 - monoe","url":"http://blogs.msdn.com/b/osamum/archive/2014/09/19/winjs3-0.aspx"}]},{"category":"Headline","title":"Node v0.10.32 (Stable)","url":"http://blog.nodejs.org/2014/09/16/node-v0-10-32-stable/","tags":["node.js","ReleaseNote"],"content":"Node v0.10.32 リリース。","relatedLinks":[]},{"category":"Headline","title":"React v0.11.2 | React","url":"http://facebook.github.io/react/blog/2014/09/16/react-v0.11.2.html","tags":["facebook","JavaScript","DOM","library","ReleaseNote"],"content":"React v0.11.2リリース。\n\ndialogとpicture要素のサポート、flowの型チェックツール用のアノテーションを取り除くフラグをjsxコマンドに追加","relatedLinks":[]},{"category":"Headline","title":"Polymer 0.4.1 Released!","url":"http://blog.polymer-project.org/releases/2014/09/18/release-0.4.1/","tags":["JavaScript","WebComponents","library","ReleaseNote"],"content":"Polymer 0.4.1リリース。\n\nWAI-ARIAについての`core-a11y-keys`要素を追加、iOS8のバグに対するworkaroundを追加","relatedLinks":[]},{"category":"Article","title":"Updates to our platform roadmap - IEBlog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/ie/archive/2014/09/18/updates-to-our-platform-roadmap.aspx","tags":["IE","ECMAScript","JavaScript"],"content":"IEの開発中、検討中の機能について","relatedLinks":[{"title":"Internet Explorer Web Platform Status and Roadmap - status.modern.IE","url":"http://status.modern.ie/"}]},{"category":"Article","title":"iOS 8 and iPhone 6 for web developers and designers: next evolution for Safari and native webapps | Breaking the Mobile Web","url":"http://www.mobilexweb.com/blog/safari-ios8-iphone6-web-developers-designers","tags":["ios","safari","まとめ","JavaScript","CSS"],"content":"iPhone6とiPhone6 plusの仕様やviewportまわりの違いについて。\nまた、iOS8 SafariでサポートされたAPIやCSSサポート、minimal-uiの廃止、Safariの追加機能、UIWebViewとWKWebVIewの違い、バグについて詳しくまとめられている","relatedLinks":[{"title":"iOS8 presents serious issues that prevent file uploading | Blog","url":"http://blog.fineuploader.com/2014/09/10/ios8-presents-serious-issues-that-prevent-file-uploading/"}]},{"category":"Article","title":"Apple Shows Love for HTML5 with iOS 8 | Blog | Sencha","url":"http://www.sencha.com/blog/apple-shows-love-for-html5-with-ios-8","tags":["ios","safari","まとめ","performance"],"content":"iOS8のSafariでサポートされた新しい機能について。\n\nまた今までのWebViewと新しく追加されたWebKitの機能がちゃんと使えるWKWebViewのパフォーマンスの比較。\n\n既知のバグについても書かれてる","relatedLinks":[{"title":"iOS 8 に Apple の HTML5 への愛を見た | 株式会社ゼノフィ","url":"https://www.xenophy.com/sencha-blog/11578"}]},{"category":"Article","title":"Node.jsエンジニアなら2014年内に知っておきたいPromise入門 | Tokyo Otaku Mode Tech Blog","url":"http://blog.otakumode.com/2014/09/17/nodejs-promise/","tags":["JavaScript","node.js","Promises","tutorial"],"content":"JavaScript Promiseの基本的な使い方、async.jsを使っていた場合にそれをPromiseに書き換える実装方法について。\n\nPromiseについてよくまとまってるチュートリアル","relatedLinks":[]},{"category":"Article","title":"JavaScript Promiseを使うウェブの仕様を調べてみた | Web Scratch","url":"http://efcl.info/2014/09/16/promises-spec-ref-list/","tags":["JavaScript","Promises","spec","検索"],"content":"Promiseの仕様を前提にしてる仕様の一覧。また、仕様をどうやって調べるかについて。W3CやWHATWGの仕様をまとめてダウンロードして検索する方法について書かれてる","relatedLinks":[]},{"category":"Article","title":"Node.js Best Practices","url":"http://blog.risingstack.com/node-js-best-practices/","tags":["node.js","開発環境"],"content":"Node.jsにおけるコーディングルール的なのとエラーについて。\n\ncallbackのerrorはチェックする事と早期return、Operational errorとProgrammer errorsの違いと対処、npmを使ったWorkflowについて書かれてる","relatedLinks":[{"title":"Error Handling in Nodejs - Developer Center - Joyent","url":"http://www.joyent.com/developers/node/design/errors"}]},{"category":"Article","title":"Traceur, Gulp, Browserify and ES6 - Matt Greer","url":"http://www.mattgreer.org/articles/traceur-gulp-browserify-es6/","tags":["JavaScript","gulp","browserify"],"content":"Gulp+TraceurでES6のコードを使う方法と、Browserify + es6ifyでTraceurを使う方法について。","relatedLinks":[]},{"category":"Article","title":"透過PNGをSVGを利用して軽くするテクニック - Weblog - Hail2u.net","url":"http://hail2u.net/blog/webdesign/with-svg.html","tags":["SVG","画像"],"content":"JPG画像とマスクとなるPNG画像をSVGのmask要素によって合わせる事で擬似アルファチャンネルをやる事について。\n\n単体の透過PNGよりファイルサイズが軽量に出来る話。\n\n<a href='http://blog.jackadam.net/2010/alpha-jpegs/'>http://blog.jackadam.net/2010/alpha-jpegs/</a>","relatedLinks":[]},{"category":"Article","title":"CSSセレクターマッチングのコスト - Unreviewed","url":"http://takenspc.hatenablog.com/entry/2014/09/16/152157","tags":["CSS","webkit"],"content":"CSSセレクタは要素とセレクタの数だけ判定を行う回数が増えるため、そのコストを減らすアプローチについて。\n\nまた、CSSセレクタのマッチ判定の手順について結合子別に詳しく解説してる。","relatedLinks":[{"title":"WebKit CSS JIT Internals - Constellation Scorpius","url":"http://constellation.github.io/blog/2014/07/14/webkit-css-jit-internals/"}]},{"category":"Article","title":"WebStorm 9 EAP, 138.2406: spy-js code completion, CSS3 enhancements, Scratch files and… JSX | JetBrains WebStorm Blog","url":"http://blog.jetbrains.com/webstorm/2014/09/webstorm-9-eap-138-2406/","tags":["WebStorm","ReleaseNote","node.js"],"content":"spy.jsを実行した結果を使ったコード補完が行えるように。また、今までは引数や返り値のみだったが、式にも対応した。\n\nemacsみたいなScratchファイルの機能を追加、indexingの範囲をデフォルトではnode_modulesまでに限定、JSX(React)のサポート改善等","relatedLinks":[]},{"category":"Article","title":"WebIDE、ストレージインスペクタ、jQuery イベント、iframe 切り替えなど – Firefox 開発ツール エピソード 34 | Mozilla Developer Street (modest)","url":"https://dev.mozilla.jp/2014/09/webide-storage-inspector-jquery-events-iframe-switcher-more-firefox-developer-tools-episode-34/","tags":["firefox","debug","Tools"],"content":"Firefox 34 で追加されてる開発ツールの機能について","relatedLinks":[]},{"category":"SlideVideo","title":"Slide decks of JSConf 2014","url":"https://gist.github.com/nikcorg/1fe60d2da6e22653806c","tags":["JavaScript","event","スライド"],"content":"JSConf.eu 2014のスライドまとめ\n\n<a href='http://2014.jsconf.eu/'>http://2014.jsconf.eu/</a>\n\n<a href='https://www.youtube.com/user/jsconfeu/'>https://www.youtube.com/user/jsconfeu/</a>","relatedLinks":[]},{"category":"SlideVideo","title":"A Quick Introduction to BrowserSync - Tuts+ Web Design Tutorial","url":"http://webdesign.tutsplus.com/tutorials/a-quick-introduction-to-browsersync--cms-22135","tags":["browser","動画","Tools"],"content":"BrowserSyncについて紹介するスクリーンキャスト","relatedLinks":[]},{"category":"SlideVideo","title":"Syncing Async","url":"http://www.slideshare.net/fitc_slideshare/syncingasync","tags":["JavaScript","Promises","スライド"],"content":"非同期処理とPromiseについてのスライド。\n\nコールバックのネストの問題、PromiseやGeneratorで考える非同期で逐次的な処理について。","relatedLinks":[]},{"category":"SlideVideo","title":"CORS для тестирования и для жизни. Константин Якушев. MoscowJS 14","url":"http://www.slideshare.net/moscowjs/cors-moscowjs-14","tags":["XHR","スライド"],"content":"CORSのHTTPヘッダの設定と動作について分かりやすくまとめられてる。 \n\n指定する値の書き方についてが分かりやすい\n\nCORS in Actionの人。","relatedLinks":[]},{"category":"SlideVideo","title":"Componentization for Reality","url":"http://ja.slideshare.net/ygoto3q/componentization-for-reality","tags":["JavaScript","スライド"],"content":"コンポーネントベースで考えるウェブ開発についてのスライド。\n\nディレクトリ単位だとバラけてしまうのでコンポーネント単位でまとめる。\n\nジェネレータ、webpack、insertCSS、Angular","relatedLinks":[{"title":"俺の話を聞け、5分だけでもいい　ーJavaScriptだいすきな男たちとJavaScriptを学ぼう！【JSオジサン#3】 JSオジサン 先生 - 無料動画学習｜schoo（スクー）","url":"https://schoo.jp/class/1190"}]},{"category":"SoftwareLibrary","title":"wingify/dom-comparator","url":"https://github.com/wingify/dom-comparator","tags":["JavaScript","DOM","testing","library"],"content":"2つのDOM文字列を比較した結果を取得するライブラリ。\n\nCSSやNodeにどういう操作が行われたかの情報が取れる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ConradIrwin/async-profile","url":"https://github.com/ConradIrwin/async-profile","tags":["JavaScript","performance","library","node.js"],"content":"Node.jsで非同期処理のプロファイルを取るためのライブラリ。\n\ncallback待ちにどれくらいの時間を使ってるかの表示、非同期処理の結果をネスト表示も出来る","relatedLinks":[{"title":"A CPU Profiler for Node.js - Bugsnag","url":"https://bugsnag.com/blog/async-profile"}]},{"category":"SoftwareLibrary","title":"matthew-andrews/denodeify","url":"https://github.com/matthew-andrews/denodeify/","tags":["JavaScript","Promises","library"],"content":"Node.jsスタイルで書かれた関数(error, response)をPromiseラッパにするライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"deloreanjs/delorean","url":"https://github.com/deloreanjs/delorean","tags":["JavaScript","library"],"content":"Flux patternの実装ライブラリ\n\ndispatcherとstore、ComponentとしてReactやFlight、Ractiveなどと組み合わせて使うことができる","relatedLinks":[{"title":"Fluxxor - Home","url":"http://fluxxor.com/"}]},{"category":"SoftwareLibrary","title":"fat/bean","url":"https://github.com/fat/bean","tags":["JavaScript","library","event"],"content":"JavaScriptのDOMイベントを簡単に扱える小さなライブラリ。\n\non/off/fire/one/cloneが用意されている。cloneではNodeと共にeventをコピーすることができる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"inikulin/dmn","url":"https://github.com/inikulin/dmn","tags":["npm","node.js","console","Tools"],"content":"プロジェクトで使ってるファイルから.npmignoreを生成するコマンドラインツール。\n\nまた、インストール済みのnode_modulesから不要なファイルを削除する事も出来る。","relatedLinks":[]}]},{"meta":{"title":"2014-09-30のJS: Gruntの現在と未来、React.js、The Mobile Web Handbook","author":"azu","layout":"post","date":"2014-09-30T13:36:00.000Z","category":"JSer","tags":["JavaScript","Grunt","React","Flux"],"url":"https://jser.info/2014/09/30/grunt-react-mobile/"},"items":[{"category":"Headline","title":"Release 0.11.0-rc · yyx990803/vue","url":"https://github.com/yyx990803/vue/releases/tag/0.11.0-rc","tags":["JavaScript","library","ReleaseNote"],"content":"Vue.js 0.11.0-rcリリース。\n\nBreakingな変更も含め多数の変更が予定されてる","relatedLinks":[]},{"category":"Article","title":"Virtual DOMのアルゴリズムが知りたくてvirtual-domのコードを読んだ話 - snyk_s log","url":"http://saneyukis.hatenablog.com/entry/2014/09/03/134858","tags":["VirualDOM","アルゴリズム","JavaScript"],"content":"VirtualDOMの構成要素やdiffのアルゴリズムについて","relatedLinks":[]},{"category":"Article","title":"JavaScript - BrowserifyからWebpackへの移行時の注意点 - Qiita","url":"http://qiita.com/derui@github/items/5233b4ef8fbde1e80d33","tags":["JavaScript","browserify"],"content":"Browserifyから見たWebpackのメリットについて。 Browserifyはデフォルトでは1ビルドに1ファイル出力、一方Webpackは最初から複数のファイルを吐き出せる。\n(Browserifyは[factor-bundle](https://github.com/substack/factor-bundle \"factor-bundle\")などが必要)\n\nまた、Webpackはデフォルトで賢いビルドをするため高速にビルド出来る。\n(BrowserifyはAdvanced Optionsなどで細かい指定やビルドの工夫が必要)\n\nどちらもビルド時間の多くをSourceMap出力が占めている傾向がある。","relatedLinks":[]},{"category":"Article","title":"Get Started React.js // Speaker Deck","url":"https://speakerdeck.com/koba04/get-started-react-dot-js","tags":["JavaScript","VirualDOM","library","スライド"],"content":"React.jsについて詳しく書かれたスライド。\n\nJSXの使い方、Viewの構成、ImmutableなPropと状態を表すState、Component同士のやり取りやライフサイクル、CSSやアニメーション、Fluxアーキテクチャ、サーバサイドレンダリングなど","relatedLinks":[{"title":"Fluxアーキテクチャの覚え書きを書いた - snyk","url":"http://saneyukis.hatenablog.com/entry/2014/09/26/174750"}]},{"category":"Article","title":"Testing Flux Applications | React","url":"http://facebook.github.io/react/blog/2014/09/24/testing-flux-applications.html","tags":["JavaScript","testing"],"content":"FluxアーキテクチャをJestでテストする話。","relatedLinks":[{"title":"Flux | Application Architecture for Building User Interfaces","url":"http://facebook.github.io/flux/"},{"title":"Jest | Painless JavaScript Unit Testing","url":"http://facebook.github.io/jest/"}]},{"category":"Article","title":"ECMAScript 6 promises (1/2): foundations","url":"http://www.2ality.com/2014/09/es6-promises-foundations.html","tags":["JavaScript","Promises"],"content":"ES6 Promiseについての連載。\n\nJavaScriptにおける非同期処理に関連するコールスタック、イベントループ、コールバックについての解説がされている","relatedLinks":[]},{"category":"Article","title":"Preparing for ECMAScript 6: New String Methods","url":"http://www.sitepoint.com/preparing-ecmascript-6-new-string-methods/","tags":["ECMAScript","JavaScript"],"content":"ES6で入るString周りのメソッドについての解説","relatedLinks":[]},{"category":"Article","title":"async vs defer attributes - Growing with the Web","url":"http://www.growingwiththeweb.com/2014/02/async-vs-defer-attributes.html","tags":["HTML","JavaScript"],"content":"script要素のasync属性とdefer属性の動作の違いを図解にしたもの","relatedLinks":[{"title":"サイトに適したリソース配置とasync/defer完全マスター – レンダリング優先のグッド・プラクティス | ゆっくりと…","url":"http://tokkono.cute.coocan.jp/blog/slow/index.php/xhtmlcss/resource-potitioning-best-practice/"}]},{"category":"Article","title":"Dev.Opera — Better @font-face with Font Load Events","url":"https://dev.opera.com/articles/better-font-face/","tags":["fonts","Promises","CSS"],"content":"CSS Font Loadingを使ってウェブフォントを読み込んでから適応して、FOUTを回避する事について","relatedLinks":[{"title":"CSS Font Loading Module Level 3を試してみた - console.blog(self);","url":"http://sadah.hatenablog.com/entry/2014/06/30/211944"}]},{"category":"Article","title":"Using ServiceWorker in Chrome today - JakeArchibald.com","url":"http://jakearchibald.com/2014/using-serviceworker-today/","tags":["Chrome"],"content":"Chromeでフラグ付きで実装されたService Workerを動かす方法やオフラインキャッシュのデモ","relatedLinks":[]},{"category":"SlideVideo","title":"The State of Grunt","url":"http://cowboy.github.io/state-of-grunt-fe-summit-2014-talk/#1","tags":["Grunt","スライド"],"content":"Gruntの現状と未来についてのスライド。\n\nGrunt 0.4ではGulpやBroccoliのプラグインも使えるようにすることやstream/promiseベースのTaskのパイプラインのサポート。\n\nGrunt/Gulp/Broccoliの目的の違いについてまとめられてる","relatedLinks":[]},{"category":"SlideVideo","title":"Dropbox - guiding-through-the-javascript-frameworks.pdf","url":"https://www.dropbox.com/s/hjl3cfs36b31jja/guiding-through-the-javascript-frameworks.pdf?dl=0","tags":["JavaScript","MVC","library","スライド"],"content":"JavaScriptのAngular、Ember、Backbone、React、Ampersand.jsなどのライブラリの特徴、またそれらを使って何を解決するのかというガイドラインを示すスライド","relatedLinks":[]},{"category":"SlideVideo","title":"▶ Tale of npm, css and html - YouTube","url":"https://www.youtube.com/watch?v=27GYm6nRv6E","tags":["npm","browserify","CSS","動画"],"content":"Browserifyとnpmを使った開発、またBrowserifyのcss版と言えるparcelifyについてのスクリーンキャスト\n\n<a href='https://github.com/rotundasoftware/parcelify'>https://github.com/rotundasoftware/parcelify</a>","relatedLinks":[]},{"category":"WebsiteDocument","title":"JavaScriptが実行できるリアルタイムオンラインエディタ作ってみました | 圧縮電子どうのこうの","url":"http://polygon-planet-log.blogspot.com/2014/09/javascript-online-synchronize-editor.html","tags":["JavaScript","editor","webservice"],"content":"コラボレーション出来るjsfiddle的なウェブサービス。\n\n複数人で編集できカーソル位置の可視化、JavaScriptコンソールやHTMLのプレビューなどがある","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mohayonao/neume.js · GitHub","url":"https://github.com/mohayonao/neume.js","tags":["JavaScript","audio","library"],"content":"Web Audio APIを扱うライブラリ。\n\nパフォーマンスや試行錯誤がしやすいインタフェースを目的にしている\n\n<a href='http://mohayonao.hatenablog.com/entry/2014/09/29/123242'>http://mohayonao.hatenablog.com/entry/2014/09/29/123242</a>","relatedLinks":[]},{"category":"Book","title":"Amazon.co.jp： JavaScriptエンジニア養成読本 [Webアプリ開発の定番構成Backbone.js+CoffeeScript+Gruntを1冊で習得! ] （Software Design plus）: 吾郷 協, 山田 順久, 竹馬 光太郎, 和智 大二郎: 本","url":"http://www.amazon.co.jp/dp/4774167975/","tags":["JavaScript","book"],"content":"2014年10月18日 発売\n\nJavaScript開発のムック本","relatedLinks":[]},{"category":"Book","title":"Developing a React.js Edge - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/9781939902122.do","tags":["VirualDOM","JavaScript","library","book"],"content":"React.jsについての書籍\n\n<a href='https://github.com/rtfeldman/bleeding-edge-sample-app'>https://github.com/rtfeldman/bleeding-edge-sample-app</a>","relatedLinks":[]},{"category":"Book","title":"“There Are More Bugs In Mobile Than... Particles In The Universe!” | Smashing Magazine","url":"http://www.smashingmagazine.com/2014/09/30/mobile-web-handbook-release/","tags":["ios","Android","mobile","web","JavaScript","CSS","book"],"content":"PPKによるモバイル周りのJSやCSSのバグや混乱する挙動などについてのガイドラインを提供する本。\n\nviewportや300msの遅延、ズームの動作、Touch Event、Androidなどのハマりどころについて書かれてる","relatedLinks":[]}]},{"meta":{"title":"2014-10-06のJS: localForage 1.0.0、Promises API、FluxとReactとBackbone.js","author":"azu","layout":"post","date":"2014-10-06T10:59:00.000Z","category":"JSer","tags":["JavaScript","Promise","localstorage","Flux","React","Backbone.js"],"url":"https://jser.info/2014/10/06/promise-flux-react-backbone/"},"items":[{"category":"Headline","title":"Release 0.9.0 · marijnh/acorn","url":"https://github.com/marijnh/acorn/releases/tag/0.9.0","tags":["JavaScript","AST","library","ReleaseNote"],"content":"JavaScriptパーサのacorn 0.9.0リリース。","relatedLinks":[]},{"category":"Headline","title":"node-browserify/changelog.markdown at 6.0.0 · substack/node-browserify","url":"https://github.com/substack/node-browserify/blob/6.0.0/changelog.markdown","tags":["browserify","ReleaseNote","sourcemap"],"content":"Browserify 6.0.0リリース。\n\nSourceMapのファイルパスがベースURLからの相対パスとなった。","relatedLinks":[]},{"category":"Headline","title":"Release v1.3.0 - UI Improvements · yeoman/yo","url":"https://github.com/yeoman/yo/releases/tag/v1.3.0","tags":["JavaScript","console","Tools","ReleaseNote"],"content":"yo v1.3.0リリース。\n\nコマンドラインUIの改善","relatedLinks":[]},{"category":"Headline","title":"Google Developers Blog: Promises in the Google APIs JavaScript Client Library","url":"http://googledevelopers.blogspot.com/2014/10/promises-in-google-apis-javascript.html","tags":["google","Promises","library","ReleaseNote"],"content":"Google APIのクライアントライブラリがPromise/A+ベースのものとなった","relatedLinks":[]},{"category":"Headline","title":"Release Stable API · mozilla/localForage","url":"https://github.com/mozilla/localForage/releases/tag/1.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"IndexedDB, WebSQL, localStorageを同じインタフェースで使えるlocalForage 1.0.0リリース。","relatedLinks":[]},{"category":"Article","title":"【JavaScript】 MutationObserverの使い方 個人的まとめ - はりをきば","url":"http://blog.gutyan.jp/entry/2014/09/06/MutationObserver","tags":["JavaScript"],"content":"MutationObserverの使い方、オプションについての解説","relatedLinks":[]},{"category":"Article","title":"Node.js Security Tips","url":"http://blog.risingstack.com/node-js-security-tips/","tags":["node.js","セキュリティ"],"content":"Node.jsとセキュリティについて\n\neval、strict mode、sudoしない、シェルを叩いてコマンドを実行しない、一時ファイル、XSS、HttpOnly、CSP等の扱いについて書かれている","relatedLinks":[]},{"category":"Article","title":"npm 2.0.0でローカルモジュールを使ってrequire(&#x27;../../../&#x27;)を回避する | Web Scratch","url":"http://efcl.info/2014/10/04/npm2-local-module/","tags":["npm","node.js","JavaScript"],"content":"npm 2.0.0からdependenciesにローカルパスを指定出来るようになり、プロジェクトだけで使うUtilsを読み込みやすくなった話","relatedLinks":[]},{"category":"Article","title":"HTML5Rocks の日本語記事まとめ - Google Developer Relations Japan Blog","url":"http://googledevjp.blogspot.com/2014/10/html5rocks.html","tags":["翻訳","まとめ"],"content":"HTML5 Rocksに現在公開されている翻訳記事のまとめ","relatedLinks":[]},{"category":"Article","title":"レスポンシブイメージのネイティブサポート - HTML5 Rocks","url":"http://www.html5rocks.com/ja/tutorials/responsive/picture-element/","tags":["HTML","画像"],"content":"レスポンシブに画像を扱うpicture要素について。\n\nmedia queryでの分岐、srcset属性での解像度対応、読み込む画像の種類によるfallback","relatedLinks":[]},{"category":"Article","title":"viljamis/Molten-Leading","url":"https://github.com/viljamis/Molten-Leading","tags":["JavaScript","library"],"content":"jQueryで実装されてたMolten Leadingのpure JavaScript版。\n\nline-heightを要素の幅に併せて変更してくれるライブラリ","relatedLinks":[]},{"category":"Article","title":"React Apps Using Flux and Backbone | Toptal","url":"http://www.toptal.com/front-end/simple-data-flow-in-react-applications-using-flux-and-backbone","tags":["React","backbone.js","JavaScript"],"content":"Fluxアーキテクチャのフローについて。\n\nDispatcherでイベントとState管理、Store(EventEmitter)がブロードキャストしたイベントをキャッチしてViewをレンダリングするという流れ。\n\nこれをBackbone.jsとReactを使った実装について","relatedLinks":[]},{"category":"Article","title":"ECMAScript 6 promises (2/2): the API","url":"http://www.2ality.com/2014/10/es6-promises-api.html","tags":["Promises","tutorial"],"content":"ES6 Promiseについて詳しい解説。基本的な使い方やどのようなフローで動くか、エラーハンドリング、メリット/デメリット、デバッグ、Promiseラッパの書き方、他の機能と強調した書き方についてなど","relatedLinks":[]},{"category":"Article","title":"まだmechanizeで消耗してるの? WebDriverで銀行をスクレイピング（ProtractorとWebdriverIOを例に） - 詩と創作・思索のひろば (Poetry, Writing and Contemplation)","url":"http://motemen.hatenablog.com/entry/2014/10/01/scrape-by-protractor-webdriverio","tags":["AngularJS","testing","Tools"],"content":"AngularJS向けのE2EテストフレームワークであるProtractorを使ったスクレイピングについて。","relatedLinks":[]},{"category":"SlideVideo","title":"A primer on Content Security Policy // Speaker Deck","url":"https://speakerdeck.com/polarblau/a-primer-on-content-security-policy","tags":["CSP","スライド"],"content":"XSSの動く仕組み、そのXSSを防止するためのエスケープや必要な事の多さとその一つとしてのCSPについてのスライド。\n\nCSPのルールについての紹介","relatedLinks":[]},{"category":"SlideVideo","title":"React - A JavaScript library for building user interfaces // Speaker Deck","url":"https://speakerdeck.com/helielson/react-a-javascript-library-for-building-user-interfaces","tags":["React","JavaScript","library","スライド"],"content":"React入門的なスライド。\n\nrender、state、componentのライフサイクル、テストについて","relatedLinks":[]},{"category":"SlideVideo","title":"Ampersand.js – Minimalistic Approach to not so minimalistic Problems // Speaker Deck","url":"https://speakerdeck.com/kamilogorek/ampersand-dot-js-minimalistic-approach-to-not-so-minimalistic-problems","tags":["JavaScript","MVC","library","スライド"],"content":"Ampersand.jsの紹介スライド","relatedLinks":[{"title":"▶ Kamil Ogórek – Ampersand.js – Minimalistic Approach to not so minimalistic Problems ","url":"https://www.youtube.com/watch?v=2Rzxn-xaFkg&index=5&list=PL37ZVnwpeshF8Sr8JZNFU6boKMmod9YBw"}]},{"category":"SlideVideo","title":"ES6: the future is now // Speaker Deck","url":"https://speakerdeck.com/jsist/es6-the-future-is-now","tags":["ECMAScript","スライド"],"content":"ECMAScriptのタイムライン、ES6の機能紹介のスライド","relatedLinks":[]},{"category":"SlideVideo","title":"TypeScript: coding JavaScript without the pain","url":"http://www.slideshare.net/SanderMak/typescript-coding-javascript-without-the-pain","tags":["TypeScript","スライド"],"content":"TypeScriptの特徴について紹介しているスライド","relatedLinks":[{"title":"sandermak/typescript-presentation","url":"https://github.com/sandermak/typescript-presentation"}]},{"category":"SlideVideo","title":"Localize your frontend // slidr.io","url":"http://slidr.io/klyrr/localize-your-frontend##1","tags":["JavaScript","i18n","library","スライド","AngularJS"],"content":"jimdo.com のローカライズについてのスライド。数字フォーマットの問題に対してAngularJS、Closure LibraryやECMA i18n API(とpolyfill)等について","relatedLinks":[{"title":"▶ Tina Umlandt – Localize your frontend! ","url":"https://www.youtube.com/watch?v=Lu4mholN2lA&index=3&list=PL37ZVnwpeshF8Sr8JZNFU6boKMmod9YBw"}]},{"category":"SlideVideo","title":"Reject.JS 2014 - YouTube","url":"https://www.youtube.com/playlist?list=PL37ZVnwpeshF8Sr8JZNFU6boKMmod9YBw","tags":["JavaScript","動画","まとめ"],"content":"Reject.JS 2014 の動画が公開された\n\n<a href='http://rejectjs.org/speakers/'>http://rejectjs.org/speakers/</a>","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Steady.js","url":"http://lafikl.github.io/steady.js/","tags":["JavaScript","library"],"content":"scrollイベントを扱うライブラリ。\n\nonscrollをthrottleしたり、topからの位置で反応するイベントをつけたりスクロール周りの処理を扱いやすくしてくれる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"JavaScript Promises Essentials | Packt","url":"https://www.packtpub.com/application-development/javascript-promises-essentials","tags":["JavaScript","book","電子書籍"],"content":"JavaScript Promiseについての書籍。\n\nWinJSのPromiseについても扱ってる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"verb - A CAD Library for the Web","url":"http://verbnurbs.com/","tags":["JavaScript","library"],"content":"CADライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"yahoo/gifshot","url":"https://github.com/yahoo/gifshot","tags":["JavaScript","画像","library"],"content":"複数枚の画像や動画からgifを作成するJavaScriptライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Mozilla Brick","url":"http://brick.mozilla.io/","tags":["Mozilla","WebComponents","library"],"content":"Web Componentsを使ったUIコンポーネントライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"shakiba/svgexport","url":"https://github.com/shakiba/svgexport","tags":["node.js","SVG","画像","console","Tools"],"content":"PhantomJSを使ってSVGをPNG/JPEG/PDFなどに変換出来るコマンドラインツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"SweetAlert","url":"http://tristanedwards.me/sweetalert","tags":["JavaScript","UI","library"],"content":"ダイアログUIライブラリ","relatedLinks":[]},{"category":"Book","title":"Developing a Gulp.js Edge - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/9781939902146.do","tags":["gulp","book"],"content":"JavaScriptのStreamベースのビルドシステムであるGulpについての書籍","relatedLinks":[{"title":"gulp.js - the streaming build system","url":"http://gulpjs.com/"}]},{"category":"Book","title":"Amazon.co.jp: Webアプリ構築のためのAngularJS 電子書籍: 外村 和仁, CodeGrid: Kindleストア","url":"http://www.amazon.co.jp/dp/B00O4RMZ4O/","tags":["AngularJS","book","kindle"],"content":"2014年10月6日発売\n\n<a href='https://app.codegrid.net/'>https://app.codegrid.net/</a> の攻略！AngularJSの連載を元にした書籍","relatedLinks":[]}]},{"meta":{"title":"2014-10-14のJS: Chrome 38リリース、ES6をES5へお手軽に変換","author":"azu","layout":"post","date":"2014-10-14T10:40:00.000Z","category":"JSer","tags":["Chrome","ECMAScript","Tools"],"url":"https://jser.info/2014/10/14/chrome38-es6to5/"},"items":[{"category":"Headline","title":"Chrome Releases: Stable Channel Update","url":"http://googlechromereleases.blogspot.com/2014/10/stable-channel-update.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 38リリース","relatedLinks":[{"title":"Chromium Blog: Chrome 38 Beta: New primitives for the next-generation web","url":"http://blog.chromium.org/2014/08/chrome-38-beta-new-primitives-for-next.html"}]},{"category":"Headline","title":"Visual Studio “14” CTP 4 and TypeScript 1.1 CTP Released - The Visual Studio Blog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/visualstudio/archive/2014/10/06/visual-studio-14-ctp-4-and-typescript-1-1-ctp-released.aspx","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 1.1リリース","relatedLinks":[{"title":"TypeScript 1.1.0 変更点 - Qiita","url":"http://qiita.com/vvakame/items/5e53c392867ebc604267"}]},{"category":"Headline","title":"AngularJS 1.3.0 – superluminal-nudge","url":"http://angularjs.blogspot.com/2014/10/angularjs-130-superluminal-nudge.html","tags":["AngularJS","ReleaseNote"],"content":"AngularJS 1.3.0リリース\n\nOne-time bindings、WAI-ARIAに対応するngAriaやStrict DI等の機能追加。\n\nまた1.3.0からはIE8は非サポートとなる","relatedLinks":[{"title":"AngularJS 1.3.0 リリース - AngularJS Ninja","url":"http://angularjsninja.com/blog/2014/10/14/angularjs-1.3.0-released/"}]},{"category":"Headline","title":"Release v0.9.1: Release Release 0.9.1 (2014-10-08) Node 0.11.x support · twada/power-assert","url":"https://github.com/twada/power-assert/releases/tag/v0.9.1","tags":["JavaScript","testing","library","ReleaseNote"],"content":"power-assert 0.9.1リリース。\n\nNode.js 0.11サポート","relatedLinks":[]},{"category":"Headline","title":"ractive/CHANGELOG.md at master · ractivejs/ractive","url":"https://github.com/ractivejs/ractive/blob/master/CHANGELOG.md","tags":["JavaScript","library","ReleaseNote"],"content":"Ractive.js 0.6.0リリース。\n\n`init`の代わりに`onrender`となったり、色々なevent hooksが追加された。\n\nテンプレートエンジンへの機能追加等","relatedLinks":[{"title":"Version 0.6.0 - Google グループ","url":"https://groups.google.com/forum/#!topic/ractive-js/_VIdRH_pG3w"}]},{"category":"Headline","title":"Brackets 0.44 Release: Split View – Brackets Blog","url":"http://blog.brackets.io/2014/10/06/brackets-0-44-release-split-view/","tags":["JavaScript","editor","ReleaseNote"],"content":"Brackets 0.44リリース。\n\n横並べで表示できるSplit Viewの追加、Vendor prefixなどについてのQuick Docsを追加","relatedLinks":[]},{"category":"Article","title":"Vue.js v0.11の変更点(予定)まとめ - blog.koba04.com","url":"http://blog.koba04.com/post/2014/10/07/vue-js-v011-changes/","tags":["JavaScript","MVC","library"],"content":"Vue.js v0.11 RCの変更点のまとめ","relatedLinks":[]},{"category":"Article","title":"Dev.Opera — CSS: It was twenty years ago today — an interview with Håkon Wium Lie","url":"https://dev.opera.com/articles/css-twenty-years-hakon/","tags":["CSS","歴史","インタビュー"],"content":"CSS20周年を記念してのインタビュー","relatedLinks":[]},{"category":"Article","title":"Lightweight ES6 Features That Pack A Punch | colintoh.com","url":"http://colintoh.com/blog/lightweight-es6-features","tags":["ECMAScript","JavaScript"],"content":"ES6の機能紹介記事。\n\nES6Fiddleで実行出来るサンプルコードと共に紹介されてて分かりやすい","relatedLinks":[]},{"category":"Article","title":"JavaScript Beyond the Web in 2014","url":"http://www.sitepoint.com/javascript-beyond-web-2014/","tags":["JavaScript"],"content":"JavaScriptとハードウェアについて。\n\nJavaScriptを使って触れるハードウェアについてまとめられている","relatedLinks":[]},{"category":"Article","title":"JavaScript - 本当にあったTouchEventの怖い話 - Qiita","url":"http://qiita.com/damele0n/items/dc312bbf66da1d46dd6f","tags":["mobile","JavaScript","Android","ios"],"content":"Android、iOSでのTouchEventを生成してdispatchする方法について。\n\n独自仕様の`initTouchEvent`についてやPolyfillについて","relatedLinks":[]},{"category":"Article","title":"天使やカイザーと呼ばれて » オレ流AngularJSを使った設計ポリシー","url":"https://www.eisbahn.jp/yoichiro/2014/10/my_angularjs_design_policy.html","tags":["AngularJS","JavaScript"],"content":"Chrome MySQL Adminを例としたAngularJSを使った設計のポリシーについて。\n\nコントローラやサービス、状態変化とイベントのやり取りについて等","relatedLinks":[]},{"category":"Article","title":"全国のSeleniumer必読 - Qiita","url":"http://qiita.com/oh_rusty_nail/items/b8ba525d31ea7c522856","tags":["Selenium","まとめ","Tips","browser"],"content":"SeleniumのTips集、verifyとassertの使い分け、状況別の対処法等","relatedLinks":[]},{"category":"Article","title":"Explorations In Automatically Fixing JavaScript Linting-errors","url":"http://addyosmani.com/blog/fixmyjs/","tags":["JavaScript","editor","Tools"],"content":"FixMyJSを使ったJSHintの警告対象を自動的に修正する方法とSublime Text等のエディタ連携について","relatedLinks":[]},{"category":"SlideVideo","title":"React: Flux Architecture - Video Tutorial Series @eggheadio","url":"https://egghead.io/series/react-flux-architecture","tags":["React","動画"],"content":"Reactを使ったFluxアーキテクチャでのショッピングカートを作るスクリーンキャスト。\n\nReactでなくても実現できる事が中心なのでデザインのパターンとして見られる感じ","relatedLinks":[]},{"category":"SlideVideo","title":"WebRTC (概要から中の仕組みまで) // Speaker Deck","url":"https://speakerdeck.com/yosuke_furukawa/webrtc-gai-yao-karazhong-falseshi-zu-mimade","tags":["WebRTC","スライド"],"content":"WebRTCの接続確立から通信するまでの流れとWebRTCのAPIについてのスライド。\n\nNAT、ICE(STUN、TURN)、DTLS、SRTP、SCTP、WebSocket APIとの類似性などについて","relatedLinks":[{"title":"WebRTCについての話を社内勉強会でしてきた - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2014/10/09/100629"}]},{"category":"WebsiteDocument","title":"INTRO TO D3.JS - Overview","url":"https://square.github.io//intro-to-d3/","tags":["JavaScript","d3.js","tutorial"],"content":"Square社によるD3.jsチュートリアル","relatedLinks":[]},{"category":"WebsiteDocument","title":"DevTools Tips","url":"http://devtoolstips.com/","tags":["Chrome","debug"],"content":"Chrome DevToolsのTips投稿サイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sebmck/6to5","url":"https://github.com/sebmck/6to5","tags":["ECMAScript","JavaScript","Tools"],"content":"ES6のコードをランタイムなしのES5に変換するツール。\n\nSourceMap対応、BrowserifyやGrunt等のpluginが用意されてる。\n\n他のES6コード変換との比較表も載せている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Nightmare","url":"http://www.nightmarejs.org/","tags":["JavaScript","browserify","library"],"content":"PhantomJS APIでの操作をメソッドチェーンで書いていけるライブラリ。\n\n`.run(callback)` にerrorオブジェクトが渡ってくる。\n\n操作をまとめたモジュールを作って`.use`で再利用できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"React Bootstrap","url":"http://react-bootstrap.github.io/","tags":["React","CSS","design"],"content":"Reactを使ったBootstrap 3のcomponent。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"angular/dart2es6","url":"https://github.com/angular/dart2es6","tags":["dart","ECMAScript","Tools"],"content":"DartをES6に変換するtranspiler","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cure53/jPurify","url":"https://github.com/cure53/jPurify","tags":["jQuery","DOM","XSS","library"],"content":"jQueryでDOM Based XSSを引き起こす可能性があるメソッドを乗っ取って、サニタイズ的な処理を追加するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ilyavolodin/eslint-plugin-backbone","url":"https://github.com/ilyavolodin/eslint-plugin-backbone","tags":["JavaScript","backbone.js","plugin"],"content":"ESLintを使ったBackbone.jsに関するLintのルールセット","relatedLinks":[]},{"category":"SoftwareLibrary","title":"github/fetch · GitHub","url":"https://github.com/github/fetch","tags":["JavaScript","XHR","Promises","library"],"content":"WHATWGで策定されてる`fetch`のpolyfillライブラリ。 \n\nXHRよりもシンプルなAPIでデータの取得、送信等が行える。\n\nfetchはPromiseを返すので別途Promiseのpolyfillが必要。\n\nformやArrayBuffer等まだ実装されていない部分がある。","relatedLinks":[]},{"category":"Book","title":"JavaScript… by Reginald Braithwaite [Leanpub PDF/iPad/Kindle]","url":"https://leanpub.com/javascript-spessore","tags":["JavaScript","book"],"content":"JavaScriptのオブジェクト指向についての書籍。スケール出来るようなWebアプリケーションの作りを学ぶ。\n\nWeb版は無料で見られる","relatedLinks":[]}]},{"meta":{"title":"2014-10-20のJS: Firefox 33、Reactとは何か、FormatJS","author":"azu","layout":"post","date":"2014-10-19T14:31:00.000Z","category":"JSer","tags":["Firefox","React","i18n","library"],"url":"https://jser.info/2014/10/19/firefox33-react-formatjs/"},"items":[{"category":"Headline","title":"Firefox — Notes (33.0) — Mozilla","url":"https://www.mozilla.org/en-US/firefox/33.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 33リリース。\n\nOpenH264のサポート、CSPのバックエンドが新しくなりました。\nまた、`<picture>`をフラグ付きでサポート、[開発者ツールの機能追加](https://hacks.mozilla.org/2014/07/event-listeners-popup-media-sidebar-cubic-bezier-editor-more-firefox-developer-tools-episode-33/ \"Event listeners popup, @media sidebar, Cubic bezier editor + more – Firefox Developer Tools Episode 33 ✩ Mozilla Hacks – the Web developer blog\")等が行われています。","relatedLinks":[{"title":"Firefox 33 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/docs/Mozilla/Firefox/Releases/33"},{"title":"Firefox 33 サイト互換性情報 - Mozilla | MDN","url":"https://developer.mozilla.org/ja/docs/Mozilla/Firefox/Releases/33/Site_Compatibility"},{"title":"Firefox 33 が正式リリース、Open H264 や @counter-style 規則のサポート、OMTC の有効化など | WWW WATCH","url":"http://hyper-text.org/archives/2014/10/firefox_33_release.shtml"},{"title":"CSP for the web we have | Mozilla Security Blog","url":"https://blog.mozilla.org/security/2014/10/04/csp-for-the-web-we-have/"}]},{"category":"Headline","title":"Release Dragon Master · sass/libsass","url":"https://github.com/sass/libsass/releases/tag/3.0","tags":["Sass","C++"],"content":"SassコンパイラのC++実装であるlibsass 3.0リリース。\n\nSass 3.4の動作に近づけていく改善が中心。\n\n`@extends`、Map、`call()`のサポート、Windowsでの動作を改善など","relatedLinks":[]},{"category":"Headline","title":"jQuery UI 1.11.2 | jQuery UI Blog","url":"http://blog.jqueryui.com/2014/10/jquery-ui-1-11-2/","tags":["jQuery","UI","ReleaseNote"],"content":"jQuery UI 1.11.2リリース","relatedLinks":[]},{"category":"Headline","title":"React v0.12 RC | React","url":"http://facebook.github.io/react/blog/2014/10/16/react-v0.12-rc1.html","tags":["React","ReleaseNote"],"content":"React v0.12 RCリリース。\n\nJSXに破壊的な変更が多く含まれている。\n\n`@jsx` pragmaは不要に、JSXタグは小文字or`-`が含まれてるならHTMLとして扱うように、Spread attributesをサポートする代わりにtransferPropsToは非推奨にする等など","relatedLinks":[]},{"category":"Headline","title":"A new ES6 draft, Rev28","url":"https://esdiscuss.org/topic/a-new-es6-draft-rev28","tags":["ECMAScript","spec","ReleaseNote"],"content":"ECMAScript 6 Draft Rev 28リリース。","relatedLinks":[{"title":"harmony:specification","url":"http://wiki.ecmascript.org/doku.php?id=harmony:specification_drafts#october_14_2014_draft_rev_28"}]},{"category":"Headline","title":"Android Lollipop | Android Developers","url":"http://developer.android.com/about/versions/lollipop.html#WebView","tags":["Android","webview"],"content":"Android 5.0以降のChromium WebViewはGoogle Playからアップデートすることが出来るようになっている","relatedLinks":[]},{"category":"Article","title":"Exploring Angular 1.3 - One-time bindings – Blog | thoughtram - Extend your memory","url":"http://blog.thoughtram.io//angularjs/2014/10/14/exploring-angular-1.3-one-time-bindings.html","tags":["AngularJS"],"content":"Angular 1.3で導入されたone-time bindingについての解説","relatedLinks":[]},{"category":"Article","title":"ReactJS For Stupid People","url":"http://blog.andrewray.me/reactjs-for-stupid-people/","tags":["JavaScript","React"],"content":"Reactとは何かについて。\n\nReactはViewのみを扱うライブラリ、DOM APIでHTML作成は大変なのでJSXというSyntaxを持つ、Reactはサーバでも使える。\n\n良くない点としてドキュメントサイトの入り口のわかりにくさやサイズなどがあげられています。\n\nFluxはコンセプトであってライブラリではないという話やどういう時に使うべきかについても書かれている。","relatedLinks":[]},{"category":"Article","title":"platform.js ⇒ webcomponents.js","url":"http://blog.polymer-project.org/announcements/2014/10/16/platform-becomes-webcomponents/","tags":["WebPlatformAPI","WebComponents","library"],"content":"platform.jsはwebcomponents.jsという名前にリネームされる。\n\nbower等を利用して入れている場合は影響があるので参照するファイルを変更する必要がある","relatedLinks":[]},{"category":"Article","title":"自動検出と自動修正でCSSを保守する - Qiita","url":"http://qiita.com/r7kamura/items/7addebc61d177313a29d","tags":["CSS","Sass","Tools"],"content":"scss-lintとcsscombを使ってSassのLintと修正を行い保守可能なCSSを維持する事について","relatedLinks":[]},{"category":"Article","title":"status.modern.IEの見方 | Web Scratch","url":"http://efcl.info/2014/10/19/modern-ie/","tags":["IE","browser","webservice"],"content":"status.modern.IEで公開されているIEの開発ステータスの読み方と、その変更を見ていく方法について","relatedLinks":[]},{"category":"Article","title":"Announcing key advances to JavaScript performance in Windows 10 Technical Preview - IEBlog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/ie/archive/2014/10/09/announcing-key-advances-to-javascript-performance-in-windows-10-technical-preview.aspx","tags":["IE","JavaScript"],"content":"IEのJavaScriptエンジンであるChakraの最適化について。\n[Baseline コンパイラ](https://dev.mozilla.jp/2013/04/the-baseline-compiler-has-landed/ \"Baseline コンパイラ\")的なASTを中間層として用意してJITコンパイルする仕組みなどについて書かれている。\n\n最適化としてやっていることについてで、\nオブジェクトの同値の場合にインラインキャッシュ、コードのインライン化、Arrayアクセスの最適化、mark&sweep GCの改善等に触れている","relatedLinks":[{"title":"Baseline コンパイラを導入しました | Mozilla Developer Street (modest)","url":"https://dev.mozilla.jp/2013/04/the-baseline-compiler-has-landed/"}]},{"category":"Article","title":"NPM 2.0 and how it helps avoiding global dependencies | 4waisenkinder","url":"http://4waisenkinder.de/blog/2014/10/18/npm-2-dot-0-and-the-much-better-star-npm-run-star-command/","tags":["node.js","npm"],"content":"npm 2.0からnpm run scriptに引数を渡せるようになった件とnpm run scriptでは自動的にnode_modules/.binのパスを解決してくれる事について","relatedLinks":[]},{"category":"Article","title":"mattdesl/module-best-practices","url":"https://github.com/mattdesl/module-best-practices","tags":["node.js","JavaScript","document"],"content":"Node.jsのモジュールベストプラクティス。\n\nモジュールのファイル名、npmモジュールの作成、コンストラクタのパターン、テスト、バージョニング、package.jsonの情報、npmignore、npm run-scriptについて等","relatedLinks":[]},{"category":"WebsiteDocument","title":"Browser Platform Status Tracker","url":"http://platformstatustracker.azurewebsites.net/","tags":["IE","Chrome","まとめ","browser"],"content":"IEやChromiumのステータス情報から差分の情報をまとめてくれているページ。\n\nどの機能がどのバージョンで入ったか、prefixが外れたか等が分かる","relatedLinks":[]},{"category":"WebsiteDocument","title":"Lapple/ErrorBoard","url":"https://github.com/Lapple/ErrorBoard","tags":["JavaScript","debug","node.js"],"content":"Node.jsで動くJavaScriptのエラーを収集して見るためのダッシュボードアプリ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Functional Programming in Javascript","url":"http://jhusain.github.io/learnrx/","tags":["JavaScript","関数型プログラミング"],"content":"Arrayのmapやfilter等について学べるエクササイズ。\n\n一つのエクササイズを完了させると次の問題へ進めていって全部で40個以上ある\n\n<a href='https://github.com/jhusain/learnrx'>https://github.com/jhusain/learnrx</a>","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kriasoft/react-starter-kit · GitHub","url":"https://github.com/kriasoft/react-starter-kit","tags":["React"],"content":"React/Fluxパターンで全部入りな感じのStarter Kit。\n\nシングルページアプリケーション的な構成になっている。","relatedLinks":[{"title":"Web Starter Kit — Web Fundamentals","url":"https://developers.google.com/web/starter-kit/"}]},{"category":"SoftwareLibrary","title":"FormatJS","url":"http://formatjs.io/","tags":["JavaScript","i18n","library"],"content":"数字や日付、文字列の国際化対応のためのライブラリ。\n\n150言語以上に対応しており、HandlebarsやReact等のテンプレートの対応も用意されている。\n\nECMA i18n APIやUnicode CLDR、ICU MessageFormatなどの標準の上に実装されている","relatedLinks":[{"title":"Announcing Format.JS: Internationalize your web apps on the client ","url":"http://yahooeng.tumblr.com/post/100006468771/announcing-format-js-internationalize-your-web-apps-on"},{"title":"米Yahoo!が国際化のためのJavaScriptライブラリ「Format.JS」を公開 | SourceForge.JP Magazine","url":"http://sourceforge.jp/magazine/14/10/17/151500"}]},{"category":"SoftwareLibrary","title":"medikoo/memoize","url":"https://github.com/medikoo/memoize","tags":["JavaScript","library"],"content":"memorizeを行うためのライブラリ。\n\n多彩なキャッシュをするルールが用意されていて、特定の引数をキーにしたり、非同期対応、Weakなmemorizeなども用意されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"No9/localstorage-down","url":"https://github.com/no9/localstorage-down","tags":["JavaScript","library"],"content":"leveldownのdbとして使えるlocalStorageのバックエンド実装。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"uber/potter","url":"https://github.com/uber/potter","tags":["node.js","console","Tools"],"content":"uber社のNode.jsのプロダクションプロジェクトを作成するscaffold、CIの設定等を行うpluginで拡張可能なコマンドラインツール\n\n<a href='http://raynos.github.io/nodeconfeu2014-talk/'>http://raynos.github.io/nodeconfeu2014-talk/</a>","relatedLinks":[]},{"category":"SoftwareLibrary","title":"box/leche","url":"https://github.com/box/leche","tags":["JavaScript","testing","library"],"content":"mockするためのオブジェクト作成やパラメタライズドテストを行うData Providerの機能が用意されているテストの補助ライブラリ。\n\nMochaとSinonと共に使う事を想定して作られている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dgs700/angular-custom-element","url":"https://github.com/dgs700/angular-custom-element","tags":["AngularJS","WebComponents"],"content":"Angular 2.0ではWeb Components対応が予定されているが、1.xでもCustom Elementsを使ってディレクティブを定義出来るようにするライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Knockout Secure Binding – Brian M Hunt","url":"http://brianmhunt.github.io/articles/knockout-plus-content-security-policy/","tags":["CSP","JavaScript","library"],"content":"KnockoutのCSP対応なバインディングを出来るようにするライブラリ。\n\n`new Function`を使わないようにすることでCSPに対応している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"othiym23/async-listener","url":"https://github.com/othiym23/async-listener","tags":["node.js","library"],"content":"Node.js 0.11のasyncListener APIのpolyfillライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"captainbrosset/pagerecorder","url":"https://github.com/captainbrosset/pagerecorder","tags":["firefox","addon"],"content":"Firefoxの開発者ツールでページの変更を記録するアドオン。\n\nどのようなイベントがおきて、どの要素が変更されたか等を一覧できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"react-hot-loader · Pure JS live-editing for React","url":"http://gaearon.github.io/react-hot-loader/","tags":["React","JavaScript","Tools"],"content":"Reactを使ったコードのLive Reloadを行うためのWebpackのloaderに指定するプラグイン","relatedLinks":[]},{"category":"Book","title":"Learning Ember.js by Blake Erickson [Leanpub PDF/iPad/Kindle]","url":"https://leanpub.com/learningemberjs","tags":["JavaScript","library","book"],"content":"Ember.jsとEmber CLIについての基本的な使い方から学べる書籍","relatedLinks":[]}]},{"meta":{"title":"2014-10-27のJS: WebStorm 9、ESLint 0.9.0、AngularJS 2.0とAtScript","author":"azu","layout":"post","date":"2014-10-27T10:41:00.000Z","category":"JSer","tags":["WebStorm","IDE","Lint","Tools","TypeScript","AngularJS"],"url":"https://jser.info/2014/10/27/webstorm9-eslint-atscript/"},"items":[{"category":"Headline","title":"WebStorm 9 released: Meteor support, React and JSX, Gulp integration, and more | JetBrains WebStorm Blog","url":"http://blog.jetbrains.com/webstorm/2014/10/webstorm-9-released-meteor-support-react-and-jsx-gulp-integration-and-more/","tags":["WebStorm","ReleaseNote"],"content":"WebStorm 9リリース。\n\n主に以下の様な機能追加等が中心です。\n\n- Meteor、React/JSX、Polymerのサポート\n- PhoneGap、Gulp統合\n- spy-js/LiveEditがNode.jsアプリケーションに対応\n- ESLint/JSCS/EditorConfigのサポート\n- [What&#x27;s new in WebStorm 9](https://www.jetbrains.com/webstorm/whatsnew/ \"What&#x27;s new in WebStorm 9\")","relatedLinks":[]},{"category":"Headline","title":"Release Custom Driver Support · mozilla/localForage","url":"https://github.com/mozilla/localForage/releases/tag/1.1.1","tags":["JavaScript","library","ReleaseNote"],"content":"localForage 1.1.1リリース。\n\n`defineDriver()`メソッドが追加され、任意のCustom Driverを作成して適応出来るようになった。\n\n任意のストレージをバックエンドに実装出来る","relatedLinks":[]},{"category":"Headline","title":"mocha/History.md at 2.0.0 · mochajs/mocha","url":"https://github.com/mochajs/mocha/blob/2.0.0/History.md","tags":["JavaScript","node.js","testing","ReleaseNote"],"content":"mocha 2.0.0リリース。\n\nリポジトリのオーナーがmochajsになった。\n\nNode.js 0.4と0.6のサポート終了","relatedLinks":[]},{"category":"Headline","title":"Node v0.10.33 (Stable)","url":"http://blog.nodejs.org/2014/10/23/node-v0-10-33-stable/","tags":["node.js","ReleaseNote","セキュリティ"],"content":"Node v0.10.33リリース\n\nPOODLE対策","relatedLinks":[]},{"category":"Headline","title":"ESLint 0.9.0 released - ESLint","url":"http://eslint.org/blog/2014/10/eslint-0.9.0-released/","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 0.9.0リリース。\n\npluginはstableに、 Governance Modelを追加、ルールの追加や修正など","relatedLinks":[]},{"category":"Headline","title":"CodeMirror release 4.7.0 - Google グループ","url":"https://groups.google.com/forum/#!msg/codemirror/Ry_Mx8BGcQU/NFqd0odfYHQJ","tags":["JavaScript","editor","library"],"content":"CodeMirror 4.7.0リリース\n\nCoffeeScriptやScala、PHP等のmodeを改善。Textileのサポート、ロゴが新しくなった","relatedLinks":[]},{"category":"Article","title":"TypeScript and the Road to 2.0 - TypeScript - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/typescript/archive/2014/10/22/typescript-and-the-road-to-2-0.aspx","tags":["TypeScript"],"content":"TypeScript 2.0のロードマップ。\n\n1.4でunion typesのサポート、1.5からES6の親和性の向上などを目指す。\n\nまたFacebookのFlowやAngularJS 2.0で使われてるAtScriptのチームと一緒にType AnnotaionsをECMAScriptへの提案を進めていく方針","relatedLinks":[]},{"category":"Article","title":"Community Round-up #23 | React","url":"http://facebook.github.io/react/blog/2014/10/17/community-roundup-23.html","tags":["Flux","JavaScript","まとめ"],"content":"Fluxアーキテクチャのサンプルや解説やライブラリ等のまとめ","relatedLinks":[]},{"category":"Article","title":"写真サービス機能のブラウザ内実装 | 株式会社サイバーエージェント","url":"https://www.cyberagent.co.jp/recruit/techreport/report/id=8548","tags":["ios","Android","画像","canvas","browser"],"content":"iOS 6.0~、Android 4.0~に対応した画像を扱う時に起きる問題と対処について。\n\niOS 6のファイルサイズの問題、AndroidのtoDataURLがJPEGをサポートしてない問題、フィルタ処理やリサイズについてなどハマりどころをまとめられている","relatedLinks":[]},{"category":"Article","title":"スマートフォンWebのフロントエンドを高速化する取り組み - クックパッド開発者ブログ","url":"http://techlife.cookpad.com/entry/2014/10/23/095814","tags":["Android","webkit","JavaScript","mobile"],"content":"モバイル向けの一部ページをシングルページアプリケーションとして作るのに適した条件やメリットについて書かれている。\n\nクライアントサイドでの画像リサイズとアップロードやTouchイベント対応などについて","relatedLinks":[]},{"category":"Article","title":"ECMAScript 6 returns JavaScript to original intent | InfoWorld","url":"http://www.infoworld.com/article/2837425/javascript/ecmascript-6-returns-javascript-to-original-intent.html","tags":["JavaScript","ECMAScript","インタビュー"],"content":"ES6/7についてJafar Husainさん(Async Generatorの人)へのインタビュー。\n\n何故ES6/7を同時進行しているのか、Async functionとAsync Generatorについて、大きなアプリケーションと型の必要性について。","relatedLinks":[]},{"category":"SlideVideo","title":"AngularJS カンファレンス（ng-europe 2014）のスライドまとめ - AngularJS Ninja","url":"http://angularjsninja.com/blog/2014/10/24/slides-at-ngeurope-2014/","tags":["AngularJS","スライド","まとめ"],"content":"ng-europeのスライドまとめ","relatedLinks":[{"title":"ng-europe - The first AngularJS European conference in Paris, France.","url":"http://ngeurope.org/"}]},{"category":"SlideVideo","title":"Keynote: AtScript - Google スライド","url":"https://docs.google.com/presentation/d/1hr2IM-8G-0RzpB-WY8pLHvxqNggKPzUO0KvEv1IKPws/present#slide=id.p","tags":["AngularJS","スライド"],"content":"AtScriptについてのスライド。\n\nAtScriptは新しい言語ではなくES6にTypesとAnnotationsとIntrospectionを追加したもの。\n\nAtScriptのロードマップについても書かれている。","relatedLinks":[]},{"category":"SlideVideo","title":"AtScript Primer - Google ドキュメント","url":"https://docs.google.com/document/d/11YUzC-1d0V1-Q3V0fQ7KSit97HnZoKVygDxpWzEYW0U/preview#","tags":["AngularJS","JavaScript","document","spec"],"content":"AngularJS 2.0で使われているES6に型定義を拡張したもの。\n\nassert.jsを使ったES6 validなものへTraceurで変換が出来る。またDI等に利用できるMetadata Annotationsがある。\n\nこちらもECMAScript標準への提案を行っていく方針。","relatedLinks":[{"title":"Assert.js","url":"http://angular.github.io/assert/"},{"title":"The Extensible Web Manifesto","url":"http://extensiblewebmanifesto.org/"}]},{"category":"SlideVideo","title":"ES6 &amp; Traceur","url":"http://arv.github.io/ngeurope/#/","tags":["ECMAScript","JavaScript","スライド"],"content":"ES6の機能についてのスライド。\n\n機能ごとにいつ、どんな時に使うべきかも書かれている。\n\nまたTraceurがどのように動いているかやAngularで使われてるAtScriptの拡張について","relatedLinks":[]},{"category":"SlideVideo","title":"Yahoo! JAPAN Creative Blog — 「SCRIPTY#1 」の資料を公開します #scripty01","url":"http://yj-creative.tumblr.com/post/100569738942/scripty-1-scripty01","tags":["JavaScript","スライド","まとめ","イベント"],"content":"SCRIPTYのスライドまとめ。\n\nCSS/BEM、Backbone/Marionette、Angular/Three.js、Polymer、Yahoo!ニュースのブラウザサポート、grunt、ライブコーディング、アクセシビリティなど","relatedLinks":[]},{"category":"SlideVideo","title":"In the DOM, no one will hear you scream","url":"http://www.slideshare.net/x00mario/in-the-dom-no-one-will-hear-you-scream","tags":["DOM","XSS","スライド"],"content":"DOM Based XSSとjQueryによるXSSについてのスライド。\n\nDOM Level、文字列からコードとして実行するメソッド一覧、上書きによる破壊、DOMPurifyによる防止について","relatedLinks":[{"title":"cure53/DOMPurify","url":"https://github.com/cure53/DOMPurify"},{"title":"cure53/jPurify","url":"https://github.com/cure53/jPurify"}]},{"category":"SlideVideo","title":"christianalfoni WebApp Enthusiast","url":"http://christianalfoni.github.io/javascript/2014/08/20/react-js-and-flux.html","tags":["JavaScript","Flux"],"content":"Backbone/Angular/Flux+Reactでそれぞれ実装した場合の違いを見ながら、Fluxアーキテクチャの特徴について紹介。 \n\n[Ractive.js](<a href='http://www.ractivejs.org/'>http://www.ractivejs.org/</a> &quot;Ractive.js&quot;)と[vue.js](<a href='http://vuejs.org/'>http://vuejs.org/</a> &quot;vue.js&quot;)とFluxアーキテクチャを使って同様のサンプルを作ってあります。","relatedLinks":[{"title":"azu/Flux-Checkbox-Example","url":"https://github.com/azu/Flux-Checkbox-Example"}]},{"category":"SlideVideo","title":"ブラウザのパフォーマンスを限界まで高める HTMLコーディングの考え方","url":"http://ja.slideshare.net/kawada_hiroshi/html-40678123","tags":["browser","performance","スライド"],"content":"ブラウザのパフォーマンス最適化の戦略についてのスライド。\n\n極端な例外を除いたパーセンタイルを見てパフォーマンスを調整。\n\nレンダリングの開始時間、Speed Index、Critical Redering Pathを目安にする。\n\n標準化やNavigation Timingについて","relatedLinks":[{"title":"Google I/O 2014 - Mobile Web performance auditing","url":"https://www.google.com/events/io/schedule/session/c8300366-03ed-e311-903f-00155d5066d7"}]},{"category":"WebsiteDocument","title":"AurelioDeRosa/HTML5-API-demos","url":"https://github.com/AurelioDeRosa/HTML5-API-demos","tags":["HTML5","WebPlatformAPI","サンプル"],"content":"Battery Status API等の広義のHTML5 APIについての仕様とサンプルと記事をまとめたリポジトリ","relatedLinks":[]},{"category":"WebsiteDocument","title":"JS Compatibility Checker","url":"http://jscc.info/","tags":["browser","JavaScript","Tools"],"content":"ブラウザ間で互換性のあるコードかをチェックするツール。\n\nECMAScript5 APIやcaniuseのデータを元にチェックする","relatedLinks":[]},{"category":"WebsiteDocument","title":"Content Security Policy Playground","url":"http://www.cspplayground.com/","tags":["CSP","webservice","まとめ"],"content":"CSPについて実際に任意の設定を適応して試しながら学べるサイト。\n\nCSP Policyのバリデーションや関連リソースについてもまとめられている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"wooorm/mdast","url":"https://github.com/wooorm/mdast","tags":["Markdown","node.js","AST","library"],"content":"JavaScriptのMarkdownパーサライブラリ。パースした結果をJSON的なASTとして出力する。\n\ngfmやpandoc風の解釈も対応していて、Parser API ライクなドキュメントもあって良さそう","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Khan/structuredjs","url":"https://github.com/Khan/structuredjs","tags":["JavaScript","AST","library"],"content":"JavaScriptのコードをプレースホルダー的に書いておいて、入力されたコードがプレースホルダーと一致するかをチェックできるライブラリ。\n\n不一致の場合のエラー情報等も定義でき、学習サイト等で使われる感じ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dameleon/paw.js","url":"https://github.com/dameleon/paw.js","tags":["JavaScript","mobile","library"],"content":"TouchEventやPointerEventをハンドリングして、シンプルに扱える`tap`イベント等のカスタムイベントを発行してくれるライブラリ。","relatedLinks":[{"title":"Paw.jsというのを書いたのと今から始めるマルチタッチイベント処理 - damelog","url":"http://dameleon.hatenablog.com/entry/2014/10/21/171448"}]},{"category":"SoftwareLibrary","title":"hughsk/district","url":"https://github.com/hughsk/district","tags":["node.js","npm","console","Tools"],"content":"指定したディレクトリをnode_modules以下にエイリアスを貼るツール。\n\nモジュールを特定のディレクトリに名前空間的にまとめることができる","relatedLinks":[]}]},{"meta":{"title":"2014-11-02のJS: Bootstrap 3.3.0、CSP Lv.2、Object.observe()の未来","author":"azu","layout":"post","date":"2014-11-02T08:35:00.000Z","category":"JSer","tags":["CSS","CSP","セキュリティ","JavaScript","MVC","React"],"url":"https://jser.info/2014/11/02/bootstrap3.3.0-csplv2-object.observe/"},"items":[{"category":"Headline","title":"HTML5勧告–オープン・ウェブ・プラットフォームの重要なマイルストーンを達成","url":"http://www.w3.org/2014/10/html5-rec.html.ja","tags":["HTML5","ReleaseNote"],"content":"W3C HTML5が勧告された","relatedLinks":[]},{"category":"Headline","title":"Bootstrap 3.3.0 released · Bootstrap Blog","url":"http://blog.getbootstrap.com/2014/10/29/bootstrap-3-3-0-released/","tags":["CSS","library","ReleaseNote"],"content":"Bootstrap 3.3.0リリース。\n\nHTML lintをするbootlintや4.0についても書かれている","relatedLinks":[{"title":"twbs/bootlint","url":"https://github.com/twbs/bootlint"},{"title":"Web開発のためのツール集の最新版「Bootstrap 3.3.0」リリース、「Bootstrap 4」も近日登場：CodeZine","url":"http://codezine.jp/article/detail/8248"}]},{"category":"Headline","title":"Meteor","url":"https://www.meteor.com/blog/2014/10/28/meteor-1-0","tags":["JavaScript","node.js","ReleaseNote"],"content":"Meteor 1.0リリース","relatedLinks":[]},{"category":"Headline","title":"React v0.12 | React","url":"http://facebook.github.io/react/blog/2014/10/28/react-v0.12.html","tags":["React","library","ReleaseNote"],"content":"React 0.12正式リリース。\n\n用語やAPIの変更、JSXの変更、ChromeのDevTools拡張の改善、ライセンスがApache 2から修正BSDに変更","relatedLinks":[]},{"category":"Headline","title":"Release JSHint 2.5.7 · jshint/jshint","url":"https://github.com/jshint/jshint/releases/tag/2.5.7","tags":["JavaScript","Tools","ReleaseNote"],"content":"JSHint 2.5.7リリース。\n\nES6のSymbol、Reflect、System、ComputedPropertyNamesに対応等","relatedLinks":[]},{"category":"Headline","title":"Socket.IO — Socket.IO 1.2.0","url":"http://socket.io/blog/socket-io-1-2-0/","tags":["node.js","JavaScript","library","ReleaseNote"],"content":"Socket.IO 1.2.0リリース。\n\nサーバとクライアントのバグ修正。\n\nIE10みたいにXDRとXHR Lv2がある場合はXHRを優先するように、PhantomJSのサポート等","relatedLinks":[]},{"category":"Headline","title":"Sinon.JS/Changelog.txt at v1.11.1 · cjohansen/Sinon.JS","url":"https://github.com/cjohansen/Sinon.JS/blob/v1.11.1/Changelog.txt","tags":["JavaScript","testing","ReleaseNote","library"],"content":"Sinon.JS 1.11.0リリース。\n\nAMDサポートの改善、xhrに`.response`プロパティの追加、バグ修正","relatedLinks":[]},{"category":"Headline","title":"Release RxJS Version 2.3 · Reactive-Extensions/RxJS","url":"https://github.com/Reactive-Extensions/RxJS/releases/tag/v2.3.12","tags":["JavaScript","library","ReleaseNote"],"content":"RxJS 2.3リリース。\n\nPromise、Generatorのサポート。\n\nまたES6以降のArray.fromといったメソッドと同等の機能の提供など","relatedLinks":[]},{"category":"Headline","title":"Release Son of Dragon · sass/libsass","url":"https://github.com/sass/libsass/releases/tag/3.0.1","tags":["Sass","ReleaseNote"],"content":"libsass 3.0.1リリース","relatedLinks":[]},{"category":"Article","title":"Spy-js 2.0: New level of JavaScript tracing | JetBrains WebStorm Blog","url":"http://blog.jetbrains.com/webstorm/2014/10/spy-js-2-0-new-level-of-javascript-tracing/","tags":["WebStorm","node.js","JavaScript"],"content":"WebStorm 9のspy-js 2.0について。\n\n実行時の結果からコードの補完候補の追加、breakpointを貼らなくてもinspectionで変数の中身を見られるように、Node.jsサポート、トレース結果の共有、ES6サポート等","relatedLinks":[]},{"category":"Article","title":"Getting To Know Flux, the React.js Architecture ♥ Scotch","url":"http://scotch.io/tutorials/javascript/getting-to-know-flux-the-react-js-architecture","tags":["JavaScript","Flux","React"],"content":"Fluxアーキテクチャについて分かりやすく解説されてる。\n\nStoreが複数ある場合にwatiForを使って依存関係を解決する方法やどのようなフローで処理を行うかを図を用いて分かりやすくまとめている","relatedLinks":[]},{"category":"Article","title":"Class構文が実装された - JS.next","url":"http://js-next.hatenablog.com/entry/2014/11/01/034607","tags":["JavaScript","V8","ECMAScript"],"content":"ES6のclass syntaxについて。\n\nprototypeの糖衣構文であることや継承、匿名クラス、class内はstrict modeになる点について書かれている","relatedLinks":[]},{"category":"Article","title":"For and against &#x27;let&#x27;","url":"http://davidwalsh.name/for-and-against-let","tags":["ECMAScript"],"content":"ES6の`let`について詳しく書かれてる。\n\nletによるブロックスコープや使い方について","relatedLinks":[]},{"category":"Article","title":"Introducing SIMD.js ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2014/10/introducing-simd-js/","tags":["JavaScript","ECMAScript","performance"],"content":"SIMD APIについて。 SIMDとは何か、polyfillのSIMD.jsについて","relatedLinks":[]},{"category":"Article","title":"Why we should stop using Grunt &amp; Gulp","url":"http://blog.keithcirkel.co.uk/why-we-should-stop-using-grunt/","tags":["JavaScript","Grunt","gulp","Tools"],"content":"GruntやGulpのようなTask Runnerではなく、npm runを使う話。\n\nTask Runnerはそれ自体のアップデート変更や別の選択肢が出てきた時のコストやpluginの挙動の不満等からnpm runで行う事について","relatedLinks":[]},{"category":"Article","title":"Building single page apps using web components - Polymer","url":"https://www.polymer-project.org/articles/spa.html","tags":["WebComponents","tutorial"],"content":"Web Componentsを使ってシングルページアプリケーションを作るチュートリアル","relatedLinks":[]},{"category":"Article","title":"The Fine Art of JavaScript Error Tracking — Medium","url":"https://medium.com/@jico/the-fine-art-of-javascript-error-tracking-bc031f24c659","tags":["JavaScript","debug","webservice"],"content":"JavaScriptのエラーレポートを集めるサービスについて。\n\nまたエラーレポートはノイズにも成り得る。Sentryでは重要と思われるエラーを優先的表示やどのブラウザなのかについて表示してくれる","relatedLinks":[{"title":"Application Performance Management ","url":"http://newrelic.com/"},{"title":"Error Monitoring, Error Tracking, and Notification for Ruby on Rails 2, 3 and 4 - Honeybadger - Honeybadger","url":"https://www.honeybadger.io/"},{"title":"{","url":"http://trackjs.com/"},{"title":"Sentry: Track exceptions with modern error logging for JavaScript, Python, Ruby, Java, and Node.js","url":"https://getsentry.com/welcome/"}]},{"category":"SlideVideo","title":"CSP Lv.2の話","url":"http://ja.slideshare.net/yagihashoo/csp-lv2","tags":["CSP","スライド","セキュリティ"],"content":"CSP Level2の機能についての紹介スライド。\n\nPath matching、Nonce source、Source hash、frame-ancestors、referrer、sandbox等についてよくまとまっている","relatedLinks":[{"title":"Content-Security-Policy と nonce の話 - blog.64p.org","url":"http://blog.64p.org/entry/2014/09/25/201424"}]},{"category":"SlideVideo","title":"Model-View-Intent and the Virtual DOM","url":"http://staltz.com/mvi-freaklies/#/","tags":["VirualDOM","JavaScript","スライド","MVC"],"content":"Reactiveなパターンについてのスライド。\n\nMVCが絡み合って複雑になるのをイベントバスを使ってどう解決するか。\n\nModel、View(Virtual DOM)、Intentでのアーキテクチャについて","relatedLinks":[{"title":"MVI Example","url":"http://staltz.com/mvi-example/"}]},{"category":"SlideVideo","title":"A State of Change — On the future of Object.observe","url":"https://markdalgleish.github.io/presentation-a-state-of-change-object-observe/","tags":["JavaScript","スライド"],"content":"Object.observeについてのスライド。\n\nObject.observeはオブジェクトの変更を監視できるが、Imuutabilityとは逆の事になってしまう。\n\nImmutableなしくみを提供するmori等のライブラリや同様にDOMでもStatelessなDOMを提供するReactやVirtual DOMがある。\n\n現在のシンプルなバインディングはMutableデータをStateful DOMへ結びつける。\n未来のレンダリングはImmutableデータをStateless DOMにする?","relatedLinks":[{"title":"The Future of JavaScript MVC Frameworks","url":"http://swannodette.github.io/2013/12/17/the-future-of-javascript-mvcs/"},{"title":"presentation-a-state-of-change-object-observe/REFERENCES.md at master · markdalgleish/presentation-a-state-of-change-object-observe","url":"https://github.com/markdalgleish/presentation-a-state-of-change-object-observe/blob/master/REFERENCES.md"}]},{"category":"SlideVideo","title":"ブラウザーに優しくて、アニメーションを滑らかに","url":"http://people.mozilla.org/~bbirtles/pres/html5j-2014/#/","tags":["JavaScript","CSS","SVG","animation","スライド"],"content":"Web Animationについてのスライド。\n\nどのようなフローでスタイルが決定され、レンダリングが行われているか。\n\nまたどうすれば、レンダリングやレイアウトのコストを減らせるかについて等の最適化について。\n\nレイヤーや`will-change`などについても触れている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jwerle/w625","url":"https://github.com/jwerle/w625","tags":["JavaScript","console","Tools"],"content":"6to5を使ってES6で書けるREPLの実装。\n\n特定のウェブサイトに繋いで、コンソール的に使うことも出来る","relatedLinks":[{"title":"sebmck/6to5","url":"https://github.com/sebmck/6to5"}]},{"category":"SoftwareLibrary","title":"Zolmeister/promiz","url":"https://github.com/Zolmeister/promiz","tags":["JavaScript","Promises","library"],"content":"ES6 Promisesのpolyfill。","relatedLinks":[]}]},{"meta":{"title":"JSer.info 200回記念イベントを開催しました","author":"azu","layout":"post","date":"2014-11-02T10:26:00.000Z","category":"JSer","tags":["JSer","JavaScript","イベント"],"url":"https://jser.info/2014/11/02/jser200/"},"items":[]},{"meta":{"title":"2014-11-10のJS: Less 2.0、Vue.js 0.11、Model-View-Intent","author":"azu","layout":"post","date":"2014-11-10T11:46:00.000Z","category":"JSer","tags":["Less","CSS","Vue.js","VirtualDOM"],"url":"https://jser.info/2014/11/10/less2-vue-mvi/"},"items":[{"category":"Headline","title":"Ember.js - Ember.js 1.8.0 and 1.9 Beta Released","url":"http://emberjs.com/blog/2014/10/26/ember-1-8-0-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember 1.8.0と1.9βリリース。\n\nまたEmber 2.0についても話し合われている","relatedLinks":[{"title":"The Road to Ember 2.0 RFC by tomdale · Pull Request #15 · emberjs/rfcs","url":"https://github.com/emberjs/rfcs/pull/15"},{"title":"Contribute to Ember.js 2.0. No coding required. :: madhatted.com","url":"http://madhatted.com/2014/11/5/contribute-to-ember-js-2-0-no-coding-required"}]},{"category":"Headline","title":"Release v2.0.0.0 · less/less.js","url":"https://github.com/less/less.js/releases/tag/v2.0.0","tags":["JavaScript","CSS","ReleaseNote"],"content":"Less 2.0リリース","relatedLinks":[]},{"category":"Headline","title":"Release 0.11.0: Cowboy Bebop · yyx990803/vue","url":"https://github.com/yyx990803/vue/releases/tag/0.11.0","tags":["JavaScript","MVC","library","ReleaseNote"],"content":"Vue.js 0.11.0リリース。\n\n一から書きなおされているため、挙動の変更やオプションの削除等破壊的な変更も多くあり、追加された機能やオプションも多い。","relatedLinks":[{"title":"vue/changes.md at master · yyx990803/vue","url":"https://github.com/yyx990803/vue/blob/master/changes.md"},{"title":"Vue.js v0.11の変更点(予定)まとめ - blog.koba04.com","url":"http://blog.koba04.com/post/2014/10/07/vue-js-v011-changes/"}]},{"category":"Headline","title":"Brackets Blog - The Free, Open Source Code Editor for the Web","url":"http://blog.brackets.io/2014/11/04/brackets-1-0-and-extract-for-brackets-preview-now-available/","tags":["JavaScript","editor","ReleaseNote"],"content":"Brackets 1.0リリース。\n\n同時にExtract for BracketsというPSDファイルからテキストや色などの情報が取得出来るプラグインのα版が公開されている","relatedLinks":[{"title":"Adobe、オープンソースのWeb開発向けテキストエディター「Brackets」v1.0をリリース - 窓の杜","url":"http://www.forest.impress.co.jp/docs/news/20141105_674571.html"}]},{"category":"Article","title":"Stream API がブラウザにやってくる - Block Rockin’ Codes","url":"http://jxck.hatenablog.com/entry/whatwg-stream","tags":["stream","API","JavaScript"],"content":"WHATWGのStream APIについて。\n\n連続したイベントを表現するStreamの流れ、ReadableとWritableの処理待ちのバランスが悪くなった時に調整するBack Pressureについても書かれている","relatedLinks":[{"title":"Streams Standard","url":"https://streams.spec.whatwg.org/"}]},{"category":"Article","title":"React.jsとBackbone.jsを組み合わせて実践してみた結果 - Qiita","url":"http://qiita.com/derui@github/items/864113f694b77eca685d","tags":["React","backbone.js"],"content":"ReactとBackboneの組み合わせについて実践的な話が書かれている。\n\nViewの部分をReactにするアプローチ、Viewをテストする際に使えるTestUtilsやReactを導入する際の注意点など","relatedLinks":[]},{"category":"Article","title":"An easier way of using polyfills ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2014/11/an-easier-way-of-using-polyfills/","tags":["JavaScript","library"],"content":"JavaScriptの必要な機能のpolyfillをCDN的に使えるPolyfill.ioについて","relatedLinks":[]},{"category":"Article","title":"browserify をはじめてみる - Please Sleep","url":"http://please-sleep.cou929.nu/trying-browserify.html","tags":["JavaScript","browserify"],"content":"埋め込み配布を目的としてJavaScriptをBrowserifyでビルドするにあたっての話。\n\nbowerでインストールしたjQueryの依存関係の解決、browserify-shimを使ってCommonJSに対応してないライブラリを使う方法について","relatedLinks":[]},{"category":"Article","title":"AngularJS についての所感 ::ハブろぐ","url":"http://havelog.ayumusato.com/develop/javascript/e628-angularjs_thought.html","tags":["AngularJS","JavaScript"],"content":"AngularJSの扱い方を間違えるとハマってしまう所。\n\n$scope、DIとProviderと依存の数、ルールの抑制とexpression、Controllerの肥大化。\n\n他のライブラリに応用がしにくい世界観などについて","relatedLinks":[{"title":"AngularJS: The Bad Parts | Lars Eidnes","url":"http://larseidnes.com/2014/11/05/angularjs-the-bad-parts/"}]},{"category":"SlideVideo","title":"Reactive MVC and the Virtual DOM — Futurice","url":"http://futurice.com/blog/reactive-mvc-and-the-virtual-dom","tags":["React","Flux","VirualDOM","デザインパターン","JavaScript"],"content":"MVIというReactiveなデザインパターンについて。\n\nMV*と違いControllerを取り除き、代わりにIntentというユーザイベントを扱う仕組みを入れる。\n一方通行にする点などFluxに似ている所はあるが、RxJS等を意識した話。\nまた、Virtual DOMを使い、テストしやすくするためにViewと実際の表示を作るRendererに分けている。\n\n最後にReact/Fluxとどのような点が違うのかについて書かれている","relatedLinks":[{"title":"Reactive MVC and the Virtual DOMのメモ | GH Issue Note","url":"http://efcl.wordpress.com/2014/11/03/reactive-mvc-and-the-virtual-dom%e3%81%ae%e3%83%a1%e3%83%a2/"},{"title":"Model-View-Intent and the Virtual DOM","url":"http://staltz.com/mvi-freaklies/#/"}]},{"category":"SlideVideo","title":"zertosh/ssr-demo-kit","url":"https://github.com/zertosh/ssr-demo-kit","tags":["スライド","動画"],"content":"SoundCloudの人のReactによるサーバーサイドレンダリングのスライドと動画とサンプル","relatedLinks":[]},{"category":"SlideVideo","title":"Protractor for AngularJS: writing end-to-end tests has never been so fun","url":"http://ramonvictor.github.io/protractor/slides/","tags":["protractor","AngularJS","testing","スライド"],"content":"Protractorについてよく書かれたスライド。\n\nProtractorの仕組み、インストール方法、設定、API、Page Objectsを使ったテストのパターン、デバッグ方法等幅広くまとまってる","relatedLinks":[]},{"category":"SlideVideo","title":"Components, React and Flux (WIP) by Dan Abramov","url":"http://slides.com/danabramov/components-react-flux-wip#/","tags":["React","Flux","スライド","サンプル"],"content":"Reactに関する事が幅広く書かれているスライド。\n\njQuery、Backbone、Reactそれぞれで実装した場合について。\nReactの特徴である再利用性、コンポーネントのネスト、ステートフルやreact-router等について。\n\nまた開発ツールとしてhot-reload、一方向のデータフローを実現するFluxアーキテクチャについてもそれぞれの役割が詳しく書かれている。","relatedLinks":[{"title":"gaearon/flux-react-router-example","url":"https://github.com/gaearon/flux-react-router-example"}]},{"category":"WebsiteDocument","title":"ReactJS News","url":"http://reactjsnews.com/","tags":["React","JavaScript","news"],"content":"ReactのWeeklyニュースサイト","relatedLinks":[]},{"category":"WebsiteDocument","title":"Announcing RemoteIE: Test the latest IE on Windows, Mac OS X, iOS and Android - IEBlog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/ie/archive/2014/11/02/announcing-remoteie-test-the-latest-ie-on-windows-mac-os-x-ios-and-android.aspx","tags":["IE","debug","MS"],"content":"確認用のIEをOS XやAndroid、iOS等でVPNで簡単に利用できるRemoteIEを公開した","relatedLinks":[]},{"category":"SoftwareLibrary","title":"uxebu/kommando","url":"https://github.com/uxebu/kommando","tags":["JavaScript","browser","testing","library"],"content":"WebDriverを使ったE2Eテストを行うライブラリ。\n\nwd.jsやleadfootなどのクライアントライブラリはオプションで指定できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ibm-js/ecma402 · GitHub","url":"https://github.com/ibm-js/ecma402","tags":["JavaScript","i18n","library","AMD"],"content":"ECMA-402 JavaScript  Internationalization APIのshimライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"substack/html-inline","url":"https://github.com/substack/html-inline","tags":["HTML","CSS","画像","Tools"],"content":"HTMLで読み込み指定されてるJavaScriptやCSS、画像をインライン化するコマンドラインツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rtfeldman/seamless-immutable","url":"https://github.com/rtfeldman/seamless-immutable","tags":["JavaScript","library"],"content":"ES5の機能を使ってImmutableな配列やオブジェクトを作成するライブラリ。\n\nそれぞれのオブジェクトは`Object.freeze`された状態になり、幾つか補助するメソッドが追加で用意されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"travishorn/npm-package-store","url":"https://github.com/travishorn/npm-package-store","tags":["npm","Tools"],"content":"App Storeみたいにnpmモジュールの更新一覧を見られるツール","relatedLinks":[{"title":"NPM Package Store","url":"http://travishorn.com/npm-package-store/"}]},{"category":"SoftwareLibrary","title":"Paperclip.js - fast template engine for the DOM","url":"http://paperclipjs.com/","tags":["JavaScript","template","library"],"content":"JavaScriptテンプレートライブラリ。\n\nデータバインディングについての方向をテンプレート内に`<~>`演算子を使って指定する事ができるのが特徴的","relatedLinks":[]},{"category":"Book","title":"Amazon: WebRTC ブラウザベースのP2P技術: Alan B. Johnston, Daniel C. Burnett, 日本電信電話株式会社 内田直樹(監訳)","url":"http://www.amazon.co.jp/dp/4897979587?tag=amazon0abac-22","tags":["WebRTC","p2p","book"],"content":"2014年12月12日 発売\n\nWebRTC: APIs and RTCWEB Protocols of the HTML5 Real-Time Webの翻訳本","relatedLinks":[]},{"category":"Book","title":"Amazon: デザイニングWebアクセシビリティ - アクセシブルな設計やコンテンツのための実践Q&amp;A: 太田良典, 伊原力也","url":"http://www.amazon.co.jp/dp/4862671756?tag=amazon0abac-22","tags":["web","アクセシビリティ","book"],"content":"2015年1月31日 発売\n\nWebアクセシビリティについての書籍","relatedLinks":[]}]},{"meta":{"title":"2014-11-17のJS: IEプレビュー版のES6サポート、Jasmine 2.1.0、TypeScript 1.3","author":"azu","layout":"post","date":"2014-11-17T12:17:00.000Z","category":"JSer","tags":["IE","ES6","Testing"],"url":"https://jser.info/2014/11/17/ie11-es6-jasmine/"},"items":[{"category":"Headline","title":"Living on the Edge – our next step in helping the web just work - IEBlog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/ie/archive/2014/11/11/living-on-the-edge-our-next-step-in-interoperability.aspx","tags":["IE","ECMAScript","JavaScript"],"content":"IE12?の新しいプレビュー版が公開された。\n\n多くのES6の機能が入り、CSP 1.0、CSS Interaction Media Queries、Gamepad API等が実装された。\n\nまたドキュメントモードの挙動もEdgeがデフォルトとなり、互換表示となる場合が限定された。","relatedLinks":[{"title":"IE11 の「エンタープライズ モード」の新機能 – ドキュメント モードの指定 | Hebikuzure","url":"http://hebikuzure.wordpress.com/2014/11/13/ie11-enterprise-mode-improvement/"},{"title":"さねゆき on Twitter: ","url":"https://twitter.com/saneyuki_s/status/532701057940348929"},{"title":"Šime Vidas on Twitter: ","url":"https://twitter.com/simevidas/status/532749912333881344"}]},{"category":"Headline","title":"jasmine/2.1.0.md at master · pivotal/jasmine","url":"https://github.com/pivotal/jasmine/blob/master/release_notes/2.1.0.md","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Jasmine 2.1.0リリース。\n\n`fit`、`fdescribe`で指定したテストのみを実行出来るように、`beforeAll`、`afterAll`のサポート、`fail`のサポート、それぞれタイムアウトの時間指定のサポート等","relatedLinks":[]},{"category":"Headline","title":"Sinon.JS/Changelog.txt at v1.12.1 · cjohansen/Sinon.JS","url":"https://github.com/cjohansen/Sinon.JS/blob/v1.12.1/Changelog.txt","tags":["JavaScript","library","ReleaseNote"],"content":"Sinon.JS 1.12.1 リリース。\n\nFake timersが単体のモジュールに分離、setImmediateとsetTimeoutを同時に使った時の順番の問題を改善、AMDの対応改善など","relatedLinks":[{"title":"sinonjs/lolex","url":"https://github.com/sinonjs/lolex"},{"title":"Set immediate precedence by duncanbeevers · Pull Request #6 · sinonjs/lolex","url":"https://github.com/sinonjs/lolex/pull/6"}]},{"category":"Headline","title":"power-assert/CHANGELOG.md at v0.10.0 · twada/power-assert","url":"https://github.com/twada/power-assert/blob/v0.10.0/CHANGELOG.md","tags":["JavaScript","testing","ReleaseNote"],"content":"power-assert 0.10.0リリース。\n\n設定や出力に使うモジュールを指定等が出来る`.customize` APIをサポート。\n\ndiff等のassert結果の細かいカスタマイズが可能になった","relatedLinks":[{"title":"power-assert, mechanism and philosophy","url":"http://www.slideshare.net/t_wada/power-assert-nodefest-2014"}]},{"category":"Headline","title":"Announcing TypeScript 1.3 - TypeScript - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/typescript/archive/2014/11/12/announcing-typescript-1-3.aspx","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 1.3リリース。\n\n`protected` アクセス修飾子、tupleのサポート、Visual Studioでコード構文解析やリファクタリング機能の改善","relatedLinks":[{"title":"TypeScript 1.3.0 変更点 - Qiita","url":"http://qiita.com/vvakame/items/0b5060de5566f210479b"}]},{"category":"Headline","title":"Release 4.0 “Indivisibiliter ac Inseparabiliter” · postcss/autoprefixer","url":"https://github.com/postcss/autoprefixer/releases/tag/4.0.0","tags":["CSS","JavaScript","Tools"],"content":"Autoprefixer 4.0リリース。 Source Mapがデフォルト有効に、`prev`でSource Mapを指定時にエラーが起きた時に元の行数を示せるように、不要なprefixの削除がデフォルト有効になる等","relatedLinks":[{"title":"PostCSS v3の変更点 - Weblog - Hail2u.net","url":"http://hail2u.net/blog/coding/postcss-v3.html"}]},{"category":"Article","title":"Announcing ES6 and JSX Support - ESLint","url":"http://eslint.org/blog/2014/11/es6-jsx-support/","tags":["ECMAScript","JavaScript","Tools"],"content":"ESLintではES6とJSXをサポートしたブランチ `es6jsx` が用意されて、masterとは別モジュールとしてインストールする事でES6のコードに対応する。\nJSXはオプションで有効化出来る。 \n\nまた、現時点ではES6ではスコープの表現力が変わったため、正しく動作しないルールが存在している。\n\n年内にES6対応をリリース予定","relatedLinks":[]},{"category":"Article","title":"Underscore vs Lo-Dash","url":"http://benmccormick.org/2014/11/12/underscore-vs-lodash/","tags":["JavaScript","library"],"content":"UnderscoreとLo-Dashについて。\n\nLo-DashはUnderscoreを書き直し+機能追加したもの。\n\n2つの違いについてユーザビリティ、ファイルサイズ、バージョニング、追加機能、パフォーマンスの観点で書かれている。","relatedLinks":[]},{"category":"Article","title":"npm で依存もタスクも一元化する - Qiita","url":"http://qiita.com/Jxck_/items/efaff21b977ddc782971","tags":["npm","node.js","console","Tools"],"content":"npm run-scriptをtask runnerのインターフェースとして使う話","relatedLinks":[]},{"category":"Article","title":"interact.js for drag and drop, resizing and multi-touch gestures ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2014/11/interact-js-for-drag-and-drop-resizing-and-multi-touch-gestures/","tags":["JavaScript","library"],"content":"要素をD&amp;D、リサイズ、multi-touch等に対応した処理を書くことが出来るinteract.jsについての紹介記事","relatedLinks":[{"title":"interact.js - JavaScript drag and drop, resizing and gestures with inertia and snapping","url":"http://interactjs.io/"}]},{"category":"Article","title":"Building a Q&amp;A System With Polymer and Firebase","url":"https://divshot.com/blog/web-components/building-a-qa-system-with-polymer-and-firebase/","tags":["JavaScript","tutorial","WebComponents"],"content":"PolymerとFirebaseを使ったQ&amp;Aシステム作るチュートリアル","relatedLinks":[]},{"category":"Article","title":"native\\_javascript\\_data\\_binding","url":"http://www.sellarafaeli.com/blog/native_javascript_data_binding","tags":["JavaScript","tutorial"],"content":"Object.observeを使ったデータバインディング、getter/setterを使ったデータバインディングの実装について","relatedLinks":[]},{"category":"Article","title":"wilmoore/frontend-packagers","url":"https://github.com/wilmoore/frontend-packagers","tags":["JavaScript","まとめ"],"content":"フロントエンド向けのパッケージマネージャ管理ツールのまとめ","relatedLinks":[]},{"category":"Article","title":"Getfirebug Blog » Blog Archive » Firebug 3 – next generation of Firebug","url":"https://blog.getfirebug.com/2014/11/10/firebug-3-next-generation-of-firebug/","tags":["Firebug","ReleaseNote"],"content":"Firebug 3αリリース。\n\nFirefox開発者ツールをベースにした拡張となる。\n\nFirefox開発者ツールにFirebug風のテーマやDOMパネル等の機能を追加出来るアドオン","relatedLinks":[]},{"category":"Article","title":"Mozilla Introduces the First Browser Built For Developers: Firefox Developer Edition ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2014/11/mozilla-introduces-the-first-browser-built-for-developers-firefox-developer-edition/","tags":["firefox","software"],"content":"Firefox Developer Editionが公開された(Auroraと呼ばれていたもの)","relatedLinks":[{"title":"開発者のために作られた初めてのブラウザ、Firefox Developer Edition を公開しました | Mozilla Developer Street (modest)","url":"https://dev.mozilla.jp/2014/11/mozilla-introduces-the-first-browser-built-for-developers-firefox-developer-edition/"},{"title":"Firefox Developer Edition — Mozilla","url":"https://www.mozilla.org/ja/firefox/developer/"}]},{"category":"SlideVideo","title":"BlinkOn 3 One-Pager - http://bit.ly/blinkon3 - Google ドキュメント","url":"https://docs.google.com/document/d/1m6JNcFYnwJ0I7OWHrs-meO6820oM_5q9jSELOPDAQnc/edit#","tags":["JavaScript","Chrome","blink","イベント","スライド","まとめ"],"content":"Blinkについてのカンファレンスのスライドまとめ","relatedLinks":[]},{"category":"SlideVideo","title":"CSSI: CSS Investigation // Speaker Deck","url":"https://speakerdeck.com/studiomohawk/cssi-css-investigation","tags":["CSS","スライド"],"content":"CSSのコードレビューやツールについてのスライド","relatedLinks":[]},{"category":"SlideVideo","title":"Simplifying Async Programs","url":"http://jlongster.com/s/nationjs-slides/#/","tags":["JavaScript","スライド"],"content":"js-CSPについてのスライド","relatedLinks":[{"title":"ubolonton/js-csp","url":"https://github.com/ubolonton/js-csp"}]},{"category":"SoftwareLibrary","title":"wooorm/franc","url":"https://github.com/wooorm/franc","tags":["JavaScript","言語","library"],"content":"テキストから言語判定が出来るJavaScriptライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sinonjs/lolex","url":"https://github.com/sinonjs/lolex","tags":["JavaScript","library","testing"],"content":"SinonJSのFake timersライブラリ。\n\nSinonJSから独立して使えるようになった","relatedLinks":[]},{"category":"SoftwareLibrary","title":"danielstjules/jsinspect","url":"https://github.com/danielstjules/jsinspect","tags":["JavaScript","console","Tools"],"content":"JavaScriptのファイル(複数ファイルも可能)から構造的に類似している部分を抽出してdiff表示出来るツール","relatedLinks":[]},{"category":"Book","title":"The Pragmatic Bookshelf | Dart 1 for Everyone","url":"https://pragprog.com/book/csdart1/dart-1-for-everyone","tags":["dart","book"],"content":"Dartについての書籍","relatedLinks":[]}]},{"meta":{"title":"2014-11-25のJS: Chrome 39、デバッグTips、Facebook Flow","author":"azu","layout":"post","date":"2014-11-24T23:12:00.000Z","category":"JSer","tags":["Chrome","debug","Flow","Type"],"url":"https://jser.info/2014/11/25/chrome39-debug-flowtype/"},"items":[{"category":"Headline","title":"Chromium Blog: Chrome 39 Beta: JS Generators, Animation Playback Control, and the WebApp Manifest","url":"http://blog.chromium.org/2014/10/chrome-39-beta-js-generators-animation.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 39リリース。([Stableのリリースノートはこちら](http://googlechromereleases.blogspot.jp/2014/11/stable-channel-update_18.html \"Chrome Releases: Stable Channel Update\"))\n\nGeneratorがデフォルトで有効、Web Animationの`play()`や`pause()`のサポート、 Web Application Manifest、 Beacon API のサポート","relatedLinks":[{"title":"ジェネレータについて - JS.next","url":"http://js-next.hatenablog.com/entry/2014/08/07/174147"},{"title":"Send beacon data in Chrome 39","url":"http://updates.html5rocks.com/2014/10/Send-beacon-data-in-Chrome-39"}]},{"category":"Article","title":"Send beacon data in Chrome 39","url":"http://updates.html5rocks.com/2014/10/Send-beacon-data-in-Chrome-39","tags":["JavaScript","アクセス解析","Chrome"],"content":"Chrome 39でBeacon APIが入った。\n\nBeacon APIを使えばクリックしてページ移動するときのクリックのログも非同期でちゃんと送ることが出来る。(単純なXHRだと送り終わる前に遷移してしまう)","relatedLinks":[]},{"category":"Article","title":"Modern Debugging Experience: Part 2 - Tuts+ Code Tutorial","url":"http://code.tutsplus.com/tutorials/modern-debugging-experience-part-2--cms-22584","tags":["JavaScript","Chrome","debug","Tools"],"content":"開発者ツールを使ったデバッグ方法のTips。\n\n`debugger`ステートメント、コールスタック、getter/setter/Object.observe等を使ったアクセス時にBreakさせる方法やWatch Expression、イベントリスナーのデバッグ等について書かれている","relatedLinks":[]},{"category":"Article","title":"My five promise patterns","url":"https://remysharp.com/2014/11/19/my-five-promise-patterns","tags":["JavaScript","Promises"],"content":"Promiseパターンについて\n\nNode.jsスタイルの高階関数をPromiseを返すようにするdenodeify、`bind`による引数の固定、コールバックとの併用、`reject`ではなく常にthrowする、処理の終わりでいつも`catch`する","relatedLinks":[]},{"category":"Article","title":"Property testing in JavaScript with quick_check.js - RightScale Engineering Blog","url":"http://eng.rightscale.com/2014/07/18/quick-check-js.html","tags":["JavaScript","library","testing"],"content":"JavaScriptのQuickCheck実装である [quick_check.js](https://github.com/gampleman/quick_check.js/) について","relatedLinks":[]},{"category":"Article","title":"uxebu/mocha-sinon-traceur-example","url":"https://github.com/uxebu/mocha-sinon-traceur-example","tags":["ECMAScript","JavaScript","testing"],"content":"ES6でテストを書いてTDDするサンプルプロジェクト","relatedLinks":[{"title":"ES6 and TDD at work, with traceur, mocha and sinon - uxebu","url":"http://www.uxebu.com/blog/2014/11/es6-tdd-work-traceur-mocha-sinon/"}]},{"category":"SlideVideo","title":"Nodevember - YouTube","url":"https://www.youtube.com/user/nodevember/feed","tags":["JavaScript","node.js","動画"],"content":"http://nodevember.org/ の動画が公開されている","relatedLinks":[]},{"category":"SlideVideo","title":"Real World React - YouTube","url":"https://www.youtube.com/watch?v=uZgAq1CZ1N8","tags":["React","JavaScript","スライド","動画"],"content":"ReactのComponentの作り方やテストについて詳しい発表","relatedLinks":[{"title":"http://presentboldly.com/bejonbee/real-world-react-v012","url":"http://presentboldly.com/bejonbee/real-world-react-v012"}]},{"category":"SlideVideo","title":"DOM Performance (JSNext Bulgaria)","url":"http://www.slideshare.net/ickatanet/dom-performance-jsnext-bulgaria","tags":["DOM","performance","スライド"],"content":"DOM操作のパフォーマンスTips的なスライド。\n\nEvent Delegate、Style操作、DOM Nodeの作成(clone、DocumentFragment)、DOM Nodeの削除について。","relatedLinks":[]},{"category":"SlideVideo","title":"KnowThen – Screencasts For Developers","url":"http://knowthen.com/","tags":["JavaScript","node.js","動画"],"content":"JavaScriptについてのスクリーンキャストをするサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"newton-software/devil","url":"https://github.com/newton-software/devil","tags":["node.js","node-webkit","debug"],"content":"node-inspectorのようにGUIでNode.jsアプリのデバッグを行う事が出来るツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Flow | A static type checker for JavaScript","url":"http://flowtype.org/","tags":["flowtype","facebook","JavaScript","Tools"],"content":"Facebookの静的型チェックツール。\n\nOCamlで書かれていて、TypeScriptと大体互換性のある型定義を行える。\n\nサーバとして動かす事もできる。HHVM/Hackみたいなインクリメンタルな型付けを行える","relatedLinks":[]},{"category":"SoftwareLibrary","title":"axemclion/protractor-perf","url":"https://github.com/axemclion/protractor-perf","tags":["protractor","testing","performance"],"content":"Protractorのパフォーマンス測定版のようなツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"inikulin/ineed","url":"https://github.com/inikulin/ineed","tags":["HTML","node.js","JavaScript","library"],"content":"HTMLのスクレイピング、変換処理(Reprocessing)を行えるNode.jsモジュール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jas-/secStore.js","url":"https://github.com/jas-/secStore.js","tags":["JavaScript","library"],"content":"localStorage/sessionStorage/Cookieで暗号化をサポートするラッパーライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"janmonschke/Web-Audio-Editor","url":"https://github.com/janmonschke/Web-Audio-Editor","tags":["browser","web","audio","Tools"],"content":"ウェブベースのWeb Audio Editor","relatedLinks":[]},{"category":"SoftwareLibrary","title":"SpoonX/useuses","url":"https://github.com/SpoonX/useuses","tags":["JavaScript","Tools"],"content":"`@uses`アノテーションコメントでそのJSファイルが依存するファイルパスを記述して使うモジュール管理ルール、ビルドツール\n\nconcatする程度にはシンプルで、CommonJSのような強い依存関係ではなく、単純にコメントを追加するだけなので余計にファイルは必要ない。","relatedLinks":[{"title":"javascript dependency management « Php « SpoonX Blog","url":"http://blog.spoonx.nl/javascript-dependency-management/"}]},{"category":"SoftwareLibrary","title":"techlayer/espresso.js","url":"https://github.com/techlayer/espresso.js","tags":["JavaScript","library","backbone.js","Flux"],"content":"BackboneとReactをインスパイアしたMV*ライブラリ。\n\nFluxのデータフローを一方向にするアイデアをBackboneに持ってきた感じのライブラリ","relatedLinks":[]},{"category":"Book","title":"Discover AngularJS by Adam Burak [Leanpub PDF/iPad/Kindle]","url":"https://leanpub.com/discoverangularjs","tags":["AngularJS","book"],"content":"AngularJSチュートリアル本","relatedLinks":[]}]},{"meta":{"title":"2014-12-02のJS: JavaScript開発者アンケート、フレームワーク or ライブラリ、関数型プログラミング","author":"azu","layout":"post","date":"2014-12-02T00:47:00.000Z","category":"JSer","tags":["アンケート","Angular","JavaScript","library"],"url":"https://jser.info/2014/12/02/survey-framework-library-functional-js/"},"items":[{"category":"Headline","title":"Release 0.11.1 · yyx990803/vue","url":"https://github.com/yyx990803/vue/releases/tag/0.11.1","tags":["JavaScript","library","ReleaseNote"],"content":"Vue.js 0.11.1リリース。\n\nv-componentのスコープの変更、`wait-for`属性で特定のeventがemitされるまで待てるように、`v-style`にdataとしてCSSオブジェクトを渡してスタイルを適応出来るようになるなど","relatedLinks":[]},{"category":"Headline","title":"ESLint 0.10.0 released - ESLint","url":"http://eslint.org/blog/2014/11/eslint-0.10.0-released/","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 0.10.0リリース。\n\nCLIがデフォルトでnode_modulesを無視するように、拡張子なしのファイル名のみの指定が可能になり、別途オプションとして拡張子のデフォルト値を設定出来るようになる等","relatedLinks":[]},{"category":"Headline","title":"IE Web Development Support Moving to Stack Overflow","url":"https://social.msdn.microsoft.com/Forums/ie/en-US/8ba70824-dba2-4425-bc75-247c2c29bde1/action?threadDisplayName=ie&forum=iewebdevelopment","tags":["MS","IE"],"content":"IEの開発に関する質問サポートはStack Overflowに移行するとの話","relatedLinks":[]},{"category":"Headline","title":"DailyJS: JavaScript Developer Survey 2014","url":"http://dailyjs.com/2014/12/01/javascript-survey/","tags":["JavaScript"],"content":"DailyJSのJavaScript開発者アンケート 2014の受付が開始された","relatedLinks":[]},{"category":"Article","title":"The State of Flux","url":"http://reactjsnews.com/the-state-of-flux/","tags":["Flux","library","まとめ"],"content":"Fluxアーキテクチャ関連のライブラリのまとめ、それぞれの実装的な特徴","relatedLinks":[]},{"category":"Article","title":"Getting Started with React and JSX","url":"http://www.sitepoint.com/getting-started-react-jsx/","tags":["React","tutorial"],"content":"Reactのチュートリアル。\n\nprops、state、eventと順に紹介してる","relatedLinks":[]},{"category":"Article","title":"フロントエンドエンジニアになってから11ヶ月間で覚えたちょっと捗るChromeの使い方 - Qiita","url":"http://qiita.com/dayoshix/items/0d4043bf7dbaa1dc9184","tags":["Chrome","debug","tools"],"content":"Chrome開発者ツールのTips。\n\ngifと共に機能を紹介してて分かりやすい","relatedLinks":[{"title":"Chrome DevTools Overview - Google Chrome","url":"https://developer.chrome.com/devtools"}]},{"category":"Article","title":"The State of JavaScript in 2015 - Jimmy Breck-McKye","url":"http://www.breck-mckye.com/blog/2014/12/the-state-of-javascript-in-2015","tags":["JavaScript","AngularJS","library","thought"],"content":"AngularJS 2.0の発表でJavaScriptについて再考する話。\n\n新しいテクノロジーを扱う時はちゃんと疑問を持って接する事、企業製だからといって信用するのは別問題、モノリシックなフルスタックフレームワークよりも役割が分けられたライブラリを選ぶ。\n\n役割が分けられたライブラリを使う事でレガシーなプロジェクトに新しいテクノロジーを導入するときも全てを書き換えないでインクリメンタルに変更していける。\n\n著名なライブラリがフルスタックなのか、特定の役割だけを持っているかや、\n今後どのようにライブラリを選び開発していくかについて。","relatedLinks":[]},{"category":"Article","title":"What&#x27;s in a Function Name? - Bocoup","url":"http://bocoup.com/weblog/whats-in-a-function-name/","tags":["JavaScript"],"content":"JavaScriptの関数名について。\n\n関数定義や関数式、即時実行、newの場合、ES6のletやexportなどのそれぞれの場合に\"関数名\"がどうなるか。\n\nまたJSHintによるチェックやデバッグに役立つ`displayName`プロパティについて","relatedLinks":[]},{"category":"Article","title":"Custom Elements - Web Components を構成する技術: Tender Surrender","url":"http://blog.agektmr.com/2014/11/custom-elements-web-components.html","tags":["JavaScript","WebComponents","動画"],"content":"Custom Elementsについての解説。\n\nCustom Elementsの作り方、仕組み、ライフサイクルコールバック、ユースケースについて","relatedLinks":[]},{"category":"Article","title":"Goodbye, Layout Invalidation: Animating SVGs With CSS Transforms | Charlie Marsh","url":"http://www.princeton.edu/~crmarsh/svg-performance/","tags":["SVG","performance"],"content":"動かすSVG要素を分けてCSS transform等を使ってGPUで処理が出来るようにチューニングすることで、60FPSが出るようにパフォーマンス改善をする話","relatedLinks":[]},{"category":"SlideVideo","title":"React Through the Ages // Speaker Deck","url":"https://speakerdeck.com/zpao/react-through-the-ages","tags":["React","スライド"],"content":"Reactの今後についてのスライド。\n\nReusable ComponentsがFacebookの中には既に10000個ある。\n\n1.0に向けてAPIの安定化/修正、ES6 Classesへの対応、CSS in JS、Web Worker対応、レイアウトやアニメーション等をあげている","relatedLinks":[{"title":"React: CSS in JS // Speaker Deck","url":"https://speakerdeck.com/vjeux/react-css-in-js"}]},{"category":"SlideVideo","title":"ReactJS: Keep Simple. Everything can be a component! // Speaker Deck","url":"https://speakerdeck.com/pedronauck/reactjs-keep-simple-everything-can-be-a-component","tags":["React","スライド"],"content":"Reactの特徴について分かりやすくまとめられているスライド。\n\nImmutable、Virtual DOM、PropとState、DRYにするためのMixin、Isomorphicについて","relatedLinks":[]},{"category":"SlideVideo","title":"Functional Programming","url":"http://scott.sauyet.com/Javascript/Talk/2014/01/FuncProgTalk/","tags":["JavaScript","関数型プログラミング","スライド"],"content":"関数型プログラミングについてのスライド。\n\nオブジェクト指向との考え方の違い、DeclarativeとImperative、まだJSでは扱えない部分について(末尾最適化等)、具体的にOOPからFPへどう書き換えるかの例等","relatedLinks":[]},{"category":"WebsiteDocument","title":"ペパボのフロントエンドスタンダード","url":"http://pepabo.github.io/docs/frontend/standard.html","tags":["JavaScript","CSS","tutorial","document"],"content":"ペパボによるエンジニア、デザイナが「最低限これだけはおさえておこう」というスタンダードを文書化したもの。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"decadecity/css-specificity-map","url":"https://github.com/decadecity/css-specificity-map","tags":["CSS","JavaScript","tools"],"content":"CSSの詳細度グラフのデータを作るライブラリ","relatedLinks":[{"title":"The Specificity Graph – CSS Wizardry – CSS, OOCSS, front-end architecture, performance and more, by Harry Roberts","url":"http://csswizardry.com/2014/10/the-specificity-graph/"},{"title":"CSS specificity graphs | Blog | Decade City","url":"https://decadecity.net/blog/2014/11/26/css-specificity-graphs"}]},{"category":"SoftwareLibrary","title":"knsv/mermaid","url":"https://github.com/knsv/mermaid","tags":["図","JavaScript"],"content":"テキストからD3を使ったフローチャートやダイアグラム等の図を作成してくれるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"krasimir/atomus","url":"https://github.com/krasimir/atomus","tags":["JavaScript","DOM","node.js","testing","library"],"content":"Node.js環境でDOMを含めたクライアントサイドのコードをテストするライブラリ。\n\njsdomを使っていて、テストを実行する場所となるHTMLを渡して、クリックなどのイベントを起こしてテスト出来る","relatedLinks":[]},{"category":"SoftwareLibrary","title":"serratus/quaggaJS","url":"https://github.com/serratus/quaggaJS","tags":["JavaScript","library"],"content":"JavaScriptで書かれたバーコードリーダライブラリ。getUserMediaを使ってリアルタイムに処理したり、画像から検出したりできる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Handsontable - JavaScript data grid editor. Excel-like grid editing with HTML &amp; JavaScript","url":"http://handsontable.com/","tags":["JavaScript","library"],"content":"Excelライクなデータグリッドエディタ。\n\n依存するライブラリなしで利用できる","relatedLinks":[]},{"category":"Book","title":"Introduction | Full Stack JavaScript Engineering","url":"http://fsje.codefellows.org/","tags":["JavaScript","book","Sass"],"content":"フロントエンド全般についての知識について書かれたGitBookを使った電子書籍","relatedLinks":[]},{"category":"Book","title":"Amazon: 改訂版 Webデザイナーのための jQuery入門: 髙津戸 壮, 小原 司","url":"http://www.amazon.co.jp/dp/4774169447?tag=amazon0abac-22","tags":["jQuery","book"],"content":"「WebデザイナーのためのjQuery入門」の改訂版","relatedLinks":[{"title":"改訂版 WebデザイナーのためのjQuery入門 - Takazudo hamalog","url":"http://hamalog.tumblr.com/post/104081966956/web-jquery"}]}]},{"meta":{"title":"2014-12-08のJS: Firefox 34、QUnit 1.16、ES7 Async Generator","author":"azu","layout":"post","date":"2014-12-08T10:47:00.000Z","category":"JSer","tags":["Firefox","testing","webpack","ES7","非同期"],"url":"https://jser.info/2014/12/08/firefox-qunit-es7-async/"},"items":[{"category":"Headline","title":"Intern 2.2 released | Blog | SitePen","url":"http://www.sitepen.com/blog/2014/12/05/intern-2-2-released/","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Intern 2.2リリース。\n\nコンソールレポーターの表示改善、テストが失敗した時にオブジェクトのDiff表示が出来るようになるなど","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 40 Beta: Powerful Offline and Lightspeed Loading with Service Workers","url":"http://blog.chromium.org/2014/12/chrome-40-beta-powerful-offline-and.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 40β リリース。\n\nService WorkersとCSP Lv2の部分的サポート、`element.closest()`のサポート等","relatedLinks":[]},{"category":"Headline","title":"Firefox — Notes (34.0) — Mozilla","url":"https://www.mozilla.org/en-US/firefox/34.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 34リリース。\n\nCSS Fonts Level 3 の実験的な実装、ES6のObject.assign()やtemplate strings、メソッド定義の短縮記法等の実装、開発者ツールの改善等","relatedLinks":[{"title":"Firefox 34 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/34"},{"title":"WebIDE, Storage inspector, jQuery events, iframe switcher + more – Firefox Developer Tools Episode 34 ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2014/09/webide-storage-inspector-jquery-events-iframe-switcher-more-firefox-developer-tools-episode-34/"}]},{"category":"Headline","title":"Dev.Opera — Opera 26 released","url":"https://dev.opera.com/blog/opera-26/","tags":["Opera","ReleaseNote"],"content":"Opera 26 (based on Chromium 39)リリース","relatedLinks":[]},{"category":"Headline","title":"qunit/History.md at 1.16.0 · jquery/qunit","url":"https://github.com/jquery/qunit/blob/1.16.0/History.md","tags":["JavaScript","testing","library","ReleaseNote"],"content":"QUnit 1.16.0リリース。\n\n`done()`呼び出しでの非同期テストを行う`assert.async`の追加、Promiseのサポート、setup/teardownをbeforeEach/afterEachにリネーム、HTML Reporterの改善等","relatedLinks":[{"title":"async() | QUnit API Documentation","url":"http://api.qunitjs.com/async/"},{"title":"Async: Make tests Promise-aware by JamesMGreene · Pull Request #634 · jquery/qunit","url":"https://github.com/jquery/qunit/pull/634"},{"title":"QUnit 2.x Upgrade Guide | QUnit","url":"http://qunitjs.com/upgrade-guide-2.x/"}]},{"category":"Article","title":"Introduction to Service Worker: How to use Service Worker - HTML5 Rocks","url":"http://www.html5rocks.com/en/tutorials/service-worker/introduction/","tags":["JavaScript","tutorial"],"content":"Service Workerのライフサイクル、Service Workerへのスクリプトの登録方法や基本的な使い方、どうやってキャッシュを更新するか、注意点について","relatedLinks":[]},{"category":"Article","title":"Top 10 Mistakes Node.js Developers Make","url":"https://www.airpair.com/node.js/posts/top-10-mistakes-node-developers-make","tags":["node.js","まとめ"],"content":"Node.jsで開発時にやってしまう間違いとそれを改善する方法や参考リソース。\n\n半分以上JavaScriptで同様の事が当てはまりそう","relatedLinks":[]},{"category":"Article","title":"bassistance.de » jQuery Foundation 2014 roundup","url":"http://bassistance.de/2014/12/01/jquery-foundation-2014-roundup/","tags":["jQuery","まとめ"],"content":"2014年のjQueryの活動についてのまとめ。\n\n- jQuery Coreの3.0の方針やPromises等の標準へ合わせる変更について\n- jQuery UIのUIレイヤーの標準化活動、パフォーマンステストの実施。\n- QUnitを始めとするテストフレームワークのレポーターの標準化活動。\n- 国際化に使うCLDRのJSON版の管理など\n\nなどjQuery Foundationとしての活動がまとめられています。","relatedLinks":[{"title":"Roadmap · jquery/jquery Wiki","url":"https://github.com/jquery/jquery/wiki/Roadmap"},{"title":"jquery/css-framework","url":"https://github.com/jquery/css-framework"},{"title":"js-reporters/js-reporters","url":"https://github.com/js-reporters/js-reporters/"},{"title":"jquery/globalize","url":"https://github.com/jquery/globalize/"}]},{"category":"Article","title":"Moving from PhantomJS to node-webkit - Todd Wolfson","url":"http://twolfson.com/2014-11-22-moving-from-phantomjs-to-node-webkit","tags":["browser","node-webkit","testing"],"content":"node-webkitを使いスクリーンショットを取って画像diffのレグレッションテストを行う話。","relatedLinks":[]},{"category":"Article","title":"生WebGL入門:初音ミクの美麗3Dモデルを表示する(前編) » nmi.jp","url":"http://nmi.jp/archives/582","tags":["WebGL","tutorial","JavaScript"],"content":"WebGLを使ってMMDの3Dモデルを表示するまでを丁寧に解説している\n\nWebGLでのポリゴンの表示、3Dで必須な行列や座標、モデルデータの読み込みについて等","relatedLinks":[{"title":"tkihira/webgl-miku-sample","url":"https://github.com/tkihira/webgl-miku-sample"}]},{"category":"Article","title":"JavaScript - Direct Proxiesでmethod missing的なことをやる - Qiita","url":"http://qiita.com/hokaccha/items/3a3ea6180e94e70bc335","tags":["JavaScript","ECMAScript"],"content":"Direct Proxiesを使ったmethod missingの実装について","relatedLinks":[]},{"category":"Article","title":"webpackを使い倒す - Thujikun blog","url":"http://thujikun.github.io/blog/2014/12/07/webpack","tags":["webpack"],"content":"webpackのloader紹介、`resolve`フィールドの指定による`require`のパス解決、pluginsの紹介、Webpack Dev Server、非同期読み込みについて","relatedLinks":[]},{"category":"SlideVideo","title":"QUnit 2.xで変わること","url":"http://azu.github.io/slide/chatwork/qunit2.html","tags":["JavaScript","testing","スライド"],"content":"QUnit 2.xでの変更点についてのスライド。\n\nモジュール化、`done`スタイルの非同期テストサポート、スマートなPromiseテストサポート、レポーターの標準化活動など","relatedLinks":[{"title":"QUnit 2.x Upgrade Guide | QUnit","url":"http://qunitjs.com/upgrade-guide-2.x/"}]},{"category":"SlideVideo","title":"The npm Blog — Getting Started with npm","url":"http://blog.npmjs.org/post/104272486560/getting-started-with-npm","tags":["npm","動画"],"content":"npmのサイトのGetting Startedに動画チュートリアルが追加された","relatedLinks":[{"title":"Getting Started","url":"https://docs.npmjs.com/getting-started/what-is-npm"}]},{"category":"SlideVideo","title":"Netflix JavaScript Talks - Version 7: The Evolution of JavaScript - YouTube","url":"https://www.youtube.com/watch?v=DqMFX91ToLw","tags":["JavaScript","ECMAScript","動画","スライド"],"content":"ES7のAsync Generatorについて紹介する発表。\n\nObject.observeの変更通知とイベントループの話から始まり、\nPromises、Generator、またES7のasync/await、さらに発展してObservableを返すAsync Generatorについて話されている。\n\n発表内容は[jhusain/asyncgenerator](https://github.com/jhusain/asyncgenerator \"jhusain/asyncgenerator\")にも一部同様の事が書かれている","relatedLinks":[{"title":"ES7 Async Generator from azu on Twitter","url":"https://twitter.com/azu_re/timelines/541204375696191488"},{"title":"jhusain/asyncgenerator","url":"https://github.com/jhusain/asyncgenerator"},{"title":"Version 7: The Evolution of JavaScript- Eventbrite","url":"https://www.eventbrite.com/e/version-7-the-evolution-of-javascript-tickets-14284664817#m_1_100"}]},{"category":"WebsiteDocument","title":"js-reporters/js-reporters","url":"https://github.com/js-reporters/js-reporters","tags":["JavaScript","testing","issue"],"content":"JavaScriptテストフレームワーク/Runnerのレポーターの共通フォーマットについて議論してるコミュニティ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Understanding JSON Schema — Understanding JSON Schema 1.0 documentation","url":"http://spacetelescope.github.io/understanding-json-schema/","tags":["JSON","book","tutorial"],"content":"JSON Schema draft 4について解説しているサイト。\n\nJSON Schemaの書き方やリファレンス等が用意されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Tweene :: JavaScript Animation Proxy","url":"http://tweene.com/","tags":["JavaScript","animation","library"],"content":"JavaScriptアニメーションプロキシライブラリ。\n\n既にアニメーション機能を実装してるGSAP、Velocity.js、Transit、jQuery等のライブラリを共通のAPIで利用できるようにするラッパライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lafikl/RWDPerf","url":"https://github.com/lafikl/RWDPerf","tags":["design","performance","Tools"],"content":"画面サイズやUA等のシミュレートをして、あるURLで使ってない要素や画像の検出、通信量などのデータを一覧出来るパフォーマンス測定ツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"a11y.css by Gaël Poupard","url":"http://ffoodd.github.io/a11y.css/","tags":["CSS","アクセシビリティ","HTML","ブックマークレット"],"content":"CSSを使ったHTMLのビジュアルLintツール。\n\nHTML要素における記述のミスなどへの警告やエラーを表示する事ができる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rejs – Vanilla JS Module Builderの紹介 | GREE Engineers&#x27; Blog","url":"http://labs.gree.jp/blog/2014/12/12311/","tags":["JavaScript","Tools"],"content":"名前空間オブジェクトを使うJavaScriptファイルを、名前空間のプロパティにアクセスできるようにソートして結合出来るコマンドラインツール","relatedLinks":[{"title":"Moncader/rejs","url":"https://github.com/Moncader/rejs"}]},{"category":"Book","title":"JavaScript Cookbook, 2nd Edition - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920033455.do","tags":["JavaScript","book"],"content":"2015年2月 発売\n\nJavaScript Cookbookの第二版","relatedLinks":[]},{"category":"Book","title":"Learn JavaScript &amp; jQuery - a book about interactive front-end web development","url":"http://www.javascriptbook.com/","tags":["JavaScript","jQuery","book"],"content":"HTML & CSS: Design and Build WebsitesのJavaScript編","relatedLinks":[]}]},{"meta":{"title":"2014-12-16のJS: ES6 Proxy、Web Components、Service Worker","author":"azu","layout":"post","date":"2014-12-16T13:00:00.000Z","category":"JSer","tags":["ES6","WebComponents","ServiceWorker"],"url":"https://jser.info/2014/12/16/es6proxy-serviceworker/"},"items":[{"category":"Headline","title":"jsdom/Changelog.md at 1.5.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/1.5.0/Changelog.md","tags":["JavaScript","DOM","library"],"content":"jsdom 1.5.0リリース。\n\nconsole APIの定義を追加","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember.js 1.9.0 and 1.10 Beta Released","url":"http://emberjs.com/blog/2014/12/08/ember-1-9-0-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember.js 1.9.0と1.10βリリース。\n\nEmber 2.0に向けて1.9では非推奨となった機能があることについて書かれている。\n\nHandlebars 2.0へのアップデート、streams observationパターンの導入等","relatedLinks":[{"title":"Ember.js - Deprecations: Deprecations","url":"http://emberjs.com/guides/deprecations/"}]},{"category":"Headline","title":"Release 3.5 “Mount Sharp” · mbostock/d3","url":"https://github.com/mbostock/d3/releases/tag/v3.5.0","tags":["JavaScript","SVG","library","ReleaseNote"],"content":"D3.js 3.5リリース","relatedLinks":[{"title":"D3 バージョン 3.5 がリリースされました。 | Daily D3","url":"http://daily.d3js.info/?p=775"}]},{"category":"Headline","title":"Release 0.4 · sdesalas/trifleJS","url":"https://github.com/sdesalas/trifleJS/releases/tag/v0.4","tags":["IE","ReleaseNote"],"content":"PhantomJSのIE版的なヘッドレスブラウザであるtrifleJS 0.4リリース。","relatedLinks":[]},{"category":"Headline","title":"harmony:specification_drafts [ES Wiki]","url":"http://wiki.ecmascript.org/doku.php?id=harmony:specification_drafts#december_6_2014_draft_rev_29","tags":["ECMAScript","ReleaseNote"],"content":"ECMAscript 6 Draft Rev 29リリース。\n\n`RegExp.prototype.flags`の追加、WeakMap/WeakSetから`clear`メソッドの削除、`String.prototype.contains`が`includes`にリネーム","relatedLinks":[{"title":"TC39 MTG Notes 第43回 報告会","url":"http://azu.github.io/slide/chatwork/tc39-mtg-notes.html"},{"title":"RegExp.prototype.flags - JavaScript | MDN","url":"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/flags"}]},{"category":"Headline","title":"Dynatrace AJAX Edition 4.5 is here","url":"http://apmblog.compuware.com/2014/12/11/dynatrace-ajax-edition-4-5-last-page-chapter-yet-story-continues/","tags":["performance","software","browser"],"content":"Dynatrace AJAX Edition 4.5リリース","relatedLinks":[]},{"category":"Article","title":"JavaScript Application Architecture On The Road To 2015 — Medium","url":"https://medium.com/@addyosmani/javascript-application-architecture-on-the-road-to-2015-d8125811101b","tags":["JavaScript"],"content":"2014年のJavaScript全体のアーキテクチャを振り返り今後どうなるかについての話。\n\nデータバインディング、Immutable、Virtual DOM、Web Components、Component同士のメッセージング、ES6とBrowserify、オフラインファースト等","relatedLinks":[]},{"category":"Article","title":"[JavaScript Advent Calendar 2014 No.6] navigator.onLine in Blink","url":"http://blog.oimou.com/javascript-advent-calendar-2014-6ri-mu-navigator-onlinemaniatukusu2589ed73/","tags":["Chrome","blink","コードリーディング"],"content":"navigator.onLineがどのように実装されているかをBlink/Chromeのソースコードから追っていく話。\n\nブラウザのソースコードを見ていく方法について実例での参考になりそう","relatedLinks":[]},{"category":"Article","title":"How to Use npm as a Build Tool","url":"http://blog.keithcirkel.co.uk/how-to-use-npm-as-a-build-tool/","tags":["npm"],"content":"npm run-scriptをビルドツールとして使う話\n\nクロスプラットフォーム向けにrmの代わりにrimrafモジュールを使ったり、タスクのグループ化やhookについて書かれている。","relatedLinks":[]},{"category":"Article","title":"Meta programming with ECMAScript 6 proxies","url":"http://www.2ality.com/2014/12/es6-proxies.html","tags":["JavaScript","ECMAScript","リファレンス","まとめ"],"content":"ES6のProxyについて詳しい解説。\n\nメタプログラミングとは何か、Proxyはどのように動くのか、ユースケース、Proxyかどうかの判定方法、PropertyDescriptorとあわせた場合の挙動、Reflect APIについて","relatedLinks":[{"title":"ECMAScript 6 proxyによるメタプログラミング(1/11) | JSお散歩","url":"http://panda.node.ws/?p=1371"}]},{"category":"Article","title":"Snap.svgの使い方まとめ","url":"http://www.h2.dion.ne.jp/~defghi/snapsvg/snapsvg.xhtml","tags":["SVG","tutorial","まとめ"],"content":"Snap.svgについての詳しい解説、チュートリアル。\n\n目的や基本的な使い方から応用、Raphaël.jsとの違いなどよくまとまってる","relatedLinks":[]},{"category":"Article","title":"SVGOを使ったSVGの軽量化方法（アニメーションさせるときの注意とか）｜2.IDEA","url":"http://2ndidea.com/svg/optimize-svg-with-svgo/","tags":["SVG","Tools"],"content":"SVGの最適化を行うSVGOの使い方について。\n\nそれぞれのプラグインについて解説されてる","relatedLinks":[]},{"category":"Article","title":"Polyfilling Doesn&#x27;t Have to be Difficult -Telerik Developer Network","url":"http://developer.telerik.com/featured/polyfilling-doesnt-difficult/","tags":["JavaScript","library","tutorial"],"content":"polyfillとはどういうものか、実際に`Number.isInteger()`や`placeholder`属性を実装しながら学ぶチュートリアル","relatedLinks":[]},{"category":"Article","title":"Web Componentsの基本的な使い方・まとめ","url":"http://www.h2.dion.ne.jp/~defghi/webc/webc.htm","tags":["WebComponents","tutorial","まとめ"],"content":"Web Componentsの構成要素、それぞれの機能について詳しく解説されてる。\n\ntemplate要素、HTML Imports、Shadow DOM、Custom Elementsについて","relatedLinks":[]},{"category":"Article","title":"実践入門 Ember.js：連載｜gihyo.jp … 技術評論社","url":"http://gihyo.jp/dev/serial/01/emberjs","tags":["JavaScript","MVC","library"],"content":"Ember.jsについての連載","relatedLinks":[]},{"category":"Article","title":"Ractive.js の紹介 — KaoriYa","url":"http://www.kaoriya.net/blog/2014/12/13/","tags":["JavaScript","MVC","library"],"content":"簡単なTODOアプリを使ったRactive.jsの紹介。\n\nmustache拡張なテンプレートとイベント、データバインディングについて","relatedLinks":[]},{"category":"Article","title":"JavaScript - Chrome 40 で今すぐ ServiceWorker を試す - Qiita","url":"http://qiita.com/kinu/items/2abd61b4390f9bbaffc9","tags":["ServiceWorker","JavaScript"],"content":"Service Workerを使ったオフライン処理、スクリプトの登録、更新方法、FetchやCache APIについて","relatedLinks":[]},{"category":"Article","title":"The offline cookbook - JakeArchibald.com","url":"http://jakearchibald.com/2014/offline-cookbook/","tags":["ServiceWorker","JavaScript"],"content":"Service Workerを使った典型的なパターンの紹介。","relatedLinks":[]},{"category":"Article","title":"On Third-Party JavaScript - In Production Case-Study","url":"http://blog.risingstack.com/on-third-party-javascript-in-production/","tags":["JavaScript","セキュリティ"],"content":"サードパーティJavaScriptのケーススタディから学べる事について。\n\nMixpanel、Disqusからサイズやキャッシュ、どういう初期化経路を踏むかなどについて書かれている","relatedLinks":[]},{"category":"Article","title":"Introducing the JavaScript Internationalization API ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2014/12/introducing-the-javascript-internationalization-api/","tags":["JavaScript","i18n","API"],"content":"ECMA i18n APIの使い方について。\n\n元々localeCompareやtoLocaleStringといったものがあったがローカライズには不十分であり、その部分にECMA i18n APIを使える。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Papa Parse - Powerful CSV parser for Javascript","url":"http://papaparse.com/","tags":["JavaScript","library"],"content":"CSVパーサーライブラリ。\n\nCSVをJSONに変換、WebWorkerを使っての並列処理、ダウンロードしながらのパース等","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gcanti/uvdom","url":"https://github.com/gcanti/uvdom","tags":["JavaScript","VirualDOM","library"],"content":"Virtual DOMを持っているライブラリ(React、virtual-dom等)向けに、それぞれ変換出来る抽象レイヤーの実装。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Offline.js – Handle your users losing their internet connection like a pro","url":"http://github.hubspot.com/offline/docs/welcome/","tags":["JavaScript","library"],"content":"オフラインかどうかを検知して通知出来るライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"decimal.js API","url":"http://mikemcl.github.io/decimal.js/","tags":["JavaScript","library"],"content":"Decimalを扱うライブラリ。\n\n小数点同士の演算、丸め込みの挙動の指定等、フォーマットを指定しての出力等が出来る","relatedLinks":[]},{"category":"Book","title":"Amazon: TypeScript実践プログラミング (Programmer&#x27;s SELECTION): スティーブ・フェントン, 鈴木 幸敏, 株式会社クイープ","url":"http://www.amazon.co.jp/dp/4798139807?tag=amazon0abac-22","tags":["TypeScript","book","翻訳"],"content":"2015年1月23日 発売\n\nPro TypeScriptの翻訳本\n\nhttp://www.apress.com/9781430267911","relatedLinks":[]},{"category":"Book","title":"WebSocket - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920030485.do","tags":["WebSocket","book"],"content":"WebSocketについての書籍","relatedLinks":[]}]},{"meta":{"title":"2014-12-23のJS: 開発者アンケート結果、Protractorの仕組み、パフォーマンスチューニング","author":"azu","layout":"post","date":"2014-12-23T09:26:00.000Z","category":"JSer","tags":["アンケート","E2E","Performance","JavaScript","Angular"],"url":"https://jser.info/2014/12/23/survey2014-protractor-performance/"},"items":[{"category":"Headline","title":"Node v0.10.34 (Stable)","url":"http://blog.nodejs.org/2014/12/17/node-v0-10-34-stable","tags":["node.js","ReleaseNote"],"content":"Node v0.10.34リリース。\n\nv0.11.15がv0.12RCとなるので、次のStableで0.12がリリースされる予定(が[ルート証明書のトラブル](http://d.hatena.ne.jp/jovi0608/20141222/1419265270 \"Node-v0.10.34がはまったクロスルート証明書とOpenSSLの落とし穴 - ぼちぼち日記\")により多少ずれそう)","relatedLinks":[{"title":"node js on Twitter: ","url":"https://twitter.com/nodejs/status/545349270241435648"},{"title":"node v0.10.34 で CERT_UNTRUSTED のエラーが発生する - Qiita","url":"http://qiita.com/ken880guchi/items/bb72846fb785b01ced0b"},{"title":"Node-v0.10.34がはまったクロスルート証明書とOpenSSLの落とし穴 - ぼちぼち日記","url":"http://d.hatena.ne.jp/jovi0608/20141222/1419265270"}]},{"category":"Headline","title":"jQuery 1.11.2 and 2.1.3 Released – Safari Fail-Safe Edition | Official jQuery Blog","url":"http://blog.jquery.com/2014/12/18/jquery-1-11-2-and-2-1-3-released-safari-fail-safe-edition/","tags":["jQuery","ReleaseNote"],"content":"jQuery 1.11.2と2.1.3リリース。\n\niOS7と8のquerySelectorバグの対処(Workaround)","relatedLinks":[]},{"category":"Headline","title":"Improving the Pointer Events Polyfill | Official jQuery Blog","url":"http://blog.jquery.com/2014/12/17/improving-the-pointer-events-polyfill/","tags":["google","jQuery","library"],"content":"GoogleからjQuery FoundationがPointerEventsのpolyfillの管理を引き継いだ","relatedLinks":[]},{"category":"Article","title":"DailyJS: JavaScript Developer Survey 2014: Results","url":"http://dailyjs.com/2014/12/16/javascript-survey-results/","tags":["JavaScript","まとめ"],"content":"JavaScript開発者アンケート 2014年の結果が公開された。","relatedLinks":[{"title":"DailyJS | JavaScript デベロッパー・サーベイ 2014 結果 | JSお散歩","url":"http://panda.node.ws/?p=1620"}]},{"category":"Article","title":"HTML Best Practices - Weblog - Hail2u.net","url":"http://hail2u.net/blog/webdesign/html-best-practices.html","tags":["HTML"],"content":"HTMLベストプラクティス。\n\nHTMLの書き方について良い例と悪い例が書かれている","relatedLinks":[{"title":"hail2u/html-best-practices","url":"https://github.com/hail2u/html-best-practices"}]},{"category":"Article","title":"IE10 以下を切る場合の JavaScript チェックリスト - Qiita","url":"http://qiita.com/Jxck_/items/fe8a1c49cac717e52ae3","tags":["IE","JavaScript","browser","まとめ"],"content":"モダンブラウザでは利用できるJavaScriptやDOM APIについて。\n\nまた使いどころが難しい機能についても触れている","relatedLinks":[]},{"category":"Article","title":"ソーシャルメディアの読み込みはDNSプリフェッチのまとめ設定がお得 | ゆっくりと…","url":"http://tokkono.cute.coocan.jp/blog/slow/index.php/programming/boostup-socials-with-dns-prefetch/","tags":["browser","performance"],"content":"`<link rel=\"dns-prefetch\" />`のブラウザサポート状況、同時に指定できる数の制限が無いこと、meta要素を置く場所について。","relatedLinks":[]},{"category":"Article","title":"Maintaining JavaScript Code Quality with ESLint | PayPal Engineering Blog","url":"https://www.paypal-engineering.com/2014/12/12/maintaining-javascript-code-quality-with-eslint/","tags":["JavaScript","Tools","AST"],"content":"自分でルールを拡張出来るESLintの紹介。簡単なルールの書き方、設定方法について","relatedLinks":[]},{"category":"Article","title":"Unit Testing Polymer Elements - Polymer","url":"https://www.polymer-project.org/articles/unit-testing-elements.html","tags":["WebComponents","testing","tutorial"],"content":"Polymerを使ったElementのテストのチュートリアル。\n\nWeb Componentsのテストの参考になりそう","relatedLinks":[]},{"category":"Article","title":"JavaScript - こわくない Protractor - Qiita","url":"http://qiita.com/shuhei/items/6973fe694d29a193f224","tags":["protractor","E2E","testing"],"content":"ProtractorというE2Eテストツールの仕組みについての解説。\n\nelement()はDOM要素を選択してる訳ではない、ブラウザの操作をするメソッドはPromiseを返している、書いた順番で実行されるようになっている点などどのような仕組みで動いているかについてまとめられている","relatedLinks":[]},{"category":"Article","title":"私のJavaScript情報の集め方 - Qiita","url":"http://qiita.com/koba04/items/ba2381776d394633de72","tags":["JavaScript","rss","twitter","github"],"content":"JavaScriptに関連する情報収集について","relatedLinks":[{"title":"Frontrend in Kanazawaのスライドを公開しましたというご連絡と情報収集についての補足など - Life goes on","url":"http://layzie.hatenablog.com/entry/20141104/1415076724"},{"title":"世界のJavaScriptを読もう @ 2014","url":"http://azu.github.io/slide/jser200/javascript-2014.html"}]},{"category":"Article","title":"TypeScript - dtsmのご紹介 - Qiita","url":"http://qiita.com/vvakame/items/38b953ab0f4de63cce8b","tags":["TypeScript","package","Tools"],"content":"npmライクなコマンドラインインタフェースを持ったd.ts管理ツール","relatedLinks":[]},{"category":"SlideVideo","title":"React.js + Flux入門 #scripty02","url":"http://www.slideshare.net/techblogyahoo/reactjs-flux-scripty02","tags":["React","library","Flux"],"content":"React, Virtual DOM, Flux(Fluxxor)を全体的に眺めた感じのスライド。Reactが持つ機能やライフサイクル、Fluxのフローについて","relatedLinks":[]},{"category":"SlideVideo","title":"Backbone Conf III - 2014 - YouTube","url":"https://www.youtube.com/playlist?list=PLlgxAbM67lYIGw8DnANC7VgREbzJRQged&app=desktop","tags":["backbone.js","動画","イベント","まとめ"],"content":"http://backboneconf.com/ の動画が公開された","relatedLinks":[{"title":"BACKBONECONF 2014, by Bocoup","url":"http://backboneconf.com/"}]},{"category":"SlideVideo","title":"Effective web performance tuning for smartphone","url":"http://www.slideshare.net/dena_study/effective-web-performance-tuning-for-smartphone","tags":["mobile","JavaScript","game","performance","スライド"],"content":"スマフォのパフォーマンスチューニングについてのスライド。\n\nどうやって調査するか、改善のワークフロー、何を指標に改善するか。\n\n改善すべき目安やポイントとして処理時間が20ms超、一定間隔で同一処理、描画の負荷が高いイベント、5MB超のGC、メモリリーク、意図しないレイヤーの合成などについて書かれている。","relatedLinks":[{"title":"第三回DeNAゲーム開発勉強会 : ATND","url":"https://atnd.org/events/59594"},{"title":"2014年のWebパフォーマンスふりかえり - 来年以降の期待etc ::ハブろぐ","url":"http://havelog.ayumusato.com/develop/performance/e637-web_performance_2014.html"}]},{"category":"WebsiteDocument","title":"Libscore","url":"http://libscore.com/","tags":["JavaScript","library","検索"],"content":"世界中のサイトでどのJavaScriptライブラリがどれくらい使われているかを表示するサービス","relatedLinks":[]},{"category":"SoftwareLibrary","title":"domenic/html-as-custom-elements","url":"https://github.com/domenic/html-as-custom-elements","tags":["HTML","WebComponents"],"content":"HTML要素をCustom Elementで実装し直すプロジェクト。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"foss-haas/fynx","url":"https://github.com/foss-haas/fynx","tags":["Flux","library"],"content":"Fluxアーキテクチャ的な実装ライブラリ。\n\nAjax的な操作を行うServicesという場所を明示的に用意している。","relatedLinks":[]},{"category":"Book","title":"CUTT System:TypeScriptネットワークプログラミング","url":"http://www.cutt.co.jp/book/978-4-87783-354-1.html","tags":["TypeScript","book"],"content":"2014年1月10日 発売\n\nWebSocketやWebRTC等を使ったアプリをTypeScriptで書いて学んで行く書籍","relatedLinks":[]}]},{"meta":{"title":"2014-12-30のJS: jsdom 2.0.0、6to5 2.0.0、HTMLBars","author":"azu","layout":"post","date":"2014-12-30T13:54:00.000Z","category":"JSer","tags":["JavaScript","DOM","ECMAScript","テンプレート"],"url":"https://jser.info/2014/12/30/jsdom-6to5-htmlbars/"},"items":[{"category":"Headline","title":"Node v0.10.35 (Stable)","url":"http://blog.nodejs.org/2014/12/23/node-v0-10-35-stable/","tags":["node.js","ReleaseNote"],"content":"Node v0.10.35リリース。\n\nhttp://d.hatena.ne.jp/jovi0608/20141222/1419265270 の修正が入った","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember.js 1.9.1 Released","url":"http://emberjs.com/blog/2014/12/23/ember-1-9-1-released.html","tags":["JavaScript","library","ReleaseNote","XSS"],"content":"Ember.js 1.9.1 リリース。\n\nHandlebarsテンプレートはタグのエスケープは自動でやるが、属性値にjavascript:等を指定した場合にXSSとなる可能性があったため自動的にエスケープされるように変更された","relatedLinks":[]},{"category":"Headline","title":"Release v1.5.0 · eslint/espree","url":"https://github.com/eslint/espree/releases/tag/v1.5.0","tags":["JavaScript","AST","library","ReleaseNote"],"content":"esprima forkのespree 1.5.0リリース。\n\nJSXのパースをサポート","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at 2.0.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/2.0.0/Changelog.md","tags":["JavaScript","DOM","library"],"content":"jsdom 2.0.0リリース。\n\nリファクタリング、内部構造を大きく変えていくリリース。\n\n`levels`という概念を捨ててLiving Standard Modelに従うように。\n\n非標準なAPIを標準化されたものへ変更など","relatedLinks":[]},{"category":"Headline","title":"6to5/CHANGELOG.md at master · 6to5/6to5","url":"https://github.com/6to5/6to5/blob/master/CHANGELOG.md#200","tags":["JavaScript","ECMAScript","Tools","ReleaseNote"],"content":"ES6のコードをES5に変換する6to5 2.0.0リリース。\n\nFlowTypeのサポート、polyfill等をcore-jsに変更、Performanceの改善、`6to5/register`に`cache`オプションの追加等","relatedLinks":[{"title":"Flow types · Issue #260 · 6to5/6to5","url":"https://github.com/6to5/6to5/issues/260"},{"title":"zloirock/core-js","url":"https://github.com/zloirock/core-js"},{"title":"Slow compilation · Issue #341 · 6to5/6to5","url":"https://github.com/6to5/6to5/issues/341"}]},{"category":"Headline","title":"Brackets Blog - The Free, Open Source Code Editor for the Web","url":"http://blog.brackets.io/2014/12/18/brackets-1-1-and-extract-for-brackets-0-6-now-available/","tags":["editor","ReleaseNote"],"content":"Brackets 1.1リリース。\n\nクロスブラウザのLive Previewを実験的にサポート。","relatedLinks":[]},{"category":"Article","title":"Shape Security Labs: Announcing the Shift JavaScript AST Specification","url":"http://engineering.shapesecurity.com/2014/12/announcing-shift-javascript-ast.html","tags":["JavaScript","AST","spec"],"content":"SpiderMonkey ASTは内部表現として始まったので、ツールから扱いにくい部分やES6のサポートの問題がでてきた。 \"Shift\"プロジェクトではそのASTの仕様策定、パーサ、ジェネレータ、バリデータ、SpiderMonkey ASTからの変換ツール、Javaの実装などが公開されている。","relatedLinks":[{"title":"Shape Security","url":"https://github.com/shapesecurity"}]},{"category":"Article","title":"Performance Calendar » Fast-Forward Performance – The Future Looks Bright","url":"http://calendar.perfplanet.com/2014/fast-forward-performance-the-future-looks-bright/","tags":["browser","JavaScript","API","performance"],"content":"パフォーマンス改善に役立つAPI、測定をするためのAPIのまとめ。\n\nブラウザのサポート状態について","relatedLinks":[]},{"category":"Article","title":"HTMLBars - A Feature-by-Feature Review | colintoh.com","url":"http://colintoh.com/blog/htmlbars","tags":["JavaScript"],"content":"Emberが採用する[HTMLBars](https://github.com/tildeio/htmlbars \"htmlbars\")について。\n\n以前のEmberのレンダリングは[Handlebars](http://handlebarsjs.com/ \"Handlebars\")をそのまま使っていたため\n\n> テンプレート -> AST -> HTML String -> DOM\n\nというレンダリングのフローとなっていて遅かった。\n\nHTMLBarsはHandlebarsのテンプレート記法を使うのは同様だが、上記のフローを以下のように行える。\n\n> テンプレート (HTMLBarsがコンパイル)-> JavaScript関数(DOM API) -> DOM\n\nこのようなフローとなった理由や仕組みについて書かれている。\n\n内部的にはHTMLBars ASTというものがあるが、レンダリングのフローではコンパイル結果の関数を使うので、HTML Stringのパースがなくなる点が大きな違い。","relatedLinks":[{"title":"htmlbars/ARCHITECTURE.md at master · tildeio/htmlbars","url":"https://github.com/tildeio/htmlbars/blob/master/ARCHITECTURE.md"}]},{"category":"Article","title":"Symbols in ECMAScript 6","url":"http://www.2ality.com/2014/12/es6-symbols.html","tags":["ECMAScript","JavaScript"],"content":"ES6のSymbolsについて。\n\nSymbolの使い方、const Symbol()でのユニーク値としての利用、WeakMapと合わせてのプライベート値、メタ値との利用、iframe、なぜ文字列じゃなくてSymbolなのかについて","relatedLinks":[]},{"category":"Article","title":"Smashing Magazineのパフォーマンス改善ケースが凄まじい件 — MOL","url":"http://t32k.me/mol/log/style-class-conference/","tags":["JavaScript","CSS","performance"],"content":"Smashing Magazineのパフォーマンス改善について。\n\nCritical Rendering Pathの最適化、パフォーマンス改善の指標をSpeed Index <= 1000としている点について等","relatedLinks":[{"title":"Improving Smashing Magazine","url":"http://www.smashingmagazine.com/2014/09/08/improving-smashing-magazine-performance-case-study/"}]},{"category":"Article","title":"Functional Reactive Programming with the Power of Node.js Streams","url":"http://blog.risingstack.com/functional-reactive-programming-with-the-power-of-nodejs-streams/","tags":["node.js","stream","関数型プログラミング"],"content":"NodeのStreamとFRPの導入的な記事。\n\nリアクティブプログラミングはどのようなケースで有用なのか、FRPのライブラリとしてRxJSやBacon等が既にある。\n\nまたNodeのStreamとの互換性を高めたHighland.jsというライブラリの紹介記事","relatedLinks":[]},{"category":"Article","title":"The state of the Web Notifications API - Aurelio De Rosa blog","url":"http://aurelio.audero.it/blog/2014/10/18/state-web-notifications-api/","tags":["JavaScript","WebPlatformAPI"],"content":"Web Notifications APIの`events`周りの仕様がW3CとWHATWGで異なるが、それぞれのブラウザの実装はどうなっているかについて。","relatedLinks":[{"title":"W3C vs. WhatWG HTML5 Specs - Differences Documented -Telerik Developer Network","url":"http://developer.telerik.com/featured/w3c-vs-whatwg-html5-specs-differences-documented/"}]},{"category":"Article","title":"Javascript-globalization by rxaviers","url":"http://rxaviers.github.io/javascript-globalization/","tags":["JavaScript","i18n","library","まとめ"],"content":"ECMA i18n APIやFormatJS等の国際化ライブラリなどの特徴や機能比較のまとめ","relatedLinks":[]},{"category":"SlideVideo","title":"Flux react現状確認会","url":"http://www.slideshare.net/VOYAGE_GROUP/flux-react","tags":["React","Flux","スライド"],"content":"FluxとReactについてのスライド。\n\nアーキテクチャ = オブザーバパターン、データの一方通行性、メリット・デメリット、ViewライブラリとしてReactを選んだ理由について。\n\n実際にFlux的にやっての本家との違いについて","relatedLinks":[{"title":"Fluxとはなんだったのか + misc at 2014 - snyk","url":"http://saneyukis.hatenablog.com/entry/2014/12/24/014421"}]},{"category":"SlideVideo","title":"Chrome 関連の動画に日本語字幕が付きました - Google Developer Japan Blog","url":"http://googledevjp.blogspot.com/2014/12/chrome.html","tags":["Chrome","翻訳"],"content":"I/O Bytes 2014のChrome関係の動画に日本語字幕がついた","relatedLinks":[]},{"category":"SoftwareLibrary","title":"JSVerify — property based testing for JavaScript. Like QuickCheck.","url":"http://jsverify.github.io/#jsverify","tags":["JavaScript","testing","library"],"content":"QuickCheckを行うライブラリ。\n\nMochaやJasmineとの連携も用意されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"azu/textlint","url":"https://github.com/azu/textlint","tags":["JavaScript","Markdown","Tools","library","node.js"],"content":"テキストやMarkdownをLintするツール。\n\nESLintのようにルールをJavaScriptで書いて拡張出来る。","relatedLinks":[{"title":"JavaScriptでルールを書けるテキスト/Markdownの校正ツール textlint を作った | Web Scratch","url":"http://efcl.info/2014/12/30/textlint/"}]},{"category":"SoftwareLibrary","title":"mapbox/pbf","url":"https://github.com/mapbox/pbf","tags":["JavaScript","library"],"content":"ファイルサイズの小さいprotocol buffersの実装ライブラリ","relatedLinks":[]},{"category":"Book","title":"Knockout.js - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920035367.do","tags":["JavaScript","library","book"],"content":"Knockout.jsについての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-01-06のJS: ESLint 0.11.0、Browserifyとwebpack、TypeScriptの本","author":"azu","layout":"post","date":"2015-01-06T13:24:00.000Z","category":"JSer","tags":["JavaScript","Lint","tools","Browserify","webpack","TypeScript"],"url":"https://jser.info/2015/01/06/eslint0.11-browserify-webpack-typescript/"},"items":[{"category":"Headline","title":"ESLint 0.11.0 released - ESLint","url":"http://eslint.org/blog/2014/12/eslint-0.11.0-released/","tags":["ECMAScript","JavaScript","Tools","ReleaseNote"],"content":"ESLint 0.11.0リリース。\n\nJavaScriptパーサがesprimaからEspreeへと変更された。\n\nまたES5がデフォルトとなり、ES3のコードとしてLintしたい場合はオプションを変更する必要がある","relatedLinks":[]},{"category":"Headline","title":"Release v2.2.0 · less/less.js","url":"https://github.com/less/less.js/releases/tag/v2.2.0","tags":["CSS","JavaScript","ReleaseNote"],"content":"less 2.2.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release Bulleit Bottle · sass/libsass","url":"https://github.com/sass/libsass/releases/tag/3.1.0","tags":["Sass","ReleaseNote"],"content":"libsass 3.1.0リリース。\n\n`@debug`、`@error`等のデバッグ系の実装、`random()`等の関数の実装や修正など。","relatedLinks":[]},{"category":"Article","title":"ECMAScript 6: maps and sets","url":"http://www.2ality.com/2015/01/es6-maps-sets.html","tags":["ECMAScript","JavaScript","まとめ","tutorial"],"content":"Map, WeakMap, Set, WeakSetの挙動についての解説。\n\nそれぞれのAPIの解説、WeakMapを使ったプライベートデータ、spread operatorとあわせた使い方等について","relatedLinks":[]},{"category":"Article","title":"browserify for webpack users","url":"https://gist.github.com/substack/68f8d502be42d5cd4942","tags":["browserify","webpack"],"content":"Browserifyとwebpackのそれぞれの機能対応について。\n\nwebpackは多くの機能が同梱されているため、その機能に対応するBrowserify pluginの紹介や設計思想の違い等について","relatedLinks":[{"title":"webpack for browserify users","url":"http://webpack.github.io/docs/webpack-for-browserify-users.html"},{"title":"substack/browserify-handbook","url":"https://github.com/substack/browserify-handbook"}]},{"category":"Article","title":"Advanced unit testing tools for Node.js","url":"http://blog.wercker.com/2014/12/23/Testing-in-Node.html","tags":["JavaScript","testing"],"content":"TAP形式とtapeを使ってのNodeのテストについて。\n\nproxyquireを使ってのStubなど","relatedLinks":[{"title":"thlorenz/proxyquire","url":"https://github.com/thlorenz/proxyquire"}]},{"category":"Article","title":"KeyboardEvent.keyを利用する前に知っておくべき事 - WebStudio","url":"http://www.d-toybox.com/studio/weblog/show.php?mode=single;id=2015010100","tags":["DOM","event","キーボード"],"content":"DOM 3 KeyboardEventについて。 \n\nKeyboardEvent.keyCodeの問題点やKeyboardEvent.keyは入力される文字となり直感的に分かるようになっている点について。\n\nまた、KeyboardEvent.codeはキー自体を示し、クロスブラウザでのキーイベント対応について等","relatedLinks":[]},{"category":"Article","title":"ES6 Generatorを使ってasync/awaitを実装するメモ - maru source","url":"http://blog.h13i32maru.jp/entry/2015/01/02/225457","tags":["JavaScript","Promises","tutorial"],"content":"ES6 GeneratorとPromiseを使ってcoライクな実装をするまでをステップ・バイ・ステップで","relatedLinks":[]},{"category":"Article","title":"Multi-User Video Conference with WebRTC – Minko Gechev&#x27;s blog","url":"http://blog.mgechev.com/2014/12/26/multi-user-video-conference-webrtc-angularjs-yeoman","tags":["JavaScript","WebRTC","AngularJS","tutorial"],"content":"AngularJS+WebRTC+socket.ioを使ってビデオチャットを作るチュートリアル。\n\nYeomanのジェネレータを使ってAngularJSのコードベースを生成してる","relatedLinks":[]},{"category":"SlideVideo","title":"A Brief Introduction to SVG | Treehouse Blog","url":"http://blog.teamtreehouse.com/brief-introduction-svg","tags":["SVG","動画"],"content":"SVGとは何かというのが簡単にまとめられたスクリーンキャスト","relatedLinks":[]},{"category":"SlideVideo","title":"The jsdom","url":"http://www.slideshare.net/domenicdenicola/the-jsdom","tags":["JavaScript","DOM","スライド"],"content":"jsdomの実装、将来についてのスライド。\n\nまたWebIDLから実装に落としていくツールについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Front-end Dev Weekly","url":"https://frontenddevweekly.curated.co/","tags":["web","Tools","mail"],"content":"フロントエンド開発のニュース、ツールについての週間のメールマガジン","relatedLinks":[]},{"category":"WebsiteDocument","title":"Frontend Weekly","url":"http://studiomohawk.us2.list-manage.com/subscribe?u=0c8604ec46b9f779a3f5b6a1c&id=9af01549dd","tags":["web","mail"],"content":"フロントエンドに関連する記事、チュートリアル、動画/スライドを紹介する週間のメールマガジン","relatedLinks":[{"title":"”今の”フロントエンド開発を知るためのメルマガ：Frontend Weekly — MOL","url":"http://t32k.me/mol/log/frontend-weekly/"}]},{"category":"WebsiteDocument","title":"Optimizing Performance — Web Fundamentals","url":"https://developers.google.com/web/fundamentals/performance/","tags":["翻訳","Brackets","performance"],"content":"Web Fundamentalsの一部が翻訳されてる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"deSVG","url":"http://benhowdle.im/deSVG/","tags":["SVG","CSS","JavaScript","library"],"content":"SVGをインラインに展開してCSSでスタイリング出来るようにするライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mauriciosoares/core.js","url":"https://github.com/mauriciosoares/core.js","tags":["JavaScript","library"],"content":"`Core.register`で要素指定しその要素に関連する処理を書いたコンポーネントの作成、コンポーネント同士はlistenとnotifyのpub/subでやり取りする事で疎結合な構成を作るライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"fraction/set-timer","url":"https://github.com/fraction/set-timer","tags":["JavaScript","library"],"content":"setTimeout、setIntervalをラップしたTimer APIライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"STRML/JSXHint","url":"https://github.com/STRML/JSXHint","tags":["JavaScript","Tools"],"content":"JSXシンタックスを含んだファイルもLint出来るJSHintラッパツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bearcat","url":"http://bearcatjs.org/","tags":["JavaScript","library"],"content":"モジュール定義部分をbearcatの書き方にすることで、DI、非同期ロード、AOPに対応出来るライブラリ","relatedLinks":[]},{"category":"Book","title":"型の国のTypeScript","url":"http://typescript.ninja/typescript-in-definitelyland/","tags":["TypeScript","book","電子書籍"],"content":"TypeScriptについての書籍\n\n無料で公開されている。","relatedLinks":[{"title":"TypeScript in Definitelyland 発行","url":"http://typescript.ninja/2015/01/01/typescript-in-definitelyland.html"}]},{"category":"Book","title":"Pro Express.js","url":"http://www.apress.com/9781484200384","tags":["node.js","book"],"content":"Express.jsについての書籍","relatedLinks":[]},{"category":"Book","title":"CSS Refactoring - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920033998.do","tags":["CSS","book"],"content":"2015年3月発売\n\nCSSのリファクタリング本","relatedLinks":[]},{"category":"Book","title":"Beautiful JavaScript - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920030706.do","tags":["JavaScript","book"],"content":"2015年3月発売\n\nJavaScript全体のエコシステムやどうやって問題にアプローチしていくのかなどについて","relatedLinks":[]}]},{"meta":{"title":"2015-01-13のJS: 6to5、ES6とjspm、リファクタリングJavaScript","author":"azu","layout":"post","date":"2015-01-13T12:44:00.000Z","category":"JSer","tags":["ES6","リファクタリング","JavaScript","modules"],"url":"https://jser.info/2015/01/13/6to5-jspm-refactoring-javascript/"},"items":[{"category":"Headline","title":"6to5 · Turn ES6+ code into readable vanilla ES5","url":"https://6to5.org/","tags":["ECMAScript","JavaScript","Tools"],"content":"包含的にES6のコードをES5に変換する6to5の公式サイトリニューアル。\nJSXやFlowとか多くの部分に対応、polyfill出来るところは外部のpolyfillを読み込み対応、可読性が高いコードを吐くようになっている。","relatedLinks":[]},{"category":"Article","title":"ライブラリをES6で書いて公開する所から始めよう | Web Scratch","url":"http://efcl.info/2015/01/09/write-es6/","tags":["JavaScript","ECMAScript","library","testing","document"],"content":"ES6でライブラリを書いて、テストしてnpmに公開するまでの流れ。\n6to5+power-assert+mochaの組み合わせを設定ファイルレスで行う話","relatedLinks":[]},{"category":"Article","title":"Shape Security Labs: A Technical Comparison of the Shift and SpiderMonkey AST Formats","url":"http://engineering.shapesecurity.com/2015/01/a-technical-comparison-of-shift-and.html","tags":["JavaScript","AST","spec"],"content":"Shift ASTとSpiderMonkey ASTの違いについて。\n改善点、拡張された点、まだ議論すべき点について","relatedLinks":[]},{"category":"Article","title":"A Good Front-End Architecture","url":"http://www.sitepoint.com/good-front-end-architecture/","tags":["JavaScript","CSS"],"content":"フロントエンド(HTML、JavaScript、CSS、リソース)のディレクトリ構造について","relatedLinks":[]},{"category":"Article","title":"Modularizing Underscore.js | &amp;yet Blog","url":"http://blog.andyet.com/2015/01/07/modularizing-underscorejs","tags":["JavaScript","npm","document","library"],"content":"小さいモジュールを大量に作って公開する場合にも問題となる点がある事について。\nAmp.jsという小さなモジュールの組み合わせでUnderscoreライクなものを作り、それぞれのモジュールがどのような構造になっているかについて","relatedLinks":[{"title":"Amp.js","url":"http://amp.ampersandjs.com/"},{"title":"HenrikJoreteg/fixpack","url":"https://github.com/henrikjoreteg/fixpack"}]},{"category":"Article","title":"What&#x27;s New in QUnit 1.16","url":"http://www.sitepoint.com/whats-new-qunit-1-16/","tags":["JavaScript","testing"],"content":"QUnit 1.16について。\n2.0に向けて変更、非同期のテストの新しい方法の追加、Promiseのサポート、`QUnit.skip()`などについて","relatedLinks":[]},{"category":"Article","title":"Cross-tab Communication","url":"http://ponyfoo.com/articles/cross-tab-communication","tags":["JavaScript"],"content":"localStorageを使ったタブ間のやり取りをする方法。\nより簡単に行う`local-storage`というライブラリについて","relatedLinks":[{"title":"bevacqua/local-storage","url":"https://github.com/bevacqua/local-storage"}]},{"category":"SlideVideo","title":"JavaScript in 2015 - Glen Maddern: Internet Pro","url":"http://glenmaddern.com/articles/javascript-in-2015","tags":["JavaScript","ECMAScript","Tools","動画"],"content":"jspmの紹介記事 + 動画。\nredditのAPIを使いGIFを表示する画面をjspm+npm+ES6をつかって書く動画。\nテンポ良く紹介されている動画で、開発中はビルド等不要でローダで読み込み、プロダクションでは一つのファイルにbundle出来るという特徴を紹介してる。","relatedLinks":[{"title":"jspm.io - Frictionless Browser Package Management","url":"http://jspm.io/"}]},{"category":"WebsiteDocument","title":"Essential JavaScript Links","url":"https://gist.github.com/ericelliott/d576f72441fc1b27dace","tags":["JavaScript","まとめ","links"],"content":"JavaScriptに関するリソースリンク集","relatedLinks":[]},{"category":"WebsiteDocument","title":"Internet ExplorerのどのバージョンからどのHTML/CSS/JSに対応しているかの一覧｜Web制作 W3G","url":"https://w3g.jp/blog/ie_supportlist","tags":["IE","まとめ","WebPlatformAPI"],"content":"IEバージョン別のサポート終了日、対応したHTML/CSS/JSの機能のまとめ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"azu/espower-6to5 · GitHub","url":"https://github.com/azu/espower-6to5","tags":["ECMAScript","testing","JavaScript","library"],"content":"power-assert + 6to5 ES6でpower-assertのテストを書ける。\n使用例: https://github.com/azu/textlint-rule-helper","relatedLinks":[]},{"category":"SoftwareLibrary","title":"conceptsandtraining/modernie_selenium","url":"https://github.com/conceptsandtraining/modernie_selenium","tags":["IE","Selenium"],"content":"modern.ieを使ったSeleniumの設定ツール。\n自動で必要なものをインストール + Windowsの余計な設定をオフにしてくれる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"es-shims/es7-shim","url":"https://github.com/es-shims/es7-shim","tags":["ECMAScript","library"],"content":"ES7のpolyfillライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bevacqua/local-storage","url":"https://github.com/bevacqua/local-storage","tags":["JavaScript","library"],"content":"localStorageのAPIをシンプルにしたライブラリ  \nタブ間のコミュニケーションに使うような監視機能も持ってる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Zhouzi/TheaterJS","url":"https://github.com/Zhouzi/TheaterJS","tags":["JavaScript","library"],"content":"タイプライター的な文字表示効果等を行えるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mirek/node-unused-deps","url":"https://github.com/mirek/node-unused-deps","tags":["node.js","module","Tools","console"],"content":"使用してないNode.jsモジュールがあるかどうかをチェックするコマンドラインツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tejasmanohar/npm-algos","url":"https://github.com/tejasmanohar/npm-algos","tags":["node.js","JavaScript","library","アルゴリズム"],"content":"コンピュータサイエンス、アルゴリズムの実装ライブラリのまとめ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Headless Browser Testing With Xvfb","url":"http://tobyho.com/2015/01/09/headless-browser-testing-xvfb/","tags":["console","firefox","browser"],"content":"Firefoxなどヘッドレスで動かすのにXvfbが必要なアプリを`xvfb-run firefox`という感じで起動できるコマンドラインツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Amp.js","url":"http://amp.ampersandjs.com/","tags":["JavaScript","library"],"content":"Underscore.js的なユーティリティ関数のコレクションライブラリ。\nそれぞれの機能をちゃんと個別のnpmモジュールとしてインストール出来る","relatedLinks":[{"title":"Modularizing Underscore.js | ","url":"http://blog.andyet.com/2015/01/07/modularizing-underscorejs"}]},{"category":"Book","title":"Node.js Design Patterns | Packt","url":"https://www.packtpub.com/web-development/nodejs-design-patterns","tags":["node.js","デザインパターン","book"],"content":"Node.jsのデザインパターンについての書籍","relatedLinks":[]},{"category":"Book","title":"The Refactoring Tales","url":"http://javascriptplayground.com/the-refactoring-tales/refactoring-tales.html","tags":["JavaScript","book","jQuery"],"content":"JavaScriptのリファクタリングについてのウェブで公開されてる書籍。(まだ執筆中)  \n1,2章はjQueryべったりな書き方のリファクタリング、3章は不必要な複雑性を分離、4章はデザインパターン、5章はFat Controller等","relatedLinks":[{"title":"The Refactoring Tales","url":"http://javascriptplayground.com/the-refactoring-tales/"},{"title":"The Refactoring Tales - JavaScriptのリファクタリング本を読んだ | Web Scratch","url":"http://efcl.info/2015/01/11/refactoring-tales/"}]}]},{"meta":{"title":"JSer.info 4周年","author":"azu","layout":"post","date":"2015-01-15T22:35:00.000Z","category":"Article","tags":["JavaScript"],"url":"https://jser.info/2015/01/16/4-years/"},"items":[]},{"meta":{"title":"2015-01-20のJS: TypeScript 1.4、io.js 1.0、bluebird 2.7のglobal rejection events","author":"azu","layout":"post","date":"2015-01-20T13:24:00.000Z","category":"JSer","tags":["TypeScript","Node.js","io.js","Promise","library"],"url":"https://jser.info/2015/01/20/typescript1.4-iojs-bluebird2.7/"},"items":[{"category":"Headline","title":"Socket.IO — Socket.IO 1.3.0","url":"http://socket.io/blog/socket-io-1-3-0/","tags":["node.js","JavaScript","library","ReleaseNote"],"content":"Socket.IO 1.3.0リリース。","relatedLinks":[]},{"category":"Headline","title":"harmony:specification_drafts [ES Wiki]","url":"http://wiki.ecmascript.org/doku.php?id=harmony:specification_drafts#january_15_2015_draft_rev_31","tags":["ECMAScript","spec","ReleaseNote"],"content":"ECMAScript 6のDraft Rev 31リリース。\n議論検討する`super()`についての記述の変更が中心","relatedLinks":[{"title":"ecma262/ES6-super-construct=proposal.md at master · tc39/ecma262","url":"https://github.com/tc39/ecma262/blob/master/workingdocs/ES6-super-construct%3Dproposal.md"}]},{"category":"Headline","title":"ESLint 0.12.0 released - ESLint","url":"http://eslint.org/blog/2015/01/eslint-0.12.0-released/","tags":["JavaScript","ECMAScript","Tools","ReleaseNote"],"content":"ESLint  0.12.0リリース。\nES6の一部をサポート、JSXのフルサポート。\nそれに併せてルールがJSXでも動くように修正等","relatedLinks":[]},{"category":"Headline","title":"Release 1.17.0 · jquery/qunit","url":"https://github.com/jquery/qunit/releases/tag/1.17.0","tags":["JavaScript","testing","ReleaseNote"],"content":"QUnit 1.17.0リリース。\nHTMLレポータの改善。","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 1.4 - TypeScript - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/typescript/archive/2015/01/16/announcing-typescript-1-4.aspx","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 1.4リリース。\nUnion Types、Type Aliases、Const Enumsの追加。\nES6の構文サポートの改善、ES6のコードを出力するモードの追加等","relatedLinks":[{"title":"TypeScript 1.4.1 変更点 - Qiita","url":"http://qiita.com/vvakame/items/69efc1c6a3b91876330d"}]},{"category":"Headline","title":"io.js/CHANGELOG.md at v1.x · iojs/io.js","url":"https://github.com/iojs/io.js/blob/v1.x/CHANGELOG.md#2015-01-14-version-101","tags":["node.js","ReleaseNote"],"content":"Node.jsのforkであるio.js 1.0リリース。","relatedLinks":[{"title":"IO.js Overview","url":"http://blog.risingstack.com/iojs-overview/"},{"title":"io.js-v1.0.0のリリースによせて - ぼちぼち日記","url":"http://d.hatena.ne.jp/jovi0608/20150115/1421312947"},{"title":"io.jsについて知っていること - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2014/12/25/104300"}]},{"category":"Headline","title":"Release v2.7.0 · petkaantonov/bluebird","url":"https://github.com/petkaantonov/bluebird/releases/tag/v2.7.0","tags":["Promises","library","ReleaseNote"],"content":"bluebird 2.7.0リリース。\n`process.on(\"unhandledRejection\", fn)`という感じでグローバルにunhandled Rejectionをキャッチ出来るイベントを登録できるように。","relatedLinks":[{"title":"Promise unhandled rejection tracking global handler hook","url":"https://gist.github.com/benjamingr/0237932cee84712951a2"},{"title":"[","url":"http://lists.w3.org/Archives/Public/public-whatwg-archive/2014Sep/0024.html"}]},{"category":"Headline","title":"Release v1.10.0 · jscs-dev/node-jscs","url":"https://github.com/jscs-dev/node-jscs/releases/tag/v1.10.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"JavaScriptコードスタイルチェックツールjscs 1.10.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release 5.0 “Pravda vítězí” · postcss/autoprefixer","url":"https://github.com/postcss/autoprefixer/releases/tag/5.0.0","tags":["CSS","Tools","ReleaseNote"],"content":"autoprefixer 5.0リリース。\nPostCSS 4.0とBrowserslistを使用するように、`object-fit`やCSS Shapesなどの新しいプロパティに対応","relatedLinks":[]},{"category":"Article","title":"ServiceWorker を使った XHR のモックテスト - Block Rockin’ Codes","url":"http://jxck.hatenablog.com/entry/response-injection","tags":["JavaScript","ServiceWorker"],"content":"ServiceWorkerを使ったXHRのモック。\n`onfetch`に登録すれば、XHR等のリクエストに対してhookができるので、事前に定義しておいたレスポンスを返すようにする。\nServiceWorkerの登録プロセスについて","relatedLinks":[]},{"category":"Article","title":"What&#x27;s new in CSS Selectors 4 | grack","url":"https://grack.com/blog/2015/01/11/css-selectors-4/","tags":["CSS"],"content":"CSS Selectors Level 4で追加された要素についての紹介","relatedLinks":[]},{"category":"Article","title":"embona – ブラウザで動くBonanzaを作ってみた(その1) » nmi.jp","url":"http://nmi.jp/archives/763","tags":["JavaScript"],"content":"Emscriptenを使って将棋プログラムを移植するまでの流れ。\nヒープメモリ不足、ファイルの読み込み、デバッグ方法、標準入出力の扱い、Asyncifyでのメインループ処理など","relatedLinks":[]},{"category":"WebsiteDocument","title":"VersionEye - Notification System for Software Packages","url":"https://www.versioneye.com/","tags":["package","webservice"],"content":"npmやgem等色々な言語のライブラリの更新チェック、依存関係のチェック等が出来るサービス。\nファイルアップロードとかAPI等もある。\nパッケージをフォローしてRSSで見たりできる","relatedLinks":[{"title":"Continuous Updating // Speaker Deck","url":"https://speakerdeck.com/reiz/continuous-updating"}]},{"category":"SoftwareLibrary","title":"Esperanto demo","url":"http://esperantojs.org/","tags":["JavaScript","ECMAScript","library","node.js","Tools"],"content":"ES6 modulesのコードをCommonJS、AMD、UMDに変換するコマンドラインツール。Node.jsモジュールとしても利用できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"fdecampredon/rx-flux","url":"https://github.com/fdecampredon/rx-flux","tags":["Flux","library"],"content":"RxJSベースのFluxアーキテクチャの実装ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"RubaXa/Sortable","url":"https://github.com/RubaXa/Sortable","tags":["JavaScript","library"],"content":"D&Dで要素を動かせるsortableライブラリ。\njQuery等の依存がないライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ECharts · Home","url":"http://ecomfe.github.io/echarts/index-en.html","tags":["JavaScript","グラフ","library"],"content":"Baidu EFEのグラフライブラリ。\n種類が豊富に用意されていて、Canvasを管理するのにZRenderというライブラリを使っている","relatedLinks":[{"title":"ZRender","url":"http://ecomfe.github.io/zrender/"}]},{"category":"SoftwareLibrary","title":"winterbe/streamjs","url":"https://github.com/winterbe/streamjs","tags":["JavaScript","Java","library"],"content":"Java 8 Streams APIをインスパイアなStreamライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"eventualbuddha/decaffeinate","url":"https://github.com/eventualbuddha/decaffeinate","tags":["CoffeeScript","JavaScript"],"content":"CoffeeScript to ES6に変換するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gobblejs/gobble","url":"https://github.com/gobblejs/gobble","tags":["JavaScript","Tools","Grunt"],"content":"JavaScriptビルドツール。\nGruntはビルドツールではないため、Gruntと共存する形でも使える。\nまたデバッガビリティを優先して開発していて、pluginも変に複雑化しないように役割をシンプルにしてる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ForbesLindesay/sync-request","url":"https://github.com/ForbesLindesay/sync-request","tags":["JavaScript","node.js","HTTP","library"],"content":"同期的なHTTPリクエストを行うライブラリ","relatedLinks":[]}]},{"meta":{"title":"2015-01-28のJS: Vivaldi、lodash 3.0.0、JavaScriptテスト概要","author":"azu","layout":"post","date":"2015-01-27T15:14:00.000Z","category":"JSer","tags":["Browser","Opera","library","Testing"],"url":"https://jser.info/2015/01/28/vivaldi-lodash3-js-tests/"},"items":[{"category":"Headline","title":"Vivaldi - A new browser for our friends","url":"https://vivaldi.com/","tags":["browser","Opera","blink"],"content":"元Opera CEOが始めたブラウザ。\nChromium(Blink)をベースにしていて、UIにReact等ウェブの技術を使用している。","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 41 Beta: New ES6 Features and Improved DevTools for Service Workers and Web Animations","url":"http://blog.chromium.org/2015/01/chrome-41-beta-new-es6-features-and.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 41βリリース。\nES6 Template Literals、Web Animationsのデバッグ機能、image-rendering: pixelatedのサポート等","relatedLinks":[]},{"category":"Headline","title":"Release 2.5.0 · groupon-testium/testium","url":"https://github.com/groupon-testium/testium/releases/tag/v2.5.0","tags":["E2E","testing","ReleaseNote"],"content":"Integration Testフレームワークのtestium 2.5.0リリース。\n日本語などの入力ができない問題の修正やエラー表示の改善、`Element.prototype.getElement`の実装など","relatedLinks":[]},{"category":"Headline","title":"Release 3.0.0 · lodash/lodash","url":"https://github.com/lodash/lodash/releases/tag/3.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"lodash v3.0.0リリース。\nString関係のメソッドの追加、関数型スタイルで使いやすいメソッドの追加、個々のモジュールとして入れた時の依存関係をシンプルに、パフォーマンスの改善、lazy chainingの導入等","relatedLinks":[{"title":"Changelog · lodash/lodash Wiki","url":"https://github.com/lodash/lodash/wiki/Changelog#compatibility-warnings"},{"title":"How to Speed Up Lo-Dash ×100? Introducing Lazy Evaluation. | Filip Zawada","url":"http://filimanjaro.com/blog/2014/introducing-lazy-evaluation/"}]},{"category":"Headline","title":"Release JSHint 2.6.0 · jshint/jshint","url":"https://github.com/jshint/jshint/releases/tag/2.6.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"JSHint 2.6.0リリース。","relatedLinks":[]},{"category":"Headline","title":"ESLint 0.13.0 released - ESLint","url":"http://eslint.org/blog/2015/01/eslint-0.13.0-released/","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 0.13.0リリース。\nTemplate strings、デフォルトパラメータ等のES6サポート改善、ブロックスコープの挙動を修正等","relatedLinks":[]},{"category":"Article","title":"テストできないコードをE2Eテストを使ってリファクタリングしよう | Web Scratch","url":"http://efcl.info/2015/01/24/testium-e2e-refactoring/","tags":["JavaScript","E2E","testing","browser"],"content":"E2EテストフレームワークのTestiumの紹介とリファクタリングについて。\nMocha+Testium+power-assertでユニットテストと同じようにE2Eテストを書くための設定やサンプル","relatedLinks":[]},{"category":"Article","title":"Fetch API in action","url":"http://blog.gospodarets.com/fetch_in_action","tags":["JavaScript","DOM","API","XHR"],"content":"Fetch APIについての紹介。\nレスポンスのステータスコード、レスポンスのJSONパース、タイムアウトの問題、使い方、polyfillについて","relatedLinks":[]},{"category":"Article","title":"Destructuring and parameter handling in ECMAScript 6","url":"http://www.2ality.com/2015/01/es6-destructuring.html","tags":["ECMAScript","JavaScript"],"content":"ES6のDestructuring(分割代入、構造化代入)と引数時の扱いについて。\nまたSpread operatorを使った値の展開についても書かれてる","relatedLinks":[]},{"category":"Article","title":"Strange JavaScript Errors and How to Fix Them","url":"http://davidwalsh.name/fix-javascript-errors","tags":["JavaScript","debug"],"content":"JavaScriptのエラーメッセージとそれがどのようなときに起きてるエラーなのか、また修正方法について","relatedLinks":[]},{"category":"Article","title":"addyosmani/es6-equivalents-in-es5","url":"https://github.com/addyosmani/es6-equivalents-in-es5","tags":["JavaScript","ECMAScript","tutorial","document"],"content":"ES6で書かれたものとES5で同等の事を行うコードを並べて、ES6の機能について紹介","relatedLinks":[]},{"category":"Article","title":"Getting Literal With ES6 Template Strings","url":"http://updates.html5rocks.com/2015/01/ES6-Template-Strings","tags":["JavaScript","ECMAScript"],"content":"ES6 Template Stringsについての解説","relatedLinks":[{"title":"TemplateStrings.md","url":"https://gist.github.com/kuu/b7eb679a3ad48d980ed3"}]},{"category":"Article","title":"5分でわかる正しい Web サイト常時 SSL 化のための基礎知識 | WWW WATCH","url":"http://hyper-text.org/archives/2015/01/full_time_ssl_website_quick_start.shtml","tags":["HTTP","SSL","まとめ"],"content":"SSLの効果 - メリットとデメリット、SSL証明書の種類と取得方法、外部リソースの読み込みとMixed Content、HTTPSに接続を強制する方法 - HSTS、リダイレクト、CookieのSecure属性などについて","relatedLinks":[]},{"category":"Article","title":"ES6 Module Gotchas | geedew","url":"http://www.geedew.com/2014/12/26/es6-module-gotchas/","tags":["ECMAScript","JavaScript"],"content":"ES6 modulesのアンチパターンについて。\n静的なものを扱うデザインであるという話、オブジェクトをexportした場合の問題、副作用を目的としたモジュールの読込方法、export defaultを出来るだけ使うべき等","relatedLinks":[]},{"category":"Article","title":"New animation controls in Chrome Canary | Val Head - Designer","url":"http://www.valhead.com/2015/01/06/quick-tip-chrome-animation-controls/","tags":["CSS","Chrome","debug"],"content":"ChromeのCSS animationのデバッグ機能についての紹介","relatedLinks":[{"title":"New animation inspector panel in Firefox 37 - YouTube","url":"https://www.youtube.com/watch?v=3UZdsbmYduQ"}]},{"category":"Article","title":"What the Virtual Viewport?","url":"http://updates.html5rocks.com/2015/01/virtual-viewport","tags":["Chrome","browser"],"content":"Chrome 39と40でviewportの仕組みが変わった。\n40からLayout ViewportとVisual Viewportに分かれて処理されるようになった。(IEと同様)\nズーム時にposition: fixedな要素等の動作の違いがでる。","relatedLinks":[{"title":"Chrome Viewports - Google スライド","url":"https://docs.google.com/presentation/d/1nJvJqL2dw5STi5FFpR6tP371vSpDWWs5Beksbfitpzc/present"},{"title":"A tale of two viewports — part two","url":"http://www.quirksmode.org/mobile/viewports2.html"}]},{"category":"Article","title":"A Journey Through Client-Side Testing with JavaScript -Telerik Developer Network","url":"http://developer.telerik.com/featured/journey-client-side-testing-javascript/","tags":["JavaScript","testing"],"content":"JavaScriptのテスト全体について書かれた記事。\nテストフレームワーク、Assertionライブラリ、Test Runnerなどテストを構成する要素。\nmocha-phantom、karma、DalekJS、Atomusでの実行方法について","relatedLinks":[]},{"category":"SlideVideo","title":"Functional programming in javascript (intro) // Speaker Deck","url":"https://speakerdeck.com/geekingfrog/functional-programming-in-javascript-intro","tags":["JavaScript","スライド","関数型プログラミング"],"content":"JavaScriptと関数型プログラミングについてのスライド。","relatedLinks":[]},{"category":"SlideVideo","title":"Web Componentsのアクセシビリティ","url":"http://www.slideshare.net/mlca11y/web-components-43883982","tags":["WebComponents","WAI-ARIA","アクセシビリティ","スライド"],"content":"Web Componentsとアクセシビリティについてのスライド。\n既存要素があるケースと独自要素の場合はWAI-ARIAを使うことについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"CSS Flexbox Please!","url":"http://demo.agektmr.com/flexbox/","tags":["CSS","demo"],"content":"CSS Flexboxのプロパティをその場で変更したりして動作を試せるデモページ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Diet.js","url":"http://dietjs.com/","tags":["node.js","library"],"content":"Node.jsのウェブアプリケーションフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"yoshuawuyts/promise-each","url":"https://github.com/yoshuawuyts/promise-each","tags":["Promises","library"],"content":"Promiseと組み合わせて使えるeach、every、filter、map、reduce、some等の関数をそれぞれモジュール化したもの","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Home | Aurelia","url":"http://aurelia.io/","tags":["JavaScript","library"],"content":"Durandalの次世代となるJavaScriptフレームワーク。 ES6(or AltJS) + jspm、two-way binding、DI、ルーティング等を盛り込んだフレームワーク。\n元AngularJSチームの人が開発してる","relatedLinks":[{"title":"Introducing Aurelia","url":"http://blog.durandal.io/2015/01/26/introducing-aurelia/"}]},{"category":"SoftwareLibrary","title":"shiwano/typhen","url":"https://github.com/shiwano/typhen","tags":["TypeScript","Tools"],"content":"d.tsからJSON Schemaを作ったり、Handlebarsを使ったテンプレートでコードやドキュメントを出力できるツール","relatedLinks":[{"title":"TypeScript の型定義からコードを自動生成するツールを作った - Qiita","url":"http://qiita.com/shiwano/items/dd769ead84e0da2d349a"}]},{"category":"SoftwareLibrary","title":"Wallaby - intelligent test runner for JavaScript","url":"http://wallabyjs.com/","tags":["JetBrains","IDE","JavaScript","testing"],"content":"JetBrains IDE等と統合して使えるTest Runner。\nMocha、QUnit、Jasmine等が使えて、コードカバレッジをエディタ上に表示、テストケースを一部だけ実行などが出来る。\nspy-jsの人が作ってる","relatedLinks":[]}]},{"meta":{"title":"2015-02-02のJS: 6to5 Ver3.0、CoffeeScript 1.9.0、PhantomJS 2.0","author":"azu","layout":"post","date":"2015-02-02T11:09:00.000Z","category":"JSer","tags":["ES6","CoffeeScript","webkit"],"url":"https://jser.info/2015/02/02/6to5-coffeescript-phantomjs/"},"items":[{"category":"Headline","title":"React v0.13.0 Beta 1 | React","url":"http://facebook.github.io/react/blog/2015/01/27/react-v0.13.0-beta-1.html","tags":["React","ReleaseNote"],"content":"React 0.13 β1リリース。\nES6 ClassでReact.Componentを書けるように","relatedLinks":[]},{"category":"Headline","title":"2to3 · 6to5","url":"https://6to5.org/blog/2015/01/27/2to3","tags":["JavaScript","Tools","React"],"content":"6to5 3.0リリース。\nコマンドラインオプションに`--blacklist`と`--whitelist`の追加、パフォーマンス改善、細かいオプションの変更等。","relatedLinks":[{"title":"Name suggestions · Issue #596 · 6to5/6to5","url":"https://github.com/6to5/6to5/issues/596"}]},{"category":"Headline","title":"CoffeeScript","url":"http://coffeescript.org","tags":["CoffeeScript","ReleaseNote"],"content":"CoffeeScript 1.9.0リリース。\nES6 generatorsのサポート","relatedLinks":[]},{"category":"Headline","title":"Node v0.10.36 (Stable)","url":"http://blog.nodejs.org/2015/01/26/node-v0-10-36-stable/","tags":["node.js","ReleaseNote"],"content":"Node v0.10.36リリース。","relatedLinks":[]},{"category":"Headline","title":"Dev.Opera — Opera 27 released","url":"https://dev.opera.com/blog/opera-27/","tags":["Opera","ReleaseNote"],"content":"Opera 27(based on Chromium 40)リリース。\nminlength属性、form要素の`reportValidity()`の実装、CSP Lv2の実装、Service Workers等","relatedLinks":[]},{"category":"Headline","title":"PhantomJS 2.0 Release Notes | PhantomJS","url":"http://phantomjs.org/release-2.0.html","tags":["browser","ReleaseNote"],"content":"ヘッドレスブラウザのPhantomJS 2.0リリース。QtとWebKitのアップデート、CoffeeScriptのデフォルトサポートを廃止","relatedLinks":[]},{"category":"Article","title":"Replace CoffeeScript with ES6","url":"http://robots.thoughtbot.com/replace-coffeescript-with-es6","tags":["CoffeeScript","JavaScript"],"content":"CoffeeScriptのSyntaxをES6に書き換える方法について\n[eventualbuddha/decaffeinate](https://github.com/eventualbuddha/decaffeinate \"eventualbuddha/decaffeinate\")のようなツールではなくて、どういう対応のコードを示しながら解説している。","relatedLinks":[]},{"category":"Article","title":"New string features in ECMAScript 6","url":"http://www.2ality.com/2015/01/es6-strings.html","tags":["JavaScript","ECMAScript"],"content":"ES6で追加されるString系のメソッドについて。\nTemplate strings、ユニコードコードポイントを正しく扱う方法、追加された便利メソッドについて","relatedLinks":[]},{"category":"Article","title":"Surfin&#x27; Safari - Blog Archive » Building WebKit for iOS Simulator","url":"https://www.webkit.org/blog/3457/building-webkit-for-ios-simulator/","tags":["ios","safari"],"content":"iOSシミュレータ向けにWebKitをビルド出来るように","relatedLinks":[]},{"category":"Article","title":"Canvas 2D: New docs, Path2D objects, hit regions ✩ Mozilla Hacks – the Web developer blog","url":"http://hacks.mozilla.org/2015/01/canvas-2d-new-docs-path2d-hit-regions/","tags":["canvas"],"content":"Canvas 2Dの機能として追加されたPath2Dについて","relatedLinks":[]},{"category":"SlideVideo","title":"最近のASTパーサの動き","url":"http://azu.github.io/slide/crosushi/shift-ast.html","tags":["JavaScript","AST","スライド"],"content":"Esprima/Esprima-FB/espree、Shift AST、acorn/acorn-6to5とかのJS ASTパーサの近況についてのスライド。\nEsprimaがjQuery Foundationに移管した話についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"React.js Conf | January 28 &amp; 29 2015","url":"http://conf.reactjs.com/schedule.html","tags":["React","イベント","動画"],"content":"React.js Confの動画まとめ","relatedLinks":[]},{"category":"SlideVideo","title":"React in 7 Minutes - React Video Tutorial #free @eggheadio","url":"https://egghead.io/lessons/react-react-in-7-minutes","tags":["React","動画"],"content":"7分で分かるReact Componentのスクリーンキャスト。\nJSX、Componentのネスト、stateとprops、イベントハンドラについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"MaxArt2501/object-observe","url":"https://github.com/MaxArt2501/object-observe","tags":["JavaScript","library"],"content":"Object.observeの限定的なpolyfill","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Contracts.js","url":"http://www.contractsjs.org/","tags":["sweet.js","JavaScript"],"content":"sweet.jsを使った実行時型チェック的な機能を提供するマクロ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"is.js - micro check library","url":"http://arasatasaygin.github.io/is.js/","tags":["JavaScript","library"],"content":"`is.*`というメソッドで色々な種類の値をチェック出来るライブラリ。\n型や正規表現、環境、時間等","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Fluxible | A Pluggable Container for Isomorphic Flux Applications | Fluxible","url":"http://www.fluxible.io/","tags":["JavaScript","Flux","library"],"content":"Yahoo製のFlux実装ライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Ramda Documentation","url":"http://ramdajs.com/","tags":["JavaScript","関数型プログラミング","library"],"content":"Underscore.jsやlodashよりも関数型スタイル向けに沿った作りとする事を目的としたライブラリ。\nImmutable、副作用の排除、関数同士を組み合わせしやすいようなインターフェースにしているのが特徴。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Home | marty.js","url":"http://martyjs.org/","tags":["JavaScript","Flux","library"],"content":"Fluxアーキテクチャ実装のライブラリ。\n基本的なStore、Dispatcher、Actionがあり、追加でConstant値の作成、Storageを指定して管理出来るStateが用意されてる。\nChromeのデバッグで流れを見られるようになってる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"israelidanny/ie8linter","url":"https://github.com/israelidanny/ie8linter","tags":["IE","Tools","browser"],"content":"IE8でサポートしてないタグやCSSプロパティ等を検出するツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"douglasduteil/isparta","url":"https://github.com/douglasduteil/isparta","tags":["JavaScript","Tools"],"content":"istanbulと6to5を使ったES6のコードカバレッジツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"timoxley/pkgfiles","url":"https://github.com/timoxley/pkgfiles","tags":["npm","Tools"],"content":"npm publishでどのファイルが公開されるのかをチェック出来るツール","relatedLinks":[]}]},{"meta":{"title":"2015-02-09のJS: Node v0.12.0、Esprima 2.0、CSS Reference","author":"azu","layout":"post","date":"2015-02-09T10:38:00.000Z","category":"JSer","tags":["Node.js","AST","JavaScript","CSS","リファレンス"],"url":"https://jser.info/2015/02/09/nodejs-0.12-esprima2.0-css-reference/"},"items":[{"category":"Headline","title":"Node v0.12.0 (Stable)","url":"http://blog.nodejs.org/2015/02/06/node-v0-12-0-stable/","tags":["node.js","ReleaseNote"],"content":"Node v0.12.0リリース。\nStreams 3、maxSocketsのデフォルト値がInfinityになった、spawnSync/execSyncの追加、ECMA i18n APIのサポートなど","relatedLinks":[{"title":"StrongLoop | What’s New in io.js 1.0 Beta? – Streams3","url":"http://strongloop.com/strongblog/whats-new-io-js-beta-streams3/"},{"title":"Stream今昔物語 - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2014/12/01/155303"},{"title":"Node-v0.12の新機能について","url":"http://www.slideshare.net/shigeki_ohtsu/node-v012tng12"},{"title":"StrongLoop | Node.js v0.12 is Now Available With Improvements to Clustering and Performance","url":"http://strongloop.com/strongblog/node-js-v0-12-released/"},{"title":"Node.js v0.12 がリリースされました。 - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2015/02/07/185002"}]},{"category":"Headline","title":"io.js/CHANGELOG.md at v1.1.0 · iojs/io.js","url":"https://github.com/iojs/io.js/blob/v1.1.0/CHANGELOG.md","tags":["node.js","ReleaseNote"],"content":"io.js 1.1.0リリース。\ncryptoのパフォーマンス改善、エラーメッセージを作るときに`JSON.stringify()`だと循環参照でエラーとなるため、`util.inspect()`を使うように変更された","relatedLinks":[{"title":"DailyJS | Node 0.11.16 と io.js 1.1.0 がリリース | JSお散歩","url":"http://panda.node.ws/?p=2152"},{"title":"assert: use util.inspect() to create error messages by cjihrig · Pull Request #668 · iojs/io.js","url":"https://github.com/iojs/io.js/pull/668"},{"title":"iojs-jp/2015-02-06.md at master · iojs/iojs-jp","url":"https://github.com/iojs/iojs-jp/blob/master/weekly/2015-02-06.md"}]},{"category":"Headline","title":"Scala.js no longer experimental | The Scala Programming Language","url":"http://scala-lang.org/news/2015/02/05/scala-js-no-longer-experimental.html","tags":["scala","JavaScript"],"content":"Scala.js v0.6.0リリース","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember.js 1.10.0 and 1.11 Beta Released","url":"http://emberjs.com/blog/2015/02/07/ember-1-10-0-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember.js 1.10.0と1.11βリリース。\n1.10でHTMLBarsをテンプレートエンジンとして利用するようになった","relatedLinks":[]},{"category":"Headline","title":"Releases · google/closure-compiler Wiki","url":"https://github.com/google/closure-compiler/wiki/Releases#february-2-2015-v20150126","tags":["JavaScript","ReleaseNote"],"content":"closure-compiler v20150126リリース。\nTypeScript的な型アノテーションのサポートを開始、ES6のサポート改善","relatedLinks":[]},{"category":"Headline","title":"Release 0.11.5 · yyx990803/vue","url":"https://github.com/yyx990803/vue/releases/tag/0.11.5","tags":["JavaScript","library","ReleaseNote"],"content":"Vue.js 0.11.5リリース。\n`Vue.nextTick`でMutationObserverが使える時は使うように、`v-with`で親子間でバインディングが働くように","relatedLinks":[]},{"category":"Headline","title":"ESLint 0.14.0 released - ESLint","url":"http://eslint.org/blog/2015/02/eslint-0.14.0-released/","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 0.14.0リリース。\nArrow Functionのサポート、インデントルールの追加(JSCSからのポート)","relatedLinks":[]},{"category":"Headline","title":"WebStorm 10 EAP | JetBrains WebStorm Blog","url":"http://blog.jetbrains.com/webstorm/2015/02/webstorm-10-eap/","tags":["WebStorm","ReleaseNote"],"content":"WebStorm 10 EAPリリース。\nJavaScriptサポートの改善、spy-jsが多段SourceMapに対応しAltJSなどでも元ソースへジャンプできるように、Firefoxでのデバッグに再対応","relatedLinks":[]},{"category":"Headline","title":"flow/Changelog at v0.2.0 · facebook/flow","url":"https://github.com/facebook/flow/blob/v0.2.0/Changelog","tags":["JavaScript","Tools","ReleaseNote"],"content":"Flow v0.2.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Esprima 2.0 Released | Official jQuery Blog","url":"http://blog.jquery.com/2015/02/06/esprima-2-0-released/","tags":["JavaScript","AST","library","ReleaseNote"],"content":"jQuery Fundationに移管したEsprimaのVer 2.0がリリース。\n\"harmony\"ブランチをマージしたリリースとなりES6の機能を多く含んでいる。\nまた、IssueのメインがGoogle CodeからGitHubへ移行した。","relatedLinks":[{"title":"最近のASTパーサの動き","url":"http://azu.github.io/slide/crosushi/shift-ast.html"}]},{"category":"Headline","title":"harmony:specification_drafts [ES Wiki]","url":"http://wiki.ecmascript.org/doku.php?id=harmony:specification_drafts#february_2_2015_draft_rev_32","tags":["ECMAScript","spec","ReleaseNote"],"content":"ES6 Draft Rev 32リリース。\nclass syntax周りの記述の更新が中心。\nclassで定義されたmethodがnon-enumerableに変更。","relatedLinks":[]},{"category":"Article","title":"Google SoundScript: faster OOP for JavaScript","url":"http://www.2ality.com/2015/02/soundscript.html","tags":["JavaScript","google","AngularJS"],"content":"JavaScriptエンジンのHidden class等の典型的な最適化とSoundScriptについて。\nSoundScriptは最適化が効きやすいようなstrict modeの拡張的な話","relatedLinks":[]},{"category":"Article","title":"ES6時代のJavaScript - クックパッド開発者ブログ","url":"http://techlife.cookpad.com/entry/2015/02/02/094607","tags":["ECMAScript","JavaScript"],"content":"ES6で入る機能や構文の一部を紹介する記事。\n具体的にどういう目的で使うかについて書かれてる。","relatedLinks":[]},{"category":"Article","title":"Variables and scoping in ECMAScript 6","url":"http://www.2ality.com/2015/02/es6-scoping.html","tags":["ECMAScript","JavaScript"],"content":"letやconstのスコープやconstでのimmutableデータの扱いについて。\nconstとObject.freeze、TDZ、デフォルトパラメータとスコープ、グローバル空間でのvar/functionとlet/const/classの違いについて","relatedLinks":[]},{"category":"Article","title":"Temporal Dead Zone (TDZ) demystified - ES6 Rocks","url":"http://es6rocks.com/2015/01/temporal-dead-zone-tdz-demystified/","tags":["JavaScript","ECMAScript"],"content":"ES6のTDZ(Temporal Dead Zone)について。\nES6では`let`によりlexical scopeが増えた、また`var`と違い変数宣言は巻き上げされないため、宣言より前方などには変数にアクセスできない領域(TDZ)が存在する事について","relatedLinks":[]},{"category":"Article","title":"Tech — Switching from immutable.js to seamless-immutable","url":"http://noredinktech.tumblr.com/post/107617838018/switching-from-immutable-js-to-seamless-immutable","tags":["JavaScript","library"],"content":"immutable.jsは専用のオブジェクトになるため、既存のライブラリと連携がしにくい、またAPIも独特。\nその辺を扱いやすく使えるseamless-immutableというライブラリについて","relatedLinks":[{"title":"rtfeldman/seamless-immutable","url":"https://github.com/rtfeldman/seamless-immutable#asmutable"}]},{"category":"Article","title":"BroadcastChannel API in Firefox 38 ✩ Mozilla Hacks – the Web developer blog","url":"http://hacks.mozilla.org/2015/02/broadcastchannel-api-in-firefox-38/","tags":["JavaScript","WebPlatformAPI"],"content":"BroadcastChannelについて。\nタブやウィンドウをまたぎsame origin間でメッセージングでやり取りするAPI。","relatedLinks":[]},{"category":"Article","title":"Measuring Client-side JavaScript Test Coverage With Istanbul | Quick Left","url":"https://quickleft.com/blog/measuring-clientside-javascript-test-coverage-istanbul/","tags":["JavaScript"],"content":"mocha-phantomjs + istanbulでコードカバレッジを取る方法について","relatedLinks":[]},{"category":"Article","title":"Muscula/json-schema-benchmark","url":"https://github.com/Muscula/json-schema-benchmark","tags":["node.js","JavaScript","JSON","benchmark"],"content":"JSONスキーマバリデーターのベンチマーク比較。","relatedLinks":[]},{"category":"SlideVideo","title":"VOYAGE GROUP　エンジニアブログ : 今、クライアントサイドのJavaScriptを書く前に知っておきたいこと ~ 2014年トレンド総まとめ","url":"http://tech.voyagegroup.com/archives/8046369.html","tags":["JavaScript","スライド"],"content":"2014年のJavaScriptのパラダイムの変化についてまとめられたスライド。\nAltJSとES6、非同期処理、モジュールパッケージ管理とビルドツール、テスト、ライブラリについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"CSS Reference | Codrops","url":"http://tympanus.net/codrops/css_reference/","tags":["CSS","リファレンス"],"content":"CSSのリファレンスサイト。\n擬似クラスやプロパティ、Flexboxといったコンセプトや@mediaなどのruleなどそれぞれ詳しく書かれていて網羅的","relatedLinks":[{"title":"I Wrote A CSS ","url":"http://sarasoueidan.com/blog/codrops-css-reference/"},{"title":"codrops/css-reference-issues","url":"https://github.com/codrops/css-reference-issues"}]},{"category":"WebsiteDocument","title":"Try Flow online — Typechecker for Javascript by Facebook","url":"https://tryflow.org/","tags":["flowtype","JavaScript","editor"],"content":"Flowによる型チェックをオンラインで試せるサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"NativeScript for Cross-Platform Native App Development with JavaScript","url":"http://www.telerik.com/nativescript","tags":["JavaScript","mobile","app"],"content":"JavaScript + CSS + XMLを使ったクロスプラットフォームなモバイルアプリを開発できるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jareware/flotate","url":"https://github.com/jareware/flotate","tags":["JavaScript","flowtype","Tools"],"content":"FlowTypeの型アノテーションをコメントで書けるようにするツールとライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"CSS polyfills from the future | GSS","url":"http://gridstylesheets.org/","tags":["CSS"],"content":"CSSのGrid Layoutを扱うCSS preprocessor。CocoaのAutoLayoutのVisual Format LanguageみたいなVisual Grid Languageを持ちGridを扱う。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"js-data/js-data","url":"https://github.com/js-data/js-data","tags":["JavaScript","library"],"content":"データストア部分をadapterで変更出来るモデルライブラリ。\nobserve-jsを使ってdirtyチェックをするため、特別なgetter/settterなしでバインディングを行える。\nEmber DataのようなREST APIをバックエンドとするhttp adapterも持っている。","relatedLinks":[{"title":"Polymer/observe-js","url":"https://github.com/Polymer/observe-js"}]},{"category":"SoftwareLibrary","title":"voronianski/flux-comparison","url":"https://github.com/voronianski/flux-comparison","tags":["Flux","library","サンプル"],"content":"FluxライブラリのTodoMVCみたいな感じのサンプル実装集。\nオンラインショップカートをサンプルケースとして実装されてる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jquense/react-widgets","url":"https://github.com/jquense/react-widgets","tags":["React","UI","library"],"content":"Reactを使ったUI widgets。\nカレンダーやドロップダウンリスト等のUIコンポーネント集","relatedLinks":[]},{"category":"Book","title":"Make: JavaScript Robotics - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920031390.do","tags":["JavaScript","ハードウェア","book"],"content":"JavaScriptとハードウェアの組み合わせについての書籍","relatedLinks":[{"title":"NodeBots - The Rise of JS Robotics","url":"http://nodebots.io/"}]}]},{"meta":{"title":"2015-02-17のJS: Babel(6to5)、BrowserSync 2.0、Flux実装比較","author":"azu","layout":"post","date":"2015-02-16T15:00:00.000Z","category":"JSer","tags":["Tools","ES6","Flux","library"],"url":"https://jser.info/2015/02/17/6to5-to-babel-browsersync-flux/"},"items":[{"category":"Headline","title":"Release v1.11.0 · jscs-dev/node-jscs","url":"https://github.com/jscs-dev/node-jscs/releases/tag/v1.11.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"jscs v1.11.0リリース。\n既存のファイルの用意されてるプリセットでチェックして、自動で設定ファイルを作成出来る`--auto-configure`のオプションの追加、ルールの追加修正など。","relatedLinks":[]},{"category":"Headline","title":"jQuery UI 1.11.3 | jQuery UI Blog","url":"http://blog.jqueryui.com/2015/02/jquery-ui-1-11-3/","tags":["jQuery","UI","ReleaseNote"],"content":"jQuery UI 1.11.3リリース。","relatedLinks":[]},{"category":"Headline","title":"Changelog · lodash/lodash Wiki","url":"https://github.com/lodash/lodash/wiki/Changelog#v320","tags":["JavaScript","library","ReleaseNote"],"content":"lodash v3.2.0リリース。\n`_.fill`や`_.spread`等の追加、lazyサポートの修正や対応メソッドの追加","relatedLinks":[]},{"category":"Headline","title":"BrowserSync 2.0 - JH","url":"http://www.wearejh.com/news/browsersync-2-0/","tags":["JavaScript","browser","debug","Tools","ReleaseNote"],"content":"LiveReloadなどが入った開発用サーバであるBrowserSync 2.0リリース。\nデバッグのUI画面が追加され、履歴、接続してる端末一覧、CSSでデバッグ用にアウトライン表示などの機能が追加されている","relatedLinks":[]},{"category":"Headline","title":"Download RequireJS","url":"http://requirejs.org/docs/download.html#2-1-16","tags":["JavaScript","AMD","library","ReleaseNote"],"content":"RequireJS 2.1.16リリース。\n依存関係のパースをするのにEsprima 2.0を使うように、r.jsがNashornをサポート、UMDサポートのアップデート","relatedLinks":[]},{"category":"Headline","title":"Release Pure 0.6.0-rc-1 – New Pure Menus · yahoo/pure","url":"https://github.com/yahoo/pure/releases/tag/v0.6.0-rc-1","tags":["CSS","ReleaseNote"],"content":"Pure 0.6.0-rc-1リリース。\nMenusの書き直し、Normalizeのアップデート(IE 7以下はサポート廃止)など","relatedLinks":[]},{"category":"Headline","title":"js2coffee/New_in_2.0.md at master · js2coffee/js2coffee","url":"https://github.com/js2coffee/js2coffee/blob/master/notes/New_in_2.0.md","tags":["JavaScript","CoffeeScript","ReleaseNote"],"content":"JavaScriptをCoffeeScriptに変換するJs2coffee 2.0リリース。\nエディタや警告の表示、ASTの表示、SourceMap対応など","relatedLinks":[]},{"category":"Headline","title":"harmony:specification_drafts [ES Wiki]","url":"http://wiki.ecmascript.org/doku.php?id=harmony:specification_drafts","tags":["ECMAScript","ReleaseNote"],"content":"ECMAScript 2015 (ES6)  Draft Rev 33リリース。\n`super()`に関する制約の記述の追加、module周りのリファクタリング","relatedLinks":[]},{"category":"Article","title":"Not Born to Die · Babel","url":"https://babeljs.io/blog/2015/02/15/not-born-to-die","tags":["JavaScript","Tools"],"content":"6to5が\"Babel\"にリネームされた。\n多くのツールがparsersとtranspilersに依存しているため、Babelプロジェクトではこの部分を解決していく。\nESTreeというASTの仕様の標準化作業にも協力していくとのこと","relatedLinks":[{"title":"Project scope and future · Issue #568 · babel/babel","url":"https://github.com/babel/babel/issues/568"},{"title":"estree/estree","url":"https://github.com/estree/estree"},{"title":"Name suggestions · Issue #596 · babel/babel","url":"https://github.com/babel/babel/issues/596"}]},{"category":"Article","title":"estree/estree · GitHub","url":"https://github.com/estree/estree","tags":["ECMAScript","JavaScript","AST"],"content":"SpiderMonkey Parser APIのASTのドキュメントがGitHubに移行し、ES6についてのドキュメント化が開始された。\n現行の多くのツールがこれに依存していて、明文化されてないASTについてを仕様に落とすのが目的。","relatedLinks":[]},{"category":"Article","title":"JSCS in use","url":"http://varya.me/en/posts/jscs-in-use/","tags":["JavaScript","Tools"],"content":"JavaScriptのコードスタイルチェックツールであるJSCSの使い方について","relatedLinks":[{"title":"JavaScript CodeStyle. Automatically!","url":"http://varya.me/jscs-talk/"},{"title":"JSCS: JavaScript Code Style — Frontend Babel","url":"http://frontendbabel.info/articles/jscs-javascript-code-style/"}]},{"category":"Article","title":"Extensible Web を支える低レベル API 群 - Block Rockin’ Codes","url":"http://jxck.hatenablog.com/entry/extensible-lowlevel-api","tags":["JavaScript","WebPlatformAPI"],"content":"現在策定や実装が進んでいる低レベルなAPIとしてどのようなものがあるかについてのまとめ","relatedLinks":[{"title":"Extensible web","url":"http://www.slideshare.net/Jxck/extensible-web"}]},{"category":"Article","title":"Change Detection in Angular 2 | Victor Savkin","url":"http://victorsavkin.com/post/110170125256/change-detection-in-angular-2","tags":["AngularJS","アルゴリズム"],"content":"Angular 2の変更検知の仕組みについての解説。\n基本的にはComponentツリーを上から走査して変更を検知するが、Reactの`shouldComponentUpdate()`のように子への探索を減らす仕組みが導入されている","relatedLinks":[{"title":"リアルな DOM はなぜ遅いのか - steps to phantasien","url":"http://steps.dodgson.org/b/2014/12/11/why-is-real-dom-slow/"}]},{"category":"Article","title":"Year in review: Spidermonkey part 1 | H4writer","url":"http://h4writer.com/?p=14","tags":["firefox","歴史"],"content":"2014年のFirefoxに入ったAPI、機能や改善点等の振り返り","relatedLinks":[{"title":"Year in review: Spidermonkey in 2014 part 2 | H4writer","url":"http://h4writer.com/?p=40"}]},{"category":"Article","title":"TouchDevelop - TouchDevelop goes open-source","url":"https://www.touchdevelop.com/blog/touchdevelopgoesopensource","tags":["JavaScript","TypeScript","MS","オープンソース"],"content":"タッチ操作でアプリを開発出来るウェブアプリである TouchDevelopがオープンソースとして公開された。\nTypeScriptで書かれている","relatedLinks":[{"title":"TouchDevelop","url":"https://github.com/Microsoft/TouchDevelop"}]},{"category":"Article","title":"A Guide To ES6 Classes - I Like Kill Nerds","url":"http://ilikekillnerds.com/2015/02/a-guide-to-es6-classes/","tags":["JavaScript","ECMAScript"],"content":"ES6 Classesについて。\nES5ではどのように\"クラス\"を書いてたかと、ES6ではどのように書けるかについて。\n継承や`super()`についても触れている","relatedLinks":[]},{"category":"Article","title":"Flux solutions compared by example - Pixelhunter.me | Dmitri Voronianski&#x27;s blog","url":"http://pixelhunter.me/post/110248593059/flux-solutions-compared-by-example","tags":["Flux","サンプル","JavaScript"],"content":"Flux実装のライブラリは多種多様で、小さなサンプルをそれぞれのライブラリを使って分かった事について。\n通信でデータ取得はどこですべきか、\nIsomorphicとシングルトン、ComponentをラップしたContainerのレイヤーを設ける事についてなど","relatedLinks":[]},{"category":"Article","title":"60fps on the mobile web — Flipboard Engineering","url":"http://engineering.flipboard.com/2015/02/mobile-web/","tags":["JavaScript","canvas","React","DOM"],"content":"React Canvasについて。\ncanvas要素でUIを作ることで60FPSのスクロールを実現する。\n宣言的にUIを作れるためDOM的な抽象レイヤーとしてReactを使い、内部的にCanvasでレンダリングするReact Canvasを開発した話","relatedLinks":[{"title":"Flipboard/react-canvas","url":"https://github.com/flipboard/react-canvas"},{"title":"Flipboard – React Canvas Accessibility | The Paciello Group – Your Accessibility Partner (WCAG 2.0/508 audits, VPAT, usability and accessible user experience)","url":"http://www.paciellogroup.com/blog/2015/02/flipboard-react-canvas-accessibility/"}]},{"category":"Article","title":"maxogden/maintenance-modules","url":"https://github.com/maxogden/maintenance-modules","tags":["JavaScript","npm","Tools"],"content":"npmでモジュールを公開するのを補助する色々なツールの紹介。\nTravis CIの設定、gh-pagesへのデプロイスクリプト、package.jsonの整形、npm release、依存パッケージのチェックなど","relatedLinks":[]},{"category":"Article","title":"Detect JavaScript Problems with ESLint","url":"http://davidwalsh.name/eslint","tags":["JavaScript","Tools"],"content":"ESLintを使ったJavaScriptのLintについて。\nオプションの設定方法","relatedLinks":[]},{"category":"SlideVideo","title":"ES6 at PayPal","url":"http://www.slideshare.net/JamundFerguson/es6-at-paypal","tags":["ECMAScript","JavaScript","スライド"],"content":"ES6を使ってみようという感じのスライド","relatedLinks":[]},{"category":"SlideVideo","title":"Asynchronous Programming: The End of The Loop - Video Tutorial Series @eggheadio","url":"https://egghead.io/series/mastering-asynchronous-programming-the-end-of-the-loop","tags":["JavaScript","動画"],"content":"NetflixのJafar HusainさんによるJavaScriptの非同期プログラミングについてのスクリーンキャスト。\n聞きやすくて、分かりやすくて、書き起こしもある","relatedLinks":[]},{"category":"SlideVideo","title":"Tagtree course: Expert ES6","url":"http://tagtree.io/courses/expert-es6/","tags":["JavaScript","ECMAScript","tutorial"],"content":"ES6について学べる講座。\nES6の新しい機能についての解説と練習問題を解いて学べる","relatedLinks":[]},{"category":"SlideVideo","title":"nodefest 2014 - YouTube","url":"https://www.youtube.com/playlist?list=PL42hYWKFRfN689rx3pVReAkYjs2F05Kum","tags":["node.js","イベント","動画"],"content":"東京Node学園祭2014 http://nodefest.jp/2014/ の動画が公開された","relatedLinks":[]},{"category":"WebsiteDocument","title":"npm/how-to-npm","url":"https://github.com/npm/how-to-npm","tags":["node.js","npm","tutorial"],"content":"npmについてコマンドラインで学べるインタラクティブな教材","relatedLinks":[]},{"category":"WebsiteDocument","title":"css2scss - from css to scss","url":"http://sebastianpontow.de/css2compass","tags":["CSS","Sass","webservice"],"content":"CSSからSCSSの機能を使ったものを変換したり、色見本を作ってくれるサービス。","relatedLinks":[{"title":"汚いcssを整形するWebアプリ「css2scss」でリファクタリングした際、「ヤバい」と感じた３つの機能と３つの点 - Qiita","url":"http://qiita.com/koh-taka@github/items/bf638dd64c7c09e93557"}]},{"category":"SoftwareLibrary","title":"wooorm/eslint-md","url":"https://github.com/wooorm/eslint-md","tags":["JavaScript","Markdown","Tools"],"content":"Markdownの中にあるCodeBlockのJavaScriptをESLintでチェックできるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Phoenixmatrix/phoenixmatrix-proxy","url":"https://github.com/Phoenixmatrix/phoenixmatrix-proxy","tags":["node-webkit","proxy","app"],"content":"node-webkit(nw.js)で書かれたプロキシアプリ。\nSSLにもCharlesみたいに証明書を使ってプロキシ出来る。Fiddlerとかみたいにスクリプタブルなデバッグプロキシとなるのが目的","relatedLinks":[]},{"category":"SoftwareLibrary","title":"wix/react-templates","url":"https://github.com/wix/react-templates","tags":["React","template","library"],"content":"ReactのJSXへ変換できるテンプレートとコンパイラ。\nJetBrains IDEで動くプラグインが用意されている\nhttps://github.com/idok/react-templates-plugin","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Flipboard/react-canvas","url":"https://github.com/flipboard/react-canvas","tags":["React","canvas","library"],"content":"CanvasのレンダリングをするReact components。\n基本的な要素、Events、Text sizing、css-layout(パフォーマンス優先なのでなくなるかも?)、Accessibilityへの配慮が予定されてる","relatedLinks":[{"title":"60fps on the mobile web — Flipboard Engineering","url":"http://engineering.flipboard.com/2015/02/mobile-web/"}]},{"category":"SoftwareLibrary","title":"Reapp - Hybrid apps, fast","url":"http://reapp.io/","tags":["React","mobile","library"],"content":"ReactベースのモバイルUIフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"maxogden/wzrd","url":"https://github.com/maxogden/wzrd","tags":["JavaScript","browserify","debug","library"],"content":"beefyみたいなBrowserifyを使ったローカルサーバを立てるコマンドラインツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"typicode/jsop","url":"https://github.com/typicode/jsop","tags":["node.js","library"],"content":"Object.observeを使って読み込んだJSONを書き換えたら自動的に保存するNode.jsモジュール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"acdlite/flummox","url":"https://github.com/acdlite/flummox","tags":["Flux","JavaScript","library"],"content":"Flux実装ライブラリ。\nコアとなるFlummoxクラスを継承して、そこにStoreとActionを登録することでシングルトンを避ける作りになっている。ES6 Classesやasync/awaitを使った書き方等が考慮されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"fdecampredon/jsx-typescript","url":"https://github.com/fdecampredon/jsx-typescript","tags":["TypeScript","React"],"content":"TypeScript + React(JSX)なTypeScript fork.","relatedLinks":[]},{"category":"Book","title":"Exploring ES6: Upgrade to the next version of JavaScript","url":"http://exploringjs.com/","tags":["ECMAScript","JavaScript","book"],"content":"Speaking JavaScriptの著者でもあるDr. AxelによるES6についての書籍","relatedLinks":[{"title":"First details of my upcoming book on ES6","url":"http://www.2ality.com/2015/02/es6-book.html"}]}]},{"meta":{"title":"2015-02-23のJS: Underscore.js 1.8.0、CodeMirror 5.0、Web Audio入門","author":"azu","layout":"post","date":"2015-02-23T13:21:00.000Z","category":"JSer","tags":["JavaScript","library","Editor","WebAudio"],"url":"https://jser.info/2015/02/23/underscore1.8-codemirror5.0-web-audio-api/"},"items":[{"category":"Headline","title":"Underscore.js","url":"http://underscorejs.org/","tags":["JavaScript","library"],"content":"Underscore.js 1.8.0(現在1.8.2まで出てる)リリース。\nファイルサイズの削減、エイリアスとして使われていたメソッド名を一部変更、削除などのBreaking Changeを含んでいる。\n詳しくは下記のIssueを参照。\n1.8.0はIE8との互換性がないので、1.8.1と1.8.2で互換性の修正が行われている。","relatedLinks":[{"title":"Discuss latest changes to master before releasing · Issue #2061 · jashkenas/underscore","url":"https://github.com/jashkenas/underscore/issues/2061"}]},{"category":"Headline","title":"ESLint 0.15.0 released - ESLint","url":"http://eslint.org/blog/2015/02/eslint-0.15.0-released/","tags":["JavaScript","ECMAScript","Tools"],"content":"ESLint 0.15.0リリース。\nSpread operator、Rest parameters、Destructuringのサポート。\nES6についてはESTreeでASTの仕様の議論をしてるので、それに従う形で実装を進めて行く","relatedLinks":[{"title":"estree/estree","url":"https://github.com/estree/estree/"}]},{"category":"Headline","title":"node-browserify/changelog.markdown at 9.0.3 · substack/node-browserify","url":"https://github.com/substack/node-browserify/blob/9.0.3/changelog.markdown","tags":["browserify","ReleaseNote"],"content":"Browserify 9.0.0リリース。\numd 3.0.0へのアップデート。`$`や`_`もモジュール名として利用できるようになったため`--standalone $foo_bar`のような指定をした時の挙動がBreaking Changeとなる","relatedLinks":[{"title":"umd/HISTORY.md at 3.0.0 · ForbesLindesay/umd","url":"https://github.com/ForbesLindesay/umd/blob/3.0.0/HISTORY.md"}]},{"category":"Headline","title":"jsdom/Changelog.md at 4.0.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/4.0.0/Changelog.md","tags":["JavaScript","DOM","library"],"content":"jsdom 4.0.0リリース。\nio.jsの新しいvmモジュールに依存するため、4.xはio.jsでの動作のみで、Node.jsの場合は3.xを使うように推奨されてる。","relatedLinks":[]},{"category":"Headline","title":"Wallaby.js hits version 1.0 · Artem Govorov","url":"http://dm.gl/2015/02/23/wallaby-version-one/","tags":["WebStorm","plugin","testing"],"content":"JetBrains IDEのpluginとして動作するテストフレームワークwallaby.js 1.0リリース。\n今後は他のエディタサポートやAPIの公開、AltJSのサポートなどを予定している。","relatedLinks":[]},{"category":"Headline","title":"New releases 4.13 and 5.0 - discuss.CodeMirror","url":"http://discuss.codemirror.net/t/new-releases-4-13-and-5-0/163","tags":["JavaScript","library","ReleaseNote"],"content":"CodeMirror 4.13と5.0リリース。\n5.0ではcontentEditableを使ったモバイルブラウザのサポートが追加されてる","relatedLinks":[]},{"category":"Headline","title":"Knockout.js 3.3 Released - Knock Me Out","url":"http://www.knockmeout.net/2015/02/knockout-3-3-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Knockout.js 3.3リリース。\nComponentsの値を変更した時のレンダリングを同期か非同期の設定が可能に、`$component`の追加、computesが\"awake\"と\"sleep\"のイベントを通知するように","relatedLinks":[{"title":"Release Version 3.3.0 · knockout/knockout","url":"https://github.com/knockout/knockout/releases/tag/v3.3.0"}]},{"category":"Headline","title":"rev9-ecma-402-draft-now-available","url":"https://esdiscuss.org/topic/rev9-ecma-402-draft-now-available","tags":["ecma","spec","i18n"],"content":"ECMA-402(ECMA i18n API) 2.0ドラフト Rev 9リリース","relatedLinks":[]},{"category":"Headline","title":"harmony:specification_drafts [ES Wiki]","url":"http://wiki.ecmascript.org/doku.php?id=harmony:specification_drafts#february_20_2015_rev_34_release_candidate_1","tags":["ECMAScript","spec","ReleaseNote"],"content":"ES6 Draft RC1リリース(Rev 34)","relatedLinks":[]},{"category":"Headline","title":"Release 0.7.0 · airportyh/testem","url":"https://github.com/airportyh/testem/releases/tag/v0.7.0","tags":["JavaScript","testing","ReleaseNote"],"content":"testem 0.7.0リリース。\nio.jsやNode.js 0.12のサポート、Windowsでもci-modeが動くように修正、実行ページをよりisolateに","relatedLinks":[]},{"category":"Article","title":"Flow | Flow Comments","url":"http://flowtype.org/blog/2015/02/20/Flow-Comments.html","tags":["flowtype","Tools","ReleaseNote"],"content":"Flow 0.4.0でコメントによる型指定が追加された。\nhttps://github.com/jareware/flotate のプロジェクトのシンタックスがマージされた形","relatedLinks":[]},{"category":"Article","title":"Classes in ECMAScript 6 (final semantics)","url":"http://www.2ality.com/2015/02/es6-classes-final.html","tags":["JavaScript","ECMAScript"],"content":"ES6 Classesについての詳しい解説。\nClassの挙動、使い方、Iterator、継承、`super()`、`new.target`の値、ES5では無理だったビルトインコンストラクタのサブクラスが可能になる点などについて","relatedLinks":[]},{"category":"Article","title":"音を扱うJavaScriptライブラリや記事 - Qiita","url":"http://qiita.com/mohayonao/items/d79e9fc56b4e9c157be1","tags":["JavaScript","audio","library","まとめ"],"content":"Web Audio API関連のライブラリやpolyfill、fallback実装などのリソースまとめ","relatedLinks":[]},{"category":"Article","title":"React Tips and Best Practices - ÆFLASH","url":"http://aeflash.com/2015-02/react-tips-and-best-practices.html","tags":["JavaScript","React","Tips"],"content":"ReactのTips。\n`shouldComponentUpdate`とMixin、propTypesとプロダクション、component内のstateを避けて全体のデータフローを一方通行にする話など","relatedLinks":[]},{"category":"Article","title":"The npm Blog — Welcome, jQuery developers!","url":"http://blog.npmjs.org/post/111385956875/welcome-jquery-developers","tags":["jQuery","npm"],"content":"jQuery plugin registryはread onlyモードとなり、pluginの公開にnpmを推奨してるのを受けて、jQuery pluginをnpmで公開する方法についてのサポートをしていくとの事","relatedLinks":[{"title":"【翻訳】Welcome, jQuery developers! — Medium","url":"https://medium.com/@watilde/%E7%BF%BB%E8%A8%B3-welcome-jquery-developers-3ae0075c19f6"},{"title":"【翻訳】Publishing your jQuery plugin to npm, the quick and dirty way — Medium","url":"https://medium.com/@watilde/%E7%BF%BB%E8%A8%B3-publishing-your-jquery-plugin-to-npm-the-quick-and-dirty-way-8487344e2b3f"}]},{"category":"Article","title":"JSX - ESLintについての細かいあれこれ - Qiita","url":"http://qiita.com/suisho/items/8610d3806a3f94d7d1d0","tags":["JavaScript","Tools"],"content":"ESLintの設定について","relatedLinks":[]},{"category":"Article","title":"JavaScript - ぼくのかんがえたさいきょうのES6プロジェクトテンプレート - Qiita","url":"http://qiita.com/mohayonao/items/9b0655b8b4979bffda31","tags":["JavaScript","ECMAScript"],"content":"ES6でのプロジェクト構成について。\nビルド、npm run-script、Browserify、テスト、Lint、コードカバレッジなどの設定について","relatedLinks":[]},{"category":"SlideVideo","title":"HTML5で音を扱う3つの方法","url":"http://150217-html5sound.fnobi.com/","tags":["HTML","audio","API","スライド"],"content":"Audioタグ、Web Audio API、MediaStream Processing APIについてのスライド。\nそれぞれがどのような用途や機能を持っているかについて書かれている","relatedLinks":[]},{"category":"SlideVideo","title":"Reactive Programming in JavaScript","url":"http://ahomu.github.io/s/150221-frontrend_conference/index.html#1","tags":["JavaScript","program","スライド"],"content":"Reactiveプログラミングについてのスライド。\"Reactive = 片方の変化を他方に自動で伝播する仕組み\"\nActor、FRP等Reactiveは色々あるがFRPについて詳しく書かれている。\nRxJSやBacon.jsを使ったサンプルについて","relatedLinks":[{"title":"Reactive Programming in JavaScript - Frontrend Final Conference 資料 ::ハブろぐ","url":"http://havelog.ayumusato.com/develop/javascript/e657-reactive_programming_in_javascript.html"}]},{"category":"SlideVideo","title":"Introduction to Service Worker // Speaker Deck","url":"https://speakerdeck.com/1000ch/introduction-to-service-worker","tags":["JavaScript","browser","スライド"],"content":"オフラインを実現するために関連するAPI、主にService Workerについてのスライド。\nCache API、Push APIについて解説されている。","relatedLinks":[]},{"category":"SlideVideo","title":"Introduction To React // Speaker Deck","url":"https://speakerdeck.com/hokaccha/introduction-to-react","tags":["JavaScript","React","スライド"],"content":"既存のDOMの再描画の流れとReactでのUI再描画の仕組みの違いについて。\n再描画のコストの違いや設計への影響、Fluxアーキテクチャへの流れが分かりやすく書かれているスライド","relatedLinks":[]},{"category":"WebsiteDocument","title":"Eric Elliott’s essential JavaScript links or The way of the parrot, not · Super-Script","url":"http://super-script.us/2015/essential-js-links.html","tags":["JavaScript","まとめ","links"],"content":"JavaScriptについてのリソースリンク集。\nスクリーンショット付きで紹介してる","relatedLinks":[]},{"category":"WebsiteDocument","title":"mking/react-hn","url":"https://github.com/mking/react-hn","tags":["React","サンプル","tutorial"],"content":"Reactを使ったHackerNewsのクローン。\nどういうComponentの粒度になってるかや構造についての解説が書かれている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mzabriskie/axios","url":"https://github.com/mzabriskie/axios","tags":["JavaScript","library","XHR"],"content":"Node.js/ブラウザどちらでも動くPromiseベースのHTTPリクエストライブラリ。\nリクエスト/レスポンスに対してコールバックを呼ばれる前に処理を挟んだりすることも出来る","relatedLinks":[]},{"category":"SoftwareLibrary","title":"yahoo/preceptor","url":"https://github.com/yahoo/preceptor","tags":["JavaScript","browser","testing","library"],"content":"Mocha、Cucumberなどに対応したTest Runner。\n設定によりレポーターやテスト対象などを細かく設定することができ、何をテストするかはTaskという塊で定義でき、Taskを並列で動かすこともできる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"yahoo/kobold","url":"https://github.com/yahoo/kobold","tags":["JavaScript","browserify","testing"],"content":"スクリーンショットを比較して視覚的なレグレッションがないかをテストするコマンドラインツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"hughsk/disc","url":"https://github.com/hughsk/disc","tags":["JavaScript","browserify","Tools","gurai"],"content":"Browserifyでビルドしたコードから、ディレクトリ別(モジュール別)でファイルサイズやファイル数をグラフで可視化してくれるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gabelerner/canvg","url":"https://github.com/gabelerner/canvg","tags":["JavaScript","SVG","canvas"],"content":"SVGをCanvasでレンダリングするライブラリ","relatedLinks":[]},{"category":"Book","title":"Amazon: コーディングWebアクセシビリティ - WAI-ARIAで実現するマルチデバイス環境のWebアプリケーション: ヘイドン・ピカリング, Heydon Pickering, 伊原力也, 太田良典, 株式会社Bスプラウト","url":"http://www.amazon.co.jp/dp/4862462669?tag=amazon0abac-22","tags":["WAI-ARIA","book","翻訳"],"content":"2015年3月30日発売\n\"Apps For All - Coding Accessible Web Applications\"の日本語版","relatedLinks":[]},{"category":"Book","title":"The Pragmatic Bookshelf | CoffeeScript","url":"https://pragprog.com/book/tbcoffee2/coffeescript","tags":["CoffeeScript","book"],"content":"CoffeeScriptについての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-03-02のJS: Firefox 36.0、ASTのコミュニティ標準、Service Worker","author":"azu","layout":"post","date":"2015-03-02T13:32:00.000Z","category":"JSer","tags":["JavaScript","Firefox","AST","ServiceWorker"],"url":"https://jser.info/2015/03/02/firefox36-ast-serviceworker/"},"items":[{"category":"Headline","title":"ESLint 0.15.1 released - ESLint","url":"http://eslint.org/blog/2015/02/eslint-0.15.1-released/","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 0.15.1リリース","relatedLinks":[]},{"category":"Headline","title":"New AngularJS Releases 1.4.0-beta.5 and 1.3.14","url":"http://angularjs.blogspot.com/2015/02/new-angularjs-releases-140-beta5-and.html","tags":["AngularJS","ReleaseNote"],"content":"AngularJS 1.4.0-betaと1.3.14リリース。\nCommonJS supportの改善","relatedLinks":[]},{"category":"Headline","title":"Firefox — Notes (36.0) — Mozilla","url":"https://www.mozilla.org/en-US/firefox/36.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 36.0リリース。\nHTTP/2のフルサポート、ES6 Symbolサポート、CSSの`object-fit`と`object-position`、`will-change`、`isolation`の実装、Promiseオブジェクトのデバッグ対応など","relatedLinks":[{"title":"Firefox 36 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/36"}]},{"category":"Headline","title":"React v0.13 RC | React","url":"http://facebook.github.io/react/blog/2015/02/24/react-v0.13-rc1.html","tags":["React","ReleaseNote"],"content":"React v0.13 RCリリース","relatedLinks":[]},{"category":"Headline","title":"Pointer Events is a W3C Recommendation | W3C News","url":"http://www.w3.org/blog/news/archives/4430","tags":["JavaScript","event","spec"],"content":"Pointer EventsがW3C Recommendationになった。","relatedLinks":[{"title":"Pointer Events advance to W3C Recommendation | The Paciello Group – Your Accessibility Partner (WCAG 2.0/508 audits, VPAT, usability and accessible user experience)","url":"http://www.paciellogroup.com/blog/2015/02/pointer-events-advance-to-w3c-recommendation/"},{"title":"Pointer Events W3C Recommendation, Interoperable Touch, and Removing the Dreaded 300ms Tap Delay - IEBlog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/ie/archive/2015/02/24/pointer-events-w3c-recommendation-interoperable-touch-and-removing-the-dreaded-300ms-tap-delay.aspx"},{"title":"Getting on Point | Official jQuery Blog","url":"http://blog.jquery.com/2015/02/24/getting-on-point/"}]},{"category":"Headline","title":"Release v2.4.0 · marionettejs/backbone.marionette","url":"https://github.com/marionettejs/backbone.marionette/releases/tag/v2.4.0","tags":["backbone.js","library","ReleaseNote"],"content":"Marionette 2.4.0リリース。\nCollectionViewとCompositeViewのパフォーマンスや機能強化が中心。\n`Marionette.Controller`が非推奨となり`Marionette.Object`を利用するようになった","relatedLinks":[]},{"category":"Headline","title":"WebStorm 10 EAP, 140.2753: V8 profiling, TypeScript 1.4 and built-in TypeScript compiler | JetBrains WebStorm Blog","url":"http://blog.jetbrains.com/webstorm/2015/02/webstorm-10-eap-140-2753/","tags":["WebStorm","ReleaseNote"],"content":"WebStorm 10 EAPリリース。\nV8のプロファイリングツール連携、TypeScript 1.4サポート、Scratch filesの改善など","relatedLinks":[]},{"category":"Article","title":"[2015-02] 最近のJavaScript AST標準化の動き | Web Scratch","url":"http://efcl.info/2015/02/26/recent-js-ast/","tags":["JavaScript","AST","まとめ"],"content":"EspreeやShift AST、esprimaがjQuery Foundationに移管された事により活発化したAST周りの動きについて。\nESTreeというASTのコミュニティスタンダードについてなどの話","relatedLinks":[]},{"category":"Article","title":"ServiceWorker のスコープとページコントロールについて - Qiita","url":"http://qiita.com/nhiroki/items/eb16b802101153352bba","tags":["ServiceWorker","JavaScript"],"content":"Service Workerのスコープとコントロール出来るようになるタイミングなどのライフサイクルについての解説","relatedLinks":[]},{"category":"Article","title":"ES6 Quiz - hogehoge @teramako","url":"http://d.hatena.ne.jp/teramako/20150301/p1","tags":["ECMAScript"],"content":"ECMAScript 6クイズ","relatedLinks":[]},{"category":"Article","title":"Exploring ES6 Classes In AngularJS 1.x","url":"http://www.michaelbromley.co.uk/blog/350/exploring-es6-classes-in-angularjs-1-x","tags":["AngularJS"],"content":"AngularJS 1.xでES6 Classesを使って記述する方法についての記事","relatedLinks":[]},{"category":"Article","title":"Iterables and iterators in ECMAScript 6","url":"http://www.2ality.com/2015/02/es6-iteration.html","tags":["JavaScript","ECMAScript"],"content":"ES6のIteratorについての詳しい解説。\nfor..ofでのイテレート、spread演算子での展開、`Symbol.iterator`でのIterableの実装などについて","relatedLinks":[]},{"category":"Article","title":"JavaScript - web-animations-jsで策定中のAPIを先取りする - Qiita","url":"http://qiita.com/haribote/items/a8fc84d6cc2fd4abbf72","tags":["web","animation","library"],"content":"Web Animations APIのpolyfillの基本的な使い方について","relatedLinks":[]},{"category":"Article","title":"ECMAScript7を見据えた、JavaScript(TypeScript)で使えるFRPライブラリの比較調査 - Qiita","url":"http://qiita.com/kondei/items/17e5d4867a0652911e52","tags":["JavaScript","Rx","library"],"content":"RxJS、Bacon.js、Kefire.jsの比較","relatedLinks":[]},{"category":"Article","title":"よろしくESLint - Weblog - Hail2u.net","url":"http://hail2u.net/blog/coding/come-into-eslint.html","tags":["JavaScript","Tools"],"content":"ESLintの設定について。\npackge.jsonにも設定を書くことができる点やJSHintからの移行について","relatedLinks":[]},{"category":"Article","title":"JavaScript入門用のコンソールプログラムjavascriptingを翻訳しました - @ledsun blog","url":"http://ledsun.hatenablog.com/entry/2015/02/26/085717","tags":["JavaScript","node.js","tutorial","翻訳"],"content":"nodeschool.ioで使われてるJavaScriptの文法を学ぶコンソールアプリの翻訳","relatedLinks":[]},{"category":"SlideVideo","title":"CSS 4 - What&#x27;s coming up // Speaker Deck","url":"https://speakerdeck.com/diegoeis/css-4-whats-coming-up","tags":["CSS","スライド"],"content":"CSS Selector、Media Queries Lv4についてのスライド","relatedLinks":[]},{"category":"SlideVideo","title":"Service worker が拓く mobile web の新しいかたち","url":"http://www.slideshare.net/kinukox/service-worker-mobile-web","tags":["JavaScript","browser","スライド"],"content":"Service Workerについてのスライド。\nどういうことができるのか、Fetch API、Fetch APIのResponse、デバッグ方法、セキュリティポリシーについて。\nChromeでの実装者によるスライド","relatedLinks":[]},{"category":"SlideVideo","title":"hello world » AngularJS 도입 선택 가이드 공개합니다.","url":"http://helloworld.naver.com/helloworld/1172239","tags":["AngularJS","PDF","資料","韓国"],"content":"AngularJS導入ガイド","relatedLinks":[]},{"category":"SlideVideo","title":"mattpodwysocki/applicative-2015","url":"https://github.com/mattpodwysocki/applicative-2015","tags":["JavaScript","Rx","スライド"],"content":"RxJSについてのスライド。\nFirst class async value、RxのonNext, onError, onComplete、どういう流れで処理を書けるかについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"Vue.js資料まとめ","url":"https://gist.github.com/hashrock/f575928d0e109ace9ad0","tags":["JavaScript","まとめ","links"],"content":"Vue.jsについてのリソースまとめ","relatedLinks":[]},{"category":"WebsiteDocument","title":"diafygi/webcrypto-examples","url":"https://github.com/diafygi/webcrypto-examples","tags":["JavaScript","セキュリティ","サンプル"],"content":"Web Cryptography APIのサンプル集","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jxcore·io","url":"http://jxcore.io/","tags":["JavaScript","node.js"],"content":"Node.jsを拡張したフレームワーク。\nSpiderMonkeyとV8のエンジンの切り替え、マルチスレッドサポート、モバイルアプリへの組み込みなどをサポートしてる","relatedLinks":[{"title":"Node.jsを拡張した「JXCore」、オープンソースでソースコードを公開 | SourceForge.JP Magazine","url":"http://sourceforge.jp/magazine/15/02/24/164700"}]},{"category":"SoftwareLibrary","title":"olahol/eselement","url":"https://github.com/olahol/eselement","tags":["JavaScript","AST","library"],"content":"ASTをDOMライクなAPIで操作出来るライブラリ。\nquerySelector、childNodes、removeChild、createElementのようなAPIが用意されてる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Validate.js","url":"http://validatejs.org/","tags":["JavaScript","library"],"content":"依存するライブラリがないバリデーションライブラリ。","relatedLinks":[]},{"category":"Book","title":"Amazon.co.jp： ブレイクスルーJavaScript フロントエンドエンジニアとして越えるべき5つの壁―オブジェクト指向からシングルページアプリケーションまで: 太田 智彬, 田辺 丈士, 新井 智士, 大江 遼, 株式会社アイ・エム・ジェイ: 本","url":"http://www.amazon.co.jp/dp/479813905X/","tags":["JavaScript","book"],"content":"2015年4月17日発売\nオブジェクト指向、イベント、Canvas、Ajax、シングルページアプリケーションについての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-03-09のJS: ESLint 0.16.0、AtScript is TypeScript","author":"azu","layout":"post","date":"2015-03-09T11:58:00.000Z","category":"JSer","tags":["ECMAScript","AtScript","TypeScript"],"url":"https://jser.info/2015/03/09/eslint0.16-atscript-is-typescript/"},"items":[{"category":"Headline","title":"io.js/CHANGELOG.md at v1.5.0 · iojs/io.js","url":"https://github.com/iojs/io.js/blob/v1.5.0/CHANGELOG.md","tags":["node.js","ReleaseNote"],"content":"io.js 1.5.0リリース。","relatedLinks":[{"title":"io.js ウィークリーアップデート 2015/03/06","url":"http://blog.iojs.jp/2015-03-06.html"},{"title":"Release v2.7.0 · npm/npm","url":"https://github.com/npm/npm/releases/tag/v2.7.0"}]},{"category":"Headline","title":"NW.js v0.12.0 released - Google グループ","url":"https://groups.google.com/forum/#!msg/nwjs-general/NJA-Up4MFug/1jmBPjzklSUJ","tags":["node-webkit","ReleaseNote"],"content":"NW.js 0.12.0リリース。\n`webview`タグの追加、chrome.webrequest APIの追加、`bg-script`フィールドの追加、ソースコードを難読化するnwjcツールの追加など","relatedLinks":[]},{"category":"Headline","title":"ESLint 0.16.0 released - ESLint","url":"http://eslint.org/blog/2015/03/eslint-0.16.0-released/","tags":["JavaScript","Tools"],"content":"ESLint 0.16.0リリース。\nClasses、Moduleのサポートが追加されES6のサポート(パース)がひとまず完了。\n// コメントでルール設定を無効化できるように","relatedLinks":[]},{"category":"Headline","title":"React v0.13 RC2 | React","url":"http://facebook.github.io/react/blog/2015/03/03/react-v0.13-rc2.html","tags":["React","ReleaseNote"],"content":"React v0.13 RC2リリース。\n`React.cloneElement`の追加など","relatedLinks":[{"title":"reactjs - React v0.13 RC - 気になる点を検証 - Qiita","url":"http://qiita.com/kenfdev/items/dbe10e2f0256e22945ca"},{"title":"React.js v0.13 changes - blog.koba04.com","url":"http://blog.koba04.com/post/2015/03/05/react-js-v013-changes/"}]},{"category":"Headline","title":"harmony:specification_drafts [ES Wiki]","url":"http://wiki.ecmascript.org/doku.php?id=harmony:specification_drafts#march_4_2015_rev_35_release_candidate_2","tags":["ECMAScript","spec","ReleaseNote"],"content":"ES6 RC2(Rev 35)リリース","relatedLinks":[]},{"category":"Headline","title":"Brackets Blog - The Free, Open Source Code Editor for the Web","url":"http://blog.brackets.io/2015/03/02/brackets-1-2-now-available/","tags":["JavaScript","editor","ReleaseNote"],"content":"Brackets 1.2リリース","relatedLinks":[]},{"category":"Headline","title":"Announcing Orion 8.0 | Orion News","url":"http://planetorion.org/news/2015/02/announcing-orion-8-0/","tags":["JavaScript","IDE","ReleaseNote"],"content":"WebIDEのOrion 8.0リリース。\nJavaScriptのLint、補完、JSDoc、Quickfix、CSSのLintの強化などが入ってる","relatedLinks":[]},{"category":"Headline","title":"mocha/HISTORY.md at 2.2.0 · mochajs/mocha","url":"https://github.com/mochajs/mocha/blob/2.2.0/HISTORY.md","tags":["JavaScript","testing","ReleaseNote"],"content":"Mocha 2.2.0リリース","relatedLinks":[]},{"category":"Article","title":"The Flux Quick Start Guide","url":"http://www.jackcallister.com/2015/02/26/the-flux-quick-start-guide.html","tags":["Flux","JavaScript"],"content":"Fluxアーキテクチャのコンセプトについて登場要素ごとに順を追って解説されてる。\n併せて小さなstarter-kitも用意されているので、動かして試すことができる","relatedLinks":[{"title":"jarsbe/flux-starter-kit","url":"https://github.com/jarsbe/flux-starter-kit"}]},{"category":"Article","title":"今話題のReact.jsはどのようなWebアプリケーションに適しているか？ Introduction To React─ Frontrend Conference | HTML5Experts.jp","url":"http://html5experts.jp/hokaccha/13301/","tags":["JavaScript","React"],"content":"Reactの概念をわかりやすく解説してる。 \nどのようなサイクルでレンダリングがおこなわれるかをBackboneなどと比較しながらReactの設計思想について解説されてる。","relatedLinks":[{"title":"▶ Introduction To React by Kazuhito Hokamura - YouTube","url":"https://www.youtube.com/watch?v=Biam884qSjg"}]},{"category":"Article","title":"Comparing Angular 1.x &amp; 2.0","url":"http://shmck.com/comparing-angular-1-x-2-0/","tags":["AngularJS","JavaScript"],"content":"AngularJSの1.xと2.0でどのような部分が異なるかについて。\n変更監視、コンポーネント、スコープ、モジュール、DirectivesとComponents、Router、テンプレート、アノテーション等について","relatedLinks":[{"title":"AngularJS: AngularJS 2.0","url":"https://blog.angularjs.org/2014/03/angular-20.html"}]},{"category":"Article","title":"Angular 2: Built on TypeScript - TypeScript - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/typescript/archive/2015/03/05/angular-2-0-built-on-typescript.aspx","tags":["AngularJS","TypeScript"],"content":"TypeScriptにアノテーションを実装していく方針になったのでAtScript自体はなくなるという話。\n\n[Welcome Brad Green and Igor Minar - YouTube](https://www.youtube.com/watch?v=QHulaj5ZxbI \"Welcome Brad Green and Igor Minar - YouTube\")の20:00ぐらいからAtScriptについての話。","relatedLinks":[{"title":"Angular、TypeScript、Javascript、AtScript、Dart、なんてこった (Angular.ts.js.at.dart.wtf) - Qiita","url":"http://qiita.com/Cat_sushi/items/04abb9a1d248131bf5c0"}]},{"category":"Article","title":"Comparison of 4 popular JavaScript MV* frameworks (part 2) - Developer Economics","url":"http://www.developereconomics.com/comparison-4-popular-javascript-mv-frameworks-part-2/","tags":["JavaScript","library"],"content":"Ember、AngularJS、Backbone、React比較。\nそれぞれのデータを可視化して紹介してる。","relatedLinks":[]},{"category":"SlideVideo","title":"poteto/emberconf-2015","url":"https://github.com/poteto/emberconf-2015","tags":["JavaScript","イベント","スライド"],"content":"EmberConf 2015のスライドや動画、ブログのまとめ","relatedLinks":[{"title":"EmberConf 2015","url":"http://emberconf.com/"}]},{"category":"SlideVideo","title":"Frontrend Final Conference 2015 - YouTube","url":"https://www.youtube.com/playlist?list=PLTo9gQMPMgGaVv9e-ZsrzhWvu5BgyWpi-","tags":["JavaScript","CSS","イベント","動画"],"content":"Frontrend Final Conference 2015の動画が公開された","relatedLinks":[{"title":"Frontrend Conference - A conference for front-end developer（2015年2月21日開催）","url":"http://frontrend.github.io/conference/"}]},{"category":"SlideVideo","title":"Angular — ng-conf 2015 media — AngularJs Meetup — South London — Medium","url":"https://medium.com/angularjs-meetup-south-london/angular-ng-conf-2015-media-25dbe6250154","tags":["AngularJS","イベント","動画","スライド"],"content":"ng-conf 2015の動画とスライドまとめ","relatedLinks":[{"title":"ng-conf 2015 - The World","url":"http://www.ng-conf.org/"}]},{"category":"WebsiteDocument","title":"flexbox in 5 minutes","url":"http://flexboxin5.com/","tags":["CSS","サンプル"],"content":"flexboxについて動かしながら学べるサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jeffposnick/sw-precache · GitHub","url":"https://github.com/jeffposnick/sw-precache","tags":["JavaScript","library","ServiceWorker"],"content":"Service Workerでキャッシュするデータを定義したコードを生成してくれるNode.jsモジュール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"royriojas/eslint-friendly-formatter","url":"https://github.com/royriojas/eslint-friendly-formatter","tags":["JavaScript","Tools"],"content":"ESLintのLint結果を該当コードの行と合わせて表示できるESLintのformatter","relatedLinks":[]},{"category":"SoftwareLibrary","title":"timoxley/chimes","url":"https://github.com/timoxley/chimes","tags":["JavaScript","library"],"content":"Iterableなオブジェクトに対するArray.forEachやsome、reduce等の関数を提供するライブラリ","relatedLinks":[]}]},{"meta":{"title":"2015-03-16のJS: React v0.13、Chrome 42β、モダンJavaScriptの歴史","author":"azu","layout":"post","date":"2015-03-16T13:31:00.000Z","category":"JSer","tags":["React","Chrome","history"],"url":"https://jser.info/2015/03/16/react0.13-chrome42beta-modern-js-hisotory/"},"items":[{"category":"Headline","title":"React v0.13 | React","url":"http://facebook.github.io/react/blog/2015/03/10/react-v0.13.html","tags":["React","ReleaseNote"],"content":"React 0.13リリース。\nES6 Classesの対応、React Toolsで`--target es3`の追加など","relatedLinks":[{"title":"React.js v0.13 changes - blog.koba04.com","url":"http://blog.koba04.com/post/2015/03/05/react-js-v013-changes/"}]},{"category":"Headline","title":"ESLint 0.17.0 released - ESLint","url":"http://eslint.org/blog/2015/03/eslint-0.17.0-released/","tags":["ECMAScript","JavaScript","Tools","ReleaseNote"],"content":"ESLint 0.17.0リリース。\nJSX/Reactのセマンティックに関するルールはESLint本体ではなくpluginで行うように。","relatedLinks":[{"title":"yannickcr/eslint-plugin-react","url":"https://github.com/yannickcr/eslint-plugin-react"}]},{"category":"Headline","title":"Esprima 2.1 Released | Official jQuery Blog","url":"http://blog.jquery.com/2015/03/10/esprima-2-1-released/","tags":["JavaScript","AST","ReleaseNote"],"content":"Esprima 2.1リリース。\nES6サポートが中心でclass、rest parameter、computed property nameなどをサポートした。\nESTreeでAST仕様を策定してる件について","relatedLinks":[]},{"category":"Headline","title":"superagent/History.md at 1.0.0 · visionmedia/superagent","url":"https://github.com/visionmedia/superagent/blob/1.0.0/History.md","tags":["JavaScript","node.js","HTTP","library"],"content":"ブラウザ、Node.jsで動くHTTPクライアントライブラリであるsuperagent 1.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 42 Beta: Push Notifications, Promoting Add to Home Screen and ES6 Classes","url":"http://blog.chromium.org/2015/03/chrome-42-beta-push-notifications_12.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 42βリリース。\nService Workerを使ったプッシュ通知、WebApp Manifestのサポート、ES6 Classes、Fetch APIがwindowコンテキストに公開されるなど","relatedLinks":[{"title":"Chrome 42 ベータ版: プッシュ通知、","url":"http://googledevjp.blogspot.jp/2015/03/chrome-42-es6-class.html"},{"title":"Push Notifications on the Open Web","url":"http://updates.html5rocks.com/2015/03/push-notificatons-on-the-open-web"}]},{"category":"Headline","title":"Dev.Opera — Opera 28 released","url":"https://dev.opera.com/blog/opera-28/","tags":["Opera","ReleaseNote","Chrome"],"content":"Opera 28 (based on Chromium 41)リリース。\nElement#closestの実装、any-pointerとany-hoverのサポート、Web Audio APIのsuspendとresume、StereoPannerNodeの実装、ES6サポートの改善","relatedLinks":[]},{"category":"Article","title":"Push Notifications on the Open Web","url":"http://updates.html5rocks.com/2015/03/push-notificatons-on-the-open-web","tags":["Chrome","ServiceWorker","WebPlatformAPI"],"content":"Chrome 42でサポートされたPush APIについての解説。\nGoogle Cloud Messagingからどのようにプッシュ通知を行うかについての解説","relatedLinks":[]},{"category":"Article","title":"Taming the asynchronous beast with ES7","url":"http://pouchdb.com/2015/03/05/taming-the-async-beast-with-es7.html","tags":["JavaScript","ECMAScript"],"content":"ES7で入る予定のasync/awaitについて。\nどのような動作になってるのかを解説","relatedLinks":[]},{"category":"Article","title":"A Comparison of JavaScript Linting Tools","url":"http://www.sitepoint.com/comparison-javascript-linting-tools/","tags":["JavaScript","Tools"],"content":"JSLint、JSHint、JSCS、ESLintのそれぞれいいところ、よくないところの比較","relatedLinks":[]},{"category":"Article","title":"How to implement a programming language (tutorial for beginners)","url":"http://lisperator.net/pltut/","tags":["JavaScript","tutorial"],"content":"JavaScriptでλanguageという言語を実装するチュートリアル。\ntoken stream、パーサ、AST、ジェネレータ、最適化、CPSなど色々書かれてる。\nUglifyJS作者によるもの","relatedLinks":[]},{"category":"Article","title":"The Modern JavaScript Developer’s Toolbox","url":"http://www.infoq.com/articles/modern-javascript-toolbox","tags":["JavaScript","歴史"],"content":"InfoQが未来のJavaScript等についての連載の一環として、今までのJavaScriptを振り返りする記事。\nライブラリ、開発環境、ビルドツール/自動化などを簡単に振り返りしてる","relatedLinks":[{"title":"Next Generation HTML5 and JavaScript ","url":"http://www.infoq.com/Next-Generation-HTML5-JavaScript/articles/"}]},{"category":"Article","title":"JavaScript - React.js 実戦投入への道 - Qiita","url":"http://qiita.com/icoxfog417/items/5d79b3336226aa51e30d","tags":["Flux","JavaScript"],"content":"\"Thinking in React\"の考え方。 \nテンプレートエンジンとReactの共存の話、階層構造の複雑性を解決するためのMediator/ObserverとFluxライブラリについて","relatedLinks":[]},{"category":"Article","title":"JavaScript - IndexedDbをActiveRecord+Promiseっぽく扱えてJSONSchemaでバリデーションできてnodeでもオンメモリで動いてくORMみたいな何か作ってみた - Qiita","url":"http://qiita.com/mizchi/items/bd8befaffa8fe9f32522","tags":["JavaScript","データベース","library"],"content":"IndexedDBを扱うライブラリ。\nJSONスキーマによるバリデーションやActiveRecord風のAPIを持っている。\nマイグレーション用のUtilも設けている","relatedLinks":[{"title":"mizchi/stone-skin","url":"https://github.com/mizchi/stone-skin"}]},{"category":"SlideVideo","title":"ECMAScript没proposal追悼式","url":"http://www.slideshare.net/KMC_JP/ecmascriptproposal","tags":["ECMAScript","spec","スライド"],"content":"ES6の仕様で提案されたが、[ES6 RC2](http://wiki.ecmascript.org/doku.php?id=harmony:specification_drafts)時点で入らなかった仕様について。","relatedLinks":[]},{"category":"SlideVideo","title":"Babel: Beyond the Basics // Speaker Deck","url":"https://speakerdeck.com/sebmck/babel-beyond-the-basics","tags":["JavaScript","ECMAScript","スライド","Tools"],"content":"Babel作者によるBabelの紹介スライド。","relatedLinks":[{"title":"▶ Babel: Beyond the Basics — Sebastian McKenzie, Creator of Babel - YouTube","url":"https://www.youtube.com/watch?v=F1BIeVe99EQ"}]},{"category":"SlideVideo","title":"EmberConf 2015 - YouTube","url":"https://www.youtube.com/playlist?list=PLE7tQUdRKcyacwiUPs0CjPYt6tJub4xXU#emberconf","tags":["JavaScript","イベント","動画"],"content":"EmberConf 2015の動画一覧","relatedLinks":[{"title":"http://emberconf.com/","url":"http://emberconf.com/"},{"title":"poteto/emberconf-2015","url":"https://github.com/poteto/emberconf-2015"}]},{"category":"WebsiteDocument","title":"Experiments with Strengthening JavaScript - Chrome V8 — Google Developers","url":"https://developers.google.com/v8/experiments","tags":["google","JavaScript"],"content":"Chromeに実験的に実装してるStrong Mode(SaneScript)とSoundScript(型システム)についてのドキュメント。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Home – Component Kitchen","url":"http://component.kitchen/","tags":["WebComponents","まとめ","検索"],"content":"Web Componentsのカタログサイト。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ecomfe/fontmin","url":"https://github.com/ecomfe/fontmin","tags":["node.js","fonts","Tools","library"],"content":"ウェブフォントのMinifyを行うNode.jsモジュール。\nttfやotfからeot、woff、svgへの変換を行う。また使用する文字だけのサブセットも作成出来る","relatedLinks":[{"title":"中文字体 webfont 自动化构建 | EFE Tech","url":"http://efe.baidu.com/blog/chinese-font-build/"}]},{"category":"SoftwareLibrary","title":"zewish/rmodal.js","url":"https://github.com/zewish/rmodal.js","tags":["JavaScript","UI","library"],"content":"依存がないシンプルなモーダルダイアログUIライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rackt/react-a11y · GitHub","url":"https://github.com/rackt/react-a11y","tags":["React","library","アクセシビリティ"],"content":"React Elementにアクセシビリティ的な問題がないかを警告してくれるライブラリ。\nまたどうすればいいかも表示してくれる","relatedLinks":[{"title":"▶ React.js Conf 2015 - Hype! - YouTube","url":"https://www.youtube.com/watch?v=z5e7kWSHWTg#t=631"}]},{"category":"SoftwareLibrary","title":"Kikobeats/acho","url":"https://github.com/Kikobeats/acho#acho","tags":["JavaScript","library","node.js"],"content":"Node.jsとブラウザで動くログレベル等を持つシンプルなロガーライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bvaughn/jasmine-es6-promise-matchers","url":"https://github.com/bvaughn/jasmine-es6-promise-matchers","tags":["JavaScript","Promises","testing"],"content":"JasmineのPromise向けmatcherライブラリ","relatedLinks":[]}]},{"meta":{"title":"2015-03-23のJS: IEのアップデート、RxJS入門、Chrome DevToolsの新機能と計測の仕方","author":"azu","layout":"post","date":"2015-03-23T13:49:00.000Z","category":"JSer","tags":["IE","Chrome","debug","performance"],"url":"https://jser.info/2015/03/23/ie-rxjs-chrome-devtools/"},"items":[{"category":"Headline","title":"Rendering engine updates in March for the Windows 10 Technical Preview - IEBlog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/ie/archive/2015/03/18/rendering-engine-updates-in-march-for-the-windows-10-technical-preview.aspx","tags":["IE","ReleaseNote"],"content":"Windows 10 Technical Previewのアップデートが行われて、ブラウザのレンダリングエンジンもアップデートされている。\nWAI-ARIA Landmark Roles、Web Audio API、Touch Events、Fullscreen APIなどのサポートなど","relatedLinks":[]},{"category":"Headline","title":"flow/Changelog at v0.7.0 · facebook/flow","url":"https://github.com/facebook/flow/blob/v0.7.0/Changelog","tags":["JavaScript","flowtype","Tools","ReleaseNote"],"content":"FlowType 0.7.0リリース。\nES6 modulesのサポート開始、null/undefinedとの比較するケースの対応改善、`hasOwnProperty`を呼び出してるケースの対応改善","relatedLinks":[]},{"category":"Headline","title":"React v0.13.1 | React","url":"http://facebook.github.io/react/blog/2015/03/16/react-v0.13.1.html","tags":["React","ReleaseNote"],"content":"React v0.13.1リリース","relatedLinks":[]},{"category":"Headline","title":"harmony:specification_drafts [ES Wiki]","url":"http://wiki.ecmascript.org/doku.php?id=harmony:specification_drafts#march_17_2015_rev_36_release_candidate_3","tags":["ECMAScript","ReleaseNote"],"content":"ES6仕様書RC3リリース","relatedLinks":[]},{"category":"Article","title":"Explore React","url":"http://x-team.github.io/explore-react/","tags":["React","コードリーディング"],"content":"Reactのコードリーディングをしながら内部的な仕組みを見ていく話","relatedLinks":[]},{"category":"Article","title":"Moving Codecademy to ECMAScript 6, Webpack, and React","url":"http://artur.co/articles/moving-codecademy-to-es6-webpack-and-react/","tags":["JavaScript","ECMAScript","React"],"content":"Codecademyのクライアントサイドのアーキテクチャの変遷について","relatedLinks":[]},{"category":"Article","title":"Chromium Blog: New JavaScript techniques for rapid page loads","url":"http://blog.chromium.org/2015/03/new-javascript-techniques-for-rapid.html","tags":["Chrome","JavaScript"],"content":"Chrome 41で`async`属性をつけたスクリプトはダウンロードが始まった瞬間にパーサ用の別スレッドでパースされるためより高速になるとの話","relatedLinks":[{"title":"レンダリングを妨げる JavaScript を削除する - PageSpeed Insights — Google Developers","url":"https://developers.google.com/speed/docs/insights/BlockingJS"}]},{"category":"Article","title":"「RxJS」初心者入門 - JavaScriptの非同期処理の常識を変えるライブラリ | 株式会社LIG","url":"http://liginc.co.jp/web/js/151272","tags":["JavaScript","Rx"],"content":"RxJSの入門記事。\nRxのパラダイム的な話やサンプルなどがまとまってる","relatedLinks":[]},{"category":"Article","title":"ES5の範囲でOption型を表すライブラリ、option-t を作った - snyk_s log","url":"http://saneyukis.hatenablog.com/entry/2015/03/20/191424","tags":["JavaScript","library","Rust","Promises"],"content":"(初期状態)未選択を状態として保存したい時に使うOption typeの実装ライブラリ(like Rust)","relatedLinks":[{"title":"saneyuki/option-t.js","url":"https://github.com/saneyuki/option-t.js"},{"title":"「値が無い」ということをどう表現するか、あるいはOption型について - Line 1: Error: Invalid Blog(","url":"http://bugrammer.hateblo.jp/entry/2013/07/30/134120"}]},{"category":"Article","title":"JavaScript - 4パターンのWebWorker生成方法とインラインワーカーの技法 - Qiita","url":"http://qiita.com/mohayonao/items/872166cf364e007cf83d","tags":["JavaScript","webworker"],"content":"WebWorkerの生成方法についてのまとめ","relatedLinks":[]},{"category":"Article","title":"material-fluxというFluxライブラリをREADME駆動で開発した | Web Scratch","url":"http://efcl.info/2015/03/17/material-flux/","tags":["JavaScript","library","Flux","ECMAScript"],"content":"特殊なハックをできるだけ排除したFluxライブラリを作った話とREADME駆動について。\nまたES6 ClassesをベースとしたAPIについて","relatedLinks":[]},{"category":"Article","title":"RemoteDebug and cross-browser DevTools. One year later. — Kenneth Auchenberg","url":"https://kenneth.io/blog/2015/03/12/remotedebug-one-year-later","tags":["JavaScript","browser","debug"],"content":"ブラウザ間の共通デバッグプロトコルを作るプロジェクトであるRemoteDebugを公開して1年経ってどのような変化があったかについて","relatedLinks":[]},{"category":"SlideVideo","title":"DevTools: State Of The Union 2015 // Speaker Deck","url":"https://speakerdeck.com/addyosmani/devtools-state-of-the-union-2015","tags":["Chrome","debug","Tools","スライド"],"content":"Chromeの開発者ツールの新しい機能や実際のパフォーマンス計測、問題の見つけ方について。\nWikipediaとjQueryの例、一つの処理が100ms以上取ってるなら危険、`hide()`のボトルネック、まずは計測することから始めるという話","relatedLinks":[{"title":"jQuery UK Conference - Oxford 2015","url":"http://jqueryuk.com/2015/videos.php?s=devtools-state-of-the-union"}]},{"category":"SlideVideo","title":"Using npm link to use node modules that are &quot;in progress&quot; - Node.js Video Tutorial #free @eggheadio","url":"https://egghead.io/lessons/node-js-using-npm-link-to-use-node-modules-that-are-in-progress","tags":["node.js","npm","動画"],"content":"npm linkを使った開発についてのスクリーンキャスト","relatedLinks":[]},{"category":"SlideVideo","title":"jQuery UK Conference - Oxford 2015","url":"http://jqueryuk.com/2015/videos.php","tags":["jQuery","動画","まとめ"],"content":"jQuery UK 2015の動画が公開された","relatedLinks":[{"title":"Coverage of jQuery UK 2015 | Lanyrd","url":"http://lanyrd.com/2015/jquery-uk/coverage/"}]},{"category":"SlideVideo","title":"ウェブパフォーマンスの基礎とこれから","url":"http://www.slideshare.net/kawada_hiroshi/ss-46149727","tags":["web","performance","スライド"],"content":"通信についてを中心に扱うパフォーマンスについてのスライド\nウェブサイトの表示までにどういう通信が起きてるか、ブラウザ上でどうやって計測するかやPerformance Timelineなどの仕様について、HTTP/2での戦略の違いなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"Jank Free: Let&#x27;s Make the Web Silky Smooth!","url":"http://jankfree.org/","tags":["JavaScript","browser","Chrome","V8","performance","動画","まとめ"],"content":"ウェブサイトで60FPSの描画をするためのパフォーマンスチューニング等についてのスライド、動画や記事のまとめサイト。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"eatcodeplay/Konsole.js","url":"https://github.com/eatcodeplay/Konsole.js","tags":["JavaScript","debug","library"],"content":"画面内にコンソールを表示できるFirebug Lite的なライブラリ。\nconsole APIの上書き、DOMのインスペクト、CSSの操作、FPSの表示など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Hamsa","url":"http://gethamsa.com/","tags":["JavaScript","library"],"content":"`Object.observe()`(又はpolyfill)を使ったモデルライブラリ。\nスキーマ的なプロパティの型やデフォルト値の定義、class継承、`Object.observe()`を使った変更監視、find系の探査メソッドを持つ","relatedLinks":[]},{"category":"Book","title":"O&#x27;Reilly Japan - 入門 React","url":"http://www.oreilly.co.jp/books/9784873117195/","tags":["React","book"],"content":"2015年03月27日発売\nDeveloping a React Edgeの翻訳本。","relatedLinks":[]},{"category":"Book","title":"HTML5 &amp; CSS3 For The Real World, 2nd Edition - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/9780987467485.do","tags":["HTML5","CSS","book"],"content":"広義のHTMLとCSSの新しいAPIなどを見ていく書籍","relatedLinks":[]},{"category":"Book","title":"Functional Programming in JavaScript - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/9781784398224.do","tags":["JavaScript","book"],"content":"2015年3月発売。\n関数型JavaScriptについての書籍","relatedLinks":[]},{"category":"Book","title":"React+d3.js by Swizec Teller [Leanpub PDF/iPad/Kindle]","url":"https://leanpub.com/reactd3js","tags":["React","d3.js","book"],"content":"ReactとD3.jsについての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-03-31のJS: Dart to JS、ES6 Generator、Reactでシングルページアプリケーション作成","author":"azu","layout":"post","date":"2015-03-31T13:04:00.000Z","category":"JSer","tags":["Dart","ES6","React","tutorial"],"url":"https://jser.info/2015/03/31/dart-generator-react-tutorial/"},"items":[{"category":"Headline","title":"ESLint 0.18.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/03/eslint-0.18.0-released","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 0.18.0リリース。\nJSXの構文についての処理はESLintから完全に削除され、[eslint-plugin-react](https://github.com/yannickcr/eslint-plugin-react \"eslint-plugin-react\")へ移植された。","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember.js 1.11.0 and 1.12 Beta Released","url":"http://emberjs.com/blog/2015/03/27/ember-1-11-0-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember.js 1.11リリース。\nHTMLBarsの構文強化やその構文の解説がされている。","relatedLinks":[]},{"category":"Headline","title":"Node v0.12.1 (Stable)","url":"http://blog.nodejs.org/2015/03/23/node-v0-12-1-stable/","tags":["node.js","ReleaseNote"],"content":"Node v0.12.1リリース。\nOpenSSLのアップデート","relatedLinks":[]},{"category":"Article","title":"Dart News &amp; Updates: Dart for the Entire Web","url":"http://news.dartlang.org/2015/03/dart-for-entire-web.html","tags":["dart","ReleaseNote"],"content":"DartはDartVMをChromiumに載せることは諦めて、dart2jsに集中するとのこと。\nまた、Dart 1.9がリリースされている。","relatedLinks":[{"title":"Dart News & Updates: Dart 1.9: The release you’ve been await-ing for","url":"http://news.dartlang.org/2015/03/dart-19-release-youve-been-await-ing-for.html"},{"title":"Dart 1.9.1リリースノート - Qiita","url":"http://qiita.com/laco0416/items/cd6685ab3cd115613d37"}]},{"category":"Article","title":"A Preview of WinJS 4.0","url":"http://blogs.windows.com/buildingapps/2015/03/27/a-preview-of-winjs-4-0/","tags":["windows","JavaScript","library","ReleaseNote"],"content":"WinJS 4.0のプレビュー版が公開された","relatedLinks":[]},{"category":"Article","title":"&quot;Project Spartan&quot; in the Windows Technical Preview build 10049 - IEBlog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/ie/archive/2015/03/30/quot-project-spartan-quot-in-the-windows-technical-preview-build-10049.aspx","tags":["windows","IE","ReleaseNote"],"content":"Project Spartanが入ったWindows 10のプレビュー版が公開された\nUserVoiceでアイデアへの投票を募集している。","relatedLinks":[{"title":"Project Spartan: Hot (33 ideas) – Feature Suggestions for Windows","url":"https://windows.uservoice.com/forums/285214-project-spartan"}]},{"category":"Article","title":"Node.js Tools 1.0 for Visual Studio - The Visual Studio Blog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/visualstudio/archive/2015/03/25/node-js-tools-1-0-for-visual-studio.aspx","tags":["node.js","IDE","ReleaseNote"],"content":"Node.js Tools 1.0 for Visual Studioリリース。\nまたリポジトリがGitHubに移行した","relatedLinks":[{"title":"Microsoft/nodejstools","url":"https://github.com/Microsoft/nodejstools"}]},{"category":"Article","title":"ES6 generators in depth","url":"http://www.2ality.com/2015/03/es6-generators.html","tags":["JavaScript","ECMAScript"],"content":"ES6のGeneratorについての詳しい解説。\nGeneratorとは何か、構成要素、Iterator、Generatorの使い方、CSPなど幅広く書かれてる","relatedLinks":[]},{"category":"Article","title":"mikechau/react-primer-draft","url":"https://github.com/mikechau/react-primer-draft","tags":["React","tutorial","book"],"content":"Reactでシングルページアプリケーションを作るチュートリアル的な文章。\nReact.Componentについて詳しく書かれている","relatedLinks":[]},{"category":"SlideVideo","title":"Reusable Component UI Design // Speaker Deck","url":"https://speakerdeck.com/tyshgc/reusable-component-ui-design","tags":["React","スライド"],"content":"再利用できるReact Componentについてのスライド","relatedLinks":[]},{"category":"WebsiteDocument","title":"Package Quality","url":"http://packagequality.com/","tags":["npm","webservice"],"content":"npmのパッケージのクオリティチェック。\nissueの数やバージョンなどの情報を元に数値化してる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Microsoft/IEDiagnosticsAdapter","url":"https://github.com/Microsoft/IEDiagnosticsAdapter","tags":["Chrome","IE","debug","proxy","software"],"content":"Chrome remote debug protocolを使ってIEをデバッグできるプロキシ。\nChromeでIEで見てるサイトをデバッグ出来る","relatedLinks":[]},{"category":"SoftwareLibrary","title":"operasoftware/operachromiumdriver","url":"https://github.com/operasoftware/operachromiumdriver","tags":["Opera","Chrome","webdriver"],"content":"OperaのWebDriver実装","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bloomberg/brisket","url":"https://github.com/bloomberg/brisket","tags":["JavaScript","backbone.js","library"],"content":"Bloombergのisomorphic JavaScriptフレームワーク。\nRendrと同じくBackboneをベースとしたサーバサイドレンダリングの仕組みを持つ。","relatedLinks":[{"title":"At Bloomberg We’ve Made Brisket. And It Can Make Anything. | Bloomberg L.P.","url":"http://www.bloomberg.com/company/2015-03-24/bloomberg-weve-made-brisket-can-make-anything/"}]},{"category":"SoftwareLibrary","title":"cssnext/cssnext","url":"https://github.com/cssnext/cssnext","tags":["CSS","Tools","library"],"content":"CSS4などの仕様をCSS3相当に変換するツールとライブラリ。","relatedLinks":[{"title":"Myth - CSS the way it was imagined.","url":"http://www.myth.io/"}]},{"category":"Book","title":"Amazon: Front-End Architecture: A Modern Blueprint for Scalable and Sustainable Design Systems: Micah Godbolt","url":"http://www.amazon.com/dp/1491926783","tags":["JavaScript","HTML","book"],"content":"2015年10月25日発売\nフロントエンドアーキテクチャ。\nJavaScriptやツール、CSSなど幅広く扱ってる","relatedLinks":[]}]},{"meta":{"title":"2015-04-06のJS: Babel 5.0.0と次期ECMAScript、Bower 1.4.0、JSCSと自動整形","author":"azu","layout":"post","date":"2015-04-06T13:53:00.000Z","category":"JSer","tags":["JavaScript","ECMAScript","Bower","tool"],"url":"https://jser.info/2015/04/06/babel5-bower-jscs/"},"items":[{"category":"Headline","title":"Announcing TypeScript 1.5 Alpha - TypeScript - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/typescript/archive/2015/03/27/announcing-typescript-1-5-alpha.aspx","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 1.5αリリース。\nES6 modulesなどの対応、デコレータのサポート、Sublime Textプラグインの追加など","relatedLinks":[]},{"category":"Headline","title":"Firefox — Notes (37.0) — Mozilla","url":"https://www.mozilla.org/en-US/firefox/37.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 37リリース。\nTyped ArrayにもArrayメソッドの追加、Web Audio APIを最新の仕様に追従、Web Worker内でIndexedDBを使えるようになる等","relatedLinks":[{"title":"Firefox 37 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/37"},{"title":"Firefox 37 サイト互換性情報 - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/37/Site_Compatibility"}]},{"category":"Headline","title":"Release v2.0.0 · eslint/espree","url":"https://github.com/eslint/espree/releases/tag/v2.0.0","tags":["JavaScript","AST","ReleaseNote"],"content":"ESLintが使うASTパーサであるespree 2.0.0リリース。\nESTree仕様への追従のためにBreaking Change、`super`の対応、RestElementへの対応など","relatedLinks":[]},{"category":"Headline","title":"less.js/CHANGELOG.md at v2.5.0 · less/less.js","url":"https://github.com/less/less.js/blob/v2.5.0/CHANGELOG.md","tags":["CSS","JavaScript","library","ReleaseNote"],"content":"less.js 2.5.0リリース。\nスコープ内でも`@plugin`が動作するように、パーサのパフォーマンス改善や細かい警告の修正など","relatedLinks":[{"title":"Fix ","url":"https://github.com/less/less.js/pull/2522"}]},{"category":"Headline","title":"5.0.0 Released · Babel","url":"https://babeljs.io/blog/2015/03/31/5.0.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"Babel 5.0.0リリース。\n`--experimental`を廃止して、ECMAScriptを策定してるTC39のプロセスを元にしたStageベースのフラグを導入。またES7のDecoratorsなどの実装を追加、class継承でのsuper()の呼び出しチェックを追加するなど","relatedLinks":[]},{"category":"Headline","title":"flow/Changelog at v0.8.0 · facebook/flow","url":"https://github.com/facebook/flow/blob/v0.8.0/Changelog","tags":["flowtype","ReleaseNote"],"content":"FlowType 0.8.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release v1.4.0 · bower/bower","url":"https://github.com/bower/bower/releases/tag/v1.4.0","tags":["JavaScript","package","ReleaseNote"],"content":"Bower 1.4.0リリース。\nloginとunregisterコマンドをサポート、pacakge.jsonにBowerの設定を書けるように、`--save-exact`のサポートなど","relatedLinks":[{"title":"Unregister and login commands (rebased) by sheerun · Pull Request #1719 · bower/bower","url":"https://github.com/bower/bower/pull/1719"},{"title":"Accept npm","url":"https://github.com/bower/bower/issues/1711"}]},{"category":"Headline","title":"Release v1.12.0 · jscs-dev/node-jscs","url":"https://github.com/jscs-dev/node-jscs/releases/tag/v1.12.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"JSCS 1.12.0リリース。\n自動整形機能のサポート(`-x`オプション)、ルールの追加、Auto-configurationのエラー表示の改善など","relatedLinks":[]},{"category":"Headline","title":"Node v0.12.2 (Stable)","url":"http://blog.nodejs.org/2015/03/31/node-v0-12-2-stable/","tags":["node.js","ReleaseNote"],"content":"Node v0.12.2リリース。","relatedLinks":[]},{"category":"Headline","title":"harmony:specification_drafts [ES Wiki]","url":"http://wiki.ecmascript.org/doku.php?id=harmony:specification_drafts#april_3_2015_rev_37_release_candidate_4","tags":["ECMAScript","ReleaseNote"],"content":"ECMAScript 2015(ES6) RC4リリース。\nTC39で承認されたバージョン、\"Edition 6\"という記述を\"ECMAScript 2015\"に置換するなど","relatedLinks":[{"title":"Allen Wirfs-Brock on Twitter: ","url":"https://twitter.com/awbjs/status/584093254045413376"},{"title":"Allen Wirfs-Brock on Twitter: ","url":"https://twitter.com/awbjs/status/580326814826020864"}]},{"category":"Headline","title":"WebStorm 10 released: improved JavaScript support, TypeScript 1.4, V8 profiling, and more | JetBrains WebStorm Blog","url":"http://blog.jetbrains.com/webstorm/2015/03/webstorm-10-released/","tags":["WebStorm","ReleaseNote"],"content":"WebStorm 10リリース。\nES6のサポート改善、TypeScript 1.4のサポート、spy-jsで依存関係の表示、多段SourceMapに対応、V8のプロファイリングのサポートなど","relatedLinks":[{"title":"What","url":"https://www.jetbrains.com/webstorm/whatsnew/"}]},{"category":"Article","title":"Live Editing JavaScript with Webpack (Part III)","url":"http://jlongster.com/Backend-Apps-with-Webpack--Part-III","tags":["webpack","JavaScript","Tools"],"content":"webpackのhot module replacementの仕組みについての解説。\nリロードなしでモジュールの変更をする仕組みについて","relatedLinks":[{"title":"hot module replacement with webpack","url":"http://webpack.github.io/docs/hot-module-replacement-with-webpack.html"}]},{"category":"Article","title":"Auto-formatting JavaScript Code Style — Medium","url":"https://medium.com/@addyosmani/auto-formatting-javascript-code-style-fe0f98a923b8","tags":["JavaScript","Tools"],"content":"JSCS 1.12.0で自動整形機能が入り、JSCSを使ってSublime Textで自動整形を行う方法について。","relatedLinks":[{"title":"Release v1.12.0 · jscs-dev/node-jscs","url":"https://github.com/jscs-dev/node-jscs/releases/tag/v1.12.0"}]},{"category":"Article","title":"CSS Font LoadingとFont Face Observer、Web Font Loader - Weblog - Hail2u.net","url":"http://hail2u.net/blog/webdesign/css-font-loading-font-face-observer-and-web-font-loader.html","tags":["fonts","CSS","JavaScript","library"],"content":"CSS Font Loadingと同様の機能を提供するshim的なライブラリの比較","relatedLinks":[]},{"category":"Article","title":"Jam3/jam3-lesson-module-basics","url":"https://github.com/Jam3/jam3-lesson-module-basics","tags":["JavaScript","node.js","npm"],"content":"小さいnpmのモジュールを使ってクライアントサイドの開発をしようという紹介記事。\n実際にBrowserifyなどを使ってどうやって開発するかについて紹介している","relatedLinks":[]},{"category":"Article","title":"the-offline-cookbook-ja/ja.md at master · kuu/the-offline-cookbook-ja","url":"https://github.com/kuu/the-offline-cookbook-ja/blob/master/ja.md","tags":["ServiceWorker","翻訳","JavaScript"],"content":"The offline cookbookの翻訳。\nService Workerのパターンについて書かれている","relatedLinks":[]},{"category":"SlideVideo","title":"Service Workerハッカソン資料まとめ - dackdive&#x27;s blog","url":"http://dackdive.hateblo.jp/entry/2015/04/04/163234","tags":["ServiceWorker","スライド","動画","まとめ"],"content":"Service Workerハッカソンのスライドや動画のまとめ","relatedLinks":[]},{"category":"WebsiteDocument","title":"SemVer checker","url":"http://semver.npmjs.com/","tags":["npm","webservice","Tools"],"content":"npmのsemver計算機\nバージョン文字列からどのバージョンにマッチするかを確認できる","relatedLinks":[]},{"category":"WebsiteDocument","title":"ECMAScript 6: Feature Overview and Comparison","url":"http://es6-features.org/","tags":["JavaScript","ECMAScript","まとめ"],"content":"ES6とES5の書き方を項目毎に比較紹介してるサイト","relatedLinks":[]},{"category":"WebsiteDocument","title":"sorting algorithms in javascript","url":"http://h3manth.com/javascript-sorting/","tags":["JavaScript","アルゴリズム"],"content":"JavaScriptでソートアルゴリズムの実装","relatedLinks":[]},{"category":"SoftwareLibrary","title":"azu/wait-for-element.js","url":"https://github.com/azu/wait-for-element.js","tags":["JavaScript","library","DOM"],"content":"CSSセレクタにマッチする要素が表示されるまで待つライブラリ。\nMutationObserverを使った実装とsetTimeoutを使った実装を持ってる","relatedLinks":[{"title":"ある要素が表示されるまで待つJSライブラリを書いた(MutationObserver) | Web Scratch","url":"http://efcl.info/2015/04/06/wait-for-element/"}]},{"category":"SoftwareLibrary","title":"mohebifar/xto6","url":"https://github.com/mohebifar/xto6","tags":["JavaScript","ECMAScript","Tools"],"content":"ES5のコードをES6へ変換するTranspiler","relatedLinks":[]}]},{"meta":{"title":"2015-04-14のJS: 初代jQueryをコードリーディング、npmのエコシステムとプロトタイピング","author":"azu","layout":"post","date":"2015-04-14T14:06:00.000Z","category":"JSer","tags":["jQuery","コードリーディング","npm","GitHub"],"url":"https://jser.info/2015/04/14/jQuery-origin/"},"items":[{"category":"Headline","title":"ESLint 0.19.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/04/eslint-0.19.0-released","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 0.19.0リリース。\nASTのコミュニティ標準であるESTreeの仕様への追従が中心。","relatedLinks":[]},{"category":"Headline","title":"babel/CHANGELOG.md at master · babel/babel","url":"https://github.com/babel/babel/blob/master/CHANGELOG.md#510","tags":["JavaScript","Tools","ReleaseNote"],"content":"Babel 5.1.0リリース。\ntrailing-function-commasのサポート、オブジェクトリテラルのメソッドに対するdecoratorsのサポートなど","relatedLinks":[{"title":"Decorators in object literals trigger SyntaxError · Issue #1154 · babel/babel","url":"https://github.com/babel/babel/issues/1154"}]},{"category":"Headline","title":"The npm Blog — npm private modules are here!","url":"http://blog.npmjs.org/post/116379479775/npm-private-modules-are-here","tags":["npm","webservice"],"content":"npmのprivate modulesがオープン。\nnpmjsにscoped modulesをpublishすることが出来るようになり、それらのモジュールをprivateで利用できる$7/monthのサービス","relatedLinks":[]},{"category":"Article","title":"Rapid Prototyping in JavaScript","url":"http://mattdesl.svbtle.com/rapid-prototyping","tags":["JavaScript","debug","開発環境"],"content":"Browserify、wzrd、budoを使ったプロトタイピングについて。\nブラウザのリロードなしで変更を反映出来るHot Reloadingが出来るbudoをローカルサーバにして開発する流れ","relatedLinks":[{"title":"mattdesl/budo","url":"https://github.com/mattdesl/budo"}]},{"category":"Article","title":"eval ソースをデバッグする - 開発ツール | MDN","url":"https://developer.mozilla.org/ja/docs/Tools/Debugger/How_to/Debug_eval_sources","tags":["firefox","sourcemap","debug"],"content":"FirefoxやChromeの開発者ツールはevalやnew Function経由で実行されるコードに//# sourceURL=my-foo.js のような識別子があると通常のスクリプトと同等に扱えるので、ブレークポイントなどが可能になる。","relatedLinks":[]},{"category":"Article","title":"John Resig - Annotated Version of the Original jQuery Release","url":"http://ejohn.org/blog/annotated-version-of-the-original-jquery-release/","tags":["jQuery","歴史","JavaScript"],"content":"jQuery作者によるjQueryの初期バージョンのコードにコメントをしたものが公開されてる。\nメソッドチェインの仕組み、CSSセレクタとなるもの、文字列からのDOM要素作成など多くのライブラリに影響を与えたものがどういう考えで作られたのかが書かれていて面白い","relatedLinks":[{"title":"Genius | Annotate the world","url":"http://genius.it/ejohn.org/files/jquery-original.html"}]},{"category":"Article","title":"Measuring Performance","url":"http://davidwalsh.name/measuring-performance","tags":["JavaScript","performance","browser"],"content":"Navigation Timing API、Resource Timing APIといったパフォーマンス測定のためのブラウザAPIやWebPageTestなどの計測ツールやネットワーク環境のテストについての紹介","relatedLinks":[]},{"category":"Article","title":"Deploying ECMAScript 6","url":"http://www.2ality.com/2015/04/deploying-es6.html","tags":["ECMAScript","JavaScript","Tools","まとめ"],"content":"ES6関係のツール、試し方の簡潔なまとめ","relatedLinks":[]},{"category":"Article","title":"Timer APIs(Date.getTime, Date.now, performance.now, setTimeout, setInterval, requestAnimationFrame, setImmediate) with Canvas Animation - Qiita","url":"http://qiita.com/TypoScript/items/ae07b7fe5d5d8d526110","tags":["JavaScript","animation"],"content":"JavaScriptの時刻を取得するAPIについて詳しい記事。\nタイマーの分解能やベースクロックという考え方について","relatedLinks":[]},{"category":"Article","title":"A Detailed Explanation of JavaScript Game Loops and Timing | Isaac Sukin","url":"http://www.isaacsukin.com/news/2015/01/detailed-explanation-javascript-game-loops-and-timing","tags":["JavaScript","game","library"],"content":"JavaScriptで正しいメインループを実装するにはどうするかについて。","relatedLinks":[{"title":"IceCreamYou/MainLoop.js","url":"https://github.com/IceCreamYou/MainLoop.js"}]},{"category":"Article","title":"関数型なAltJS、PureScriptの入門書を邦訳しました。 - Qiita","url":"http://qiita.com/hiruberuto/items/f1e048fc9a8ca51eddb2","tags":["JavaScript","book","翻訳"],"content":"PureScriptの入門書の翻訳","relatedLinks":[]},{"category":"WebsiteDocument","title":"Browser","url":"http://browser.hatenablog.com/","tags":["IE","blog","browser"],"content":"IEやSpartan等の情報を追ってるブログ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"alfredkam/yakojs","url":"https://github.com/alfredkam/yakojs","tags":["JavaScript","グラフ","SVG"],"content":"DOM-lessなグラフライブラリ。\nSVGグラフを吐き出せるようにすることでサーバサイドでも同じ出力結果を出せるようにする目的","relatedLinks":[]},{"category":"SoftwareLibrary","title":"MUI - Material Design CSS Framework","url":"https://www.muicss.com/","tags":["HTML","CSS","JavaScript","library"],"content":"Material Design guidelinesに則ったデザインをするためのフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"yahoo/blink-diff","url":"https://github.com/yahoo/blink-diff","tags":["画像","testing","library","JavaScript","node.js"],"content":"画像を比較してその差を出したり、一致するかをテストできるJavaScriptライブラリ。\nどれくらいの差を許すか等も設定できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cburgmer/csscritic","url":"https://github.com/cburgmer/csscritic","tags":["CSS","testing","library"],"content":"CSSのレグレッションテストフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mojo-js/obj-stream","url":"https://github.com/mojo-js/obj-stream","tags":["JavaScript","library","browser"],"content":"Stream的なAPIを持ったライブラリ。\nオブジェクトをStreamに流すことができ、EventEmitterを使ったStream的なものなのでブラウザでも動作する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"WebRx - Dynamic JavaScript User-Interfaces with ReactiveX","url":"http://webrxjs.org/","tags":["Rx","JavaScript","MVC","library"],"content":"RxJSを使ったMVVMフレームワーク。\nAngularやKnockoutJSからインスパイアしている部分がある。TypeScriptで書かれている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mattdesl/budo","url":"https://github.com/mattdesl/budo","tags":["JavaScript","サーバー","開発環境","Tools"],"content":"Live Reloadする開発用のローカルサーバ。\nhttps://github.com/caspervonb/amok のように、ブラウザの更新なしで変更を反映するHot Reloadingを行う拡張も持っている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"RQ","url":"http://www.rq.crockford.com/","tags":["JavaScript","Promises","library"],"content":"Douglas Crockford製のPromiseハンドリングライブラリ。\nsequence、parallel、race、fallbackなどの複数のPromiseの流れを扱うライブラリ","relatedLinks":[]}]},{"meta":{"title":"2015-04-20のJS: ECMAScript6最終ドラフト、JavaScriptトレーニング","author":"azu","layout":"post","date":"2015-04-20T13:12:00.000Z","category":"JSer","tags":["ECMAScript","JavaScript","tutorial"],"url":"https://jser.info/2015/04/20/es6-final-draft-js-traning/"},"items":[{"category":"Headline","title":"April 14, 2015 Rev 38 Final Draft - Draft Specification for ES.next (Ecma-262 Edition 6)","url":"http://wiki.ecmascript.org/doku.php?id=harmony:specification_drafts#april_14_2015_rev_38_final_draft","tags":[],"content":"ECMAScript 2015(ES6)の最終ドラフトがリリース。","relatedLinks":[]},{"category":"Headline","title":"React v0.13.2 | React","url":"http://facebook.github.io/react/blog/2015/04/18/react-v0.13.2.html","tags":["React","ReleaseNote"],"content":"React v0.13.2リリース。\nreact toolsに`--es6module`のオプションを追加など","relatedLinks":[{"title":"Document new es6module flag in react-tools README by TimeBomb · Pull Request #3618 · facebook/react","url":"https://github.com/facebook/react/pull/3618"}]},{"category":"Headline","title":"Release electron v0.24.0 · atom/electron","url":"https://github.com/atom/electron/releases/tag/v0.24.0","tags":["atom","ReleaseNote"],"content":"Atom Shell 0.24.0リリース。\nAtom ShellはElectronにリネームされた","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at master · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/master/Changelog.md#500","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"jsdom 5.0.0リリース。\n`document.cookie`周りの修正が中心","relatedLinks":[]},{"category":"Headline","title":"Release v0.8.0 · airportyh/testem","url":"https://github.com/airportyh/testem/releases/tag/v0.8.0","tags":["JavaScript","testing","ReleaseNote"],"content":"Testem 0.8.0リリース。\nSauce Labsのようにリモートとつないで実行する場合の挙動を改善","relatedLinks":[]},{"category":"Headline","title":"Release v0.11.0: ES6 support (2015-04-18) · twada/power-assert","url":"https://github.com/twada/power-assert/releases/tag/v0.11.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"power-assert 0.11.0リリース。\nES6の構文をサポート","relatedLinks":[{"title":"ES6 support by twada · Pull Request #17 · twada/power-assert","url":"https://github.com/twada/power-assert/pull/17"},{"title":"twada/babel-plugin-espower","url":"https://github.com/twada/babel-plugin-espower"}]},{"category":"Headline","title":"Chromium Blog: Chrome 43 Beta: Web MIDI and upgrading legacy sites to HTTPS","url":"http://blog.chromium.org/2015/04/chrome-43-beta-web-midi-and-upgrading.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 43 Betaリリース。\nWeb MIDI APIがデフォルトで有効に、Permissions APIのサポート、DOM属性がprototype chainに移動、Flashなしでもクリップボードへのコピーが出来るように、Fetchでレスポンスをストリーミング出来るようになるなど","relatedLinks":[{"title":"Permissions API for the Web","url":"http://updates.html5rocks.com/2015/04/permissions-api-for-the-web"},{"title":"DOM Attributes now on the prototype chain","url":"http://updates.html5rocks.com/2015/04/DOM-attributes-now-on-the-prototype"},{"title":"Cut and Copy Commands","url":"http://updates.html5rocks.com/2015/04/cut-and-copy-commands"},{"title":"yutakahirano/fetch-with-streams","url":"https://github.com/yutakahirano/fetch-with-streams/"}]},{"category":"Article","title":"Getting started with Node.js and Mocha - Semaphore","url":"https://semaphoreci.com/community/tutorials/getting-started-with-node-js-and-mocha","tags":["node.js","testing","JavaScript","tutorial"],"content":"Mochaを使ったテストについて。\nMochaの基本的な使い方やexpressを使って実装したウェブサーバのテストについて簡潔にまとめられている","relatedLinks":[]},{"category":"Article","title":"Fullscreen API と 闇 - Browser","url":"http://browser.hatenablog.com/entry/2015/04/18/121248","tags":["JavaScript","browser"],"content":"ブラウザ間のFullscreen APIの挙動の違いについて","relatedLinks":[]},{"category":"Article","title":"Permissions API for the Web","url":"http://updates.html5rocks.com/2015/04/permissions-api-for-the-web","tags":["JavaScript","WebPlatformAPI"],"content":"パーミッションを確認するAPI。\n`navigator.permissions`について","relatedLinks":[]},{"category":"Article","title":"JavaScriptでフルスクラッチゲーム開発しよう 第1回 準備編 - Qiita","url":"http://qiita.com/zukkun/items/4ea9542a6dde45c6a9fd","tags":["game","JavaScript"],"content":"一からJavaScriptでゲーム(ゲームエンジン)を作る連載。\nフレームごとの更新、Canvasを使った描画、画像の読み込みなどゲームフレームワークは使わずに書いていく話","relatedLinks":[]},{"category":"SlideVideo","title":"Controllable React Components // Speaker Deck","url":"https://speakerdeck.com/lettertwo/controllable-react-components","tags":["React","スライド"],"content":"ReactでES6 Classesを使ったComponentを作るスライド。\nComponent内では常にstateじゃなくpropsを使いたい、FormのControlled Componentでもpropsを使うための高階関数について","relatedLinks":[{"title":"Forms | React","url":"http://facebook.github.io/react/docs/forms.html#controlled-components"},{"title":"matthewwithanm/react-controllables","url":"https://github.com/matthewwithanm/react-controllables"}]},{"category":"WebsiteDocument","title":"ES Weekly Newsletter","url":"http://esweekly.com/","tags":["JavaScript","ECMAScript","mail"],"content":"ECMAScriptについての週刊のメールマガジン","relatedLinks":[]},{"category":"WebsiteDocument","title":"mixi-inc/JavaScriptTraining","url":"https://github.com/mixi-inc/JavaScriptTraining","tags":["JavaScript","tutorial"],"content":"mixi社のJavaScript研修資料。\nテストを通すことで進んでいけるような内容になっている。\nDOM操作、DOMイベント、非同期処理、PromiseとFetch API、bowerを使ったパッケージ管理などについて","relatedLinks":[{"title":"2日でできる！JavaScript トレーニング - mixi Engineers","url":"http://alpha.mixi.co.jp/entry/2015/04/17/155003"}]},{"category":"WebsiteDocument","title":"ARIA in HTML 日本語訳","url":"http://momdo.github.io/html-aria/","tags":["HTML","WAI-ARIA","spec"],"content":"HTMLとWAI-ARIAの属性についての要件をまとめた仕様。\nある要素のデフォルトのARIAセマンティクスと使用してもよいARIAロールについて簡潔にまとめられている","relatedLinks":[{"title":"ARIA in HTML 日本語訳を公開した - 水底の血","url":"http://momdo.hatenablog.jp/entry/20150418/1429345964"}]},{"category":"WebsiteDocument","title":"Hacklone/private-bower","url":"https://github.com/Hacklone/private-bower","tags":["JavaScript","オープンソース"],"content":"Private bower registry","relatedLinks":[]},{"category":"WebsiteDocument","title":"HAR Resources | A community curated list of resources, tools, projects and applications that support HTTP Archive (HAR)","url":"https://ahmadnassri.github.io/har-resources","tags":["HTTP","performance","Tools","まとめ"],"content":"HTTP Archive(HAR)を扱うツールやリソースのまとめ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"acornejo/jjv","url":"https://github.com/acornejo/jjv","tags":["JavaScript","node.js","JSON","library"],"content":"JSON Schemaの定義とバリデーションを行うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"caiogondim/logdown","url":"https://github.com/caiogondim/logdown","tags":["JavaScript","node.js","library"],"content":"ロガー + Markdownなライブラリ。\nブラウザ、Node.jsどちらでも動作する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"T3 JavaScript Framework - T3 JavaScript Framework","url":"http://t3js.org/","tags":["JavaScript","library"],"content":"Box社のJavaScriptフレームワーク。\nAngularJS 1.x系みたいなモジュールの仕組みだが、基本はコンパクトでコールスタックもかなり浅くなるように作られている。`debug`オプションを有効にすることでエラーが取りやすいように設計されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vdemedes/interaptor","url":"https://github.com/vdemedes/interaptor","tags":["node.js","HTTP","testing","library"],"content":"mitmを使ったHTTP stubライブラリ。\n特定のリクエストに対して任意のレスポンスを定義して返せる","relatedLinks":[]}]},{"meta":{"title":"2015-04-29のJS: Globalize 1.0、Flux実装、Code Smellsの検出","author":"azu","layout":"post","date":"2015-04-29T14:17:00.000Z","category":"JSer","tags":["i18n","Flux","JavaScript"],"url":"https://jser.info/2015/04/29/globalize-flux-code-smells/"},"items":[{"category":"Headline","title":"Pixi.js v3 - Goodboy™ — Goodboy™","url":"http://www.goodboydigital.com/pixi-js-v3/","tags":["game","JavaScript","library"],"content":"JavaScriptゲームエンジンのpixi.js v3リリース。\nWebGL Renderer、Particle Containerの追加、Interaction、Resolution管理の改善など","relatedLinks":[]},{"category":"Headline","title":"jQuery 1.11.3 and 2.1.4 Released – iOS Fail-Safe Edition | Official jQuery Blog","url":"http://blog.jquery.com/2015/04/28/jquery-1-11-3-and-2-1-4-released-ios-fail-safe-edition/","tags":["jQuery","ReleaseNote"],"content":"jQuery 1.11.3と2.1.4リリース。\niOS 8.2と8.3向けのワークアラウンドの追加","relatedLinks":[{"title":"Prevent iOS from improperly JIT-ing isArrayLike by jridgewell · Pull Request #2094 · jashkenas/underscore","url":"https://github.com/jashkenas/underscore/pull/2094"},{"title":"Bug 142792 – Objects with numeric properties intermittently get a phantom ","url":"https://bugs.webkit.org/show_bug.cgi?id=142792"}]},{"category":"Headline","title":"Dev.Opera — Opera 29 released","url":"https://dev.opera.com/blog/opera-29/","tags":["Opera","ReleaseNote"],"content":"Opera 29(based on Chromium 42)リリース。\nES6 Classes、object literalsの拡張サポート、Fetch APIがwindowコンテキストでも利用できるように、Web Audio APIの仕様追従など","relatedLinks":[]},{"category":"Headline","title":"Announcing PEP 0.3.0 | Official jQuery Blog","url":"http://blog.jquery.com/2015/04/21/announcing-pep-0-3-0/","tags":["JavaScript","library"],"content":"PEP(Pointer Events Polyfill) 0.3.0リリース","relatedLinks":[]},{"category":"Headline","title":"Announcing Globalize 1.0 | Official jQuery Blog","url":"http://blog.jquery.com/2015/04/23/announcing-globalize-1-0/","tags":["JavaScript","i18n","library"],"content":"Unicode CLDRベースの国際化対応ライブラリであるGlobalize 1.0リリース","relatedLinks":[]},{"category":"Article","title":"ES6 を学べる tower-of-babel を作りました。 (workshopper の作り方) - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2015/04/26/104521","tags":["ECMAScript","JavaScript","tutorial"],"content":"workshopper / workshopper-exerciseを使ったエクササイズの作り方について","relatedLinks":[]},{"category":"Article","title":"JavaScriptでパーサコンビネータのコンセプトを理解する(「正規表現だけに頼ってはいけない」の続き) - id:anatooのブログ","url":"http://blog.anatoo.jp/entry/2015/04/26/220026","tags":["JavaScript","program"],"content":"JavaScriptでパーサコンビネータを実装して、パーサコンビネータについて学ぶ話","relatedLinks":[]},{"category":"Article","title":"【翻訳】ReactをjQueryの数行に要約する | POSTD","url":"http://postd.cc/boiling-react-down-to-a-few-lines-in-jquery/","tags":["jQuery","React","JavaScript","翻訳"],"content":"jQueryで書いたコードにReactのアイデアを適応して、状態の変更とDOMへの反映へと処理を分けていく話。\nVirtual DOMやimmutabilityについても触れている","relatedLinks":[]},{"category":"Article","title":"SinonJs Spies – Zsolt Nagy – Development of Maintainable Web-Applications","url":"http://zsolt-nagy.github.io/SinonJs-Spies/","tags":["JavaScript","testing"],"content":"Sinon.JSのspyを使ったテストについて","relatedLinks":[]},{"category":"SlideVideo","title":"10分で実装するFlux","url":"http://azu.github.io/slide/react-meetup/flux.html","tags":["JavaScript","Flux","library","スライド"],"content":"一からFluxアーキテクチャを実装してみてFluxがどういう仕組みで回ってるのかを確認していくスライド。\nFluxの特徴であるデータの一方通行に流れているかをスタックトレースで確認する","relatedLinks":[{"title":"橋本商会 » flux.DispatcherのwaitForの実装","url":"http://shokai.org/blog/archives/9905"},{"title":"React+FluxでTodoMVCを作ってFluxについて学んでみた - yutaponのブログ","url":"http://yutapon.hatenablog.com/entry/2015/04/27/150000"}]},{"category":"SlideVideo","title":"ReactとFluxのこと // Speaker Deck","url":"https://speakerdeck.com/geta6/reacttofluxfalsekoto","tags":["React","Flux","スライド"],"content":"Reactによって富豪的なViewの描画が現実的なレベルに落とせる話やFluxアーキテクチャがどういう形でデータを一方通行に回すかについて書かれているスライド","relatedLinks":[{"title":"社内勉強会でReactとFluxについて喋った - pixiv engineering blog","url":"http://inside.pixiv.net/entry/2015/04/27/170944"}]},{"category":"SlideVideo","title":"react-flux-fluent-2015 // Speaker Deck","url":"https://speakerdeck.com/fisherwebdev/react-flux-fluent-2015","tags":["React","Flux","スライド"],"content":"[facebook/flux](https://github.com/facebook/flux \"facebook/flux\")モジュール作者によるFluxについてのスライド。\nFluxの構成要素、Dispatcher、Storeがシングルトンであること、React、Fluxのアンチパターンについて書かれてる","relatedLinks":[]},{"category":"SlideVideo","title":"Video: JavaScript, HTML5, CSS3 Conference - O&#x27;Reilly Fluent, April 20 - 22, 2015, San Francisco, CA","url":"http://fluentconf.com/javascript-html-2015/public/content/video","tags":["JavaScript","イベント","動画"],"content":"Fluent Conf 2015の動画が公開されている","relatedLinks":[]},{"category":"SlideVideo","title":"ES6 in Production // Speaker Deck","url":"https://speakerdeck.com/pazguille/es6-in-production","tags":["JavaScript","ECMAScript","スライド"],"content":"ES6を使っていくためのスライド。\nnode_modules以下もBrowserify(Babelify)で変換するには、`global`オプションを利用する。ES6で書いたモジュールをES5から使えるように公開する方法、ES6 ClassesやBabelのlooseモードについてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Eliminate JavaScript Code Smells","url":"http://elijahmanor.github.io/talks/js-smells/#/","tags":["JavaScript","Tools","スライド"],"content":"JSHintやESLintを使って複雑なコードの検出、jsinspectやjscpdを使ってコピー&ペーストを検出、色々なあやしいコードを検出するeslint pluginや特定のライブラリをサポートするeslint pluginについて","relatedLinks":[{"title":"elijahmanor/eslint-plugin-smells","url":"https://github.com/elijahmanor/eslint-plugin-smells"}]},{"category":"SlideVideo","title":"Solar System of JS","url":"http://shaunlebron.github.io/solar-system-of-js/#0","tags":["JavaScript","歴史","スライド"],"content":"今のJavaScript、今後のJavaScriptに関係ある要素や言語などをビジュアライズしてるスライド。","relatedLinks":[{"title":"▶ ECMAScript Harmony: Rise of the Compilers - Brendan Eich keynote - YouTube","url":"https://www.youtube.com/watch?v=PlmsweSNhTw"},{"title":"shaunlebron/solar-system-of-js","url":"https://github.com/shaunlebron/solar-system-of-js"}]},{"category":"WebsiteDocument","title":"The WebKit Open Source Project - Web Platform Status","url":"http://www.webkit.org/status.html","tags":["webkit","JavaScript","まとめ"],"content":"WebKitのStatusダッシュボード。 新しい機能等の実装状況について書かれてる。","relatedLinks":[{"title":"Browser Platform Status Tracker","url":"http://platformstatustracker.azurewebsites.net/"}]},{"category":"WebsiteDocument","title":"Loupe","url":"http://latentflip.com/loupe/","tags":["JavaScript","Tools","動画"],"content":"JavaScriptのコールスタック、イベントループ、コールバックキューについて学べるサイトと動画","relatedLinks":[]},{"category":"SoftwareLibrary","title":"HerringtonDarkholme/typescript-repl","url":"https://github.com/HerringtonDarkholme/typescript-repl","tags":["TypeScript","console","Tools"],"content":"コード補完もできるTypeScript REPL","relatedLinks":[]},{"category":"SoftwareLibrary","title":"angus-c/es6-react-mixins","url":"https://github.com/angus-c/es6-react-mixins","tags":["ECMAScript","React","library"],"content":"React ComponentのmixinをES6 Classesを使って行うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rambler-digital-solutions/es6-class-mixin","url":"https://github.com/rambler-digital-solutions/es6-class-mixin","tags":["JavaScript","library"],"content":"ES6 Classesでのmixinを行うライブラリ。\n`class Input extends mixin(BaseClass. mixin) {}` という感じでBaseClassを拡張したクラスをその場で作成する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mohayonao/tickable-timer","url":"https://github.com/mohayonao/tickable-timer","tags":["JavaScript","testing","library"],"content":"setTimeout/setInterval互換のAPIを持ち、任意の間隔で進めたり、イベント通知の機能を持つテスト向けのタイマーライブラリ","relatedLinks":[]},{"category":"Book","title":"Security for Web Developers: Using JavaScript, HTML, and CSS: John Paul Mueller: 9781491928646: Amazon.com: Books","url":"http://www.amazon.com/Security-Web-Developers-Using-JavaScript/dp/1491928646","tags":["JavaScript","CSS","HTML","セキュリティ","book"],"content":"2015年9月25日発売\nウェブ開発者向けのセキュリティについての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-05-06のJS: io.js 2.0.0、Microsoft Edge、Isomorphic","author":"azu","layout":"post","date":"2015-05-06T13:09:00.000Z","category":"JSer","tags":["Node.js","io.js","ECMAScript","MS","IE"],"url":"https://jser.info/2015/05/06/iojs2.0.0-msedge-isomorphic/"},"items":[{"category":"Headline","title":"Introducing Microsoft Edge Dev","url":"http://blogs.windows.com/msedgedev/2015/05/05/introducing-microsoft-edge-dev/","tags":["MSEdge","browser"],"content":"新しいブラウザ名がMicrosoft Edgeとなり、それに関連して[dev.modern.ie](http://dev.modern.ie/)というMSEdgeについてを扱うサイトが公開された。","relatedLinks":[{"title":"Microsoft Edge is the browser for Windows 10 - IEBlog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/ie/archive/2015/04/29/microsoft-edge-is-the-browser-for-windows-10.aspx"},{"title":"Developer Resources : MSEdge Dev","url":"http://dev.modern.ie/"},{"title":"Microsoft Edge","url":"https://github.com/MicrosoftEdge/"}]},{"category":"Headline","title":"io.js/CHANGELOG.md at master · iojs/io.js","url":"https://github.com/iojs/io.js/blob/master/CHANGELOG.md#2015-05-04-version-200-rvagg","tags":["node.js","ReleaseNote"],"content":"io.js 2.0.0リリース。\nBreaking ChangesはV8のC++ APIの変更と`os.tmpdir()`のみ。\nV8のアップデートによるES6対応の追加など","relatedLinks":[{"title":"yosuke-furukawa/iojs-new-features","url":"https://github.com/yosuke-furukawa/iojs-new-features"},{"title":"io.js の v2.0 が出ました。 - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2015/05/06/170034"}]},{"category":"Headline","title":"Announcing TypeScript 1.5 Beta - TypeScript - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/typescript/archive/2015/04/30/announcing-typescript-1-5-beta.aspx","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 1.5 Betaリリース。","relatedLinks":[]},{"category":"Headline","title":"zuul/HISTORY.md at v3.0.0 · defunctzombie/zuul","url":"https://github.com/defunctzombie/zuul/blob/v3.0.0/HISTORY.md","tags":["JavaScript","testing","library"],"content":"JavaScriptテストフレームワークのzuul 3.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Brackets Blog - The Free, Open Source Code Editor for the Web","url":"http://blog.brackets.io/2015/04/27/brackets-1-3-release-is-here/","tags":["JavaScript","editor","ReleaseNote"],"content":"Brackets 1.3リリース。\nbracketsコマンドの追加、Code Foldingのサポート、Brackets Health Dataというユーザ情報を収集する仕組みが入った","relatedLinks":[]},{"category":"Article","title":"Basket.js: Script loader that caches scripts in localStorage — Medium","url":"https://medium.com/@karimaliz/basket-js-script-loader-that-caches-scripts-in-localstorage-544a93827a5","tags":["JavaScript","library"],"content":"localStorageにモジュールをキャッシュするローダライブラリのbasket.jsについて","relatedLinks":[]},{"category":"Article","title":"Designing Front-End Components","url":"http://ponyfoo.com/articles/designing-front-end-components","tags":["JavaScript","UI","library"],"content":"UIライブラリを作るにあたり気をつける事。\nインラインスタイルを避けるべき、CSSクラスのprefixを付ける、スタイルは最小にする、ライブラリはplainなCSSを提供する。\n見通しの良いAPIと柔軟なAPI設計について","relatedLinks":[{"title":"bevacqua/rome","url":"https://github.com/bevacqua/rome#default-options"}]},{"category":"Article","title":"npmで名前空間を持ったモジュールを公開する方法(scoped modules) | Web Scratch","url":"http://efcl.info/2015/04/30/npm-namespace/","tags":["npm","node.js"],"content":"npmでscoped modulesを無料で公開できるようになった。\nユーザ名を名前空間として使えるためモジュール名の重複を気にせず公開できる話","relatedLinks":[]},{"category":"Article","title":"Ruby Sass, LibSass – What&#x27;s the Difference?","url":"http://sassbreak.com/ruby-sass-libsass-differences/","tags":["Sass","ruby","C++"],"content":"LibSassとRuby Sassの違いについて\nLibSassの方が圧倒的に早いことや互換性について","relatedLinks":[]},{"category":"Article","title":"ES6 — strings — Medium","url":"https://medium.com/@mrzepinski/es6-string-bae03d964d43","tags":["ECMAScript","JavaScript"],"content":"ES6のString関係のメソッドについてのまとめ","relatedLinks":[]},{"category":"SlideVideo","title":"Isomorphic Survival Guide // Speaker Deck","url":"https://speakerdeck.com/koichik/isomorphic-survival-guide","tags":["JavaScript","サーバー","スライド"],"content":"isomorphicというキーワードを歴史的な流れを踏まえて解説するスライド。\nフロントエンド/バックエンド/クライアントサイド/サーバサイドという言葉の意味の変遷、isomorphicの構成要素、Rendrが解決した事、React/Fluxが解決できている事などについて","relatedLinks":[{"title":"isomorphic tokyo meetupに参加してきた","url":"https://html5experts.jp/shumpei-shiraishi/14895/"}]},{"category":"WebsiteDocument","title":"javascript/react at master · airbnb/javascript","url":"https://github.com/airbnb/javascript/tree/master/react","tags":["React","コードレビュー"],"content":"AirbnbのReactコードスタイルガイド","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ESDoc - An API Document Generator For JavaScript(ES6)","url":"https://esdoc.org/","tags":["JavaScript","document","JSDoc","Tools"],"content":"ES6のコードに対応したAPIドキュメント生成ツール。\n基本的にはJSDocと同じようにタグ(`@param`など)からドキュメントを生成できる。\nES6の`class`や`import/export`等に対応、ドキュメントのカバレッジの計測、テストコードとドキュメントの関連付けを行える","relatedLinks":[{"title":"ESDocというJavaScript向けのAPIドキュメントツールを作りました - maru source","url":"http://blog.h13i32maru.jp/entry/2015/05/06/221041"},{"title":"Use JSDoc: Index","url":"http://usejsdoc.org/"}]},{"category":"SoftwareLibrary","title":"Home - Visual Studio Code","url":"https://code.visualstudio.com/","tags":["IDE","MS"],"content":"[Electron](https://github.com/atom/electron \"Electron\")ベースのエディタであるVisual Studio Codeのサイト。\nASP.NETとNode.js、TypeScriptを中心にサポート。\nWindows/Mac/Linuxに対応してる","relatedLinks":[{"title":"Using TypeScript in Visual Studio Code - TypeScript - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/typescript/archive/2015/04/30/using-typescript-in-visual-studio-code.aspx"}]},{"category":"SoftwareLibrary","title":"Vorlon.JS","url":"http://vorlonjs.com/","tags":["browser","debug","Tools"],"content":"スクリプトタグを埋め込んでおくとリモートデバッグ出来るツール。\nConsole、DOMツリーの表示、Modernizrを使ったサポート状況の表示などが出来る。\nまたpluginで拡張する事が出来る","relatedLinks":[{"title":"MicrosoftDX/Vorlonjs","url":"https://github.com/MicrosoftDX/Vorlonjs"}]},{"category":"SoftwareLibrary","title":"Clusterize.js","url":"http://nexts.github.io/Clusterize.js/","tags":["JavaScript","library"],"content":"大量のリストを表示するときに上手く間引いてDOMの描画を行うライブラリ。\n無限スクロール的なものを実装出来るライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"micmro/performance-bookmarklet","url":"https://github.com/micmro/performance-bookmarklet","tags":["browser","performance","ブックマークレット"],"content":"Resource Timing API、Navigation Timing API、User-Timing APIの結果を表示するブックマークレットやブラウザ拡張","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ramjet","url":"http://www.rich-harris.co.uk/ramjet/","tags":["JavaScript","DOM","animation","library"],"content":"スムーズなDOMモーフィングの実装ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"paldepind/flyd","url":"https://github.com/paldepind/flyd","tags":["JavaScript","library"],"content":"小さなFRPライブラリ。\nモジュールで拡張可能な作り","relatedLinks":[]}]},{"meta":{"title":"2015-05-12のJS: ECMAScript 2015(ES6)入門、最近のnpmの変更点を見る","author":"azu","layout":"post","date":"2015-05-12T10:21:00.000Z","category":"JSer","tags":["ES6","ECMAScript","npm","Node.js"],"url":"https://jser.info/2015/05/12/ecmascript2015-npm/"},"items":[{"category":"Headline","title":"ESLint 0.21.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/05/eslint-0.21.0-released","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 0.21.0リリース。\n`eslint --init`で設定ファイルの作成をインタラクティブに行えるように、外部の設定ファイルを継承出来るようになり、また[Shareable Configs](http://eslint.org/docs/developer-guide/shareable-configs \"Shareable Configs\")というドキュメントが追加された","relatedLinks":[]},{"category":"Headline","title":"React v0.13.3 | React","url":"https://facebook.github.io/react/blog/2015/05/08/react-v0.13.3.html","tags":["React","ReleaseNote"],"content":"React v0.13.3リリース。\nES6 Classesを使った時に非推奨メソッドの警告を改善、\n`dangerouslySetInnerHTML`で値がundefinedの時に例外を投げないようになるなど","relatedLinks":[]},{"category":"Article","title":"Rubyist Magazine - 2015 年の JavaScript と babel の話","url":"http://magazine.rubyist.net/?0050-ECMAScript2015","tags":["JavaScript","ECMAScript"],"content":"ES6の概要を紹介する記事","relatedLinks":[{"title":"Hello, ES6 ~これから迎えるJSのミライ~ - @yoshiko_pg","url":"http://yoshiko-pg.github.io/slides/20150425-jsfes/"}]},{"category":"Article","title":"Deku: How we built our functional alternative to React","url":"https://segment.com/blog/deku-our-functional-alternative-to-react/","tags":["JavaScript","DOM","UI","library"],"content":"Virtual DOMを持ち、Reactのようなライフサイクルを持つコンポーネントライブラリ。\nES6 Classesではなくライフサイクルに対応する関数をexportする形式となっていて`this`を気にせず書くことができる。\nBabelのオプションを使いJSXで書くこともでき、Node.js上でも動作するためサーバサイドレンダリングが行える。\nファイルサイズが10kb程度。","relatedLinks":[{"title":"segmentio/deku","url":"https://github.com/segmentio/deku"}]},{"category":"Article","title":"Milliseconds Matter Modern JavaScript libraries: the isomorphic way","url":"https://blog.algolia.com/modern-javascript-libraries-the-isomorphic-way/","tags":["JavaScript","tutorial"],"content":"Node.jsとブラウザどちらでも動くライブラリを書いていく記事。\nfaux-jaxを使ったXHRのテストをzuulで動かす。コールバックとPromiseのサポートについてやBrowserify等を使ったモジュールの変換、後方互換ガイドの書き方についてなど","relatedLinks":[{"title":"algolia/faux-jax","url":"https://github.com/algolia/faux-jax"}]},{"category":"Article","title":"Immutability in JavaScript","url":"http://www.sitepoint.com/immutability-javascript/","tags":["JavaScript"],"content":"immutable.jsを使ったJavaScriptでのImmutabilityの実現について。\n実行コストはどうなのか、逆にどういう点でコストが小さくなるのか","relatedLinks":[]},{"category":"Article","title":"The Core Concepts of Angular 2 | Victor Savkin","url":"http://victorsavkin.com/post/118372404541/the-core-concepts-of-angular-2","tags":["AngularJS","設計"],"content":"AngularJS 2のコアコンセプトについて。\nテンプレート、ライフサイクル、DI、コンポーネントなどの構成要素について。","relatedLinks":[{"title":"angular/zone.js","url":"https://github.com/angular/zone.js"}]},{"category":"Article","title":"A break from the past, part 2: Saying goodbye to ActiveX, VBScript, attachEvent…","url":"https://blogs.windows.com/msedgedev/2015/05/06/a-break-from-the-past-part-2-saying-goodbye-to-activex-vbscript-attachevent/","tags":["MSEdge","IE"],"content":"MSEdgeで削除されたIE特有の機能などについて。(IEから引き継がなかった機能)\n逆に`-webkit-border-radius`のようなものを既存のウェブサイトの互換性のためにサポートしている","relatedLinks":[]},{"category":"SlideVideo","title":"npm update -g npm // Speaker Deck","url":"https://speakerdeck.com/watilde/npm-update-g-npm","tags":["npm","スライド"],"content":"npmの最近の変更点についてのスライド","relatedLinks":[]},{"category":"WebsiteDocument","title":"Front-end Dev Weekly JP","url":"http://front-end-dev-weekly-jp.github.io/","tags":["browser","翻訳","blog"],"content":"Front-end Dev Weeklyの翻訳","relatedLinks":[{"title":"Front-end Dev Weekly","url":"https://frontenddevweekly.curated.co/"}]},{"category":"SoftwareLibrary","title":"jQuery - The Write Less, Do More, JavaScript Library","url":"http://cyokodog.github.io/JS_STUDY/web-audio/presen/","tags":["JavaScript","audio","動画","スライド"],"content":"Web Audio API、MediaStream Processing API、Web Speech API、Speech Recognition APIの紹介的なスライド","relatedLinks":[]},{"category":"SoftwareLibrary","title":"getify/es-feature-tests","url":"https://github.com/getify/es-feature-tests","tags":["JavaScript","library","testing"],"content":"ECMAScript 6以降の機能についてfeature detectを実行して結果を取得するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Challenger.js","url":"http://rileyjshaw.com/challenger/","tags":["JavaScript","library","AST"],"content":"練習問題などを作るライブラリ。\n期待する結果をコードで書いて検証でき、また入力されるコードをASTのNode名などを使ったwhitelist、blacklist方式で制限できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nkzawa/hyperd","url":"https://github.com/nkzawa/hyperd","tags":["JavaScript","UI","library"],"content":"virtual-domを使ったUIコンポーネントライブラリ。\nhtml-to-domでHTMLからvirtual-domへの変換をすることで任意のテンプレートエンジンを使える。\nまた、コンポーネント自体がEventEmitterを継承している。","relatedLinks":[]}]},{"meta":{"title":"2015-05-19のJS: Firefox 38、Backbone.js 1.2.0、マイクロベンチマークの問題","author":"azu","layout":"post","date":"2015-05-19T14:03:00.000Z","category":"JSer","tags":["Firefox","Backbone","MVC","V8","ベンチマーク"],"url":"https://jser.info/2015/05/19/firefox38-babel-bench/"},"items":[{"category":"Headline","title":"Node v0.12.3 (Stable)","url":"http://blog.nodejs.org/2015/05/13/node-v0-12-3-0.12.3/","tags":["node.js","ReleaseNote"],"content":"ode v0.12.3リリース\n","relatedLinks":[]},{"category":"Headline","title":"# 0.9 released!\n","url":"http://blog.polymer-project.org/announcements/2015/05/14/0.9-release/","tags":["WebComponents","JavaScript","library"],"content":"lymer 0.9リリース。\n0.8でexperimentalだった機能がデフォルトサポートされている。\n`:root`セレクタ、Gesture、CSPのサポートやUtilの追加など。\nBreaking Changeもあり、Migration guideが用意されている\n\n","relatedLinks":[{"title":"Release notes - Polymer","url":"https://www.polymer-project.org/0.9/docs/release-notes.html"},{"title":"Migration guide - Polymer","url":"https://www.polymer-project.org/0.9/docs/migration.html"}]},{"category":"Headline","title":" Ember.js - Ember.js 1.12 and 1.13 Beta (Glimmer!) Released\n[","url":"http://emberjs.com/blog/2015/05/13/ember-1-12-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"er.js 1.12と1.13 Betaリリース。\ncomputeにgetter/setterを使った方法を追加、併せてDecoratorsを使った方法をサポートする予定\n\n-","relatedLinks":[]},{"category":"Headline","title":"Backbone.js\n[b","url":"http://backbonejs.org","tags":["backbone.js","library","ReleaseNote"],"content":"bone.js 1.2.0リリース\nViewの作成などをhookする機能の追加、モデルの\"update\"イベントの追加、ユニークidとなる`modeld`の追加、ES6 modulesとして読み込んでも使えるように修正\n\n- ","relatedLinks":[{"title":"Use Function(","url":"https://github.com/jashkenas/underscore/issues/2152"},{"title":"ES6 moduleのtop levelにある","url":"http://efcl.info/2015/05/06/this-is-es6-module/"}]},{"category":"Headline","title":"irefox — Notes (38.0) — Mozilla\n[ww","url":"https://www.mozilla.org/en-US/firefox/38.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"ox 38.0リリース。\nRuby要素のサポート、WebSocketがWeb Workerで動作するように、BroadcastChannel API、`srcset`属性とpicture要素のサポート、開発者ツールで`copy`関数のサポートなど\n\n- [","relatedLinks":[{"title":"Ruby support in Firefox Developer Edition 38 ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/03/ruby-support-in-firefox-developer-edition-38/"},{"title":"Trainspotting: Firefox 38 ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/05/trainspotting-firefox-38/"},{"title":"Firefox 38の性能を検証 ゲーム・プラットフォームとしての優秀さを示す - Mozilla Flux","url":"http://rockridge.hatenablog.com/entry/2015/05/13/003218"},{"title":"Firefox 38 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/38"},{"title":"Firefox 38 サイト互換性情報 - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/38/Site_Compatibility"},{"title":"HTML5 Web Messaging is a W3C Recommendation | W3C News","url":"http://www.w3.org/blog/news/archives/4704?pk_campaign=feed&pk_kwd=html5-web-messaging-is-a-w3c-recommendation"}]},{"category":"Headline","title":"bel/CHANGELOG.md at v5.3.0 · babel/babel\n[git","url":"https://github.com/babel/babel/blob/v5.3.0/CHANGELOG.md#530","tags":["JavaScript","Tools","ReleaseNote"],"content":"5.3.0リリース。\n5.2.0からの主な変更点としては`es7.trailingCommas` transformerの仕様追従、`retainLines`のオプション追加など\n\n- [r","relatedLinks":[{"title":"retainLines","url":"http://babeljs.io/docs/usage/options/"}]},{"category":"Article","title":" Babel Matters\n[code","url":"http://codemix.com/blog/why-babel-matters","tags":["JavaScript"],"content":"本的な機能の紹介、ES.nextと言われるようなまだ標準化されてない仕様の対応、Babel pluginでのコードの最適化や型チェック、マクロなどASTを扱うプラットフォームとして見るBabelについて\n\n----\n","relatedLinks":[]},{"category":"Article","title":"tion Bind Syntax · Babel\n[babel","url":"https://babeljs.io/blog/2015/05/14/function-bind","tags":["ECMAScript","JavaScript"],"content":"4でES.nextで提案されているStage 0の`::`によるBind構文の変換をサポート。\n[Function Bind Syntax](https://github.com/zenparsing/es-function-bind \"Function Bind Syntax\")の挙動についての解説\n\n----\n\n","relatedLinks":[]},{"category":"Article","title":"sted How Googlebot Crawls Javascript And Here&#x27;s What We Learned\n[search","url":"http://searchengineland.com/tested-googlebot-crawls-javascript-heres-learned-220157","tags":["JavaScript","google","検索"],"content":"otがどこまでJavaScript等を解釈してクロールしているかの調査\n\n----\n\n#","relatedLinks":[]},{"category":"Article","title":" Depth: Template strings ✩ Mozilla Hacks – the Web developer blog\n[hacks.m","url":"https://hacks.mozilla.org/2015/05/es6-in-depth-template-strings-2/","tags":["JavaScript","ECMAScript"],"content":"tringsについて。\nBacktickから始まるtemplate literalやtagged templateについて\n\n----\n\n##","relatedLinks":[]},{"category":"Article","title":"ra — The State of Web Type\n[dev.oper","url":"https://dev.opera.com/articles/state-of-web-type/","tags":["browser","fonts","まとめ"],"content":"トに関する機能のブラウザサポートの状況についてのまとめ。\nJustificationとHyphenation、Font Loadingについてなど\n\n- [State ","relatedLinks":[{"title":"State of Web Type","url":"http://stateofwebtype.com/"}]},{"category":"Article","title":"アルテストをするreftest-runnerを作った | Web Scratch\n[efcl.info","url":"http://efcl.info/2015/05/14/reftest-runner/","tags":["browser","testing","canvas","JavaScript","library","webdriver"],"content":"する自動テストライブラリとコマンドラインツール。\n2つのHTMLを用意して表示結果が一致するかどうかテストをするので、Canvasのテストなどに利用できる\n\n----\n\n## A","relatedLinks":[]},{"category":"Article","title":"e Guide to SVG Fallbacks | CSS-Tricks\n[css-tricks","url":"https://css-tricks.com/a-complete-guide-to-svg-fallbacks/","tags":["SVG","まとめ"],"content":"まとめ\n\n----\n\n## Br","relatedLinks":[]},{"category":"Article","title":"ode.js to Windows 10 IoT Core\n[blogs.windo","url":"http://blogs.windows.com/buildingapps/2015/05/12/bringing-node-js-to-windows-10-iot-core/","tags":["node.js","JavaScript"],"content":"iptエンジンを使ったNode.jsのforkが公開された。\n\n- [Microsoft","relatedLinks":[{"title":"Microsoft/node","url":"https://github.com/Microsoft/node"}]},{"category":"Article","title":"annel API in Firefox 38 ✩ Mozilla Hacks – the Web developer blog\n[hacks.mozill","url":"https://hacks.mozilla.org/2015/02/broadcastchannel-api-in-firefox-38/","tags":["firefox","JavaScript","WebPlatformAPI"],"content":"oadcastChannel APIが実装された。\n同じchannelを指定すれば、異なるタブやウィンドウ間でもメッセージのやり取りができるようになるAPI。\nBlobデータのやりとりも可能\n\n- [Broadcast ","relatedLinks":[{"title":"Broadcast Channel API - Web API Interfaces | MDN","url":"https://developer.mozilla.org/en-US/docs/Web/API/Broadcast_Channel_API"}]},{"category":"SlideVideo","title":"re the Weather\n[mrale.ph/talk","url":"http://mrale.ph/talks/goto2015/#/","tags":["JavaScript","performance","スライド"],"content":"イド。\nJSエンジンはJITコンパイルするため計測結果は未最適化+最適化になる。\n場合によっては計測対象がdead codeとなり最適化によって消えているかもしれないので、計測できていないケースも存在する。\nそのことを実際にIRHydra2を使って検証する話\n\n- [V8の最適化とIRHy","relatedLinks":[{"title":"V8の最適化とIRHydraでの可視化とベンチマークについてのメモ | Web Scratch","url":"http://efcl.info/2014/09/13/v8-optimization-memo/"},{"title":"IRHydra2","url":"http://mrale.ph/irhydra/2/"},{"title":"Javaの理論と実践: 欠陥マイクロベンチマークを分析する","url":"http://www.ibm.com/developerworks/jp/java/library/j-jtp02225/"}]},{"category":"SlideVideo","title":"y Smooth Web // Speaker Deck\n[speakerdeck.co","url":"https://speakerdeck.com/paullewis/making-a-silky-smooth-web","tags":["browser","performance","CSS","JavaScript","スライド"],"content":"->Layout->Paint->Compositeという表示までの流れをきれいに行う方法や開発者ツールの使い方について。\nrequestAnimationFrameの活用\n\n----\n\n<h1 class","relatedLinks":[]},{"category":"WebsiteDocument","title":"ype\n[stateofwebtype.","url":"http://stateofwebtype.com/","tags":["fonts","まとめ","検索"],"content":"c機能別のブラウザサポート状況をまとめているサイト\n\n----\n\n<h1 class=","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lugin-typecheck · GitHub\n[github.com/codem","url":"https://github.com/codemix/babel-plugin-typecheck","tags":["JavaScript","babel","flowtype"],"content":"タイム型チェックのコードへ変換するBabel plugin\n\n----\n\n## hit9/ntt","relatedLinks":[]},{"category":"SoftwareLibrary","title":".com/hit9/n","url":"https://github.com/hit9/ntt","tags":["JavaScript","testing","library"],"content":"のもので実行できるので、Mochaなどのようにrunnerにあたる部分は不要となってる\n\n----\n\n## watermark","relatedLinks":[]},{"category":"SoftwareLibrary","title":"termarks in the browser\n[brianium.github.io","url":"http://brianium.github.io/watermarkjs/","tags":["JavaScript","画像","library"],"content":"\n\n----\n\n## Quench: Th","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ile generator.\n[quenchjs.com/](http","url":"http://quenchjs.com/","tags":["gulp","webservice","Tools"],"content":"いての項目を入力してgulpfileを生成してくれるツール。\n\n----\n\n## leebyron/te","relatedLinks":[]},{"category":"SoftwareLibrary","title":"js\n[github.com/leebyron/","url":"https://github.com/leebyron/testcheck-js","tags":["JavaScript","testing"],"content":"eとMochaの拡張が用意されてる\n\n----\n","relatedLinks":[]}]},{"meta":{"title":"2015-05-27のJS: Promiseのありがちな間違い、AngularJS 2に向けて、Plain JS","author":"azu","layout":"post","date":"2015-05-27T13:12:00.000Z","category":"JSer","tags":["Promise","AngularJS","DOM","jQuery"],"url":"https://jser.info/2015/05/27/promise-angular2/"},"items":[{"category":"Headline","title":"async/CHANGELOG.md at master · caolan/async","url":"https://github.com/caolan/async/blob/master/CHANGELOG.md#v100","tags":["JavaScript","library"],"content":"非同期処理を管理するライブラリであるasync 1.0.0リリース。","relatedLinks":[]},{"category":"Article","title":"We have a problem with promises","url":"http://pouchdb.com/2015/05/18/we-have-a-problem-with-promises.html","tags":["JavaScript","Promises","まとめ"],"content":"Promiseの色々な落とし穴やアンチパターンについてよくまとまってる","relatedLinks":[{"title":"JavaScript Promiseの本","url":"http://azu.github.io/promises-book/"}]},{"category":"Article","title":"JavaScript - AngularJSモダンプラクティス - Qiita","url":"http://qiita.com/armorik83/items/5542daed0c408cb9f605","tags":["AngularJS","JavaScript","ECMAScript","tutorial"],"content":"AngularJS 2に移行しやすくするにはどうするかというチュートリアル。\n1.xでもES6 Classesを使った書き方をするためのリファクタリング方法。\nAngularJS 2でのdirective、モジュール、関連ライブラリやツール、FAQなど","relatedLinks":[]},{"category":"Article","title":"Moving to ES6 from CoffeeScript","url":"https://gist.github.com/danielgtaylor/0b60c2ed1f069f118562","tags":["JavaScript","CoffeeScript"],"content":"CoffeeScriptからES6への移行において文法の比較やES6の構文や機能の紹介","relatedLinks":[]},{"category":"Article","title":"ES6 — classes and inheritance — Medium","url":"https://medium.com/@mrzepinski/es6-classes-and-inheritance-607804080906","tags":["JavaScript","ECMAScript"],"content":"ES6 ClassesとES5との書き方比較。\ngetterやsetter、細かいショートハンドとともに紹介してる","relatedLinks":[]},{"category":"Article","title":"Why Backbone.js? - Roost Austin","url":"https://roost.bocoup.com/2015/austin/blog/why-backbone/","tags":["JavaScript","library","MVC"],"content":"JavaScriptライブラリをどのような基準で比較して選択するかについて。\nメジャーなライブラリの統計を比較した図や学習曲線、欠点などについて書かれていて、どのような見方があるかについての話が興味深い","relatedLinks":[]},{"category":"Article","title":"Notifying you of Changes to Notifications","url":"http://updates.html5rocks.com/2015/05/Notifying-you-of-notificiation-changes","tags":["JavaScript"],"content":"Chrome 44でService Workerを使ったプッシュ通知で任意のオブジェクトを渡せるようになり、また`getNotifications()`で特定のtagがついたNotificationのみを取り出せるようになった","relatedLinks":[]},{"category":"Article","title":"graphite, grafana, sitespeed.io, diamond で継続 Web パフォーマンスモニタリング - Qiita","url":"http://qiita.com/Jxck_/items/abfa9f3dd15c5572cbfd","tags":["browser","performance"],"content":"sitespeed.ioを使い実際のブラウザを動かしてTiming API等のクライアントサイドでのメトリクス情報を継続的に取得したデータをgraphiteに保存し可視化する方法について","relatedLinks":[]},{"category":"Article","title":"ここ最近のWeb地図周辺の動向をまとめてみた | #GUNMAGISGEEK","url":"http://shimz.me/blog/map/4268","tags":["JavaScript","GEO","まとめ"],"content":"GeoJSONを始めウェブの地図周りの技術についての変化について","relatedLinks":[]},{"category":"Article","title":"Testing JavaScript — Medium","url":"https://medium.com/@nickheiner/testing-javascript-8c8efe8434e","tags":["JavaScript","testing"],"content":"proxyquireを使ったテスト、E2Eとモック、tapeを使ったテストについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"ウェブクリエイターの為の情報サイト | Web Programming Primer","url":"http://wp-p.info/","tags":["HTML","JavaScript","CSS","tutorial"],"content":"HTML/CSS/JavaScriptの入門的な内容のチュートリアル集","relatedLinks":[]},{"category":"WebsiteDocument","title":"Plain JavaScript - Functions and Helpers","url":"http://plainjs.com/javascript/","tags":["JavaScript","DOM","リファレンス"],"content":"Pure JavaScriptでDOM操作などについての逆引きリファレンス","relatedLinks":[]},{"category":"WebsiteDocument","title":"EmberWeekend","url":"https://emberweekend.com/episodes","tags":["JavaScript","library","podcast"],"content":"Ember.jsについてのpodcast","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sebastian-lenz/typedoc","url":"https://github.com/sebastian-lenz/typedoc","tags":["TypeScript","API","document"],"content":"TypeScriptのAPIドキュメント生成ツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"WebdriverIO - Selenium 2.0 javascript bindings for nodejs","url":"http://webdriver.io/","tags":["node.js","Selenium","webdriver"],"content":"Node.jsのSelenium/WebDriver APIのバインディング。\nモバイルのフリックやタブの切替等色々なAPIが用意されてる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"symdiff","url":"https://symdiff.github.io/","tags":["HTML","CSS","Tools"],"content":"HTMLとCSSを渡して使われてないCSSを検索するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"padolsey/operative","url":"https://github.com/padolsey/operative","tags":["webworker","JavaScript","library"],"content":"直接関数を渡してそれをWeb Workerで動かせるライブラリ。\n古いブラウザ向けのfallbackやPromiseのサポートなど、できるだけシームレスに書けるようにしてる","relatedLinks":[{"title":"operativeでWebWorkersを手軽に扱う - 四角革命前夜","url":"http://blog.sasaplus1.com/2015/05/23/01/"}]},{"category":"SoftwareLibrary","title":"High-performance javascript library for animations &amp; interfaces | Famous.org","url":"http://famous.org/","tags":["JavaScript","animation","library","WebGL"],"content":"アニメーションライブラリであるFamousがリニューアル公開された","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Easily testing React components with react-test-tree — Qubit Engineering — Medium","url":"https://medium.com/qubit-engineering/easily-testing-react-components-with-react-test-tree-f9e1668b1c2d","tags":["React","testing","DOM"],"content":"React component向けのテストライブラリ。\n対象のReact componentに`ref`属性を追加しておくことで、clickなどのイベントのシミュレートや子componentをstubすることができる","relatedLinks":[{"title":"QubitProducts/react-test-tree","url":"https://github.com/QubitProducts/react-test-tree"}]}]},{"meta":{"title":"2015-06-02のJS: AngularJS 1.4.0、Polymer 1.0リリース、今後のJSの流れ","author":"azu","layout":"post","date":"2015-06-02T10:32:00.000Z","category":"JSer","tags":["Angular","WebComponents"],"url":"https://jser.info/2015/06/02/Angular1.4.0-Polymer1.0/"},"items":[{"category":"Headline","title":"Angular 1.4.0 - jaracimrman-existence","url":"http://angularjs.blogspot.com/2015/05/angular-140-jaracimrman-existence.html","tags":["AngularJS","ReleaseNote"],"content":"AngularJS 1.4.0リリース。\n$httpのパラメータシリアライズ方法のカスタマイズ、i18nをサポートするngMessageFormatの追加、ngCookiesの追加など","relatedLinks":[{"title":"AngularJS: Developer Guide: Migrating from Previous Versions","url":"https://docs.angularjs.org/guide/migration#migrating-from-1-3-to-1-4"},{"title":"もうすぐリリースされるAngularJS 1.4の機能を先取りチェックしよう （1/2）：CodeZine","url":"http://codezine.jp/article/detail/8698"},{"title":"JavaScript - AngularJSの1.3から1.4へのバージョンアップ - Qiita","url":"http://qiita.com/tsuchikazu@github/items/282bd7a990170a9adfb6"}]},{"category":"Headline","title":"ESLint 0.22.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/06/eslint-0.22.0-released","tags":["Tools","JavaScript","ReleaseNote"],"content":"ESLint 0.22.0リリース\nルールプラグインに設定のバリデーション用のJSON Schemaを書けるように、.eslintrcの設定ファイルをバリデーションできるように","relatedLinks":[{"title":"format","url":"http://eslint.org/docs/developer-guide/working-with-rules"}]},{"category":"Headline","title":"gulp/CHANGELOG.md at v3.9.0 · gulpjs/gulp","url":"https://github.com/gulpjs/gulp/blob/v3.9.0/CHANGELOG.md","tags":["JavaScript","Tools","ReleaseNote"],"content":"gulp 3.9.0リリース。\n内部で利用しているinterpretがアップデートされgulpfileをBabelやLiveScriptで書けるようになった(.babel.jsのような拡張子で判定される)","relatedLinks":[{"title":"tkellen/js-interpret","url":"https://github.com/tkellen/js-interpret"}]},{"category":"Headline","title":"Google Developers Blog: Polymer 1.0 Released!","url":"http://googledevelopers.blogspot.com/2015/05/polymer-10-released.html","tags":["WebComponents","library"],"content":"Polymer 1.0リリース","relatedLinks":[{"title":"Polymer 1.0の挙動変更の影響 - Qiita","url":"http://qiita.com/shibukawa/items/45324051af06e08a11cc"},{"title":"Polymer 0.5 → 1.0 変更点ナナメ読みメモ ::ハブろぐ","url":"http://havelog.ayumusato.com/develop/webcomponents/e672-polymer_050to100_changelog.html"}]},{"category":"Headline","title":"io.js Week of May 29th — Node &amp; JavaScript — Medium","url":"https://medium.com/node-js-javascript/io-js-week-of-may-29th-89bdeace6056","tags":["node.js","ReleaseNote"],"content":"io.js 2.2.0リリース","relatedLinks":[]},{"category":"Article","title":"ES6 In Depth: Destructuring ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/05/es6-in-depth-destructuring/","tags":["JavaScript","ECMAScript"],"content":"Destructuringの色々なパターンについて。\n配列、ES6 module、Iteratorなどとあわせた例","relatedLinks":[]},{"category":"Article","title":"ES6 コードをテストする | アカベコマイリ","url":"http://akabeko.me/blog/2015/05/es6-unit-test/","tags":["JavaScript","ECMAScript","testing"],"content":"ES6で書いたコードに対するテストをES6とpower-assertで書いて、Node.js上で実行する方法について","relatedLinks":[]},{"category":"Article","title":"WebGL 軽量ライブラリを比較してみる - Qiita","url":"http://qiita.com/cx20/items/0fa19c96aa6470d98807","tags":["WebGL","JavaScript","まとめ"],"content":"色々なWebGLライブラリを使って三角形など基本的なものを表示するサンプルコードまとめ","relatedLinks":[]},{"category":"Article","title":"Easily testing React components with react-test-tree — Qubit Engineering — Medium","url":"https://medium.com/qubit-engineering/easily-testing-react-components-with-react-test-tree-f9e1668b1c2d","tags":["React","testing","DOM"],"content":"React component向けのテストライブラリ。\n対象のReact componentに`ref`属性を追加しておくことで、clickなどのイベントのシミュレートや子componentをstubすることができる","relatedLinks":[{"title":"QubitProducts/react-test-tree","url":"https://github.com/QubitProducts/react-test-tree"}]},{"category":"WebsiteDocument","title":"EmberWeekend","url":"https://emberweekend.com/episodes","tags":["JavaScript","library","podcast"],"content":"EmberJSについてのpodcast","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mako-taco/DecorateThis","url":"https://github.com/mako-taco/DecorateThis","tags":["JavaScript","library"],"content":"Decoratorを使った型のバリデーション、メモ化、カリー、Debounceなど色々なものを用意したライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"skadimoolam/x-doc","url":"https://github.com/skadimoolam/x-doc","tags":["node.js","リファレンス"],"content":"Node.js/io.jsをコマンドラインからオフラインで引けるリファレンスツール","relatedLinks":[]},{"category":"Book","title":"Using WebPagetest - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920033592.do","tags":["browser","performance"],"content":"WebPagetestについての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-06-10のJS: ブラウザとES6の状況、Web Audio APIチュートリアル","author":"azu","layout":"post","date":"2015-06-10T03:45:00.000Z","category":"JSer","tags":["WebAudio","ES6","Safari","Chrome","MSEdge"],"url":"https://jser.info/2015/06/10/es6-status-webaudio/"},"items":[{"category":"Headline","title":"Node v0.12.4 (Stable)","url":"http://blog.nodejs.org/2015/05/22/node-v0-12-4-stable/","tags":["node.js","ReleaseNote"],"content":"Node v0.12.4リリース","relatedLinks":[]},{"category":"Headline","title":"babel/CHANGELOG.md at master · babel/babel","url":"https://github.com/babel/babel/blob/master/CHANGELOG.md#550","tags":["JavaScript","Tools"],"content":"Babel 5.5.0リリース。\nバグ修正が中心。","relatedLinks":[]},{"category":"Headline","title":"What’s new in Babylon.js v2.1 - Eternal Coding - HTML5 / JavaScript / 3D development - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/eternalcoding/archive/2015/06/08/what-s-new-in-babylon-js-v2-1.aspx","tags":["JavaScript","library","WebGL","ReleaseNote"],"content":"Babylon.js v2.1リリース。","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 44 Beta: Improvements to Notifications API and promoted add to homescreen","url":"http://blog.chromium.org/2015/06/chrome-44-beta-improvements-to.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 44 Betaリリース。\nプッシュ通知の改善、`\\u{1F302}`のような[Unicodeエスケープのリテラル](https://googlechrome.github.io/samples/extended-unicode-escapes/index.html)、ES6 Computed Properties、`document.scrollingElement`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Safari 9.0","url":"https://developer.apple.com/library/prerelease/mac/releasenotes/General/WhatsNewInSafari/Articles/Safari_9.html","tags":["safari","ReleaseNote"],"content":"Safari 9.0での変更点としてTemplate Strings、Classes、WeakSet、SymbolなどのES6サポート、開発者ツールのデザインや機能追加などが行われている","relatedLinks":[{"title":"Safari 9.0の新機能の概要 - console.lealog();","url":"http://lealog.hateblo.jp/entry/2015/06/09/115905"},{"title":"iOS9_changes · uupaa/WebKitChangeLog Wiki","url":"https://github.com/uupaa/WebKitChangeLog/wiki/iOS9_changes"}]},{"category":"Headline","title":"Changelog · winjs/winjs Wiki","url":"https://github.com/winjs/winjs/wiki/Changelog#v40","tags":["JavaScript","library","ReleaseNote"],"content":"WinJS 4.0リリース","relatedLinks":[]},{"category":"Article","title":"New Performance Tools in Firefox Developer Edition 40 ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/06/new-performance-tools-in-firefox-developer-edition-40/","tags":["firefox","debug","Tools"],"content":"Firefox 40の開発者ツールについて。\nパフォーマンスツールの改善、ネットワークモニタでPostデータのコピー、CSSドキュメントの表示連携など","relatedLinks":[]},{"category":"Article","title":"Polymer エレメントの開発ツールと CI - 詩と創作・思索のひろば","url":"http://motemen.hatenablog.com/entry/2015/06/polymer-tools-and-ci","tags":["JavaScript","WebComponents","library","Tools"],"content":"Polymerに関連するツールやライブラリの紹介。\nコンポーネントのドキュメントの作り方、開発時の補助ツール、配布向けのビルド作成、CIでのテストについてなど","relatedLinks":[]},{"category":"Article","title":"React/dekuコンポーネントとthisのパターン | Web Scratch","url":"http://efcl.info/2015/06/05/this-component/","tags":["React","JavaScript"],"content":"ReactのコンポーネントをES6 Classesで書くと`this`が多くなる問題とイベントハンドラの登録/解除の例。\nまた、関数的なアプローチを持つdekuのコンポーネントとの違いについて","relatedLinks":[]},{"category":"Article","title":"React: 保守しやすいハイパフォーマンスの UI コンポーネントを作成する","url":"http://www.ibm.com/developerworks/jp/web/library/wa-react-intro/index.html","tags":["JavaScript","React","tutorial"],"content":"React、Component、Flux、デバッグツール、GraphQLとReactNative等の関連するプロジェクトなどReactの全般についてまとまってる記事","relatedLinks":[]},{"category":"SlideVideo","title":"BlinkOn 4 One-Pager - http://bit.ly/blinkon4onepager - Google ドキュメント","url":"https://docs.google.com/document/d/1ga5lPyCxQ0G7deJWDZPSbVvewG7cRdT6Qi-pHXUDgkg/edit#heading=h.rx77pwie3tnj","tags":["blink","イベント"],"content":"BlinkについてのイベントであるBlinkOn  4の動画とスライドまとめ","relatedLinks":[]},{"category":"SlideVideo","title":"Integrity protection for third-party JavaScript // Speaker Deck","url":"https://speakerdeck.com/fmarier/integrity-protection-for-third-party-javascript-1","tags":["browser","セキュリティ"],"content":"ブラウザの実装してるサードパーティスクリプトに対するセキュリティについてのスライド。\nCSP、HSTS、SRIについて","relatedLinks":[]},{"category":"SlideVideo","title":"▶ Asynchronous JavaScript at Netflix by Matthew Podwysowski at JSConf Budapest 2015 - YouTube","url":"https://www.youtube.com/watch?v=a8W5VVGO-jA","tags":["JavaScript","動画","スライド"],"content":"RxやObservableについての発表。\n非同期においてはPromiseがあるがCancelができない問題があり、またNode Streamは最適ではないとして、そこを扱うAPIデザインとしてのObservable、Rxについて紹介している","relatedLinks":[{"title":"mattpodwysocki/jsconfbp-2015","url":"https://github.com/mattpodwysocki/jsconfbp-2015"}]},{"category":"WebsiteDocument","title":"Web Audio School","url":"http://mmckegg.github.io/web-audio-school/","tags":["JavaScript","web","audio","tutorial"],"content":"Web Audio APIについてのチュートリアルサイト。\nそれぞれのAudioNodeについての解説や実行結果を視覚的に分かるようにしているので分かりやすい","relatedLinks":[]},{"category":"WebsiteDocument","title":"What&#x27;s New in JavaScript","url":"https://msdn.microsoft.com/en-us/library/ie/br212465(v=vs.94).aspx","tags":["JavaScript","MSEdge"],"content":"MSEdgeでのJavaScriptの新しい機能についてのページ","relatedLinks":[]},{"category":"WebsiteDocument","title":"The Accessibility Cheatsheet - bitsofco.de","url":"http://bitsofco.de/2015/the-accessibility-cheatsheet","tags":["アクセシビリティ","チートシート"],"content":"ウェブアクセシビリティチートシート","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cssnext","url":"http://cssnext.io/","tags":["CSS","Tools"],"content":"CSSの新しい構文等を現在のCSSに変換するTranspilerツール。\n一部仕様などにない拡張構文も含まれている","relatedLinks":[{"title":"cssnextでみる次世代CSSとPostCSS | Yucchiy","url":"http://blog.yucchiy.com/2015/04/22/cssnext-postcss-for-nextgeneration-of-css/"}]},{"category":"SoftwareLibrary","title":"TechnologyAdvice/Vers","url":"https://github.com/TechnologyAdvice/Vers","tags":["JavaScript","library"],"content":"バージョニングを持ったモデルライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Verify.js - A powerful, customizable, asynchronous form validation library","url":"http://verifyjs.com/","tags":["JavaScript","library"],"content":"非同期でバリデーション出来るライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Performance Tools | CSS-Tricks","url":"https://css-tricks.com/performance-tools/","tags":["browser","performance"],"content":"ウェブサイトパフォーマンス計測に関連するツールやサービスのまとめ","relatedLinks":[]},{"category":"Book","title":"ECMAScript 2015… by Maciej Rzepiński [Leanpub PDF/iPad/Kindle]","url":"https://leanpub.com/ecmascript2015es6guide","tags":["JavaScript","ECMAScript","電子書籍"],"content":"ES6についての電子書籍","relatedLinks":[{"title":"Maciej Rzepiński — Medium","url":"https://medium.com/@mrzepinski"}]}]},{"meta":{"title":"2015-06-16のJS: Vue.js 0.12、Exploring ES6、2015年のJavaScriptの流れ","author":"azu","layout":"post","date":"2015-06-16T13:00:00.000Z","category":"JSer","tags":["ES6","book","JSer","Vue","MVVM"],"url":"https://jser.info/2015/06/16/vue0.12-exploring-es6-2015/"},"items":[{"category":"Headline","title":"Vue.js 0.12 released! - vue.js","url":"http://vuejs.org/2015/06/11/012-release/","tags":["JavaScript","library","ReleaseNote"],"content":"Vue.js 0.12リリース。\n`v-component`と`v-with`を廃止、Reactのような`props`で値を渡すony-wayバインディングの導入、Asynchronous Components、Element Directivesの追加など","relatedLinks":[{"title":"Release 0.12.0: Dragon Ball · yyx990803/vue","url":"https://github.com/yyx990803/vue/releases/tag/0.12.0"},{"title":"0.12 Plan - feedback welcome · Issue #158 · vuejs/Discussion","url":"https://github.com/vuejs/Discussion/issues/158"}]},{"category":"Headline","title":"Ember.js - Ember.js 1.13.0 and 2.0 Beta Released","url":"http://emberjs.com/blog/2015/06/12/ember-1-13-0-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember.js 1.13.0と2.0βリリース。\nコンポーネントのライフサイクル追加、Helper APIの追加など","relatedLinks":[]},{"category":"Headline","title":"ESLint 0.23.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/06/eslint-0.23.0-released","tags":["JavaScript","Tools"],"content":"ESLint 0.23.0リリース。\ncomputed property、constに関するルールの追加、バグ修正など","relatedLinks":[]},{"category":"Headline","title":"flow/Changelog.md at v0.12.0 · facebook/flow","url":"https://github.com/facebook/flow/blob/v0.12.0/Changelog.md","tags":["JavaScript","Tools","ReleaseNote"],"content":"Flow 0.12.0リリース。\nfor-of、async/await、Structural Subtypingなどのサポート、typeofでの型指定、`module.name_mapper`オプションの追加など","relatedLinks":[]},{"category":"Article","title":"2015年前半のJavaScriptを振り返る | Web Scratch","url":"http://efcl.info/2015/06/16/jser-half-year/","tags":["JavaScript","JSer"],"content":"JSer.infoの2015年1月から6月までを振り返って、どういう変化があったかについてなど","relatedLinks":[]},{"category":"Article","title":"Deprecating JSTransform and react-tools | React","url":"http://facebook.github.io/react/blog/2015/06/12/deprecating-jstransform-and-react-tools.html","tags":["React","JavaScript","Tools"],"content":"ReactではJSTransformとreact-toolsの代わりにBabelを利用するようになった。","relatedLinks":[]},{"category":"Article","title":"StrongLoop | New io.js Features You May Not Be Using","url":"https://strongloop.com/strongblog/new-io-js-features-you-may-not-be-using/","tags":["node.js","JavaScript"],"content":"io.js 2.1までに新しく入った機能についてのまとめ。\nES6、ドキュメントの改善、stream、unhandledRejection、Preload modules、Sync I/Oのデバッグなど","relatedLinks":[]},{"category":"Article","title":"React Contexts and Dependency Injection — Jack Hsu","url":"http://jaysoo.ca/2015/06/09/react-contexts-and-dependency-injection/","tags":["React"],"content":"ReactとDI。ContextとDecoratorを使った例","relatedLinks":[]},{"category":"Article","title":"Six Steps for Approaching the Next JavaScript -Telerik Developer Network","url":"http://developer.telerik.com/featured/six-steps-for-approaching-the-next-javascript/","tags":["JavaScript","ECMAScript"],"content":"ES6を学ぶアプローチについて。\nまずはES3/5についてしっかり理解する、実行環境を用意する、好きな所から学ぶ、モジュールについて知る、学びながら仕様を参照する、プロダクトコードに使ってみる、という6つのステップで学ぶ方法を紹介している。","relatedLinks":[]},{"category":"Article","title":"Unit testing React components without a DOM – simonsmith.io – Portfolio and blog of a London based front-end web developer","url":"http://simonsmith.io/unit-testing-react-components-without-a-dom/","tags":["React","DOM","testing"],"content":"`React.addons.TestUtils.createRenderer`を使ったReact Componentのテストについて。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Weaver.js","url":"http://weaver.js.org/","tags":["JavaScript","library","webworker"],"content":"WebWorkerやプロセスforkなどを使ってブラウザとNode.js環境で動くスレッドを扱うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jussi-kalliokoski/trine","url":"https://github.com/jussi-kalliokoski/trine","tags":["JavaScript","library"],"content":"thisに値が来ることを前提としたunderscoreなどのような関数のコレクションライブラリ。\n`::`という構文を定義しているfunction bind syntaxのプロポーサルを元にした使い勝手を重視した作り","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Chakram - REST API test framework","url":"http://dareid.github.io/chakram/","tags":["JavaScript","API","testing","library"],"content":"Mocha上で動くREST APIのテストフレームワーク。\nchai-expectを拡張したレスポンスのassert、`expect(promise)`を使ってスッキリ書けるようにしているのが特徴","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nature/pa11y","url":"https://github.com/nature/pa11y","tags":["アクセシビリティ","testing","Tools"],"content":"HTML_CodeSnifferをコマンドラインで走らせてアクセシビリティについてチェック出来るツール","relatedLinks":[]},{"category":"Book","title":"O&#x27;Reilly Japan - CSS3開発者ガイド 第2版","url":"http://www.oreilly.co.jp/books/9784873117256/","tags":["CSS","book"],"content":"2015年07月03日発売\nThe Book of CSS3の翻訳本","relatedLinks":[]},{"category":"Book","title":"JavaScript with Promises - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920032151.do","tags":["JavaScript","Promises","book"],"content":"Promisesについて扱う100ページほどのO'Reillyの書籍","relatedLinks":[]},{"category":"Book","title":"NW.js Essentials eBook: Alessandro Benoit: Amazon.it: Kindle Store","url":"http://www.amazon.it/NW-js-Essentials-Alessandro-Benoit-ebook/dp/B00Y9W1H34","tags":["node-webkit","book"],"content":"NW.jsについての書籍","relatedLinks":[]},{"category":"Book","title":"Exploring ES6 by Axel Rauschmayer [Leanpub PDF/iPad/Kindle]","url":"https://leanpub.com/exploring-es6/","tags":["JavaScript","ECMAScript","book"],"content":"Dr. AxelによるECMAScript 6についての書籍。ES6とは何かという話から、それぞれの機能と仕様について詳しく書かれている。\nオンライン版は無料で読むことが出来る","relatedLinks":[{"title":"Exploring ES6: Upgrade to the next version of JavaScript","url":"http://exploringjs.com/"},{"title":"②ality – JavaScript and more","url":"http://www.2ality.com/"}]}]},{"meta":{"title":"2015-06-23のJS: ECMAScript 6公開、SVGガイド、JSConf US 2015","author":"azu","layout":"post","date":"2015-06-23T12:06:00.000Z","category":"JSer","tags":["ES6","Promise","SVG","動画"],"url":"https://jser.info/2015/06/23/es6-svg-jsconfus/"},"items":[{"category":"Headline","title":"ECMAScript 2015 is now an Ecma Standard","url":"https://esdiscuss.org/topic/ecmascript-2015-is-now-an-ecma-standard","tags":["ECMAScript","spec","ReleaseNote"],"content":"ECMAScript 2015(ES6)正式リリース。","relatedLinks":[{"title":"ECMAScript 2015 Language Specification – ECMA-262 6th Edition","url":"http://www.ecma-international.org/ecma-262/6.0/"}]},{"category":"Headline","title":"babel/CHANGELOG.md at master · babel/babel","url":"https://github.com/babel/babel/blob/master/CHANGELOG.md#560","tags":["JavaScript","Tools","ReleaseNote"],"content":"Babel 5.6.0リリース。\n`--watch`開始時にパースエラーが起きてもCLIを停止しないように、transformerの一部をpluginとして分離するなど","relatedLinks":[{"title":"transformers","url":"https://github.com/babel/babel/commit/3247851019dd350504689ad57c42ef45eb2381c7"},{"title":"Babel Plugins","url":"https://github.com/babel-plugins"}]},{"category":"Headline","title":"qooxdoo 5.0 released | qooxdoo News","url":"http://news.qooxdoo.org/qooxdoo-5-0-released","tags":["JavaScript","UI","library"],"content":"JavaScriptのRIAフレームワークであるqooxdoo 5.0リリース。\nqx.Website widgetsの追加、MSEdgeの対応、Pointer Eventsなどの対応、SVG、Fullscreen APIの対応、WebDriverを使ってテストの導入など","relatedLinks":[]},{"category":"Headline","title":"Node v0.12.5 (Stable)","url":"http://blog.nodejs.org/2015/06/22/node-v0-12-5-stable/","tags":["node.js","セキュリティ","ReleaseNote"],"content":"Node v0.12.5リリース。","relatedLinks":[]},{"category":"Headline","title":"Release JSHint 2.8.0 · jshint/jshint","url":"https://github.com/jshint/jshint/releases/tag/2.8.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"JSHint 2.8.0リリース。\n`module`でコードをES6 moduleとみなしてチェック出来るように、バグ修正など","relatedLinks":[]},{"category":"Headline","title":"Node.js Foundation Advances Community Collaboration, Announces New Members and Ratified Technical Governance | The Linux Foundation","url":"http://www.linuxfoundation.org/news-media/announcements/2015/06/nodejs-foundation-advances-community-collaboration-announces-new","tags":["node.js","ReleaseNote"],"content":"Node.js Foundationについての公式アナウンス。\nNode.jsとio.jsのマージやガバナンスモデルについての同意がとれて、Linux FoundationのコラボレーションプロジェクトとしてNode.js Foundationが誕生した。","relatedLinks":[{"title":"Node.js Foundation がコミュニティのコラボレーションを進化: 新メンバーと運用指針となる技術ガバナンスを発表 | The Linux Foundation","url":"http://www.linuxfoundation.jp/news-media/announcements/2015/06/jp_nodejs-foundation-advances-community-collaboration-announces-new"}]},{"category":"Article","title":"Brendan Eich » Blog Archive » From ASM.JS to WebAssembly","url":"https://brendaneich.com/2015/06/from-asm-js-to-webassembly/","tags":["WebAssembly","asm.js","JavaScript"],"content":"ブラウザ向けのバイナリフォーマットの標準化プロジェクトとしてWebAssemblyが公開された。\nサイズやデコードの効率化を目的としたバイナリフォーマットで、第一段階の目標としてはasm.jsのバイナリ版相当の機能を予定している。\n\nJavaScriptを置き換えるものではなく、JavaScriptが苦手な部分を補完できるような立ち位置であることなどが[FAQ](https://github.com/WebAssembly/design/blob/master/FAQ.md \"FAQ\")にかかれています。","relatedLinks":[{"title":"主要ブラウザで実行可能なバイナリ形式「WebAssembly」の開発がスタート。Chrome、WebKit、Firefox、Microsoft Edge、LLVM、Unityらがサポートを相次いで表明 － Publickey","url":"http://www.publickey1.jp/blog/15/webassembly.html"},{"title":"design/HighLevelGoals.md at master · WebAssembly/design","url":"https://github.com/WebAssembly/design/blob/master/HighLevelGoals.md"},{"title":"design/FAQ.md at master · WebAssembly/design","url":"https://github.com/WebAssembly/design/blob/master/FAQ.md"},{"title":"Rebuild: 97: Minimum Viable Standard (omo)","url":"http://rebuild.fm/97/"}]},{"category":"Article","title":"WebAssembly: a binary format for the web","url":"http://www.2ality.com/2015/06/web-assembly.html","tags":["WebAssembly"],"content":"WebAssemblyの概要解説","relatedLinks":[]},{"category":"Article","title":"ES6 In Depth: Collections ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/06/es6-in-depth-collections/","tags":["ECMAScript","JavaScript"],"content":"SetとMapについて。\nそれぞれのメソッドの解説、JSと他の言語でのMapの特性の違い、列挙の順序問題、WeakSet、WeakMapが何故必要になるのかについてなど","relatedLinks":[]},{"category":"Article","title":"A Practical Guide to SVGs on the web","url":"https://svgontheweb.com/","tags":["SVG","browser"],"content":"SVGの使い方ガイドライン。\n最適化、使い方、表示方法のまとめ、CSSやJavaScriptからの操作方法、レスポンシブ、アニメーションなどSVGについてまとまってる","relatedLinks":[]},{"category":"Article","title":"MIDI,JavaScript - JavaScriptでMIDIファイルを解析してみる 1 - Qiita","url":"http://qiita.com/PianoScoreJP/items/2f03ae61d91db0334d45","tags":["JavaScript","audio"],"content":"JavaScriptでMIDIファイル(SMF)を解析してヘッダ情報やトラックを取り出すチュートリアル","relatedLinks":[]},{"category":"SlideVideo","title":"JSConf US 2015 - YouTube","url":"https://www.youtube.com/playlist?list=PL37ZVnwpeshEkVjFZlLm1krvx0mPYPOoq","tags":["JavaScript","イベント","動画"],"content":"JSConf US 2015の動画が公開された。\nそれぞれの動画の文字起こしをしたGistも公開されている","relatedLinks":[{"title":"JSConf US 2015 - The best conference for JS and the Web. Period","url":"http://2015.jsconf.us/"},{"title":"una/js-conf-notes","url":"https://github.com/una/js-conf-notes"}]},{"category":"WebsiteDocument","title":"JavaScript Live","url":"https://jslive.com/","tags":["JavaScript","news"],"content":"RubyFlowみたいなJavaScriptのコミュニティニュースサイト","relatedLinks":[]},{"category":"WebsiteDocument","title":"JavaScript.com","url":"https://www.javascript.com/","tags":["JavaScript","tutorial"],"content":"CodeSchoolによるJavaScript初心者向けの学習リソースの紹介、コミュニティによる記事紹介などをしているサイト","relatedLinks":[]},{"category":"WebsiteDocument","title":"Custom Elements - Explore the world of Web Components","url":"https://customelements.io/","tags":["WebComponents","検索"],"content":"Bowerかnpmのキーワードにweb-componentsがついてるものを検索出来るサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"oceanhouse21/dokker","url":"https://github.com/oceanhouse21/dokker","tags":["JavaScript","document","Tools"],"content":"JSDocのコメントからlodashのようなドキュメントページ/Markdownを生成してくれるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"trueadm/t7","url":"https://github.com/trueadm/t7","tags":["JavaScript","React","VirtualDOM"],"content":"Template Stringsを使ったテンプレートライブラリ。\n結果をReactやその他のvirtual-domライブラリを使ってるもの向けへ出力できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sighjs/sigh","url":"https://github.com/sighjs/sigh","tags":["JavaScript","gulp","Tools"],"content":"JavaScriptビルドツール。\ngulp pluginをサポートしていて、デフォルトで並列タスク、インクリメンタルリビルド、Source Mapの対応など他のビルドツールの特徴も持たせてる\nhttp://sighjs.github.io/","relatedLinks":[]},{"category":"SoftwareLibrary","title":"eorroe/NodeList-Prototype-Extension","url":"https://github.com/eorroe/NodeList-Prototype-Extension","tags":["DOM","library"],"content":"DOM NodeのCollectionに対して操作出来るライブラリ","relatedLinks":[]}]},{"meta":{"title":"2015-06-30のJS: Ember Data Stableリリース、JavaScriptアンケート","author":"azu","layout":"post","date":"2015-06-30T11:28:00.000Z","category":"JSer","tags":["Ember","アンケート","JavaScript","ECMAScript"],"url":"https://jser.info/2015/06/30/ember-data-survey/"},"items":[{"category":"Headline","title":"jsdom/Changelog.md at master · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/master/Changelog.md#550","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"jsdom 5.5.0リリース。\npostMessageのサポート、`cloneNode`と`importNode`の問題を修正など","relatedLinks":[]},{"category":"Headline","title":"flow/Changelog.md at master · facebook/flow","url":"https://github.com/facebook/flow/blob/master/Changelog.md#v0131","tags":["JavaScript","Tools","ReleaseNote"],"content":"Flow v0.13.1リリース。\n`flow ast`でESTree ASTを出力するように。class式、binary/octal integer literalのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember Data v1.13 Released","url":"http://emberjs.com/blog/2015/06/18/ember-data-1-13-released.html","tags":["JavaScript","library"],"content":"Ember Data 1.13リリース。\nEmber Data初のStableリリースで、バージョンをEmberと合わせてる","relatedLinks":[]},{"category":"Headline","title":"ESLint 0.24.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/06/eslint-0.24.0-released","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 0.24.0リリース。\nES6 Classesに関するルールの追加など","relatedLinks":[]},{"category":"Headline","title":"Vorlon.js 0.0.15 is out ! - Etienne Margraff - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/emargraff/archive/2015/06/24/vorlon-js-0-0-15-is-out.aspx","tags":["JavaScript","debug","ReleaseNote"],"content":"JavaScriptデバッグツールのVorlon.js 0.0.15リリース。\nネットワークパネル、DOMパネル、プラグイン機能の改善など","relatedLinks":[]},{"category":"Headline","title":"Announcing Orion 9.0 | Orion News","url":"http://planetorion.org/news/2015/06/language-tooling-goodness-in-orion-9-0/","tags":["JavaScript","IDE","ReleaseNote"],"content":"Orion 9.0リリース。\nTernをベースとしたコード解析に変更し、コード補完やコードナビゲーション、リファクタリング機能の追加。","relatedLinks":[{"title":"Eclipse、Webブラウザ上で動作する統合開発環境「Orion 9.0」をリリース：CodeZine","url":"http://codezine.jp/article/detail/8798"}]},{"category":"Article","title":"ES5 + Facebook JSXで書かれたJavaScriptコードベースをTypeScriptに移行させる - VOYAGE GROUP techlog","url":"http://techlog.voyagegroup.com/entry/2015/06/24/170611","tags":["JavaScript","TypeScript","ECMAScript","React"],"content":"TypeScriptでES6 targetなコードを吐き出し、BabelでES5へ変換するビルドチェインの形成について。\n既存プロジェクトの段階的な移行ステップについて。\n\n追記: TypeScriptのmasterブランチにJSXサポートがマージされたので、この辺ももう少し構成が代わって行く可能性はありそうです。","relatedLinks":[{"title":"JSX and ","url":"https://github.com/Microsoft/TypeScript/pull/3564"}]},{"category":"Article","title":"JavaScript Scene Tech Survey Results — JavaScript Scene — Medium","url":"https://medium.com/javascript-scene/javascript-scene-tech-survey-d2449a529ed","tags":["JavaScript"],"content":"Twitterなどで行ったJavaScriptアンケートの結果発表。\nNode.jsのユーザーが多めで、ES6を利用したことがある人が半分程度、関心のあるフレームワークなど","relatedLinks":[]},{"category":"Article","title":"Metaprogramming in ES6: Symbols and why they&#x27;re awesome","url":"http://blog.keithcirkel.co.uk/metaprogramming-in-es6-symbols/","tags":["JavaScript","ECMAScript"],"content":"ES6とメタプログラミング。\nSymbolの使い方。Symbol.hasInstance、Symbol.iterator、Symbol.matchなどそれぞれを定義しておいた時の挙動について書かれてる","relatedLinks":[]},{"category":"Article","title":"JavaScript - Web Audioの新しいAPIについてざっくり解説 - Qiita","url":"http://qiita.com/mohayonao/items/ace81c01892321702687","tags":["web","audio","library"],"content":"新しく増えたWeb Audio APIとそのpolyfillについて","relatedLinks":[{"title":"mohayonao/web-audio-api-shim","url":"https://github.com/mohayonao/web-audio-api-shim/"}]},{"category":"Article","title":"A Guide to React.js Tools and Libraries | Toptal","url":"http://www.toptal.com/react/navigating-the-react-ecosystem","tags":["React","JavaScript","ECMAScript"],"content":"Reactで見るJavaScriptのエコシステム、ツール、ES6やTranspilerなどについて。\nまたFluxの実装ライブラリとして[Alt](https://github.com/goatslacker/alt)の紹介やReactの関連ライブラリについてなど幅広く書かれてる","relatedLinks":[]},{"category":"Article","title":"The State of JS Build Tools 2015","url":"http://www.walkercoderanger.com/blog/2015/06/state-of-js-build-tools-2015/","tags":["JavaScript","Tools","まとめ"],"content":"JavaScriptのビルドツールであるGrunt、Gulp、Broccoli、Brunchについて。\nそれぞれの簡単な紹介と何を基準にこれらのツールを選ぶのかという話","relatedLinks":[]},{"category":"Article","title":"Building Backbone apps using Flux — Medium","url":"https://medium.com/@victordoss/building-backbone-apps-using-flux-f656fd8a873a","tags":["JavaScript","backbone.js","Flux","library"],"content":"Backbone.jsでFlux的なデータの流れにするためにModeをラップしてDispatcherを入れるライブラリについて","relatedLinks":[]},{"category":"Article","title":"Sass - SCSSと付き合う上でやって(知って)よかったこと8選 - Qiita","url":"http://qiita.com/suisho/items/e996c42798bbb17add13","tags":["CSS","Sass","Tools","まとめ"],"content":"Sassに関連するTipsやライブラリ、ツールについて","relatedLinks":[]},{"category":"SlideVideo","title":"Front End TV - Screencast tutorials for web developers.","url":"http://www.frontend.tv/","tags":["JavaScript","CSS","動画"],"content":"JavaScriptやCSSや関連するツールなどについて5分程度のスクリーンキャストをやっているサイト","relatedLinks":[]},{"category":"WebsiteDocument","title":"HTML5test - How well does your browser support HTML5?","url":"https://html5test.com/","tags":["webservice","HTML5","browser","WebPlatformAPI"],"content":"ブラウザの実装してるHTMLやJavaScriptの機能をテストしてスコアを出すサービス","relatedLinks":[]},{"category":"WebsiteDocument","title":"React 0.13 日本語リファレンス | js STUDIO","url":"http://js.studio-kingdom.com/react","tags":["React","リファレンス","翻訳"],"content":"Reactリファレンスの日本語訳","relatedLinks":[]},{"category":"SoftwareLibrary","title":"timdp/es6-promise-pool","url":"https://github.com/timdp/es6-promise-pool","tags":["JavaScript","Promises","library"],"content":"Promise.allのように並列に処理を行うが、一度に何個づつやるかを決めて処理できるPromiseの補助ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"wavesurfer.js","url":"http://www.wavesurfer.fm/","tags":["web","audio","canvas","library"],"content":"Web Audioの波形をCanvasで描画してくれるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"karpathy/convnetjs","url":"https://github.com/karpathy/convnetjs","tags":["JavaScript","library"],"content":"JavaScriptでニューラルネットワークの実装ライブラリ","relatedLinks":[]}]},{"meta":{"title":"2015-07-06のJS: React v0.14 Beta 1、Firefox 39、ES6アンケート結果","author":"azu","layout":"post","date":"2015-07-06T13:23:00.000Z","category":"JSer","tags":["React","Firefox","JSer.info"],"url":"https://jser.info/2015/07/06/react-0.14-firefox39-es6/"},"items":[{"category":"Headline","title":"React v0.14 Beta 1 | React","url":"https://facebook.github.io/react/blog/2015/07/03/react-v0.14-beta-1.html","tags":["React","ReleaseNote"],"content":"React v0.14 Beta 1リリース。\nreactとreact-domにパッケージが分かれた。refsがDOM nodeそのものを指すようになるなど。\nまた移行用の変換ツールとしてreact-codemodが公開された","relatedLinks":[{"title":"react-codemod","url":"https://www.npmjs.com/package/react-codemod"}]},{"category":"Headline","title":"Firefox — Notes (39.0) — Mozilla","url":"https://www.mozilla.org/en-US/firefox/39.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 39リリース。\nFetch APIがデフォルトで有効に、CSS Scroll Snap Pointsのサポート、ES6仕様への準拠など","relatedLinks":[{"title":"Firefox 39 サイト互換性情報 - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/39/Site_Compatibility"},{"title":"Firefox 39 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/39"},{"title":"Firefox JavaScript changelog - JavaScript | MDN","url":"https://developer.mozilla.org/ja/docs/Web/JavaScript/New_in_JavaScript/Firefox_JavaScript_changelog#Firefox_39"},{"title":"Native CSS Scroll Snap Points","url":"http://blog.gospodarets.com/css-scroll-snap/"}]},{"category":"Headline","title":"esprima/ChangeLog at 2.4.1 · jquery/esprima","url":"https://github.com/jquery/esprima/blob/2.4.1/ChangeLog","tags":["JavaScript","AST","library","ReleaseNote"],"content":"esprima 2.4.0リリース。\nfor-of、spread elementのサポート","relatedLinks":[]},{"category":"Headline","title":"Important security upgrades for node.js and io.js — Medium","url":"https://medium.com/@iojs/important-security-upgrades-for-node-js-and-io-js-8ac14ece5852","tags":["node.js","ReleaseNote","セキュリティ"],"content":"Node.jsとio.jsにV8起因の脆弱性があったためセキュリティアップデートとしてNode.js v0.12.6、io.js-v2.3.3、io.js-v1.8.3がリリースされた","relatedLinks":[{"title":"Node.js と io.js のCritical Security Issue について","url":"http://blog.iojs.jp/important_security_issue.html"}]},{"category":"Article","title":"Using JSX with TypeScript – Minko Gechev&#x27;s blog","url":"http://blog.mgechev.com/2015/07/05/using-jsx-react-with-typescript","tags":["TypeScript","React"],"content":"TypeScriptのmasterに入ったJSXサポートについて\n1.6としてリリース予定のJSXを今試す方法","relatedLinks":[]},{"category":"Article","title":"Aerotwist - React + Performance = ?","url":"https://aerotwist.com/blog/react-plus-performance-equals-what/","tags":["React","DOM","performance"],"content":"DOMは遅くてReactのVirtual DOMは早いと言われることがあるけどそれは本当なのか。\n写真を追加するサンプルをVanillaとReactで比較してみた結果から分かった事について","relatedLinks":[]},{"category":"Article","title":"Perf audit: Loading performance · Issue #247 · reddit/reddit-mobile","url":"https://github.com/reddit/reddit-mobile/issues/247","tags":["performance","mobile","browser","issue"],"content":"Paul Irishによるredditのモバイルサイトのローディング完了までに45秒かかってる原因について報告してるIssue。\nChrome開発者ツール、React Perf、discなどを使って何が原因であるかを見ていく方法について参考になる","relatedLinks":[]},{"category":"Article","title":"How fast are web workers? ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/07/how-fast-are-web-workers/","tags":["webworker","firefox"],"content":"WebWorkerやSharedWorkerの起動コスト、メッセージの転送速度について","relatedLinks":[]},{"category":"Article","title":"Mozilla Games Technology Roadmap | Future Releases","url":"https://blog.mozilla.org/futurereleases/2015/07/02/mozilla-games-technology-roadmap/","tags":["Mozilla","firefox","future"],"content":"ウェブでプラグインフリーなゲームを実現するのに関連するIssueやロードマップ by Mozilla","relatedLinks":[]},{"category":"WebsiteDocument","title":"Breakouts","url":"http://www.jsbreakouts.org/","tags":["JavaScript","game","library","まとめ"],"content":"JavaScriptゲームエンジン版のTodoMVC。\n同じゲームを色々なゲームエンジンで実装したものを比較出来る","relatedLinks":[]},{"category":"WebsiteDocument","title":"arkency/reactjs_koans","url":"https://github.com/arkency/reactjs_koans","tags":["React","tutorial"],"content":"Reactを学ぶための問題集","relatedLinks":[]},{"category":"WebsiteDocument","title":"Paul Kinlan on Twitter: &quot;Created @ChromiumDev slack. A place for web devs to talk dev and chrome Join ☞ https://t.co/RAr4iTzesM Login ☞ https://t.co/8xLiIpC0F8&quot;","url":"https://twitter.com/Paul_Kinlan/status/598494432321773569","tags":["Chrome","community"],"content":"Chromiumについての情報共有を目的としたSlackが開設された。\n開発者とのコミュニケーションや情報共有向け","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Safe JavaScript Templating","url":"http://yahoo.github.io/secure-handlebars/","tags":["JavaScript","template","library","セキュリティ"],"content":"Yahoo!製のAutomatic Contextual Escapingを持ったHandlebars互換のテンプレーエンジン。","relatedLinks":[{"title":"Frontend Security: Applying Contextual Escaping Automatically, or How…","url":"http://www.slideshare.net/adonatwork/automatic-contextual-escaping-made-easy"},{"title":"yahoo/xss-filters","url":"https://github.com/yahoo/xss-filters"}]},{"category":"SoftwareLibrary","title":"Cycle.js","url":"http://cyclejs.github.io/index.html","tags":["JavaScript","Rx","library","VirtualDOM"],"content":"Rxを使った一方通行のデータフローとImmutabilityを実現するフレームワーク。_Model-View-Intent_というアーキテクチャを持ち、ユーザからの入力を_Intent_とし_Model_へ通知し、_Model_の変更を監視している_View_(virtual-dom)が更新されるようなサイクルを作ることを目的としている。\nそれらの通知と監視の仕組みにRxのObservableを利用している。","relatedLinks":[{"title":"Reactive MVC and the Virtual DOM — Futurice","url":"http://futurice.com/blog/reactive-mvc-and-the-virtual-dom"},{"title":"Cyclejs vs mercuryjs · Issue #49 · cyclejs/cycle-core","url":"https://github.com/cyclejs/cycle-core/issues/49"}]},{"category":"SoftwareLibrary","title":"The W3C Mobile Checker","url":"https://validator.w3.org/mobile-alpha/","tags":["W3C","mobile","Tools"],"content":"W3Cによるモバイルフレンドリーかをチェックするツール。\nURLを入れると問題点と解決方法を提示してくれる","relatedLinks":[]},{"category":"Book","title":"Learning WebRTC - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/9781783983667.do","tags":["WebRTC","book"],"content":"WebRTCについての書籍","relatedLinks":[]},{"category":"Book","title":"React: Up &amp; Running - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920042266.do","tags":["React","book"],"content":"2015年12月発売\nReactについての書籍","relatedLinks":[]},{"category":"Book","title":"Amazon.com: Test-driven JavaScript Development eBook: Ravi Kumar Gupta, Harmeet Singh, Hetal Prajapati: Kindle Store","url":"http://www.amazon.com/Test-driven-JavaScript-Development-Kumar-Gupta-ebook/dp/B010T266P6","tags":["JavaScript","testing","book"],"content":"2016年1月5日発売\nJavaScriptのTDD本","relatedLinks":[]}]},{"meta":{"title":"JSHint: A Formal Commitment to New Language Features","author":"azu","layout":"post","date":"2015-07-11T05:53:00.000Z","category":"JavaScript","tags":["JSHint","ECMAScript","ES.next","community"],"url":"https://jser.info/2015/07/11/jshint-new-lang-features/"},"items":[]},{"meta":{"title":"2015-07-14のJS: jQuery 3.0αリリース、JSHintとES.next","author":"azu","layout":"post","date":"2015-07-14T13:40:00.000Z","category":"JSer","tags":["jQuery","ECMAScript","JSHint","Lint"],"url":"https://jser.info/2015/07/14/jquery3.0-jshint-esnext/"},"items":[{"category":"Headline","title":"jQuery 3.0 and jQuery Compat 3.0 Alpha Versions Released | Official jQuery Blog","url":"http://blog.jquery.com/2015/07/13/jquery-3-0-and-jquery-compat-3-0-alpha-versions-released/","tags":["jQuery","ReleaseNote"],"content":"jQuery 3.0αとjQuery Compat 3.0αリリース。\n`.show()`と`.hide()`のパフォーマンス改善、jQuery.DeferredがPromise/A+互換に、非推奨だったjqXHR.success | error | complete、イベントの`.load`/`.unload`/`.error`を削除。\nundocumentなメソッドを外から触れないように変更。\nアニメーションで再度requestAnimationFrameを使うように、カスタムセレクタの改善など","relatedLinks":[{"title":"Issues · jquery/jquery","url":"https://github.com/jquery/jquery/issues?q=is%3Aissue+milestone%3A3.0.0"}]},{"category":"Article","title":"Introducing Incremental DOM — Google Developers — Medium","url":"https://medium.com/google-developers/introducing-incremental-dom-e98f79ce2c5f","tags":["JavaScript","DOM","library","VirtualDOM"],"content":"メモリ使用量とテンプレートエンジンでは扱える閉じタグの無い要素などがモチベーションとなってるGoogle製のDOMライブラリ(WIP)。\nDiff計算のためにVirtual DOMのような全体のTree構造をメモリに保持しない事で、余計なオブジェクトを作らないようにして、1 passで走査することでメモリ効率を上げている。","relatedLinks":[{"title":"Incremental DOM ざっと見たやつ","url":"https://gist.github.com/azu/8f1afa948eeb2da3ad00"}]},{"category":"Article","title":"canvas - JSでInstagramの画像フィルターを作るまで - Qiita","url":"http://qiita.com/KENJU/items/78c0034d7e93fbe8f95a","tags":["JavaScript","canvas"],"content":"Instagram的な画像フィルターをCanvasで行う方法、また処理が重たい問題をWeb Worker内で行うことについて","relatedLinks":[]},{"category":"Article","title":"Developer Edition 41: View source in a tab, screenshot elements, HAR files, and more ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/07/developer-edition-41-view-source-in-a-tab-screenshot-elements-har-files-and-more/","tags":["firefox","debug","Tools"],"content":"Firefox 41の開発者ツールで改善された箇所について","relatedLinks":[{"title":"Developer Edition 41: View source in a tab, screenshot elements, HAR files, and more ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/07/developer-edition-41-view-source-in-a-tab-screenshot-elements-har-files-and-more/"}]},{"category":"Article","title":"How fast are web workers? ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/07/how-fast-are-web-workers/","tags":["webworker","firefox"],"content":"WebWorkerやSharedWorkerの起動コスト、メッセージの転送速度について","relatedLinks":[]},{"category":"Article","title":"a d3.js design pattern — Medium","url":"https://medium.com/@billautomata/a-d3-js-design-pattern-16a6503dc86f","tags":["JavaScript","d3.js","デザインパターン"],"content":"D3.jsを使って書く際のデザインパターンについての連載","relatedLinks":[{"title":"billautomata/d3js","url":"https://github.com/billautomata/d3js_design_patterns"}]},{"category":"Article","title":"A Formal Commitment to New Language Features","url":"http://jshint.com/blog/new-lang-features/","tags":["JavaScript","ECMAScript","Tools"],"content":"BabelなどによってES.nextの機能を試せるようになったが、JSHintがそれらの新しすぎる構文をサポートするのが難しい理由について。\n\n詳しくは[JSHint: A Formal Commitment to New Language Features - JSer.info](http://jser.info/2015/07/11/jshint-new-lang-features/ \"JSHint: A Formal Commitment to New Language Features - JSer.info\")に書きました。","relatedLinks":[]},{"category":"Article","title":"You Might Not Need Underscore | Reindex","url":"https://www.reindex.io/blog/you-might-not-need-underscore/","tags":["JavaScript","library","まとめ"],"content":"Underscore.jsのメソッドと同様の事をES5、ES6でどのように書くことができるかについての比較まとめ","relatedLinks":[]},{"category":"Article","title":"React on ES6+ · Babel","url":"https://babeljs.io/blog/2015/06/07/react-on-es6-plus","tags":["JavaScript","babel","React"],"content":"Reactを題材にしたES6やES.nextについての機能紹介。\n具体的にES5で書いたものがどう変わるかをReactを例にして解説してる。","relatedLinks":[]},{"category":"Article","title":"ES6 Promise Anti-Patterns and Best Practices","url":"http://www.datchley.name/promise-patterns-anti-patterns/","tags":["JavaScript","Promises"],"content":"Promiseのアンチパターン集","relatedLinks":[]},{"category":"Article","title":"Javascript Async Control Flow","url":"http://kaye.us/javascript-async-control-flow/","tags":["JavaScript","ECMAScript"],"content":"ES.nextのasync/awaitについて。\nまたこれと似た事はtask.jsやcoを使うことで今すぐできるという話","relatedLinks":[]},{"category":"Article","title":"UI Testing with React Components | Toptal","url":"http://www.toptal.com/react/how-react-components-make-ui-testing-easy","tags":["React","testing"],"content":"React Componentのテスト方法について","relatedLinks":[]},{"category":"Article","title":"Testing JavaScript Modules with Tape","url":"http://ponyfoo.com/articles/testing-javascript-modules-with-tape","tags":["JavaScript","testing"],"content":"tape、proxyquire、Sinon.JSを使ったテストについて。\ntapeによるテストの書き方、proxyquireとSinon.JSを使ったモックについて","relatedLinks":[]},{"category":"SlideVideo","title":"▶ &quot;Процесс стандартизации ECMAScript&quot;, Сергей Рубанов, MoscowJS 23 - YouTube","url":"https://www.youtube.com/watch?v=5HNrQJsv4gU","tags":["ECMAScript","JavaScript","動画","スライド"],"content":"ECMAScriptを策定するTC39のプロセスについての動画とスライド。\n≈≈≈ という仮の新しい構文を例としてどういうプロセスで策定されるかについて","relatedLinks":[{"title":"ES process by Sergey Rubanov","url":"http://slides.com/chicoxyzzy/deck-1#/"}]},{"category":"WebsiteDocument","title":"V8 JavaScript Engine","url":"http://v8project.blogspot.com/","tags":["Chrome","V8","blog"],"content":"V8についてより詳細な情報を載せていく公式ブログ","relatedLinks":[]},{"category":"WebsiteDocument","title":"WebGLStudio.js","url":"http://webglstudio.org/","tags":["WebGL","editor"],"content":"WebGLエディタ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Jam3/math-as-code","url":"https://github.com/Jam3/math-as-code","tags":["JavaScript","チートシート"],"content":"色々な数学記号や数式をJavaScriptで表現するチートシート","relatedLinks":[]},{"category":"SoftwareLibrary","title":"RReverser/babel-plugin-asm-js","url":"https://github.com/RReverser/babel-plugin-asm-js","tags":["babel","JavaScript","asm.js","plugin","flowtype"],"content":"asm.jsにコンパイルするBabel plugin","relatedLinks":[]},{"category":"SoftwareLibrary","title":"IjzerenHein/autolayout.js","url":"https://github.com/IjzerenHein/autolayout.js","tags":["JavaScript","ios","CSS","library"],"content":"iOSのAutoLayoutとVisual Format Language的な実装を持つJavaScriptライブラリ","relatedLinks":[]},{"category":"Book","title":"High Performance Mobile Web - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920035060.do","tags":["browser","mobile","book"],"content":"2015年7月発売\nモバイルウェブサイトにおけるパフォーマンスについての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-07-21のJS: TypeScript 1.5、Web Components概要、ブラウザの情報源","author":"azu","layout":"post","date":"2015-07-21T13:54:00.000Z","category":"JSer","tags":["TypeScript","WebCompoents","Browser"],"url":"https://jser.info/2015/07/21/typescript1.5-webcomponents-browser/"},"items":[{"category":"Headline","title":"V8 JavaScript Engine: V8 4.5 release","url":"http://v8project.blogspot.com/2015/07/v8-45-release.html","tags":["JavaScript","V8","ReleaseNote"],"content":"V8 4.5(Chrome 45)リリース。\nArrow Function、Array/TypedArrayのメソッド追加、Object.assign、最適化コンパイラのTurboFan、V8 APIの変更など","relatedLinks":[]},{"category":"Headline","title":"ESLint 1.0.0-rc-1 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/07/eslint-1.0.0-rc-1-released","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 1.0.0-rc-1リリース。\n`--reset`がデフォルトになり、ES6の対応改善、新しいルールの追加など","relatedLinks":[{"title":"Documentation - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/docs/1.0.0/user-guide/migrating-to-1.0.0"}]},{"category":"Headline","title":"Announcing TypeScript 1.5 - TypeScript - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/typescript/archive/2015/07/20/announcing-typescript-1-5.aspx","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 1.5リリース。\nmodulesやdestructuring等ES6の対応改善、tsconfig.jsonによるプロジェクト設定、Decoratorを`--experimentalDecorators`フラグで試験的サポートなど","relatedLinks":[{"title":"Roadmap · Microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/Roadmap#15"},{"title":"TypeScript 1.5.3 変更点 - Qiita","url":"http://qiita.com/vvakame/items/9b9fde6c71aae6a824c0"}]},{"category":"Headline","title":"node-browserify/changelog.markdown at master · substack/node-browserify","url":"https://github.com/substack/node-browserify/blob/master/changelog.markdown#1100","tags":["browserify","ReleaseNote"],"content":"Browserify 11.0.0リリース。\nブラウザ向けの`stream`として使うreadable-streamをアップデートしStreams3ベースに変更。\nブラウザ向け`http`モジュールをFetch APIをベースとしたstream-httpへ変更しstreamをサポートできるように","relatedLinks":[{"title":"nodejs/readable-stream","url":"https://github.com/nodejs/readable-stream"},{"title":"jhiesey/stream-http","url":"https://github.com/jhiesey/stream-http"}]},{"category":"Article","title":"Bringing componentization to the web: An overview of Web Components | Microsoft Edge Dev Blog","url":"http://blogs.windows.com/msedgedev/2015/07/14/bringing-componentization-to-the-web-an-overview-of-web-components/","tags":["WebComponents","MSEdge","browser"],"content":"Web Componentsについての詳しい解説。\n何を目的にしているか、関連するコンポーネント実装の歴史。\nCSSスタイルのisolation、スタイルのスコープ、Global object isolation、iframeには欠けている部分についてなど","relatedLinks":[]},{"category":"Article","title":"Socket.IO — Socket.IO P2P","url":"http://socket.io/blog/socket.io-p2p/#","tags":["p2p","node.js","library"],"content":"Socket.IOからWebRTCを利用してP2Pでの通信を行えるように","relatedLinks":[]},{"category":"Article","title":"Comprehensive Beginner&#x27;s Guide To ReactJS - AntJanus","url":"http://antjanus.com/blog/web-development-tutorials/front-end-development/comprehensive-beginners-guide-to-reactjs/","tags":["AngularJS","React"],"content":"AngularJSユーザ向けのReact入門ガイド","relatedLinks":[]},{"category":"Article","title":"How to Debug JavaScript Remotely With Vorlon.js - Tuts+ Code Tutorial","url":"http://code.tutsplus.com/tutorials/how-to-debug-javascript-remotely-with-vorlonjs--cms-24343","tags":["JavaScript","debug","tutorial"],"content":"Vorlon.jsを使ったJavaScriptのリモートデバッグについて","relatedLinks":[]},{"category":"Article","title":"ES6 In Depth: Proxies ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/07/es6-in-depth-proxies-and-reflect/","tags":["JavaScript","ECMAScript"],"content":"Proxy APIについての解説。\nProxyで扱える14コのhandler、Proxyの使いどころ、Revocable proxiesについてなど。\n\"オブジェクトはプロパティのコレクションである\"といえるかどうかの話","relatedLinks":[]},{"category":"Article","title":"StrongLoop | An Introduction to JavaScript ES6 Iterators","url":"https://strongloop.com/strongblog/introduction-to-es6-iterators/","tags":["JavaScript","ECMAScript"],"content":"ES6 Iteratorについての解説。\nfor-ofとfor-inの違い、Symbol.iteratorを使って定義する方法とそれを利用する方法について","relatedLinks":[]},{"category":"Article","title":"azu/browser-javascript-resource","url":"https://github.com/azu/browser-javascript-resource","tags":["browser","JavaScript","blog","まとめ"],"content":"IEやFirefoxなどブラウザごとのリリースノートや更新履歴、実装状況、バグレポートの方法などをまとめたもの","relatedLinks":[{"title":"ブラウザ毎のリリースノートや実装状況はどこを見ればいいかをまとめました | Web Scratch","url":"http://efcl.info/2015/07/21/browser-javascript-resource/"}]},{"category":"Article","title":"知らないと損するSassの組み込み関数徹底解剖 | Yuhiisk","url":"http://blog.yuhiisk.com/archive/2015/07/14/sass-built-in-functions.html","tags":["Sass","リファレンス"],"content":"Sassの関数まとめ","relatedLinks":[]},{"category":"Article","title":"Flux in Depth. Store and Network Communication. – Minko Gechev&#x27;s blog","url":"http://blog.mgechev.com/2015/07/18/flux-in-depth-store-network-communication-services","tags":["Flux","JavaScript"],"content":"Fluxからネットワークを含めたデータフローについて。\nStore -> View、View -> Storeまでの流れ、モデルとStateの分離。\nNetwork -> UI、UI -> Networkのパターンについて","relatedLinks":[]},{"category":"SlideVideo","title":"An Introduction to Browser Rendering - YouTube","url":"https://www.youtube.com/watch?v=n1cKlKM3jYI","tags":["browser","動画"],"content":"ブラウザのレンダリングフローについてのスクリーンキャスト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nikgraf/belle","url":"https://github.com/nikgraf/belle/","tags":["React","UI","library"],"content":"React Componentとして使えるUI集。\n外からJSを経由してコンポーネントに対してスタイルを設定出来るようになっている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ipselon/react-ui-builder","url":"https://github.com/ipselon/react-ui-builder","tags":["React","UI","Tools"],"content":"React ComponentをGUIで配置したり、配置したものからReactのコードを吐き出したりして、GUIでコードを編集、プレビューなど出来るツール。\nツール自体がReactとProxyからできていて面白い","relatedLinks":[]},{"category":"Book","title":"DrBoolean/mostly-adequate-guide","url":"https://github.com/DrBoolean/mostly-adequate-guide","tags":["JavaScript","関数型プログラミング"],"content":"JavaScriptでの関数型プログラミングについての無料の書籍","relatedLinks":[]},{"category":"Book","title":"JavaScript Regular Expressions - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/9781783282258.do","tags":["JavaScript","正規表現","book"],"content":"JavaScriptの正規表現についての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-07-28のJS: Chrome 45β、ES6チュートリアル、Chrome開発者ツール本","author":"azu","layout":"post","date":"2015-07-28T14:11:00.000Z","category":"JSer","tags":["Chrome","ES6","debug"],"url":"https://jser.info/2015/07/28/chrome45-es6-devtools/"},"items":[{"category":"Headline","title":"Release 1.0.0 - 2015.07.22 · zloirock/core-js · GitHub","url":"https://github.com/zloirock/core-js/releases/tag/v1.0.0","tags":["JavaScript","library"],"content":"Babelにも同梱されてるES5、ES6、ES.nextのpolyfillであるcore-js 1.0.0リリース。","relatedLinks":[{"title":"Polyfill · Babel","url":"https://babeljs.io/docs/usage/polyfill/"}]},{"category":"Headline","title":"Chromium Blog: Chrome 45 Beta: New ES2015 features, service worker improvements, and media controls","url":"http://blog.chromium.org/2015/07/chrome-45-beta-new-es2015-features.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 45 Betaリリース。\nArrow FunctionやObject.assignなどのサポート、Subresource Integrityのサポート、SVGアニメーションを行うSMILを非推奨に、Service WorkerからページへpostMessageしたときのメッセージ配送先オブジェクトの変更など","relatedLinks":[{"title":"Subresource Integrity Sample","url":"https://googlechrome.github.io/samples/subresource-integrity/index.html"}]},{"category":"Headline","title":"Introducing TypeScript npm nightlies - TypeScript - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/typescript/archive/2015/07/27/introducing-typescript-nightlies.aspx","tags":["TypeScript"],"content":"TypeScriptのnightly buildが公開された。\n\n`npm install -g typescript@next`\n\nでインストールできるようになっている。","relatedLinks":[{"title":"Create a 'publish-nightly' task in our Jakefile by DanielRosenwasser · Pull Request #3875 · Microsoft/TypeScript","url":"https://github.com/Microsoft/TypeScript/pull/3875"}]},{"category":"Headline","title":"Release v0.9.0 · airportyh/testem","url":"https://github.com/airportyh/testem/releases/tag/v0.9.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Test Runnerツールのtestem 0.9.0リリース","relatedLinks":[]},{"category":"Article","title":"Bringing automated testing to Microsoft Edge through WebDriver | Microsoft Edge Dev Blog","url":"http://blogs.windows.com/msedgedev/2015/07/23/bringing-automated-testing-to-microsoft-edge-through-webdriver/","tags":["MSEdge","webdriver"],"content":"MSEdgeがWebDriverをサポート。\nMicrosoftWebDriver serverが公開された。","relatedLinks":[]},{"category":"Article","title":"channikhabra/yarr","url":"https://github.com/channikhabra/yarr","tags":["JavaScript","rss","tutorial"],"content":"クライアントのみで動くRSSリーダーを題材としたJavaScriptアプリのチュートリアル。\nBabel、dexie、jQuery、Rx、virtual-domで作られている。\nまた、どういう手順で作成するのかというのをGit tagでバージョン毎に見られるようにして、それぞれのバージョン毎に解説が書かれている。","relatedLinks":[]},{"category":"Article","title":"jdalton/polyfill-guide","url":"https://github.com/jdalton/polyfill-guide","tags":["JavaScript","library"],"content":"polyfillの書き方のガイド","relatedLinks":[]},{"category":"Article","title":"Building Plugins for React Apps","url":"https://nylas.com/blog/react-plugins","tags":["React","Flux","tutorial"],"content":"React Componentの独立性を保つにはどうするかという話\nStore同士に複雑な依存があると大変なので中央で管理するOmniStoreという概念の導入、Componentがただのデータであることを利用したDIする仕組み、Componentの独立性を確保するパターンについて等","relatedLinks":[]},{"category":"SlideVideo","title":"ECMAScript 6 Features - ALPROSYS","url":"http://www.alprosys.com/es6/es6_features_ol.html","tags":["ECMAScript","チートシート"],"content":"ES6の新しい構文についてES3、5ではどのように書くことができたのかを比較しながら見られるチートシート的なスライド","relatedLinks":[]},{"category":"SlideVideo","title":"Chrome Tech Talk Night #8 レポート | 株式会社サイバーエージェント","url":"https://www.cyberagent.co.jp/techinfo_detail/id=10782","tags":["Chrome","動画","イベント"],"content":"Chrome Tech Talk Night #8の動画とスライドまとめ","relatedLinks":[{"title":"Chrome Tech Talk Night #8 - connpass","url":"http://connpass.com/event/17312/"}]},{"category":"SlideVideo","title":"▶ TXJS 2015 Livestream - YouTube","url":"https://www.youtube.com/watch?v=6lEbk7xdlsQ","tags":["JavaScript","イベント"],"content":"TXJS 2015の動画","relatedLinks":[{"title":"Texas JavaScript Conference 2015 | TXJS","url":"https://2015.texasjavascript.com/"},{"title":"Texas JavaScript 2015 | Chris Missal","url":"https://lostechies.com/chrismissal/2015/07/27/texas-javascript-2015/"}]},{"category":"WebsiteDocument","title":"ECMAScript 6 Tutorial","url":"http://ccoenraets.github.io/es6-tutorial/index.html","tags":["ECMAScript","tutorial"],"content":"ES6について学ぶチュートリアルサイト。\nそれぞれの機能毎に学ぶ形式になってる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"schteppe/p2.js","url":"https://github.com/schteppe/p2.js","tags":["JavaScript","library"],"content":"2D物理エンジンライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"JavaScript engine for Internet of Things","url":"http://samsung.github.io/jerryscript/","tags":["JavaScript"],"content":"サムスンの組み込み向けJavaScriptエンジン。ファイルサイズが小さめでIoT向け。iotjsというNode.js的なフレームワークも作ってる。\n\n- JerryScript : V8\n- iotjs : Node.js\n\nのような関係","relatedLinks":[{"title":"Platform for Internet of Things with JavaScript","url":"http://samsung.github.io/iotjs/"}]},{"category":"SoftwareLibrary","title":"s-a/iron-node","url":"https://github.com/s-a/iron-node","tags":["JavaScript","node.js","debug","Tools"],"content":"Node.js向けのJavaScriptデバッガ。\nChrome開発者ツールを使ってNode.jsのコードをデバッグ出来るツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"horsey","url":"http://bevacqua.github.io/horsey/","tags":["JavaScript","UI","library"],"content":"テキスト入力時に候補データからサジェストするUIライブラリ","relatedLinks":[]},{"category":"Book","title":"Introduction | Down and Dirty with Chrome Developer Tools","url":"http://blittle.github.io/chrome-dev-tools/","tags":["Chrome","debug","Tools","book"],"content":"Chrome開発者ツールのそれぞれの機能について解説してる電子書籍。\n実際に動かして確認できるサンプルやGIFでの分かりやすい解説をされてる","relatedLinks":[]}]},{"meta":{"title":"2015-08-03のJS: ESLint 1.0.0、JSCS 2.0.0、Esprima 2.5.0","author":"azu","layout":"post","date":"2015-08-03T12:52:00.000Z","category":"JSer","tags":["Lint","Tool","AST","ES6","JavaScript"],"url":"https://jser.info/2015/08/03/eslint-jscs-esprima/"},"items":[{"category":"Headline","title":"ESLint 1.0.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/07/eslint-1.0.0-released","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 1.0.0リリース。\nES6の対応改善、`--reset`がデフォルトの挙動となり設定なしではルールを持たないようになった。\n\"eslint:recommended\"の設定を継承することで今までと同じデフォルト設定が得られる。","relatedLinks":[{"title":"Documentation - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/docs/user-guide/migrating-to-1.0.0"},{"title":"ESLint 1.0.0新ルールまとめ - Qiita","url":"http://qiita.com/armorik83/items/228b97bee25aa33c9850"}]},{"category":"Headline","title":"Release 2.0.0 · jscs-dev/node-jscs","url":"https://github.com/jscs-dev/node-jscs/releases/tag/v2.0.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"JavaScriptスタイルチェックツールJSCS 2.0.0リリース。\nES.nextをサポートする`--esnext`フラグの追加、CSTを実装しAutofixingに利用するように、ES6に対応したルールの追加、コメントによるルールの無効化のサポートなど","relatedLinks":[{"title":"mdevils/cst","url":"https://github.com/mdevils/cst"}]},{"category":"Headline","title":"Release 2.5.0 · jquery/esprima","url":"https://github.com/jquery/esprima/releases/tag/2.5.0","tags":["JavaScript","AST","library","ReleaseNote"],"content":"Esprima 2.5.0リリース。\nES6の全ての機能をパースできるように","relatedLinks":[{"title":"esprima/ChangeLog at 2.5.0 · jquery/esprima","url":"https://github.com/jquery/esprima/blob/2.5.0/ChangeLog"},{"title":"ES6 Main Tracking Issue · Issue #1099 · jquery/esprima","url":"https://github.com/jquery/esprima/issues/1099"},{"title":"Esprima Meeting Agenda - Google ドキュメント","url":"https://docs.google.com/document/d/1l02VT94tdphwUUZfPJorRYOY0Q_v41R_TyYhKayiP9M/edit"}]},{"category":"Headline","title":"Flow | Version 0.14.0","url":"http://flowtype.org/blog/2015/07/29/Version-0.14.0.html","tags":["flowtype","ReleaseNote"],"content":"Flow 0.14.0リリース。\n型指定してないパラメータを`any`と扱うように、Flowコメント構文をブロックコメント内で使えるようになるなど","relatedLinks":[]},{"category":"Headline","title":"| Intern 3 is here! | Blog | SitePen","url":"https://www.sitepen.com/blog/2015/07/30/intern-3-is-here/","tags":["JavaScript","testing","ReleaseNote"],"content":"JavaScriptテストフレームワークのIntern 3リリース。\nIE8のサポート終了、ES6の対応改善、d.tsを追加、QUnit互換のサポートなど","relatedLinks":[{"title":"Release 3.0.0 · theintern/intern","url":"https://github.com/theintern/intern/releases/3.0.0"}]},{"category":"Article","title":"Linting JavaScript in 2015","url":"http://blog.lauritz.me/linting-javascript-in-2015/","tags":["JavaScript","Tools"],"content":"ESLintを使ってJavaScriptのコードをLintする方法についての紹介","relatedLinks":[]},{"category":"Article","title":"New regular expression features in ECMAScript 6","url":"http://www.2ality.com/2015/07/regexp-es6.html","tags":["JavaScript","ECMAScript","正規表現"],"content":"ES6で追加された正規表現の要素について。\nsticky flag、Unicode flag、`\\u{...}`によるEscape sequencesについて","relatedLinks":[]},{"category":"Article","title":"Flux inside Web Workers — Medium","url":"https://medium.com/@nsisodiya/flux-inside-web-workers-cc51fb463882","tags":["JavaScript","Flux","DOM"],"content":"DOM lessな実装をしてればWeb Workerでも動かせる。\nFluxをベースにStore->View、View->ActionをpostMessageでやりとりすることで、View以外をWeb Worker上で処理できるという話","relatedLinks":[]},{"category":"Article","title":"Isomorphic Architecture を実装してるときの細かいアレコレ ::ハブろぐ","url":"http://havelog.ayumusato.com/develop/javascript/e682-universal_architecture_tips.html","tags":["isomorphic","JavaScript"],"content":"シングルページアプリケーションとサーバサイドレンダリングを扱う際に起こる問題と解決策について。\n設定の共有をするか、UAの評価、React Componentの`<head>`への適応方法、ライフサイクルの管理などについて","relatedLinks":[]},{"category":"Article","title":"Non-blocking Asynchronous JSON.parse Using The Fetch API","url":"http://azimi.me/2015/07/30/non-blocking-async-json-parse.html","tags":["JavaScript","JSON"],"content":"Fetch APIで提供されてる`Response`オブジェクトを使い`(new Response(string)).json()`を非同期JSON.parseとして利用する方法について","relatedLinks":[]},{"category":"SlideVideo","title":"Learning RiotJS - Video Tutorial Playlist @eggheadio","url":"https://egghead.io/playlists/learning-riotjs","tags":["JavaScript","tutorial","動画","library"],"content":"Riot.JSについてのスクリーンキャストシリーズ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Mithril","url":"http://mithril-ja.js.org/","tags":["JavaScript","library","翻訳"],"content":"Mithrilの日本語訳ページ","relatedLinks":[]},{"category":"WebsiteDocument","title":"WebRTCセキュリティレポート · A Study of WebRTC Security","url":"http://webrtc-security.github.io/report_ja/","tags":["JavaScript","WebRTC","セキュリティ"],"content":"WebRTCのセキュリティについての文章。\nWebRTCがどういう仕組みで動いているのか、信頼性が何をベースとして構築されているか、暗号のメカニズム、安全に扱う方法についてなど","relatedLinks":[{"title":"WebRTC入門+最新動向","url":"http://www.slideshare.net/rotsuya/intro-webrtcppt"}]},{"category":"Book","title":"Front-End Architecture - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920040156.do","tags":["JavaScript","CSS","book"],"content":"2015年12月発売\nCSSプリプロセス、開発ワークフローツール、JavaScriptのライブラリなどフロントエンドについての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-08-10のJS: io.js 3.0、RxJS 3.0、MSEdgeとは","author":"azu","layout":"post","date":"2015-08-10T13:23:00.000Z","category":"JSer","tags":["io.js","Rx","MSEdge"],"url":"https://jser.info/2015/08/10/io.js3.0-rxjs3.0-msedge/"},"items":[{"category":"Headline","title":"io.js/CHANGELOG.md at master · nodejs/io.js","url":"https://github.com/nodejs/io.js/blob/master/CHANGELOG.md#2015-08-04-version-300-rvagg","tags":["node.js","ReleaseNote"],"content":"io.js 3.0.0リリース。\nV8のアップデートによりES6のサポート改善、`Buffer.concat`の挙動変更などいくつか非互換の変更も含まれる","relatedLinks":[{"title":"Breaking Changes · nodejs/io.js Wiki","url":"https://github.com/nodejs/io.js/wiki/Breaking-Changes#300-from-2x"},{"title":"io.js v3.0.0 がリリースされました。 - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2015/08/07/002535"}]},{"category":"Headline","title":"Release RxJS Version 3.0 · Reactive-Extensions/RxJS","url":"https://github.com/Reactive-Extensions/RxJS/releases/tag/v3.0.0","tags":["JavaScript","Rx","ReleaseNote"],"content":"RxJS 3.0リリース。\nCoreパッケージとLiteパッケージへの追加。\n`Rx.Observable.fromEvent`/`Rx.Observable.spawn`/`Rx.Observable.prototype.scan`の引数の破壊的な変更など","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at 6.0.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/6.0.0/Changelog.md","tags":["DOM","JavaScript","library","ReleaseNote"],"content":"jsdom 6.0.0リリース。\nio.js 2.0以上が必要に、パフォーマンスの改善、`window.onerror`が動くように、`URL`オブジェクトのサポートなど","relatedLinks":[]},{"category":"Headline","title":"ESLint 1.1.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/08/eslint-1.1.0-released","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 1.1.0リリース。\ngrep-styleのformatterの追加","relatedLinks":[]},{"category":"Headline","title":"Dev.Opera — Opera 31 released","url":"https://dev.opera.com/blog/opera-31/","tags":["Opera","ReleaseNote"],"content":"Opera 31(based on Chromium 44)リリース。\n`document.scrollingElement`、ES6 computed property names、Unicode code point escapesのサポートなど","relatedLinks":[]},{"category":"Article","title":"Edge と IE:まるっと理解する、Windows 10 搭載に搭載される Web ブラウザーについて - monoe&#x27;s blog - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/osamum/archive/2015/08/07/about-windows-10-s-new-web-browsers.aspx","tags":["IE","MSEdge"],"content":"IEとMSEdgeについて。\nMSEdgeではどのような部分が変わるのか、実装されているAPI、フィードバック方法などがまとめられている","relatedLinks":[]},{"category":"Article","title":"オープンソースソフトウェアへの取り組み： 技術コラム・特集： React.jsでOSS Rader Scopeを再実装する： 第1回 はじめに （1/1） ｜ SCSK株式会社","url":"http://www.scsk.jp/product/oss/tec_guide/reactjs/1_column1_1.html","tags":["React","SVG","tutorial"],"content":"ウェブアプリをReactを使って作る話。\nReactの使い方、コンポーネント、Fluxアーキテクチャの解説、Nashornでのサーバサイドレンダリングなどよくまとまってる","relatedLinks":[]},{"category":"Article","title":"ECMAScript decorators on functions","url":"https://rreverser.com/ecmascript-decorators-and-functions/","tags":["JavaScript","ECMAScript"],"content":"ES.nextで提案されているDecoratorの仕組みとユースケースについて","relatedLinks":[]},{"category":"Article","title":"ES6 In Depth: Subclassing ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/08/es6-in-depth-subclassing/","tags":["JavaScript","ECMAScript"],"content":"ES6 Classesのサブクラスについて。\nサブクラスの使い方、`super`、ビルトインクラスのサブクラス、継承したクラスのConstructorの書き方、`new.target`について","relatedLinks":[]},{"category":"Article","title":"Getting started with ECMAScript 6","url":"http://www.2ality.com/2015/08/getting-started-es6.html","tags":["JavaScript","ECMAScript","tutorial"],"content":"BabelをREPLとして使い、ES5で書いてたものをES6の機能で書きながらES6について学んで行くチュートリアル","relatedLinks":[]},{"category":"Article","title":"The JavaScript Looping Evolution -Telerik Developer Network","url":"http://developer.telerik.com/featured/the-javascript-looping-evolution/","tags":["JavaScript","ECMAScript"],"content":"JavaScriptのループ周りの処理の変遷とES6でのループ処理について。\nforループ、for-in、forEachなどのArrayメソッドによるループ、ES6のiterableとiteratorを使った書き方などについての話","relatedLinks":[]},{"category":"WebsiteDocument","title":"Web Components Weekly","url":"http://webcomponentsweekly.me/","tags":["WebComponents","mail"],"content":"Web ComponentsについてのWeeklyメールマガジン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"morishitter/cssfmt · GitHub","url":"https://github.com/morishitter/cssfmt","tags":["CSS","Tools"],"content":"CSS整形ツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"brenolf/polyjuice","url":"https://github.com/brenolf/polyjuice","tags":["JavaScript","Tools"],"content":"JSHintの設定ファイルをESLintの設定ファイルに変換するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dbashford/textract","url":"https://github.com/dbashford/textract","tags":["JavaScript","library","node.js"],"content":"PDFやDocファイル、画像など様々なフォーマットからテキストを取り出す事が出来るライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"h2non/toxy","url":"https://github.com/h2non/toxy","tags":["JavaScript","node.js","proxy","library"],"content":"サーバからレスポンスの色々なネットワーク問題をシミュレート出来るProxyライブラリ","relatedLinks":[]},{"category":"Book","title":"O&#x27;Reilly Japan - Mithril","url":"http://www.oreilly.co.jp/books/9784873117447/","tags":["JavaScript","library","book"],"content":"Mithrilについての電子書籍","relatedLinks":[{"title":"Mithril","url":"http://mithril.js.org/"}]},{"category":"Book","title":"TypeScript Deep Dive","url":"http://basarat.gitbooks.io/typescript/","tags":["TypeScript","book"],"content":"atom-typescriptのbasaratさんによるTypeScriptについての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-08-17のJS: Redux 1.0.0、flux-utils、Firefox 40","author":"azu","layout":"post","date":"2015-08-17T11:21:00.000Z","category":"JSer","tags":["flux","library","firefox"],"url":"https://jser.info/2015/08/17/redux-flux-utils-firefox40/"},"items":[{"category":"Headline","title":"Release v1.0.0 · rackt/redux","url":"https://github.com/rackt/redux/releases/tag/v1.0.0","tags":["JavaScript","Flux","library","ReleaseNote"],"content":"Redux 1.0.0リリース。\nStateを管理するコンテナを提供することでFluxのActionCreatorとStoreにあたるものをただの関数として書けるようにし、単方向データの流れを行うライブラリ。","relatedLinks":[]},{"category":"Headline","title":"1.1 Release","url":"http://blog.polymer-project.org/announcements/2015/08/13/1.1-release/","tags":["WebComponents","library","ReleaseNote"],"content":"Polymer 1.1リリース。\nコンポーネントとグローバルスコープでStyleを共有する仕組みの追加など","relatedLinks":[{"title":"Polymer 1.1 リリース - Qiita","url":"http://qiita.com/laco0416/items/51a3f7863602c1d35e8a"}]},{"category":"Headline","title":"MozillaZine.jp » Blog Archive » Firefox 40 がリリースされた","url":"http://mozillazine.jp/?p=4868","tags":["firefox","ReleaseNote"],"content":"Firefox 40リリース。\n`return`に書かれた到達できないコードへの警告がコンソールへ出るように開発者ツールの改善、Web Audio APIの仕様追従、Web Animations APIの仕様追従など","relatedLinks":[{"title":"Firefox 40 サイト互換性情報 - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/40/Site_Compatibility"},{"title":"Firefox 40 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/40"}]},{"category":"Article","title":"4.0 is the new 1.0 — Node &amp; JavaScript — Medium","url":"https://medium.com/node-js-javascript/4-0-is-the-new-1-0-386597a3436d","tags":["node.js","ReleaseNote","歴史"],"content":"Node.js 4.0がio.jsとのマージが完了したバージョンとしてリリースされる予定。","relatedLinks":[]},{"category":"Article","title":"Browserify dependencies in depth! | TEJI TECH BLOG","url":"http://www.tejitak.com/blog/?p=1468","tags":["browserify"],"content":"Browserifyでの依存関係の解決パターンについて。\n依存するモジュールのバージョンが複数ある場合の問題についての色々なアプローチ","relatedLinks":[]},{"category":"Article","title":"ES6 In Depth: Modules ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/08/es6-in-depth-modules/","tags":["JavaScript","ECMAScript"],"content":"ES6 modulesのimport/exportの多様な構文のそれぞれの動作についての解説。\nModuleの仕様を分解してみた時にLoadingについてはECMAScriptでは未定義であること、構文的にstaticであることなどについて書かれている","relatedLinks":[]},{"category":"Article","title":"es6-coding-style/es6-coding-style-en.md at master · gf-web/es6-coding-style","url":"https://github.com/gf-web/es6-coding-style/blob/master/es6-coding-style-en.md","tags":["JavaScript","ECMAScript"],"content":"ES6コーディングスタイルガイド。\nDestructuringの使いすぎへの注意、ES5での書き方をES6の機能でキレイに書けるケースについて比較、moduleの`*`や`as`について書かれている。","relatedLinks":[]},{"category":"Article","title":"flux-utilsについて","url":"https://gist.github.com/azu/e0274b703ef97226b0db","tags":["Flux","JavaScript"],"content":"Facebookのfluxモジュールに追加されたutilsについて。\n今まではDispatcherのみだったがStoreやReact Componentと連携するためのContainerなどが提供されたことについて","relatedLinks":[]},{"category":"SlideVideo","title":"フロントエンドMVCとFlux // Speaker Deck","url":"https://speakerdeck.com/sangotaro/hurontoendomvctoflux","tags":["Flux","スライド"],"content":"Fluxとはどういうものなのかについてのスライド。\nMVCと何が違って何が違わないのかがわかりやすく書かれている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"mdast - markdown processor powered by plug-ins","url":"http://mdast.js.org/","tags":["Markdown","JavaScript","library"],"content":"Markdownパーサであるmdastのサイト。\nプラグインを使ってMarkdownからHTMLへの変換、Lintなど様々なことができる","relatedLinks":[]},{"category":"WebsiteDocument","title":"Perf.Rocks","url":"http://perf.rocks/","tags":["performance","まとめ"],"content":"ウェブパフォーマンスについての記事やツール、人、スライド、動画、書籍などについてのまとめ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Relay | A JavaScript framework for building data-driven React applications","url":"https://facebook.github.io/relay/","tags":["React","JavaScript","library","facebook"],"content":"GraphQLを使ったデータのやりとりをするフレームワーク。\nRelay.QLなどES6 template literalが前提になった作りになっていて面白い。","relatedLinks":[{"title":"Relay Technical Preview | React","url":"https://facebook.github.io/react/blog/2015/08/11/relay-technical-preview.html"}]},{"category":"SoftwareLibrary","title":"patrick-steele-idem/morphdom","url":"https://github.com/patrick-steele-idem/morphdom","tags":["DOM","library"],"content":"Virutal DOMではなくDOMを使ってdiff/patchをしてDOM Nodeを置き換えるライブラリ。\n`virtual-dom`と比較したベンチマークも書かれている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jamesshore/quixote","url":"https://github.com/jamesshore/quixote","tags":["CSS","JavaScript","testing"],"content":"mochaなどと組み合わせて使えるCSSのユニットテスト向けのassertionライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"scottcorgan/immu","url":"https://github.com/scottcorgan/immu","tags":["JavaScript","library"],"content":"Immutable Objectを扱うライブラリ。\nObject.definePropertyやObject.freezeを使ってArrayやObjectの変更を防止したオブジェクトを作成する","relatedLinks":[]},{"category":"Book","title":"Designing for Performance by Lara Callender Hogan","url":"http://designingforperformance.com/","tags":["performance","book"],"content":"ブラウザのパフォーマンスについての書籍。","relatedLinks":[]}]},{"meta":{"title":"2015-08-24のJS: Bootstrap 4α、PostCSS 5.0、Node.jsとio.js","author":"azu","layout":"post","date":"2015-08-24T13:00:00.000Z","category":"JSer","tags":["CSS","bootstrap","Node.js","io.js","community"],"url":"https://jser.info/2015/08/24/bootstrap-postcss-node-iojs/"},"items":[{"category":"Headline","title":"Bootstrap 4 alpha · Bootstrap Blog","url":"http://blog.getbootstrap.com/2015/08/19/bootstrap-4-alpha/","tags":["CSS","library","ReleaseNote"],"content":"Bootstrap 4αリリース。\nLessからSassへの移行、IE8のサポートを終了し`rem`を利用するように、flexboxをオプションで利用できるように、プラグインをES6で書きなおし、リセットスタイルをRebootにまとめるなど","relatedLinks":[{"title":"Bootstrap 4 alpha · Bootstrap Blog","url":"http://blog.getbootstrap.com/2015/08/19/bootstrap-4-alpha/"}]},{"category":"Headline","title":"Release 5.0 “President Valac” · postcss/postcss","url":"https://github.com/postcss/postcss/releases/tag/5.0.0","tags":["CSS","library","ReleaseNote"],"content":"CSSの変換を扱うPostCSS 5.0リリース。\n`safe`オプションが別プロジェクトへ、\n`parser`や`stringifier`などもオプション化、\nSCSSのパースにも対応するなど","relatedLinks":[]},{"category":"Headline","title":"Release RxJS Version 3.1 · Reactive-Extensions/RxJS","url":"https://github.com/Reactive-Extensions/RxJS/releases/tag/v3.1.0","tags":["Rx","JavaScript","library","Electron"],"content":"RxJS 3.1 リリース。\n`resultSelector`がオプショナルに、TypeScript定義ファイルが書き直されるなど","relatedLinks":[]},{"category":"Headline","title":"Release 1.1.0 - 2015.08.17 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v1.1.0","tags":["JavaScript","library","ReleaseNote"],"content":"core-js 1.1.0 リリース。\nstring paddingのプロポーサルへの追従、trimLeft/trimRightの追加、Reflect.enumerateはキャッシュされたkeyをiterateするようになるなど","relatedLinks":[{"title":"Question about ","url":"https://esdiscuss.org/topic/question-about-enumerate-and-property-decision-timing"}]},{"category":"Headline","title":"ESLint 1.2.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/08/eslint-1.2.0-released/","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 1.2.0リリース。\n文字列結合にTemplate Stringsを使うようにするルール、コールバックにArrow Functionを優先するルールなどの追加、`commonjs`のenvironment定義が追加された","relatedLinks":[]},{"category":"Article","title":"はてなブックマーク検索を作りながらFlux Utilsについて学ぶ | Web Scratch","url":"http://efcl.info/2015/08/24/flux-utils/","tags":["JavaScript","Flux","React","tutorial"],"content":"Flux UtilsとReactを使ってアプリを作りながら、Flux Utilsについて学ぶチュートリアル。\nStoreのstateがImmutableであったり、Containerなどの動作について","relatedLinks":[]},{"category":"Article","title":"JavaScript の イテレータ を極める！ - Qiita","url":"http://qiita.com/kura07/items/cf168a7ea20e8c2554c6","tags":["JavaScript","ECMAScript"],"content":"Iterator、Iterable、Generatorについてそれぞれが何か、どのように使うかについて書かれている","relatedLinks":[]},{"category":"Article","title":"Proper testing of Angular JS applications with ES6 modules — Medium","url":"https://medium.com/@tomastrajan/proper-testing-of-angular-js-applications-with-es6-modules-8cf31113873f","tags":["JavaScript","AngularJS","testing","library"],"content":"ES6 modulesとAngularJS。\nES6 modulesとして読み込みテストできるようにするためには、どのようにコードを書くかという話","relatedLinks":[]},{"category":"Article","title":"reactjs - ES6版React.jsチュートリアル - Qiita","url":"http://qiita.com/nownabe/items/2d8b92d95186c3941de0","tags":["React","ECMAScript","tutorial"],"content":"ReactのチュートリアルをES6 Classesなどを使って書いた場合にどうなるかについてをチュートリアル形式で書かれている。","relatedLinks":[{"title":"チュートリアル | React","url":"http://facebook.github.io/react/docs/tutorial-ja-JP.html"}]},{"category":"Article","title":"Vue.js Tutorial - Vegibit","url":"http://vegibit.com/vue-js-tutorial/","tags":["JavaScript","library","tutorial"],"content":"Vue.jsについてのチュートリアル。\n基本的な使い方、Vue.jsのEvent、Filter、Componentsなどについて","relatedLinks":[]},{"category":"Article","title":"Windows 10 virtual machines now available on Microsoft Edge Dev | Microsoft Edge Dev Blog","url":"http://blogs.windows.com/msedgedev/2015/08/17/windows-10-virtual-machines-now-available-on-microsoft-edge-dev/","tags":["MS","MSEdge","仮想化"],"content":"MSEdgeが使えるWindows 10のVirtual Machine(VM)が公開された","relatedLinks":[]},{"category":"SlideVideo","title":"PostCSS とは何か // Speaker Deck","url":"https://speakerdeck.com/jmblog/postcss-tohahe-ka","tags":["CSS","Tools","スライド"],"content":"PostCSSについてのスライド。\nPostCSSを使った変換の仕組み、それぞれのプラグインが単機能であるので組み合わせて利用できる。\ncsssnext、PreCSS、cssnanoなどのプラグインパックについて。\nまたSassの代わりに利用することについて","relatedLinks":[]},{"category":"SlideVideo","title":"どうしてこうなった？ Node.jsとio.jsの分裂と統合の行方。これからどう進化していくのか？ // Speaker Deck","url":"https://speakerdeck.com/yosuke_furukawa/dousitekounatuta-node-dot-jstoio-dot-jsfalsefen-lie-totong-he-falsexing-fang-korekaradoujin-hua-siteikufalseka","tags":["node.js","歴史"],"content":"Node.jsの歴史、io.jsがでてきた経緯、そしてNode.jsとio.jsが統合された経緯について。\nまたコミュニティにおけるオープンガバナンスモデルについて","relatedLinks":[]},{"category":"SlideVideo","title":"Effective ES6","url":"http://www.slideshare.net/teppeis/effective-es6","tags":["ECMAScript","スライド"],"content":"ES6について幅広く紹介してるスライド。\nES5以下でのベストプラクティスがES6の機能や構文で解決できることやES6で新しく入った機能について書かれている。","relatedLinks":[]},{"category":"SlideVideo","title":"Ginza.rb で Quipper のシングルページアプリケーション開発について発表しました - @kyanny&#x27;s blog","url":"http://blog.kyanny.me/entry/2015/08/20/014509","tags":["JavaScript","スライド","backbone.js"],"content":"Backbone.js/Chaplin/Marionette/React それぞれのシングルページアプリケーション開発における利点や問題点についてのスライド。\nRailsとの共存についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Functional programming in JavaScript - YouTube","url":"https://www.youtube.com/playlist?list=PL0zVEGEvSaeEd9hlmCXrk5yUyqUag-n84","tags":["JavaScript","関数型プログラミング","動画"],"content":"関数型JavaScriptについてのスクリーンキャスト","relatedLinks":[]},{"category":"WebsiteDocument","title":"Dev Tips - Developer Tips by Umar Hansa","url":"https://umaar.com/dev-tips/","tags":["Chrome","debug","Tips"],"content":"Chrome開発者ツールのTips集","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Falcor: One Model Everywhere","url":"http://netflix.github.io/falcor/","tags":["JavaScript","library"],"content":"Netflixのモデル + data fetchライブラリ。\nJSON Graphでデータを一つのドメインモデルとして表現して、そのモデルを元にサーバはルーティング、クライアントはデータの取得を行える。\nまたクライアントではキャッシュの設定が行える","relatedLinks":[{"title":"The Netflix Tech Blog: Netflix Releases Falcor Developer Preview","url":"http://techblog.netflix.com/2015/08/falcor-developer-preview.html"},{"title":"▶ Netflix JavaScript Talks - Falcor - YouTube","url":"https://www.youtube.com/watch?v=z8UgDZ4rXBU"}]},{"category":"SoftwareLibrary","title":"stylelint","url":"http://stylelint.io/","tags":["CSS","Tools"],"content":"CSSのLintツール。\nPostCSSのプラグインとしても利用できる。","relatedLinks":[]},{"category":"Book","title":"JavaScript Domain-Driven Design | PACKT Books","url":"https://www.packtpub.com/web-development/javascript-domain-driven-design","tags":["JavaScript","book"],"content":"JavaScriptでのDDDについての書籍","relatedLinks":[]},{"category":"Book","title":"Beautiful JavaScript — Medium","url":"https://medium.com/@valueof/beautiful-javascript-8aa69998add0","tags":["JavaScript","book"],"content":"Beautiful JavaScript リリース。","relatedLinks":[{"title":"Beautiful JavaScript - O","url":"http://shop.oreilly.com/product/0636920030706.do"}]},{"category":"Book","title":"Amazon: AngularJS　アプリケーションプログラミング: 山田 祥寛","url":"http://www.amazon.co.jp/dp/4774175684","tags":["AngularJS","book"],"content":"AngularJSについての書籍","relatedLinks":[]}]},{"meta":{"title":"JSer.infoのロゴやアイコンを更新しました","author":"azu","layout":"post","date":"2015-08-26T00:48:00.000Z","category":"other","tags":["JSer.info"],"url":"https://jser.info/2015/08/26/update-logo/"},"items":[]},{"meta":{"title":"2015-09-02のJS: MSEdgeとasm.js、単方向データフローのアーキテクチャ、CSS仕様書の読み方","author":"azu","layout":"post","date":"2015-09-02T12:38:00.000Z","category":"JSer","tags":["Flux","MVC","MSEdge","CSS","Spec"],"url":"https://jser.info/2015/09/02/msedge-unidirectional-architectures-read-css/"},"items":[{"category":"Headline","title":"ESLint v1.3.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/08/eslint-v1.3.0-released","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint v1.3.0リリース。\n`SourceCode`オブジェクトのAPIを追加、HTMLフォーマッターを追加、ルールの修正など","relatedLinks":[]},{"category":"Headline","title":"V8 JavaScript Engine: V8 Release 4.6","url":"http://v8project.blogspot.com/2015/08/v8-release-46.html","tags":["V8","ReleaseNote"],"content":"V8 4.6リリース。\nES6のSpread operator、`new.target`の対応、TypedArrayの改善など","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · rackt/redux","url":"https://github.com/rackt/redux/releases/tag/v2.0.0","tags":["JavaScript","Flux","library"],"content":"Redux 2.0.0リリース。\nHot Reloadingのためだけにあった`getReducer()`を削除、`compose()`の動作を修正するなど","relatedLinks":[]},{"category":"Headline","title":"mocha/HISTORY.md at master · mochajs/mocha","url":"https://github.com/mochajs/mocha/blob/master/HISTORY.md#230--2015-08-30","tags":["JavaScript","testing","ReleaseNote"],"content":"Mocha 2.3.0リリース。\nテストのエラーが起きた時に自動的にキャッチしないでスルーできる`--allowUncaught`の追加、非同期のテストのみ許可する`--async-only`でのPromiseの動作を修正","relatedLinks":[{"title":"Added option to allow unhandled exceptions to propagate in the browser by amsul · Pull Request #1659 · mochajs/mocha","url":"https://github.com/mochajs/mocha/pull/1659"}]},{"category":"Headline","title":"Release version 10532 [PC] : Microsoft Edge Dev","url":"http://dev.modern.ie/platform/changelog/10532-pc/","tags":["MSEdge","ReleaseNote"],"content":"Microsoft Edge 10532リリース。\nPointer Lock、Canvas blending modesのサポート、asm.jsとES6 Classesがデフォルトで有効に。\nまたAsync Functions、Destructuringがフラグ付きで導入された","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at 6.2.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/6.2.0/Changelog.md","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"jsdom 6.2.0リリース。\n`Element.prototype.classList`のサポートやバグ修正","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0: The first stable release (2015-08-26) · power-assert-js/power-assert","url":"https://github.com/power-assert-js/power-assert/releases/tag/v1.0.0","tags":["JavaScript","testing","ReleaseNote"],"content":"assertが失敗した時に表示する情報量を増やすpower-assert 1.0.0リリース。","relatedLinks":[]},{"category":"Article","title":"André Staltz - Unidirectional User Interface Architectures","url":"http://staltz.com/unidirectional-user-interface-architectures.html","tags":["Flux","JavaScript","設計"],"content":"Flux、Redux、Famous、Elm、Cycle.jsそれぞれのアーキテクチャについてまとめた記事。\n構成要素、データーフロー、特徴について簡潔にまとめられている","relatedLinks":[]},{"category":"Article","title":"Using requestIdleCallback — Google Web Updates","url":"https://developers.google.com/web/updates/2015/08/27/using-requestidlecallback","tags":["WebPlatformAPI","JavaScript","Chrome"],"content":"requestIdleCallbackについての解説。\nIdleな期間に非同期でコールバックを呼び出す事ができ、第二引数で一定時間内には必ず呼び出す`timeout`を指定できる","relatedLinks":[]},{"category":"Article","title":"fizzbuzz","url":"http://ditam.github.io/posts/fizzbuzz.html","tags":["JavaScript","アルゴリズム"],"content":"JavaScriptで20種類のFizzBuzzの実装","relatedLinks":[]},{"category":"SlideVideo","title":"基本の前の基礎知識 - Back to Basics CSS 2015-08-30","url":"http://unformedbuilding.com/slide/back-to-basics-2015-08-30/#/","tags":["CSS","spec","スライド"],"content":"CSSの仕様の読み方についてのスライド。\n仕様に出てくる構文の読み方や単位についてまとめられている","relatedLinks":[]},{"category":"SlideVideo","title":"npm3 ❓ // Speaker Deck","url":"https://speakerdeck.com/watilde/npm3","tags":["npm","スライド"],"content":"npm3で追加された機能や変更点などについてのスライド","relatedLinks":[]},{"category":"WebsiteDocument","title":"Thimble by Mozilla - An online code editor for learners &amp; educators.","url":"https://thimble.mozilla.org/","tags":["Mozilla","webservice","editor"],"content":"オンラインでウェブサイトを作れるサービス。\nJSFiddle的なエディタ&プレビューとファイルツリー。\nまた、任意のファイルをアップロードできるのでHTMLで公開するのに便利そう","relatedLinks":[]},{"category":"WebsiteDocument","title":"mattdesl/promise-cookbook","url":"https://github.com/mattdesl/promise-cookbook","tags":["JavaScript","Promises","book"],"content":"Promiseの基本的な使い方、メソッドについて解説したCookbook","relatedLinks":[]},{"category":"WebsiteDocument","title":"JS.ORG | NEWS","url":"http://news.js.org/","tags":["JavaScript","news"],"content":"ユーザー投稿のJavaScriptニュースを扱うサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Izzimach/react-pixi","url":"https://github.com/Izzimach/react-pixi","tags":["React","canvas","library"],"content":"Reactを使ってPixi.jsのCanvasを操作するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mysticatea/npm-run-all","url":"https://github.com/mysticatea/npm-run-all","tags":["npm","console","Tools"],"content":"npm run-scriptで定義したものの並列実行や逐次実行等の補助を行うコマンドラインツール。\nNodeモジュールとしても利用できる","relatedLinks":[{"title":"npm-run-all と concurrently を試す | アカベコマイリ","url":"http://akabeko.me/blog/2015/08/npm-run-all-and-concurrently/"}]},{"category":"Book","title":"Amazon: Reactive Programming with Rxjs: Untangle Your Asynchronous JavaScript Code: Sergi Mansilla","url":"http://www.amazon.com/dp/1680501291?tag=amazon0abac-22","tags":["JavaScript","Rx","library","book"],"content":"2016年3月25日発売\nRxJSでのリアクティブプログラミングについての書籍","relatedLinks":[]},{"category":"Book","title":"SurviveJS - Webpack and React","url":"http://survivejs.com/","tags":["webpack","React","book"],"content":"WebpackとReactについての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-09-09のJS: Node.js 4.0.0、TypeScript 1.6β、React 0.14の変更点","author":"azu","layout":"post","date":"2015-09-09T14:16:00.000Z","category":"JSer","tags":["Node.js","io.js","TypeScript","React"],"url":"https://jser.info/2015/09/09/node4.0.0-typescript1.6beta-react/"},"items":[{"category":"Headline","title":"Node v4.0.0 (Stable) | Node.js","url":"https://nodejs.org/en/blog/release/v4.0.0/","tags":["node.js","ReleaseNote"],"content":"io.jsと統合したNode.js 4.0.0リリース。\n長期間サポート(LTS)のバージョンが1年に1度リリースされ、12ヶ月アクティブ + 18ヶ月メンテナンスモードでサポートされるリリースサイクルとなる予定。","relatedLinks":[{"title":"All you need to know about Node.js 4.0.0 - Dynatrace APM Blog","url":"http://apmblog.dynatrace.com/2015/09/05/all-you-need-to-know-about-node-js-4-0/"}]},{"category":"Headline","title":"jshint/CHANGELOG.md at 2.9.0 · jshint/jshint","url":"https://github.com/jshint/jshint/blob/2.9.0/CHANGELOG.md","tags":["JavaScript","Tools","ReleaseNote"],"content":"JSHint 2.9.0リリース。\n`esversion`のオプション追加、\"use strict\"をグローバルか関数かどこに書くかの設定を`strict: global`という形で指定できるように","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 1.6 Beta: React/JSX, better error checking, and more - TypeScript - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/typescript/archive/2015/09/02/announcing-typescript-1-6-beta-react-jsx-better-error-checking-and-more.aspx","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 1.6βリリース。\nTSX(JSX)サポート、tsconfig.jsonを作成する`--init`オプションの追加、`exclude`オプションの追加、abstruct classのサポートなど","relatedLinks":[{"title":"TypeScript 1.6.0-beta 変更点 - Qiita","url":"http://qiita.com/vvakame/items/072fa78f9fe496edd1f0"}]},{"category":"Headline","title":"Release 1.19.0 · jquery/qunit","url":"https://github.com/jquery/qunit/releases/tag/1.19.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"QUnit 1.19.0リリース。\nES6 MapとSetを対象としたassertのサポート、`QUnit.stack`の実装など","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember Data v2.0 Released and v2.1 Beta Released","url":"http://emberjs.com/blog/2015/09/02/ember-data-2-0-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember Data 2.0リリース。\nEmber 2.0と同じように、1.xで非推奨となったメソッドの削除がメインとなるアップデート","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 46 Beta: Flexible animations and improved loading performance","url":"http://blog.chromium.org/2015/09/chrome-46-beta-flexible-animations-and.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 46βリリース。\nCSS Motion Path、HTTP Client Hintsのサポート。\nES6 spread operator、`new.target`、`Event.isTrusted`、`CSS.escape()`の追加、iframeのsandbox改善など","relatedLinks":[{"title":"Future Use: CSS Motion Paths by Dan Wilson on CodePen","url":"http://codepen.io/danwilson/blog/css-motion-paths"},{"title":"igrigorik/http-client-hints","url":"https://github.com/igrigorik/http-client-hints"}]},{"category":"Article","title":"Typed Arrays in ECMAScript 6","url":"http://www.2ality.com/2015/09/typed-arrays.html","tags":["ECMAScript","JavaScript"],"content":"Typed Arraysについての詳しい解説","relatedLinks":[]},{"category":"Article","title":"Angular 2 Survey Results","url":"http://angularjs.blogspot.com/2015/09/angular-2-survey-results.html","tags":["AngularJS"],"content":"AngularJS 2に関するアンケート結果","relatedLinks":[]},{"category":"Article","title":"Flash-Free Clipboard for the Web ✩ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/09/flash-free-clipboard-for-the-web/","tags":["JavaScript","クリップボード"],"content":"`document.execCommand(\"copy\")`を使ってクリップボードへのコピーをJavaScriptで行うことについて","relatedLinks":[]},{"category":"Article","title":"New React Developer Tools | React","url":"https://facebook.github.io/react/blog/2015/09/02/new-react-developer-tools.html","tags":["React","debug","firefox","Chrome"],"content":"Reactの新しい開発者ツールが公開された。\nFirefoxとChromeに対応している。","relatedLinks":[]},{"category":"Article","title":"Measuring JavaScript Functions&#x27; Performance","url":"http://www.sitepoint.com/measuring-javascript-functions-performance/","tags":["JavaScript","performance"],"content":"JavaScriptで関数のパフォーマンスを計測するときに気をつけるべきことについて","relatedLinks":[]},{"category":"SlideVideo","title":"Reactjs v0.14 changes // Speaker Deck","url":"https://speakerdeck.com/koba04/reactjs-v0-dot-14-changes","tags":["React","スライド"],"content":"React 0.14での変更点についてのスライド","relatedLinks":[{"title":"React.js meetup #2を開催しました - blog.koba04.com","url":"http://blog.koba04.com/post/2015/09/09/reactjs-meetup2/"},{"title":"React.js meetup #2 - 資料一覧 - connpass","url":"http://reactjs-meetup.connpass.com/event/19504/presentation/"}]},{"category":"SlideVideo","title":"Introduction to Redux // Speaker Deck","url":"https://speakerdeck.com/axross/introduction-to-redux","tags":["JavaScript","Flux","スライド"],"content":"Reduxについてのスライド。\nReduxのデータフローについて解説されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Substance","url":"http://substance.io/","tags":["JavaScript","editor","library"],"content":"WYSIWYGエディタライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"UpUp - The Offline First Library","url":"https://www.talater.com/upup/","tags":["JavaScript","library","ServiceWorker"],"content":"Service Workersを使いオフラインでもコンテンツを表示できるようにするライブラリ","relatedLinks":[]},{"category":"Book","title":"Amazon: JS+Node.jsによるWebクローラー/ネットエージェント開発テクニック: クジラ飛行机","url":"http://www.amazon.co.jp/dp/4883379930","tags":["JavaScript","Tools","book"],"content":"クローラーや自動化などのツールとしてJavaScriptを扱う書籍","relatedLinks":[{"title":"Node.jsによるWebクローラー開発テクニック - クジラ机ブログ","url":"http://kujirahand.com/blog/index.php?Node.js%E3%81%AB%E3%82%88%E3%82%8BWeb%E3%82%AF%E3%83%AD%E3%83%BC%E3%83%A9%E3%83%BC%E9%96%8B%E7%99%BA%E3%83%86%E3%82%AF%E3%83%8B%E3%83%83%E3%82%AF"}]}]},{"meta":{"title":"2015-09-16のJS: React 0.14 RC、ESLint 1.4.0、改めてECMAScript 5","author":"azu","layout":"post","date":"2015-09-16T10:00:00.000Z","category":"JSer","tags":["React","ESLint","Lint","ES5"],"url":"https://jser.info/2015/09/16/react-0.14-eslint-1.4-es5/"},"items":[{"category":"Headline","title":"Modernizr News","url":"https://modernizr.com/news/modernizr-3-new-release-site","tags":["JavaScript","CSS","browser","library"],"content":"Feature Detectを行うライブラリであるModernizr 3リリース。","relatedLinks":[]},{"category":"Headline","title":"React v0.14 Release Candidate | React","url":"http://facebook.github.io/react/blog/2015/09/10/react-v0.14-rc1.html","tags":["React","ReleaseNote"],"content":"React v0.14 RCリリース。\nモジュールの分割、`refs`の参照がDOM Node自体となるように、ステートレスコンポーネント、react-toolsの廃止、Babelへの移行など","relatedLinks":[]},{"category":"Headline","title":"Flow | Version 0.15.0","url":"http://flowtype.org/blog/2015/09/10/Version-0.15.0.html","tags":["flowtype","ReleaseNote"],"content":"Flow 0.15.0リリース。\nGeneratorのサポート、ワーカープロセス数の設定ができるよう、ES6 Classesで`super()`を呼ぶ前に`this`に触るのをチェックできるようになるなど","relatedLinks":[]},{"category":"Headline","title":"ESLint v1.4.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/09/eslint-v1.4.0-released","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint v1.4.0リリース。\nルールに合った形にコードを修正する`--fix`オプションの追加、実行結果をキャッシュ出来る`--cache`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at 6.4.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/6.4.0/Changelog.md","tags":["JavaScript","library","ReleaseNote"],"content":"jsdom 6.4.0リリース。\n`jsdom.nodeLocation`の追加、\n`getElementsByClassName`でスペースが区切られた文字列に対応など","relatedLinks":[]},{"category":"Article","title":"The names of functions in ES6","url":"http://www.2ality.com/2015/09/function-names-es6.html","tags":["JavaScript","ECMAScript"],"content":"関数やSymbol、モジュールなどの`name`プロパティについてのまとめ","relatedLinks":[]},{"category":"Article","title":"JavaScript - Babel プラグインを作ってみよう - Qiita","url":"http://qiita.com/shuhei/items/96a852f7e0995fd42981","tags":["JavaScript","babel","plugin","tutorial"],"content":"Babelプラグインの作成方法と仕組みについてのチュートリアル的な記事","relatedLinks":[]},{"category":"Article","title":"ES2015(ES6)な時代だからこそ、ES5を改めて調べたJavaScript初級者のメモ - Qiita","url":"http://qiita.com/zaru/items/d833dca52962c3f7770f","tags":["ECMAScript"],"content":"ES5で追加されたProperty Descriptorや追加されたメソッドについて","relatedLinks":[]},{"category":"Article","title":"Lessons Backbone Developers Can Learn From React","url":"http://benmccormick.org/2015/09/09/what-can-backbone-developers-learn-from-react/","tags":["backbone.js","React","JavaScript"],"content":"Backbone.jsから見るReactから学べることについて","relatedLinks":[]},{"category":"Article","title":"JavaScript iterables and iterators - JS Rocks","url":"http://jsrocks.org/2015/09/javascript-iterables-and-iterators/","tags":["JavaScript","ECMAScript"],"content":"iterable、iteratorについて細かな疑問がQ&A形式でまとまっている記事。\niterableとiteratorそれぞれがどういう定義であるかや関係について。\nまた、`iterator.next()`の返り値がオブジェクトを返すようになった理由などについて","relatedLinks":[]},{"category":"Article","title":"Full-Stack Redux Tutorial","url":"http://teropa.info/blog/2015/09/10/full-stack-redux-tutorial.html","tags":["JavaScript","Flux","tutorial"],"content":"Reduxを使ってウェブアプリを作るチュートリアル","relatedLinks":[]},{"category":"Article","title":"Polymer 1.0をさわってみて - console.lealog();","url":"http://lealog.hateblo.jp/entry/2015/09/04/003050","tags":["JavaScript","WebComponents"],"content":"Polymerを使ったウェブサイトを作る方法や関連ツールなどの紹介。\nPolymerのテンプレートやハマりどころについて","relatedLinks":[]},{"category":"SlideVideo","title":"The Polymer Summit 2015 - YouTube","url":"https://www.youtube.com/playlist?list=PLNYkxOF6rcICdISJclfQhj2S8QZGjXV8J","tags":["JavaScript","WebComponents","library","イベント","動画"],"content":"Polymer Summit 2015の動画一覧\nhttps://www.polymer-project.org/summit","relatedLinks":[]},{"category":"SoftwareLibrary","title":"fb55/htmlparser2","url":"https://github.com/fb55/htmlparser2","tags":["JavaScript","HTML","library"],"content":"HTML/XML/RSSパーサライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"danielstjules/mocha.parallel","url":"https://github.com/danielstjules/mocha.parallel","tags":["JavaScript","testing"],"content":"mochaで書かれたテストコードをdescribe単位で並列に処理できるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jide/moveit","url":"https://github.com/jide/moveit","tags":["JavaScript","CSS","animation","library"],"content":"DOM Nodeを定義にしたがってアニメーションさせることが出来るライブラリ。\nアニメーションの定義をオブジェクトとして定義出来る","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Mostafa-Samir/zip-local","url":"https://github.com/Mostafa-Samir/zip-local","tags":["node.js"],"content":"zip/unzipを行うNode.jsモジュール","relatedLinks":[]},{"category":"Book","title":"Amazon: HTML5/CSS3モダンコーディング フロントエンドエンジニアが教える3つの本格レイアウト スタンダード・グリッド・シングルページレイアウトの作り方: 吉田 真麻","url":"http://www.amazon.co.jp/dp/4798141577","tags":["HTML5","CSS","book"],"content":"2015年11月3日発売\nレイアウトについての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-09-25のJS: Firefox 41.0、npm 3.x stableリリース、XRegExp 3.0.0","author":"azu","layout":"post","date":"2015-09-25T06:18:00.000Z","category":"JSer","tags":["Firefox","npm","node","regexp","library"],"url":"https://jser.info/2015/09/25/firefox41-npm3-xregexp3/"},"items":[{"category":"Headline","title":"Firefox 41.0 リリースノート","url":"http://www.mozilla.jp/firefox/41.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 41.0リリース。\n縦書きレイアウトの機能がデフォルトで有効に、`Symbol.species`、`new.target`のサポート、Web Workerの中でNotifications APIなどが利用できるようになるなど","relatedLinks":[{"title":"Firefox 41 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/41"}]},{"category":"Headline","title":"Node v4.1.0 (Stable) | Node.js","url":"https://nodejs.org/en/blog/release/v4.1.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v4.1.0リリース。\nBuffer作成の改善、fs.WriteStreamの書き込み速度の改善など","relatedLinks":[]},{"category":"Headline","title":"The npm Blog — npm weekly #29: npm 3 out of beta, Nick out of the...","url":"http://blog.npmjs.org/post/129378362260/npm-weekly-29-npm-3-out-of-beta-nick-out-of-the","tags":["npm","ReleaseNote"],"content":"npm 3.xがlatestとしてリリースされた。\n`npm install -g npm`でnpm 3.xがインストールされるようになった","relatedLinks":[{"title":"Release v3.0.0 · npm/npm","url":"https://github.com/npm/npm/releases/tag/v3.0.0"}]},{"category":"Headline","title":"Announcing TypeScript 1.6 - TypeScript - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/typescript/archive/2015/09/16/announcing-typescript-1-6.aspx","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 1.6リリース。\nJSX(TSX)、Class expressions、User defined type guards、Intersection types、Abstract classes、モジュール解決アルゴリズムの改善など","relatedLinks":[{"title":"Breaking Changes · Microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/Breaking-Changes#typescript-16"}]},{"category":"Headline","title":"Release 1.0 · bosonic/bosonic","url":"https://github.com/bosonic/bosonic/releases/tag/v1.0","tags":["WebComponents","JavaScript","library","ReleaseNote"],"content":"Web Componentsを扱うライブラリであるBosonic 1.0リリース","relatedLinks":[{"title":"Bosonic Web Component","url":"http://bosonic.github.io/"}]},{"category":"Headline","title":"Flagrant Badassery » XRegExp 3.0.0!","url":"http://blog.stevenlevithan.com/archives/xregexp-3-0-0","tags":["JavaScript","正規表現","library","Electron"],"content":"正規表現の拡張ライブラリであるXRegExp 3.0.0リリース。\nUnicode周りのサポート改善、`A`(astral)フラグの追加、ES6に追従した変更など","relatedLinks":[]},{"category":"Headline","title":"RxJS/CHANGELOG.md at 5.0.0-alpha.1 · ReactiveX/RxJS","url":"https://github.com/ReactiveX/RxJS/blob/5.0.0-alpha.1/CHANGELOG.md","tags":["Rx","JavaScript","library","ReleaseNote"],"content":"ReactiveX/RxJS 5.0.0αリリース","relatedLinks":[]},{"category":"Headline","title":"リリース バージョン 10547 : Microsoft Edge Dev","url":"https://dev.modern.ie/platform/changelog/desktop/10547/","tags":["MSEdge","ReleaseNote"],"content":"MSEdge Build 10547リリース。\n`<template>`、`<picture>`の追加、`<a download>`の対応、SVGで外部コンテンツのロード、フラグ付きでAsync Function、`**`演算子の対応など","relatedLinks":[{"title":"Microsoft Edge の変更ログ - Windows 10 Insider Preview Build 10547 - Browser","url":"http://browser.hatenablog.com/entry/2015/09/21/180947"}]},{"category":"Headline","title":"ESLint v1.5.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/09/eslint-v1.5.0-released/","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint v1.5.0リリース。\n`--fix`に対応するルールの追加、`--debug`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Release ES2016 Draft 1 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2016-draft-1","tags":["ECMAScript","ReleaseNote"],"content":"ES2016 Draft 1リリース。\n仕様書がWordからEcmarkupで書かれるようになり、GitHubでリリースされた。","relatedLinks":[{"title":"New in ECMAScript 2016, JavaScript","url":"http://www.infoq.com/presentations/ecmascript-2016"}]},{"category":"Article","title":"React.js v0.14 changes - blog.koba04.com","url":"http://blog.koba04.com/post/2015/09/22/react-js-v014-changes/","tags":["React","ReleaseNote"],"content":"React 0.14の変更点について","relatedLinks":[]},{"category":"Article","title":"Pointer Events Will Make Cross-Browser Touch Support Easy","url":"http://www.sitepoint.com/pointer-events-will-make-cross-browsers-touch-support-easy/","tags":["JavaScript"],"content":"Pointer Eventsのコンセプト、実際にどう使うかについての解説記事。\nfeature detectionの方法、ジェスチャーを扱うMSGesture objectについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"ESDoc Hosting Service - hosts documentation for JavaScript(ES6) with ESDoc","url":"https://doc.esdoc.org/","tags":["JSDoc","document"],"content":"[ESDoc](https://esdoc.org)で書かれたドキュメントをホスティングするサービス。\nGitHubリポジトリのURLを登録するとESDocによるドキュメントが生成される。`esdoc.json`の設定ファイルがない場合も自動的に`src/`のコードを元に生成される。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mantoni/eslint_d.js","url":"https://github.com/mantoni/eslint_d.js","tags":["JavaScript","Tools","サーバー"],"content":"ESLintをサーバとして立ててLintを行うツール。\n初回起動のオーバーヘッドがなくなるので高速に実行出来る","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ConquestArrow/dtsmake · GitHub","url":"https://github.com/ConquestArrow/dtsmake","tags":["TypeScript","JavaScript","Tools"],"content":"JavaScriptを与えるとd.tsを生成するツール","relatedLinks":[{"title":"TypeScript型定義ファイルのコツと生成ツール dtsmake - Qiita","url":"http://qiita.com/ConquestArrow/items/450f961c3d54bc932cf3"}]},{"category":"SoftwareLibrary","title":"fireball-x/editor-framework","url":"https://github.com/fireball-x/editor-framework","tags":["editor","library","Electron"],"content":"ElectronとPolymerをベースとしたエディタ向けのフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Release the docs!","url":"http://sassdoc.com/","tags":["Sass","document","Tools","JSDoc"],"content":"コメントでアノテーションを書いたSassのコードからドキュメントを生成するツール","relatedLinks":[]},{"category":"Book","title":"Amazon: 速習ECMAScript6: 次世代の標準JavaScriptを今すぐマスター！ [Kindle版]: 山田祥寛","url":"http://www.amazon.co.jp/dp/B014MS5XWK?tag=amazon0abac-22","tags":["JavaScript","ECMAScript","book"],"content":"ES6についてのKindle本","relatedLinks":[{"title":"【新刊紹介】『速習 ECMAScript 6』発売、次期JavaScript仕様を短期間でキャッチアップ！：CodeZine（コードジン）","url":"http://codezine.jp/article/detail/8963"}]},{"category":"Book","title":"Building Isomorphic JavaScript Apps: From Concept to Implementation to Real-World Solutions: Jason Strimpel, Maxime Najim: 9781491932933: Amazon.com: Books","url":"http://www.amazon.com/dp/1491932937/","tags":["JavaScript","book"],"content":"2016年4月30日発売\nIsomorphicについてのO'Reilly本","relatedLinks":[]}]},{"meta":{"title":"2015-09-29のJS: Redux 3.0リリース、JavaScriptのライブラリを公開する方法","author":"azu","layout":"post","date":"2015-09-29T13:08:00.000Z","category":"JSer","tags":["Redux","Flux","library","GitHub","JavaScript"],"url":"https://jser.info/2015/09/29/redux3.0-js-library/"},"items":[{"category":"Headline","title":"Release v3.0.1 · rackt/redux","url":"https://github.com/rackt/redux/releases/tag/v3.0.1","tags":["JavaScript","Flux","library","ReleaseNote"],"content":"Redux 3.0.1リリース。\nActionオブジェクトは`type`を持つことを必須とする破壊的な変更が含まれている。\n`combineReducers()`にチェックする仕組みを追加。","relatedLinks":[{"title":"Release v3.0.0 · rackt/redux","url":"https://github.com/rackt/redux/releases/tag/v3.0.0"}]},{"category":"Headline","title":"Release 1.2.0 - 2015.09.27 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v1.2.0","tags":["JavaScript","ECMAScript","library","ReleaseNote"],"content":"core-js 1.2.0リリース。\nPromiseにUnhandled Rejection Trackingを実装、`IsRegExp`のalgorithmの修正、`String#leftPad`のプロポーザルへの追従など","relatedLinks":[]},{"category":"Headline","title":"Release v2.2.0 · jscs-dev/node-jscs","url":"https://github.com/jscs-dev/node-jscs/releases/tag/v2.2.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"JSCS 2.2.0リリース。\n設定ファイルにYAMLを利用できるように、HTML内のスクリプトタグ内のコードをチェックできるように、ルールやプリセットの追加と修正など","relatedLinks":[]},{"category":"Article","title":"ECMAScript 2015(ES6)の概要と次世代JavaScriptの新たな機能 | HTML5Experts.jp","url":"https://html5experts.jp/1000ch/16984/","tags":["JavaScript","ECMAScript"],"content":"ES6で追加された構文とオブジェクトの簡単な解説","relatedLinks":[]},{"category":"Article","title":"ES6 Promises in Depth","url":"http://ponyfoo.com/articles/es6-promises-in-depth","tags":["ECMAScript","JavaScript","Promises"],"content":"Promiseの動きをビジュアライズしながら、`.then`や`.catch`がどのようなフローで処理されるかを解説している記事。\nPromiseを返すFetch APIを使った例を元に解説している。","relatedLinks":[{"title":"Promisees · Courtesy of ponyfoo.com","url":"http://bevacqua.github.io/promisees/"}]},{"category":"Article","title":"ES6 Modules in Depth","url":"http://ponyfoo.com/articles/es6-modules-in-depth","tags":["ECMAScript","JavaScript"],"content":"ES6 Modulesの構文についての解説","relatedLinks":[]},{"category":"Article","title":"Automated testing in Yahoo Mail | Yahoo Engineering","url":"http://yahooeng.tumblr.com/post/115664629471/automated-testing-in-yahoo-mail","tags":["Yahoo","browser","React","testing","JavaScript"],"content":"Yahoo Mailにおけるテストについて。\nUnit Tests、Functional Tests、Smoke TestsとIntegration Testsそれぞれでやっていることについて書かれている","relatedLinks":[]},{"category":"Article","title":"Typed React and Redux — Jack Hsu","url":"http://jaysoo.ca/2015/09/26/typed-react-and-redux/","tags":["TypeScript","React","Flux"],"content":"TypeScriptとReact、Reduxを組み合わせて使う事について\n型による早期エラーの発見、`interface`と`react.PropTypes`の違い、Reduxを扱う際にunion typesをモデルとして使うことについてなど","relatedLinks":[]},{"category":"Article","title":"Debugging Node.js Applications for Memory Leaks | Toptal","url":"http://www.toptal.com/nodejs/debugging-memory-leaks-node-js-applications","tags":["node.js","debug"],"content":"Node.jsアプリのメモリリークをデバッグする方法やツールについて。","relatedLinks":[]},{"category":"Article","title":"ORTC API is now available in Microsoft Edge | Microsoft Edge Dev Blog","url":"http://blogs.windows.com/msedgedev/2015/09/18/ortc-api-is-now-available-in-microsoft-edge/","tags":["MSEdge","WebRTC"],"content":"MSEdgeにORTC APIが実装されたことについて","relatedLinks":[{"title":"ORTC が切り開く SVC サイマルキャストと WebRTC NV - Block Rockin’ Codes","url":"http://jxck.hatenablog.com/entry/ortc-to-webrtcnv"}]},{"category":"Article","title":"Mastering the filesystem in Node.js — Medium","url":"https://medium.com/@yoshuawuyts/mastering-the-filesystem-in-node-js-4706b7cb0801","tags":["node.js","library"],"content":"Node.jsでファイルを作成/削除、ディレクトリを作成、ファイルを検索する方法についてまとめられている","relatedLinks":[]},{"category":"Article","title":"What forces layout/reflow. The comprehensive list.","url":"https://gist.github.com/paulirish/5d52fb081b3570c81e3a","tags":["まとめ","browser","CSS","JavaScript"],"content":"reflowを強制的に起こすCSSプロパティやJavaScriptのメソッドのまとめ","relatedLinks":[]},{"category":"Article","title":"NW.js &amp; Electron Compared | TangibleJS","url":"http://tangiblejs.com/posts/nw-js-electron-compared","tags":["node-webkit","Electron","まとめ"],"content":"NW.jsとElectronの比較","relatedLinks":[]},{"category":"SlideVideo","title":"How to Write an Open Source JavaScript Library - Video Tutorial Series @eggheadio","url":"https://egghead.io/series/how-to-write-an-open-source-javascript-library","tags":["JavaScript","library","動画","tutorial"],"content":"JavaScriptライブラリを書いてGitHubに公開し、npmにpublishすることについてのスクリーンキャスト。\nES6で書く方法やsemverについてなど幅広い内容について解説されてる。","relatedLinks":[]},{"category":"SlideVideo","title":"TechBuzz 第17回 HTML5+JS勉強会資料","url":"http://kenju.github.io/techbuzz_htmljs_20150924/","tags":["JavaScript","webworker"],"content":"Web Workerを使ったサンプルと共にWeb Workerについて解説しているスライド","relatedLinks":[]},{"category":"SlideVideo","title":"New animation inspector features in Firefox 43 - YouTube","url":"https://www.youtube.com/watch?v=T2jykykN3yc","tags":["firefox","animation","debug","動画"],"content":"Firefox 43に実装された開発者ツールのアニメーションインスペクタについて動画","relatedLinks":[]},{"category":"SoftwareLibrary","title":"clipboard.js — Copy to clipboard without Flash","url":"http://zenorocha.github.io/clipboard.js/","tags":["JavaScript","クリップボード","library"],"content":"`execCommand`を使ったクリップボードへのコピーを行うライブラリ。\nユーザーのインタラクションに対して文字列のコピーとカットが行える","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Rune.js Documentation","url":"http://runemadsen.github.io/rune.js/","tags":["JavaScript","SVG","VirtualDOM","library"],"content":"virtual-domライブラリを使ったSVG描画ライブラリ。\nGridシステムを持っているのが特徴的","relatedLinks":[]}]},{"meta":{"title":"2015-10-08のJS: React 0.14、ESLintの使い方、ES6の末尾呼び出し最適化","author":"azu","layout":"post","date":"2015-10-08T13:51:00.000Z","category":"JSer","tags":["React","ESLint","ES6"],"url":"https://jser.info/2015/10/08/react0.14-eslint-tail-call/"},"items":[{"category":"Headline","title":"React v0.14 | React","url":"http://facebook.github.io/react/blog/2015/10/07/react-v0.14.html","tags":["React","ReleaseNote"],"content":"React 0.14の正式版リリース。\n`react`と`react-dom`へのパッケージの分割、`refs`の仕様変更、ステートレスコンポーネントの追加、react-toolsが非推奨となるなど","relatedLinks":[{"title":"React.js v0.14 changes - blog.koba04.com","url":"http://blog.koba04.com/post/2015/09/22/react-js-v014-changes/"}]},{"category":"Headline","title":"Video.js Blog - Video.js 5: The Only Thing That’s Changed Is...","url":"http://blog.videojs.com/post/130143694631/video-js-5","tags":["JavaScript","library","動画","ReleaseNote"],"content":"Video.js 5リリース。\nES6で書き直し、LessからSassへ移行、HLSをFlashなしでサポート、アクセシビリティの改善、pluginへの設定の渡し方を変更、CDNにFastlyを利用するようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v2.3.0 · jscs-dev/node-jscs","url":"https://github.com/jscs-dev/node-jscs/releases/tag/v2.3.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"JSCS 2.3.0リリース。\n`disallowIdenticalDestructuringNames`、`disallowNestedTernaries`、`requireSpaceAfterComma`のルールを追加","relatedLinks":[]},{"category":"Headline","title":"Node v4.1.2 (Stable) | Node.js","url":"https://nodejs.org/en/blog/release/v4.1.2/","tags":["node.js","ReleaseNote","セキュリティ"],"content":"Node.js 4.1.2リリース。\nio.js 3.x以降にあるhttp serverのDoSに関するセキュリティ修正を含む。","relatedLinks":[{"title":"http: fix out-of-order ","url":"https://github.com/nodejs/node/commit/05040664c2035b8abffb7bd7bb3243af35895130"}]},{"category":"Headline","title":"ESLint v1.6.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/10/eslint-v1.6.0-released/","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint v1.6.0リリース。\n`--fix`対応のルールを追加、`no-undef`ルールに`typeof`オプションの追加、`env`に`nashorn`を追加など","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember.js 2.1 and 2.2 Beta Released","url":"http://emberjs.com/blog/2015/10/04/ember-2-1-released.html","tags":["JavaScript","library"],"content":"Ember.js 2.1と2.2βリリース。","relatedLinks":[]},{"category":"Headline","title":"protractor/CHANGELOG.md at 2.5.0 · angular/protractor","url":"https://github.com/angular/protractor/blob/2.5.0/CHANGELOG.md","tags":["JavaScript","testing","E2E","ReleaseNote"],"content":"Protractor 2.5.0リリース。\nAngularJS 2のサポート、`useAllAngularAppRoots`オプションの追加","relatedLinks":[]},{"category":"Article","title":"ESLint: The Next-Generation JavaScript Linter – Smashing Magazine","url":"http://www.smashingmagazine.com/2015/09/eslint-the-next-generation-javascript-linter/","tags":["JavaScript","Tools"],"content":"ESLintの使い方、設定方法、プラグインについてなどの解説記事","relatedLinks":[]},{"category":"Article","title":"エディタの実装をcycle.jsでMVIベースにしてみた話 - ✘╹◡╹✘","url":"http://r7kamura.hatenablog.com/entry/2015/10/04/062333","tags":["JavaScript","Rx","設計"],"content":"cycle.jsのアーキテクチャについて。\n「イベントソースを受け取ってイベントソースを返す関数」がどのように使われてるのか、MVIとはどういう責務での分離なのかについて。","relatedLinks":[]},{"category":"Article","title":"Asynchronous code gets easier with ES2016 Async Function support in Chakra and Microsoft Edge | Microsoft Edge Dev Blog","url":"http://blogs.windows.com/msedgedev/2015/09/30/asynchronous-code-gets-easier-with-es2016-async-function-support-in-chakra-and-microsoft-edge/","tags":["ECMAScript","MSEdge"],"content":"MSEdgeにフラグ付きで実装されてるasync/awaitについての記事。\nasync/awaitを使うことでどのように書けるか、動作原理やどのように実装されてるかについての解説","relatedLinks":[]},{"category":"Article","title":"JavaScript - 末尾再帰による最適化 - Qiita","url":"http://qiita.com/pebblip/items/cf8d3230969b2f6b3132","tags":["ECMAScript","JavaScript"],"content":"ES6の末尾呼び出し最適化の仕組みについて。\nそもそもなぜスタックオーバーフローが起きるのか、コールスタックとは何か、どのように最適化が行われるのか、再帰関数のパターンについてよくまとまっている。","relatedLinks":[]},{"category":"Article","title":"Customizing ES6 via well-known symbols","url":"http://www.2ality.com/2015/09/well-known-symbols-es6.html","tags":["ECMAScript","JavaScript"],"content":"`Symbol`にデフォルトで定義されているwell-known symbolsの使い方について。\nECMAScriptのネイティブのメソッドはwell-known symbolsを参照するため、\nそれらのメソッドの対象となったオブジェクトの扱いを設定することが出来るという利用方法について。","relatedLinks":[]},{"category":"Article","title":"Immutable Data Structures and JavaScript","url":"http://jlongster.com/Using-Immutable-Data-Structures-in-JavaScript","tags":["JavaScript","library"],"content":"JavaScriptにおけるimmutableについて。\nReduxなどを使う際にImmutableオブジェクトが欲しくなるが、現状ではJS自体にはその仕様はない。\nそのため、Immutable.jsやseamless-immutableなどのライブラリを使って実現するメリットとデメリットについて","relatedLinks":[]},{"category":"SlideVideo","title":"BrazilJS 2015 - YouTube","url":"https://www.youtube.com/playlist?list=PLg2lQYZDBwORUpJTu5MxI71iEQIyc_Lno","tags":["JavaScript","イベント","動画"],"content":"BrazilJS 2015の動画まとめ","relatedLinks":[{"title":"BrazilJS","url":"http://braziljs.com.br/"}]},{"category":"WebsiteDocument","title":"relax/relax","url":"https://github.com/relax/relax","tags":["node.js","React","CMS"],"content":"Node.jsとReactで作られてるCMS","relatedLinks":[]},{"category":"WebsiteDocument","title":"staltz/flux-challenge","url":"https://github.com/staltz/flux-challenge","tags":["Flux","サンプル"],"content":"Fluxアーキテクチャを使って実装する問題と回答のリポジトリ。\n`submissions/`以下にそれぞれの回答があり、色々なFluxを使った実装が見られる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Accelerated Mobile Pages Project","url":"https://www.ampproject.org/","tags":["HTML","spec"],"content":"AMP HTMLというHTMLのサブセットの定義に則る事で、モバイルでも高速なページの表示が行える事を目的とした規格やライブラリ","relatedLinks":[{"title":"Official Google Blog: Introducing the Accelerated Mobile Pages Project, for a faster, open mobile web","url":"https://googleblog.blogspot.jp/2015/10/introducing-accelerated-mobile-pages.html"},{"title":"Accelerated Mobile Pages – A new approach to web performance","url":"https://www.ampproject.org/how-it-works/"},{"title":"AMP HTML (Accelerated Mobile Pages) demo - YouTube","url":"https://www.youtube.com/watch?v=i2_lAEzmOPo"}]},{"category":"SoftwareLibrary","title":"jeffbski/wait-on · GitHub","url":"https://github.com/jeffbski/wait-on","tags":["node.js","library","console","Tools"],"content":"色々な待ちパターンを行えるNode.js製のコマンドラインツール。 ファイルの存在確認、HTTP HEAD/GET、TCP、Socketのレスポンス待ちなどを行える","relatedLinks":[]},{"category":"SoftwareLibrary","title":"documentationjs","url":"http://documentation.js.org/","tags":["JavaScript","document"],"content":"JSDocと同じフォーマットをサポートしたドキュメント生成ツール。\nJSON、HTML、Markdownとして出力できる。","relatedLinks":[]},{"category":"Book","title":"O&#x27;Reilly Japan - JavaScriptによるデータビジュアライゼーション入門","url":"http://www.oreilly.co.jp/books/9784873117461/","tags":["JavaScript","d3.js","book"],"content":"2015年10月21日発売\nJavaScriptによるデータの可視化についての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-10-16のJS: Node.js 4.2.0 LTS、ES6、CSS.next","author":"azu","layout":"post","date":"2015-10-16T13:22:00.000Z","category":"JSer","tags":["Node.js","ES6","CSS","JavaScript"],"url":"https://jser.info/2015/10/16/node-lts-es6-js-css-next/"},"items":[{"category":"Headline","title":"Node v4.2.0 (Stable) | Node.js","url":"https://nodejs.org/en/blog/release/v4.2.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 4.2.0リリース。\n\"Argon\"というコードネームでLTS版(長期間サポート)を初リリース、コマンドラインオプションにシンタックスチェックだけを行う`--check`を追加","relatedLinks":[{"title":"add CLI option to syntax check script by bahamas10 · Pull Request #2411 · nodejs/node","url":"https://github.com/nodejs/node/pull/2411"}]},{"category":"Headline","title":"Release 3.4.0 Release Candidate · knockout/knockout","url":"https://github.com/knockout/knockout/releases/tag/v3.4.0rc","tags":["JavaScript","library","ReleaseNote"],"content":"Knockout 3.4.0RCリリース。\n`ko.isPureComputed`、`ko.onError`の追加、Observableのパフォーマンス改善など","relatedLinks":[]},{"category":"Headline","title":"V8 JavaScript Engine: V8 Release 4.7","url":"http://v8project.blogspot.jp/2015/10/v8-release-47.html","tags":["V8","ReleaseNote"],"content":"V8 4.7リリース。\nRest operator、Array#includesの追加など","relatedLinks":[{"title":"V8 API changes - Google ドキュメント","url":"https://docs.google.com/document/d/1g8JFi8T_oAE_7uAri7Njtig7fKaPDfotU6huOa1alds/edit"}]},{"category":"Headline","title":"Release Fetch 0.10.0 · github/fetch","url":"https://github.com/github/fetch/releases/tag/v0.10.0","tags":["JavaScript","library","ReleaseNote"],"content":"Fetch APIのpolyfillであるFetch 0.10.0リリース。\n`Requst`/`Response`へのメソッドの追加","relatedLinks":[]},{"category":"Article","title":"難読化されたJavaScriptコードを読む : document","url":"http://imaya.blog.jp/archives/8183160.html","tags":["JavaScript"],"content":"難読化されたコードを読むためのツールやリファクタリング方法について","relatedLinks":[]},{"category":"Article","title":"ES2015 — Web Fundamentals","url":"https://developers.google.com/web/shows/ttt/series-2/es2015","tags":["ECMAScript","JavaScript","Tools"],"content":"ES6を学ぶためのリソースやツールについて","relatedLinks":[]},{"category":"Article","title":"ES6 Overview in 350 Bullet Points","url":"https://ponyfoo.com/articles/es6","tags":["ECMAScript","まとめ"],"content":"ES6の機能やポイントについて箇条書きでまとめたもの","relatedLinks":[]},{"category":"Article","title":"Surfin' Safari - Blog Archive » ES6 in WebKit","url":"https://www.webkit.org/blog/4054/es6-in-webkit/","tags":["webkit","safari","ECMAScript"],"content":"Safari 9とWebKit nightlyに入ってるES6周りの機能について","relatedLinks":[]},{"category":"Article","title":"A Gentle Introduction to Ember 2.0 — Medium","url":"https://medium.com/@jamesfuthey/a-gentle-introduction-to-ember-2-0-8ef1f378ee4","tags":["JavaScript","tutorial"],"content":"FirebaseとEmber.jsを使ってブログを作りながら、Ember.jsについて学ぶチュートリアル","relatedLinks":[]},{"category":"Article","title":"Lazy, composable, and modular JavaScript","url":"https://codewords.recurse.com/issues/four/lazy-composable-and-modular-javascript","tags":["JavaScript","ECMAScript"],"content":"JavaScriptでの高階関数、関数合成、遅延評価。\nGenerator/iteratorを使った関数の組み合わせ方について","relatedLinks":[]},{"category":"Article","title":"Not Angularな環境でProtractorを使ってES2015(ES6), ES7なE2Eテストコードを書いてみた - Qiita","url":"http://qiita.com/nana4gonta/items/fabf1ab30ef16050c1e8","tags":["JavaScript","testing","protractor","Selenium"],"content":"async/awaitを使ったProtractorのE2Eテスト。\n非同期処理となる部分をasync/awaitを使うことで直列に書けるようにする話","relatedLinks":[]},{"category":"SlideVideo","title":"JavaScript/CSS 2015 Autumn","url":"http://www.slideshare.net/t32k/javascriptcss-2015-autumn","tags":["JavaScript","CSS","スライド"],"content":"JavaScriptやCSS、ビルドツール周りについて幅広くまとめられているスライド","relatedLinks":[]},{"category":"SlideVideo","title":"AngularJSの$watch登録数が60,000だった - @yoshiko_pg","url":"http://yoshiko-pg.github.io/slides/20151015-gp-meetup/","tags":["AngularJS","スライド"],"content":"AngularJSのパフォーマンスチューニングについてのスライド。\n$watchの数の調べ方と改善方法について","relatedLinks":[]},{"category":"WebsiteDocument","title":"All of the javascript features.","url":"http://jsfeatures.in/","tags":["JavaScript","ECMAScript","まとめ"],"content":"ES5、ES6やES.nextの機能別のサンプルコードがまとめられているサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gabrielbull/react-desktop","url":"https://github.com/gabrielbull/react-desktop","tags":["React","mac","windows"],"content":"OS X(やWindows)風のUIを作成するReact Component","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ryanbahniuk/sassaby","url":"https://github.com/ryanbahniuk/sassaby","tags":["Sass","testing","node.js"],"content":"MochaやJasmineなどと合わせて使えるSassのテストライブラリ。\nSassの関数やmixinなどのテストを行える","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Mancy NodeJs Repl","url":"http://www.mancy-re.pl/","tags":["node.js","JavaScript","software","Electron"],"content":"Electronを使ったJavaScript REPLアプリ","relatedLinks":[]},{"category":"Book","title":"Front-end Handbook - GitBook","url":"https://www.gitbook.com/book/frontendmasters/front-end-handbook/details","tags":["JavaScript","CSS","book"],"content":"フロントエンドについての電子書籍","relatedLinks":[]}]},{"meta":{"title":"2015-10-25のJS: ESLint入門、ECMAScriptとは何か?、rollupとES6 modules","author":"azu","layout":"post","date":"2015-10-25T11:20:00.000Z","category":"JSer","tags":["ESLint","ECMAScript","Bundle","Browserify","rollup"],"url":"https://jser.info/2015/10/25/eslint-ecmascript-rollup/"},"items":[{"category":"Headline","title":"ESLint v1.7.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/10/eslint-v1.7.0-released/","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint v1.7.0リリース。\neslintrcの`extends`にJavaScriptのファイルパスそのものを書いて設定を継承出来るようになった","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at 7.0.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/7.0.0/Changelog.md","tags":["JavaScript","library","ReleaseNote"],"content":"jsdom 7.0.0リリース。\nNode.js 4.0以降が必要になった。\nXMLHttpRequestの再実装、`HTMLTemplateElement.prototype.content`の追加など","relatedLinks":[]},{"category":"Headline","title":"esprima/ChangeLog at 2.7.0 · jquery/esprima","url":"https://github.com/jquery/esprima/blob/2.7.0/ChangeLog","tags":["JavaScript","AST","library","ReleaseNote"],"content":"esprima 2.7.0リリース。\n`esprima.tokenize`にdelegatorオプションの追加など","relatedLinks":[{"title":"API: Token delegator · Issue #1332 · jquery/esprima","url":"https://github.com/jquery/esprima/issues/1332"}]},{"category":"Article","title":"JavaScript - ESLint 最初の一歩 - Qiita","url":"http://qiita.com/mysticatea/items/f523dab04a25f617c87d","tags":["JavaScript","Tools"],"content":"ESLintの使い方、設定方法、ES6関連のルールについて","relatedLinks":[]},{"category":"Article","title":"ECMAScriptの仕様策定に関するカンニングペーパー | Web Scratch","url":"http://efcl.info/2015/10/18/ecmascript-paper/","tags":["ECMAScript","まとめ"],"content":"ECMAScriptとは何か?からES2016の策定プロセス、進捗の確認方法、コントリビュートのやり方、TranspilerやPolyfillの役割など仕様策定に関する疑問をまとめたもの","relatedLinks":[]},{"category":"Article","title":"ecmascript-6-destructuring-gotcha","url":"https://www.nczonline.net/blog/2015/10/ecmascript-6-destructuring-gotcha/","tags":["ECMAScript","spec"],"content":"`let {} = {};`がES6でvalidであるというのは混乱を起こすのではという話。\n現在、ECMAScript仕様のIssueとして修正するべきかが議論されている。","relatedLinks":[{"title":"Destructuring declarations that bind nothing should probably be an early error · Issue #97 · tc39/ecma262","url":"https://github.com/tc39/ecma262/issues/97"}]},{"category":"Article","title":"EventEmitter in ES6","url":"http://www.datchley.name/es6-eventemitter/","tags":["ECMAScript","JavaScript"],"content":"ES6でシンプルにEventEmitterやObserverを実装しながら、ES6の機能について学ぶ話","relatedLinks":[]},{"category":"Article","title":"The struggles of publishing a JavaScript library | Read the Tea Leaves","url":"http://nolanlawson.com/2015/10/19/the-struggles-of-publishing-a-javascript-library/","tags":["JavaScript","library"],"content":"bower、npm、jspmに対応したライブラリの公開方法と設定について。\nBrowserify、Webpack、rollup.jsでのライブラリのビルドについてなど","relatedLinks":[{"title":"nolanlawson/hello-javascript","url":"https://github.com/nolanlawson/hello-javascript"}]},{"category":"Article","title":"Experimenting with Object.observe in JavaScript","url":"http://www.sitepoint.com/experimenting-object-observe-javascript-found-useful/","tags":["JavaScript","ECMAScript"],"content":"ES.nextで提案されている`Object.observe`の現状について。\nブラウザのサポート状況、Polyfillについて","relatedLinks":[]},{"category":"Article","title":"StrongLoop | Moving toward Express 5","url":"https://strongloop.com/strongblog/moving-toward-express-5/","tags":["node.js","library"],"content":"Express 5αでの変更点についての解説","relatedLinks":[]},{"category":"Article","title":"TypeScript 1.6時代の.d.ts管理について意見を述べておく - Qiita","url":"http://qiita.com/vvakame/items/72d22e33632178f7db24","tags":["TypeScript","まとめ"],"content":"npmパッケージとTypeScriptのd.tsの管理について。","relatedLinks":[]},{"category":"WebsiteDocument","title":"The Accessibility Project","url":"http://a11yproject.com/","tags":["アクセシビリティ","まとめ"],"content":"ウェブ開発者向けにアクセシビリティについてまとめているサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rollup.js","url":"http://rollupjs.org/","tags":["JavaScript","ECMAScript","Tools"],"content":"ES6 modulesをBrowserifyなどのようにbundleするツール。\n使用していない関数は無視したり、余計なラップする関数なしに結合が出来る。\nデフォルトではES6のみだがプラグインでCommonJSなども対応する。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Rich-Harris/magic-string","url":"https://github.com/Rich-Harris/magic-string","tags":["JavaScript","AST","library"],"content":"Source Mapをサポートしてるコード変換ライブラリ。\n文字列の上書き、追加、削除などを文字列操作のように変更を行うことができる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":".eslintrc editor","url":"https://pirosikick.github.io/eslintrc-editor/","tags":["JavaScript","Tools","設定"],"content":"ESLintの設定をGUIでポチポチと作成することが出来るツール","relatedLinks":[{"title":"ESLintの設定ファイルをブラウザでポチポチして作るツールを作った - Qiita","url":"http://qiita.com/pirosikick/items/64cb38752fa252911501"}]},{"category":"SoftwareLibrary","title":"cotejp/webmidi","url":"https://github.com/cotejp/webmidi","tags":["web","sound","library"],"content":"Web MIDI APIをラップしたライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dleitee/valid.js","url":"https://github.com/dleitee/valid.js","tags":["JavaScript","library"],"content":"String、Number、Date、Boolなどにおけるバリデーションを組み合わせたバリデーション関数を作成できるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rodrigogs/kairos","url":"https://github.com/rodrigogs/kairos","tags":["JavaScript","library"],"content":"時間同士の四則演算や比較を行うライブラリ","relatedLinks":[]},{"category":"Book","title":"SVG Text Layout - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920043072.do","tags":["SVG","book"],"content":"SVGにおけるテキストのレイアウトについての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-11-03のJS: Vue.js 1.0.0、Babel 6.0、Node.js 5.0","author":"azu","layout":"post","date":"2015-11-03T10:16:00.000Z","category":"JSer","tags":["Vue","Babel","Node.js"],"url":"https://jser.info/2015/11/03/vue1.0-babel6.0-node5.0/"},"items":[{"category":"Headline","title":"Vue.js 1.0.0 Released - vue.js","url":"http://vuejs.org/2015/10/26/1.0.0-release/","tags":["JavaScript","library","ReleaseNote"],"content":"Vue.js 1.0.0リリース。\nテンプレートの改善、非推奨なAPIを削除、初期表示の速度改善など","relatedLinks":[{"title":"Release 1.0.0 Evangelion · vuejs/vue","url":"https://github.com/vuejs/vue/releases/tag/1.0.0"},{"title":"Vue.js 1.0.0 リリースしました - vue.js","url":"http://jp.vuejs.org/2015/10/26/1.0.0-release/"},{"title":"Vue.js: a (re)introduction","url":"http://blog.evanyou.me/2015/10/25/vuejs-re-introduction/"}]},{"category":"Headline","title":"6.0.0 Released · Babel","url":"https://babeljs.io/blog/2015/10/29/6.0.0","tags":["babel","ReleaseNote"],"content":"Babel 6.0.0リリース。\nまだ関連プラグインが追いついていないため扱いに注意。\nBabelの内部的に使っていたモジュールがそれぞれパッケージとして利用できるようになった。\nプラグインがオプトインとなり、同時にプラグインプリセットが用意された。\nまた変換の速度改善やプラグインのAPI変更が行われている。","relatedLinks":[{"title":"babel/CHANGELOG.md at master · babel/babel","url":"https://github.com/babel/babel/blob/master/CHANGELOG.md#600"}]},{"category":"Headline","title":"Node v5.0.0 (Stable) | Node.js","url":"https://nodejs.org/en/blog/release/v5.0.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 5.0.0リリース。\n`fs.readFile`がfile descriptorをサポート、npm 3.xがデフォルトへと変更、ALPNサポート、`util.inherits`がES6 Classesからも継承できるようになるなど","relatedLinks":[{"title":"ファイル記述子がfs.readFile()等でサポートへ - Weblog - Hail2u.net","url":"http://hail2u.net/blog/coding/file-descriptor-support-in-fs-file-functions.html"}]},{"category":"Headline","title":"New in bluebird 3.0 | bluebird","url":"http://bluebirdjs.com/docs/new-in-bluebird-3.html","tags":["JavaScript","Promises","library","ReleaseNote"],"content":"Promiseライブラリであるbluebird 3.0リリース。\nCancellation APIのデザインを変更、 Promisificationの挙動を変更、`Promise.config`で警告についてを設定可能になるなど","relatedLinks":[]},{"category":"Headline","title":"Dev.Opera — Opera 33 released","url":"https://dev.opera.com/blog/opera-33/","tags":["Opera","Chrome","ReleaseNote"],"content":"Opera 33リリース。\n`<link rel=preconnect>`、ES6 `new.target`、spread operator、DOMException、`CSS.escape`、HTTP Client Hintsなどのサポート","relatedLinks":[]},{"category":"Headline","title":"Release 1.20.0 · jquery/qunit","url":"https://github.com/jquery/qunit/releases/tag/1.20.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"QUnit 1.20.0リリース\n`assert.raises()`の追加、`Symbol`の比較をサポート、`QUnit.module`のネストに対応するなど","relatedLinks":[]},{"category":"Headline","title":"node-browserify/changelog.markdown at master · substack/node-browserify","url":"https://github.com/substack/node-browserify/blob/master/changelog.markdown#1200","tags":["browser","ReleaseNote"],"content":"Browserify 12.0.0リリース。\nNode.js 4.xが対象となり、0.8はサポートから外れた。\nSource Mapで日本語などが化けないように、シンボリックリンクされたモジュールは変換の対象外へと変更など","relatedLinks":[]},{"category":"Headline","title":"ESLint v1.8.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/10/eslint-v1.8.0-released/","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint v1.8.0リリース。\n`--cache`でキャッシュを作るファイル・ディレクトリを指定できるように","relatedLinks":[]},{"category":"Article","title":"Vue.js: a (re)introduction","url":"http://blog.evanyou.me/2015/10/25/vuejs-re-introduction/","tags":["JavaScript","library","tutorial"],"content":"Vue.js 1.0.0がリリースされたため、Vue.jsについて改めて紹介する記事","relatedLinks":[]},{"category":"Article","title":"express実践入門","url":"https://gist.github.com/mitsuruog/fc48397a8e80f051a145","tags":["node.js","サーバー","tutorial"],"content":"expressの入門記事\n基本的な使い方、ミドルウェア、プロジェクト構造、テンプレート、エラーハンドリング、ログの取り方などについて書かれている","relatedLinks":[]},{"category":"Article","title":"Bitovi.com | DoneJS Release","url":"http://blog.bitovi.com/donejs-release/","tags":["JavaScript","MVC","library","ReleaseNote"],"content":"JavaScriptMVCの後継であるDoneJSリリース。\nDoneJSの特徴について紹介されてる","relatedLinks":[{"title":"donejs - donejs","url":"http://donejs.com/"}]},{"category":"Article","title":"Firebug &amp; DevTools Integration ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/10/firebug-devtools-integration/","tags":["firefox","Firebug","debug"],"content":"FirebugとFirefox開発者ツールについて。\nFirebug 3ではFirefox開発者ツール上で動くものとなる。\nHAR exportやServer側からconsole APIを利用できるChrome Loggerのプロトコルに対応するなど","relatedLinks":[]},{"category":"Article","title":"React+Flux can do in just 137 lines what jQuery can do in 10 | A geek with a hat","url":"http://swizec.com/blog/reactflux-can-do-in-just-137-lines-what-jquery-can-do-in-10/swizec/6740","tags":["JavaScript","設計","jQuery","React","Flux"],"content":"メールを出すだけの機能を作るのにjQueryだと10行、React+Fluxだと137行となった。\n行数で見ると無駄に見えるが、\nFluxはパターンであるため他の人が見た時に理解がしやすかったり、新しい機能を追加しやすいなどの違いがあるという話。","relatedLinks":[]},{"category":"Article","title":"ES7: Async await","url":"http://tagtree.io/es7-async-await","tags":["ECMAScript","JavaScript","動画"],"content":"async/awaitについてのスクリーンキャスト。\nPromiseでGitHub APIを叩くものを書いて、それをasync/awaitに書き換えながら紹介している","relatedLinks":[]},{"category":"Article","title":"Easier Concurrent Programming in JavaScript with Async Functions","url":"http://amasad.me/2015/10/31/javascript-async-functions-for-easier-concurrent-programming/","tags":["JavaScript"],"content":"自動販売機的なプログラミングを題材とした、非同期処理とレースコンディションについて\nステートマシンベースのもの、Promiseキューとasync/awaitを使ったものをそれぞれ見ていく話","relatedLinks":[]},{"category":"SlideVideo","title":"Vue.js入門","url":"http://www.slideshare.net/nazone/vuejs-54412741","tags":["JavaScript","library","スライド"],"content":"Vue.jsについてのスライド\n1.0での変更点や基本的な使い方について","relatedLinks":[]},{"category":"WebsiteDocument","title":"React Cheat Sheet","url":"http://reactcheatsheet.com/","tags":["React","チートシート","検索"],"content":"ReactのAPIから該当ドキュメントへ移動出来るチートシート","relatedLinks":[]},{"category":"SoftwareLibrary","title":"codemix/fast.js","url":"https://github.com/codemix/fast.js","tags":["JavaScript","library"],"content":"ArrayやStringなどのネイティブメソッドと似たような処理を実装し直してるライブラリ。\n100％の互換性ではなくエッジケースへの対応などは落とすことで速度を稼いでいる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"samccone/drool","url":"https://github.com/samccone/drool","tags":["Chrome","webdriver","debug"],"content":"ChromeDriver(via selenium)を使ってメモリリークが起きてないかを自動チェックするためのツール。","relatedLinks":[]},{"category":"Book","title":"Why Isomorphic JavaScript? - O&#x27;Reilly Media","url":"http://www.oreilly.com/web-platform/free/why-isomorphic-javascript.csp","tags":["JavaScript","book"],"content":"Isomorphicについての薄い電子書籍","relatedLinks":[]},{"category":"Book","title":"Learning JavaScript, 3rd Edition - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920035534.do","tags":["JavaScript","book"],"content":"2016年1月発売\n初めてのJavaScript 第3版","relatedLinks":[]}]},{"meta":{"title":"2015-11-09のJS: 巨大なJavaScriptのリファクタリング、Firefox 44の開発者ツール","author":"azu","layout":"post","date":"2015-11-09T13:03:00.000Z","category":"JSer","tags":["JavaScript","Firefox","debug"],"url":"https://jser.info/2015/11/09/large-refactoring-firefox44/"},"items":[{"category":"Headline","title":"Release v3.4.0 · npm/npm","url":"https://github.com/npm/npm/releases/tag/v3.4.0","tags":["npm","ReleaseNote"],"content":"npm 3.4.0で`npm install && npm test`を行う`npm install-test`というコマンドが追加された。\n`--dry-run`などと組み合わせて、依存モジュールのアップデートテストに活用出来る","relatedLinks":[]},{"category":"Headline","title":"PEP 0.4.0 | Official jQuery Blog","url":"http://blog.jquery.com/2015/11/05/pep-0-4-0/","tags":["jQuery","library","ReleaseNote"],"content":"Pointer Events Polyfill 0.4.0リリース","relatedLinks":[]},{"category":"Headline","title":"Release ES2016 Draft 2015-11-03 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2016-draft-20151103","tags":["ECMAScript","ReleaseNote"],"content":"ES2016 Draft 2015-11-03リリース。\nabstract operationであるReturnIfAbruptのシンタックスシュガーである`?`の導入。\n仕様書のバグ修正や実在する実装に合わせて`__proto__`がstrict modeでも許可されるようになるなど","relatedLinks":[]},{"category":"Headline","title":"ESLint v1.9.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/11/eslint-v1.9.0-released/","tags":["JavaScript","ECMAScript","library","ReleaseNote"],"content":"ESLint v1.9.0リリース。\nnpm 3の対応改善など","relatedLinks":[]},{"category":"Article","title":"7 Things You Should Know About WebAssembly","url":"https://auth0.com/blog/2015/10/14/7-things-you-should-know-about-web-assembly/","tags":["WebAssembly"],"content":"WebAssemblyについてよくある疑問に対する分かりやすい解説","relatedLinks":[]},{"category":"Article","title":"Javascript quiz. ES6 edition. — Perfection Kills","url":"http://perfectionkills.com/javascript-quiz-es6/","tags":["ECMAScript","JavaScript"],"content":"ES6についてのJavaScriptクイズ","relatedLinks":[]},{"category":"SlideVideo","title":"フロントエンドに秩序を取り戻す方法 // Speaker Deck","url":"https://speakerdeck.com/fand/hurontoendonizhi-xu-woqu-rili-sufang-fa","tags":["JavaScript","スライド"],"content":"昔ながらの名前空間風で管理されconcatして扱うJavaScriptをどうやってモジュール管理出来るようにリファクタリングしていくかという話。\nまた、Reactなどのライブラリ導入における議論やリファクタリングとE2E/ユニットテストについて","relatedLinks":[]},{"category":"SlideVideo","title":"Developer Edition 44: New visual editing and memory management tools ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/11/developer-edition-44-creative-tools-and-more/","tags":["firefox","debug"],"content":"Firefox 44での開発者ツールについて。\nアニメーションパネル、 pixel rulers、メモリ消費量のスナップショット、WebSocketのデバッグ機能の追加など","relatedLinks":[{"title":"Developer Edition 44：新しいスタイル調整機能とメモリー管理ツール | Mozilla Japan ブログ","url":"http://www.mozilla.jp/blog/entry/10510/"}]},{"category":"SlideVideo","title":"What&#x27;s new in Chrome DevTools? // Speaker Deck","url":"https://speakerdeck.com/addyosmani/whats-new-in-chrome-devtools","tags":["Chrome","debug"],"content":"Chrome開発者ツールの新しい機能についてのスライド","relatedLinks":[]},{"category":"SlideVideo","title":"Javascript Unit Testing - Early Release - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920042594.do","tags":["JavaScript","動画"],"content":"ユニットテストについてのスクリーンキャスト","relatedLinks":[]},{"category":"WebsiteDocument","title":"npmcdn","url":"https://npmcdn.com/","tags":["npm","library","webservice"],"content":"npmにあるものをブラウザで読み込めるように配信するCDN的なサービス","relatedLinks":[]},{"category":"WebsiteDocument","title":"DevTools Challenger","url":"http://devtoolschallenger.com/","tags":["firefox","debug"],"content":"Firefoxの開発者ツールの使い方についてを学べるサイト。\nアニメーション制御やカラーピッカーなどのFirefox 44で新しく追加された機能について扱ってる。","relatedLinks":[{"title":"Developer Edition 44: New visual editing and memory management tools ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/11/developer-edition-44-creative-tools-and-more/"}]},{"category":"SoftwareLibrary","title":"lepture/vui · GitHub","url":"https://github.com/lepture/vui","tags":["JavaScript","UI","library"],"content":"Vue.jsベースのUIフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"neal-react - Declarative landing pages for react.js","url":"http://www.nealjs.com/","tags":["React","UI","library"],"content":"Reactを使ったランディングページでよく使われるUIをまとめたComponent集","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Scooter - Welcome to Scooter","url":"http://dropbox.github.io/scooter/","tags":["dropbox","Sass","library"],"content":"DropboxのSassフレームワーク","relatedLinks":[]},{"category":"Book","title":"Amazon: 確かな力が身につくJavaScript「超」入門 (Informatics &amp; IDEA): 狩野 祐東","url":"http://www.amazon.co.jp/dp/4797383585","tags":["JavaScript","初心者","book"],"content":"プログラミング初心者向けのJavaScriptについての書籍","relatedLinks":[{"title":"確かな力が身につくJavaScript「超」入門 | 狩野祐東の本 solidpanda.com","url":"http://www.solidpanda.com/book/title/js-beginner/"}]},{"category":"Book","title":"Selenium - O'Reilly Media","url":"http://shop.oreilly.com/product/0636920042853.do","tags":["Selenium","book"],"content":"2016年1月発売\nSeleniumについての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-11-16のJS: ECMAScript 2016(ES7)って何、WindowsでのNode.js入門","author":"azu","layout":"post","date":"2015-11-16T13:49:00.000Z","category":"JSer","tags":["ECMAScript","ES.next","MS","Node.js"],"url":"https://jser.info/2015/11/16/ecmascript-7-ms-node-js/"},"items":[{"category":"Headline","title":"babel/CHANGELOG.md at master · babel/babel","url":"https://github.com/babel/babel/blob/master/CHANGELOG.md#614","tags":["babel","ReleaseNote"],"content":"Babel 6.1.4リリース。\n`babel/register`が`babel-register`というパッケージに分離、ブラウザ向けの`babel-browser`パッケージの追加、バグ修正など","relatedLinks":[]},{"category":"Article","title":"What’s in ECMAScript 2016 (ES7)?","url":"http://www.2ality.com/2015/11/tc39-process.html","tags":["ECMAScript","spec"],"content":"ECMAScriptに関する用語解説やES.nextにおける策定プロセスの解説。\nまた“ES7 features”のような紹介は間違っているかもしれないという話や現状の策定状況についてなど","relatedLinks":[{"title":"Introduction | ECMAScriptとは何か？","url":"http://azu.github.io/slide-what-is-ecmascript/"}]},{"category":"Article","title":"Haskell in ES6: Part 1- casual javascript","url":"http://casualjavascript.com/javascript/es6/haskell/native/implementation/2015/11/12/haskell-in-es6-part-1.html","tags":["JavaScript","関数型プログラミング"],"content":"JavaScriptでHaskellの関数を実装していく話","relatedLinks":[]},{"category":"Article","title":"Anatomy of a large Angular application — Medium","url":"https://medium.com/@bojzi/anatomy-of-a-large-angular-application-f098e5e36994","tags":["AngularJS","JavaScript","設計"],"content":"大きなAngularJSアプリの構造について。\nTypeScriptで書いてBrowserifyでビルド、コードの構造のレイヤー分けやデータフローなどの設計について","relatedLinks":[]},{"category":"Article","title":"Microsoft/nodejs-guidelines","url":"https://github.com/Microsoft/nodejs-guidelines","tags":["MS","node.js","windows","tutorial"],"content":"Windows向けのNode.js入門的なガイドライン","relatedLinks":[]},{"category":"Article","title":"KeitaMoromizato/js-study-front-test","url":"https://github.com/KeitaMoromizato/js-study-front-test","tags":["JavaScript","testing","tutorial"],"content":"Node.jsでのテストとKarmaなどを使ったブラウザテストの違いや仕組みについて。\n実際に試せるサンプルと共に紹介されているので分かりやすい。","relatedLinks":[{"title":"社内JavaScript勉強会で作ったコンテンツまとめ - Qiita","url":"http://qiita.com/KeitaMoromizato/items/82679e98add1345646c6"}]},{"category":"Article","title":"Kinoma now shipping JavaScript 6th Edition (ES6) support | Kinoma Notes - Blog of Kinoma team","url":"http://blog.kinoma.com/2015/10/es6_support/","tags":["JavaScript","ECMAScript"],"content":"KinomaのIoTデバイス向けのJavaScriptエンジンXS6がES6 Compat tableで96％の実装率を持っているという話","relatedLinks":[{"title":"ECMAScript 6 compatibility table","url":"http://kangax.github.io/compat-table/es6/"}]},{"category":"SlideVideo","title":"ES6 in Practice","url":"http://www.slideshare.net/teppeis/es6-in-practice","tags":["ECMAScript","スライド"],"content":"ECMAScriptの策定プロセスやES6 Modulesについてのスライド。\nES6 Modulesのメリット、現状の問題について書かれている。\n現状では構文とセマンティクスのみが決定している。\n読み込み方などについて、BabelなどのTranspilerは独自の解釈があることについての問題提起","relatedLinks":[]},{"category":"SlideVideo","title":"BlinkOn 5 One Pager - Google ドキュメント","url":"https://docs.google.com/document/d/1BtfsTBVt7KZekH69dCXK0nOCn-W_kkv23lqjqTJ_sYY/edit#heading=h.rx77pwie3tnj","tags":["blink","イベント","まとめ"],"content":"BlinkOn 5のスライドと動画まとめ","relatedLinks":[]},{"category":"SlideVideo","title":"Porting C/C++ to Web - Google スライド","url":"https://docs.google.com/presentation/d/1liKVavDBbcg0w8izutvVopCWKGu5M7EJPvst1JlpN_s/present#slide=id.p","tags":["JavaScript","C言語","C++","スライド"],"content":"ブラウザのプラグイン(ネイティブコード)とJavaScriptについてのスライド。\nC/C++をemscriptenで変換する方法やasm.js、wasmについての解説。\nまたそれぞれの現段階での実行速度について","relatedLinks":[{"title":"Web Assembly BlinkOn 5 - Google スライド","url":"https://docs.google.com/presentation/d/19gdTwicIb-tkZ1bg8117pKVJ5oLnBbf1FsRUfDuFSQg/present#slide=id.g40421410250356b_1"},{"title":"ハイパフォーマンスなWebを実現するasm.js／WebAssemblyとは――Mozillaのルーク・ワグナー氏に聞く：CodeZine（コードジン）","url":"http://codezine.jp/article/detail/9072"}]},{"category":"SlideVideo","title":"鉄腕アニメーション","url":"http://people.mozilla.org/~bbirtles/pres/201511-astro-animation/#/title-screen","tags":["firefox","animation","スライド"],"content":"Web Animationについてのスライド","relatedLinks":[]},{"category":"SlideVideo","title":"Schedule - View Source","url":"https://viewsourceconf.org/schedule/","tags":["browser","イベント","スライド","まとめ"],"content":"ViewSource Conferenceの動画とスライドまとめ","relatedLinks":[]},{"category":"SlideVideo","title":"Jeff Morrison - Flow or how I learned to stop worrying and typecheck my React code - YouTube","url":"https://www.youtube.com/watch?v=9U4_hlnaFEE","tags":["React","flowtype","動画"],"content":"ReactとFlowTypeを使った開発についての動画","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jaredreich/notie.js","url":"https://github.com/jaredreich/notie.js","tags":["JavaScript","UI","library"],"content":"依存がないNotification UIライブラリ。\n画面上部に被さる形の通知UI","relatedLinks":[]},{"category":"SoftwareLibrary","title":"danvk/source-map-explorer · GitHub","url":"https://github.com/danvk/source-map-explorer","tags":["sourcemap","debug"],"content":"Source Mapから利用情報を可視化してファイルサイズやサイズの割合などを調べるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mweststrate/mobservable","url":"https://github.com/mweststrate/mobservable","tags":["JavaScript","library"],"content":"配列やオブジェクトなどをラップして変更監視が出来るライブラリ。\ngetterとsetterを使い変更を監視するためプロパティの代入による変更を通知出来る","relatedLinks":[{"title":"Object.observe is dead. Long live Mobservable.observe — Medium","url":"https://medium.com/@mweststrate/object-observe-is-dead-long-live-mobservable-observe-ad96930140c5"}]},{"category":"Book","title":"Client-Side Data Storage - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920043676.do","tags":["browser","JavaScript","book"],"content":"2016年1月発売\nクライアントサイドのストレージについての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-11-23のJS: JSDoc 3.4.0、Grunt/Bowerの今後、JavaScriptトレンド","author":"azu","layout":"post","date":"2015-11-23T11:40:00.000Z","category":"JSer","tags":["JSDoc","Grunt","Bower","JSer"],"url":"https://jser.info/2015/11/23/jsdoc3.4.0-grunt-bower-js-trends/"},"items":[{"category":"Headline","title":"Grunt, Rebooted | Official jQuery Blog","url":"http://blog.jquery.com/2015/11/19/grunt-rebooted/","tags":["Grunt","jQuery","issue"],"content":"GruntはjQuery Foundationに移管され、新たなメンテナーを求める形で再始動するとのこと","relatedLinks":[{"title":"Grunt needs your help! · Issue #1403 · gruntjs/grunt","url":"https://github.com/gruntjs/grunt/issues/1403"},{"title":"Grunt project tasks for jQuery Foundation transition · Issue #1404 · gruntjs/grunt","url":"https://github.com/gruntjs/grunt/issues/1404"}]},{"category":"Headline","title":"ESLint v1.10.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2015/11/eslint-v1.10.0-released/","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint v1.10.0リリース。\n設定ファイルとして`.eslintrc.yml`等も認識するように、`--init`で幾つかのデフォルトスタイルを選べるようになど","relatedLinks":[]},{"category":"Headline","title":"jest/CHANGELOG.md at 0.8.0 · facebook/jest","url":"https://github.com/facebook/jest/blob/0.8.0/CHANGELOG.md","tags":["JavaScript","testing","library","ReleaseNote"],"content":"JavaScriptテストフレームワークのJest 0.8.0リリース。\nJasmine 2に対応するなど","relatedLinks":[]},{"category":"Headline","title":"babel/CHANGELOG.md at master · babel/babel","url":"https://github.com/babel/babel/blob/master/CHANGELOG.md#620","tags":["babel","ReleaseNote"],"content":"Babel 6.2.0リリース。\nES.next Stage 2の`function.sent`のサポート、コメントに関するバグの修正など","relatedLinks":[{"title":"ESideas/Generator metaproperty.md at master · allenwb/ESideas","url":"https://github.com/allenwb/ESideas/blob/master/Generator%20metaproperty.md"}]},{"category":"Headline","title":"Release JSDoc 3.4.0 · jsdoc3/jsdoc","url":"https://github.com/jsdoc3/jsdoc/releases/tag/3.4.0","tags":["JavaScript","document","Tools","ReleaseNote"],"content":"JSDoc 3.4.0リリース。\nES6で書かれたコードのサポート、JSXのサポート、Rhinoのサポート終了など","relatedLinks":[]},{"category":"Headline","title":"protractor/CHANGELOG.md at 3.0.0 · angular/protractor","url":"https://github.com/angular/protractor/blob/3.0.0/CHANGELOG.md","tags":["E2E","testing","AngularJS","ReleaseNote"],"content":"E2EテストフレームワークのProtractor 3.0.0リリース。\nJasmine 2.xへのアップデート、Cucumberはデフォルトではなくなり、BrowserStackのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node v5.1.0 (Stable) | Node.js","url":"https://nodejs.org/en/blog/release/v5.1.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 5.1.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember.js 2.2 and 2.3 Beta Released","url":"http://emberjs.com/blog/2015/11/16/ember-2-2-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember.js 2.2と2.3 Betaリリース。\n2.3 Betaではcontextual componentsの機能が追加された","relatedLinks":[]},{"category":"Article","title":"W3C Highlights - October 2015","url":"http://www.w3.org/2015/10/w3c-highlights/","tags":["W3C","まとめ"],"content":"2015年10月のW3Cハイライト。\nWGの議論場としてDiscourse、リポジトリ管理にGitHubを使うケースが増えた。\nW3C Document Licenseが作られた。\nMOOCsのプラットフォームであるedXと連携してオンライン講座を開設するなど","relatedLinks":[{"title":"W3Cx - Free Courses from The World Wide Web Consortium (W3C) | edX","url":"https://www.edx.org/school/w3cx"}]},{"category":"Article","title":"React - Redux 基礎：Action 編 - Qiita","url":"http://qiita.com/yasuhiro-okada-aktsk/items/09ab40af831c6d73491b","tags":["JavaScript","Flux","tutorial"],"content":"Reduxの基本的な使い方について紹介している記事。\nRedux内に出てくるパターンについても書かれている","relatedLinks":[{"title":"React - Redux 基礎：Reducer 編 - Qiita","url":"http://qiita.com/yasuhiro-okada-aktsk/items/9d9025cb58ffba35f864"},{"title":"React - Redux 基礎：Middleware 編 - Qiita","url":"http://qiita.com/yasuhiro-okada-aktsk/items/1fe3df267a6034d970c1"},{"title":"yasuhiro-okada-aktsk/sample","url":"https://github.com/yasuhiro-okada-aktsk/sample_redux"}]},{"category":"Article","title":"&#x60;redux&#x60;と&#x60;flux&#x60;を比べてみたときの個人的な感想","url":"http://www.slideshare.net/ssusera7b1a1/reduxflux","tags":["React","Flux","スライド"],"content":"Reduxとfluxについての比較","relatedLinks":[]},{"category":"Article","title":"Node.jsのセキュリティ・チェックリスト | プログラミング | POSTD","url":"http://postd.cc/node-js-security-checklist/","tags":["node.js","セキュリティ","翻訳"],"content":"Node.jsで書かれたウェブアプリケーションのセキュリティチェックリストについて","relatedLinks":[]},{"category":"Article","title":"Flexbox For Interfaces All The Way: Tracks Case Study – Smashing Magazine","url":"http://www.smashingmagazine.com/2015/11/flexbox-interfaces-tracks-case-study/","tags":["CSS"],"content":"Flexboxにおけるパターンの解説","relatedLinks":[]},{"category":"Article","title":"ES.stage3: Object.entries() and Object.values()","url":"http://www.2ality.com/2015/11/stage3-object-entries.html","tags":["ECMAScript"],"content":"Stage 3の`Object.entries()`と`Object.values()`について。\n`Object.keys()`に対応する関係なので配列を返す。\nIteratorはReflect APIの方を利用する","relatedLinks":[]},{"category":"Article","title":"Announcing Visual Studio Code Beta - Visual Studio Code - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/vscode/archive/2015/11/17/announcing-visual-studio-code-beta.aspx","tags":["TypeScript","editor","ReleaseNote"],"content":"VS Codeがオープンソースとして公開され、Extensionの仕組みなども提供されてる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"JavaScript Air","url":"http://javascriptair.com/","tags":["JavaScript","podcast"],"content":"JavaScriptポッドキャスト。\nHangoutsでのライブ配信も行う。\n初回はBrendan Eichがゲストの予定。","relatedLinks":[{"title":"Introducing JavaScript Air — Medium","url":"https://medium.com/@kentcdodds/introducing-javascript-air-46700561f38d#.v9ty44vkg"}]},{"category":"SoftwareLibrary","title":"Plotly.js Open-Source Announcement","url":"https://plot.ly/javascript/open-source-announcement/","tags":["JavaScript","グラフ","library"],"content":"D3.jsとstack.glをベースにしたグラフライブラリ。","relatedLinks":[{"title":"plotly/plotly.js","url":"https://github.com/plotly/plotly.js"}]},{"category":"SoftwareLibrary","title":"ally.js","url":"http://allyjs.io/","tags":["JavaScript","アクセシビリティ","library"],"content":"DOM要素のフォーカスとタブ移動に関するブラウザ差異の吸収ライブラリ。\n`:focus-within`のpolyfill提供など","relatedLinks":[{"title":"What does ","url":"http://allyjs.io/what-is-focusable.html"}]},{"category":"SoftwareLibrary","title":"sapegin/react-styleguidist","url":"https://github.com/sapegin/react-styleguidist","tags":["React","UI","document"],"content":"React Componentのコードからスタイルガイドを生成するツール","relatedLinks":[]}]},{"meta":{"title":"2015-12-01のJS: EdgeHTML 13、TypeScript 1.7、Progressive Web Apps","author":"azu","layout":"post","date":"2015-12-01T12:05:00.000Z","category":"JSer","tags":["TypeScript","MSEdge","Progressive"],"url":"https://jser.info/2015/12/01/edgehtml13-typescript1.7-prgressive-webapps/"},"items":[{"category":"Headline","title":"AngularJS 1.5.0-beta.2 and 1.4.8 have been released","url":"http://angularjs.blogspot.jp/2015/11/angularjs-15-beta2-and-14-releases.html","tags":["AngularJS","ReleaseNote"],"content":"AngularJS 1.5.0-beta.2と1.4.8リリース。","relatedLinks":[]},{"category":"Headline","title":"V8 JavaScript Engine: V8 Release 4.8","url":"http://v8project.blogspot.jp/2015/11/v8-release-48.html","tags":["V8","ReleaseNote"],"content":"V8 4.8リリース(Chrome 48で搭載)。\nwell-known symbolsの追加、 ArrayメソッドがArray-likeなオブジェクトを扱う際にES6の仕様へ準拠するように","relatedLinks":[{"title":"Issue 3087 - v8 - ES6: Array.prototype.slice and friends should use ToLength instead of ToUint32 - V8 JavaScript Engine - Google Project Hosting","url":"https://code.google.com/p/v8/issues/detail?id=3087"}]},{"category":"Headline","title":"Introducing EdgeHTML 13, our first platform update for Microsoft Edge | Microsoft Edge Dev Blog","url":"http://blogs.windows.com/msedgedev/2015/11/16/introducing-edgehtml-13-our-first-platform-update-for-microsoft-edge/","tags":["MSEdge","ReleaseNote"],"content":"EdgeHTML 13の変更点について。\nHTMLやCSS関連では、\nCSS `initial`と`unset`、`a[download]`、`input[type=time]`、`<picture>`、ORTC、`<template>`のサポート。\n\nJavaScript関連では、ES6 Classesとasm.jsをデフォルトサポート。\nフラグ付きでasync/await、Exponentiation operator、Destructuringのサポート。","relatedLinks":[{"title":"Release version 10586 : Microsoft Edge Dev","url":"https://dev.windows.com/en-us/microsoft-edge/platform/changelog/desktop/10586/?compareWith=10240"}]},{"category":"Headline","title":"Announcing TypeScript 1.7 - TypeScript - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/typescript/archive/2015/11/30/announcing-typescript-1-7.aspx","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 1.7リリース。\nasync/awaitはフラグなしで利用できるように、Exponentiation operatorをサポート、`--target ES6`と`--module`が併用可能になるなど","relatedLinks":[{"title":"Roadmap · Microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/Roadmap#17"},{"title":"What","url":"https://github.com/Microsoft/TypeScript/wiki/What%27s-new-in-TypeScript#typescript-17"},{"title":"TypeScript 1.7.3 変更点 - Qiita","url":"http://qiita.com/vvakame/items/0441f248b349eba9e267"}]},{"category":"Article","title":"Introducing Pokedex.org: a progressive webapp for Pokémon fans — Pocket JavaScript","url":"http://www.pocketjavascript.com/blog/2015/11/23/introducing-pokedex-org","tags":["JavaScript","performance"],"content":"Progressive Web Apps(アプリになっていくウェブ)を実現する色々。\nオフラインでも動作するようにしたり、\n60FPSスクロールを実現するためにVirtual DOMのdiff/patchをWeb WorkerでUIから重たい処理を省き、CSSアニメーションを活用するなど","relatedLinks":[{"title":"Progressive Web Apps: Escaping Tabs Without Losing Our Soul – Infrequently Noted","url":"https://infrequently.org/2015/06/progressive-apps-escaping-tabs-without-losing-our-soul/"},{"title":"Progressive Web Appsとは - fragmentary","url":"http://myakura.hatenablog.com/entry/2015/11/18/053939"}]},{"category":"Article","title":"Don't lose user and app state, use Page Visibility - igvita.com","url":"https://www.igvita.com/2015/11/20/dont-lose-user-and-app-state-use-page-visibility/","tags":["JavaScript","まとめ","event"],"content":"pagehideやvisibilityChangeなどの画面表示関連のイベント対応表。\n各ブラウザでのサポート状況について","relatedLinks":[]},{"category":"Article","title":"From Karma to Mocha, with a taste of jsdom — Podio Engineering Blog — Medium","url":"https://medium.com/podio-engineering-blog/from-karma-to-mocha-with-a-taste-of-jsdom-c9c703a06b21","tags":["JavaScript","testing"],"content":"KarmaからMocha+jsdomへテストを移行した話。\nIsolationの仕組み、全テストの実行時間、単独のテストケース実行、監視などそれぞれの項目における比較が書かれている","relatedLinks":[]},{"category":"Article","title":"Configuring Babel 6","url":"http://www.2ality.com/2015/11/configuring-babel6.html","tags":["babel","設定"],"content":"Babel 6で細分化されたパッケージと基本的な使い方について","relatedLinks":[]},{"category":"Article","title":"RailsのAsset PipelineとPrecompileをNode.jsのみで処理できるgulp-sprocketsを作った - yo_waka&#x27;s blog","url":"http://waka.github.io/2015/11/25/gulp_sprockets.html","tags":["gulp","rails"],"content":"Sprocketsの独自ディレクティブもパースして、gulp上でビルド出来るようにするgulpプラグイン","relatedLinks":[]},{"category":"Article","title":"Chrome 47 WebRTC: media recording, secure origins &amp; proxy handling | Web Updates - Google Developers","url":"https://developers.google.com/web/updates/2015/10/chrome-47-webrtc","tags":["Chrome","ReleaseNote"],"content":"Chrome 47のWebRTC関連のアップデートについて。\nMediaStreamRecorderをフラグ付きで実装、`getUserMedia()`がHTTPSのみで利用可能となるなど","relatedLinks":[]},{"category":"Article","title":"Node.js へのcontributeの仕方 - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2015/12/01/093433","tags":["node.js","community","OSS"],"content":"Node.jsへコントリビュートする場合のポイントについて","relatedLinks":[]},{"category":"SlideVideo","title":"Chrome Dev Summit 2015 - YouTube","url":"https://www.youtube.com/playlist?list=PLNYkxOF6rcICcHeQY02XLvoGL34rZFWZn","tags":["Chrome","動画","イベント","まとめ"],"content":"Chrome Dev Summit 2015の動画一覧","relatedLinks":[{"title":"Chrome Dev Summit 2015","url":"https://developer.chrome.com/devsummit"}]},{"category":"WebsiteDocument","title":"React.js Conf | February 22 &amp; 23 2016","url":"http://conf.reactjs.com/","tags":["React","イベント"],"content":"2016年2月22-23日にReact.js Confが開催","relatedLinks":[]},{"category":"SoftwareLibrary","title":"OrKoN/jsperf","url":"https://github.com/OrKoN/jsperf","tags":["JavaScript","performance","node.js"],"content":"jsperf.comのコードをNode.jsで実行できるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kdzwinel/betwixt","url":"https://github.com/kdzwinel/betwixt","tags":["HTTP","proxy","Chrome","node.js"],"content":"通信内容をキャプチャしてデバッグに利用できるローカルプロキシ。\nChrome開発者ツールのネットワークパネル風UIで通信内容を見ることが出来る。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"What are the best JavaScript IDEs? - Slant","url":"http://www.slant.co/topics/1686/~javascript-ides","tags":["JavaScript","editor","まとめ"],"content":"JavaScriptのエディタ/IDEまとめ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mweststrate/ts-npm-lint","url":"https://github.com/mweststrate/ts-npm-lint","tags":["TypeScript","npm","Tools"],"content":"TypeScriptで書かれたモジュールを公開するときに`package.json`の内容などをチェック、修正するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Home | phina.js","url":"http://phinajs.com/","tags":["JavaScript","game","library"],"content":"tmlib.jsの後継となるゲームライブラリ。\nCanvasを使った描画、サウンド、入力系などゲーム作成に必要なものをサポートしてる","relatedLinks":[{"title":"本日 JavaScript ゲームライブラリ『phina.js』をリリースしました! | phiary","url":"http://phiary.me/phinajs-release/"}]},{"category":"SoftwareLibrary","title":"mo · js - Motion Graphics For The Web","url":"http://mojs.io/","tags":["JavaScript","animation","SVG","library"],"content":"モーショングラフィックライブラリ。\nSVGとCSS animationを使ったアニメーションライブラリ","relatedLinks":[]},{"category":"Book","title":"Amazon: What Every JavaScript Developer Should Know About ECMAScript 2015 (OdeToCode Programming Series): K. Scott Allen","url":"http://www.amazon.com/dp/B018D12X0C?tag=amazon0abac-22","tags":["ECMAScript","JavaScript","book","kindle"],"content":"ES6についてのKindle本\n100ページ程で追加された構文やオブジェクト、メソッドについて解説されてる。","relatedLinks":[]}]},{"meta":{"title":"2015-12-07のJS: Jasmine 2.4.0、Redux入門、Firefox Platform Status","author":"azu","layout":"post","date":"2015-12-07T11:20:00.000Z","category":"JSer","tags":["Jasmine","Testing","Redux","Firefox","Browser"],"url":"https://jser.info/2015/12/07/jasmine2.4-redux-firefox/"},"items":[{"category":"Headline","title":"December Security Release Summary | Node.js","url":"https://nodejs.org/en/blog/vulnerability/december-2015-security-releases/","tags":["node.js","セキュリティ","ReleaseNote"],"content":"Node.jsのセキュリティアップデートとして0.10、0.12、4.x、5.xのアップデートが公開された。","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 48 Beta: Present to Cast, custom notification buttons, and network estimation","url":"http://blog.chromium.org/2015/12/chrome-48-beta-present-to-cast-devices_91.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 48 Betaリリース。\nPresentation API、WebRTCがVP9をサポート、`AudioNode#connect`をサポート、well-known symbolsとして`@@toPrimitive`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 1.0.0 · dekujs/deku","url":"https://github.com/dekujs/deku/releases/tag/1.0.0","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"Virtual DOMの実装を持つReactライクなComponentライブラリであるdeku 1.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at 7.2.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/7.2.0/Changelog.md","tags":["JavaScript","DOM","ReleaseNote"],"content":"jsdom 7.2.0リリース。\n`<input>`と`<textarea>`のselection APIがサポートされた","relatedLinks":[]},{"category":"Headline","title":"babel/CHANGELOG.md at master · babel/babel","url":"https://github.com/babel/babel/blob/master/CHANGELOG.md#630","tags":["babel","ReleaseNote"],"content":"Babel 6.3.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Flow | Version 0.19.0","url":"http://flowtype.org/blog/2015/12/01/Version-0.19.0.html","tags":["flowtype","ReleaseNote"],"content":"FlowType 0.19.0リリース。\n`@noflow`の追加、宣言のみを集めた`.flow`ファイルの対応など","relatedLinks":[]},{"category":"Headline","title":"Release ES2016 Draft 2015-12-01 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2016-draft-20151201","tags":["ECMAScript","spec","ReleaseNote"],"content":"ES2016 Draft 2015-12-01リリース。\n`Promise.all/race`が`@@species`を参照しないように変更。\nPromiseのUnhandled Rejectionを検知するために必要な仕様がECMAScript側にも追加された","relatedLinks":[{"title":"domenic/unhandled-rejections-browser-spec","url":"https://github.com/domenic/unhandled-rejections-browser-spec"},{"title":"Promise Error Handling","url":"http://azu.github.io/slide/error-handling/promise-error-handling.html"}]},{"category":"Headline","title":"jasmine/2.4.0.md at master · jasmine/jasmine","url":"https://github.com/jasmine/jasmine/blob/master/release_notes/2.4.0.md","tags":["jasmine","ReleaseNote"],"content":"Jasmine 2.4.0リリース。\nテストがランダムな順番で実行されるように。レポーターにもランダム実行に関する情報が表示されるように。","relatedLinks":[]},{"category":"Article","title":"Microsoft Edge’s JavaScript engine to go open-source | Microsoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2015/12/05/open-source-chakra-core/","tags":["MSEdge","JavaScript"],"content":"MSEdgeのJavaScriptエンジンであるChakraがオープンソースとして2016年1月に公開予定。\n公開するのはコアであるChakraCore部分","relatedLinks":[]},{"category":"Article","title":"デバッグの技術 | プログラミング | POSTD","url":"http://postd.cc/the-art-of-debug/","tags":["browser","debug","thought","翻訳"],"content":"デバッグの考え方やアプローチについて。\nChromeの開発者ツールを使ったデバッグ方法についてなど","relatedLinks":[]},{"category":"Article","title":"Redux入門【ダイジェスト版】10分で理解するReduxの基礎 - Qiita","url":"http://qiita.com/kiita312/items/49a1f03445b19cf407b7","tags":["JavaScript","Flux"],"content":"Reduxの構成要素、データフロー、Reduxの3原則について簡潔にまとまってる","relatedLinks":[]},{"category":"Article","title":"Vue.jsにreduxを載せた話 | MMMブログ","url":"http://blog.mmmcorp.co.jp/blog/2015/12/03/vue-with-redux/","tags":["JavaScript","library"],"content":"Vue.jsとReduxを組み合わせて利用する話","relatedLinks":[]},{"category":"Article","title":"WHATWG版とW3C版がある仕様たち - Unreviewed","url":"http://takenspc.hatenablog.com/entry/2015/12/03/235927","tags":["W3C","spec"],"content":"W3CとWHATWGでそれぞれにある仕様の比較。\nW3C版はWHATWG版に追従できていない部分やメンテナンスされていないケースもあるという話","relatedLinks":[]},{"category":"WebsiteDocument","title":"Greenkeeper","url":"http://greenkeeper.io/","tags":["npm","webservice"],"content":"npmで依存するライブラリのアップデートがあるなら、更新内容をPull Requestで通知してくれるウェブサービス","relatedLinks":[]},{"category":"WebsiteDocument","title":"Firefox Platform Status","url":"https://platform-status.mozilla.org/","tags":["firefox","browser","WebPlatformAPI","まとめ"],"content":"Firefoxの機能ごとの実装状況をまとめたステータスページ。\nデータはGitHubで管理されている","relatedLinks":[{"title":"azu/browser-javascript-resource","url":"https://github.com/azu/browser-javascript-resource"}]},{"category":"WebsiteDocument","title":"Flexbox Froggy - A game for learning CSS flexbox","url":"http://flexboxfroggy.com/","tags":["CSS","tutorial"],"content":"CSS Flexboxについて実際の描画結果を見ながら学べるチュートリアル","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nathancahill/Split.js","url":"https://github.com/nathancahill/Split.js","tags":["JavaScript","UI","library"],"content":"サイズが可変可能なSplit Viewを作るUIライブラリ。\n要素同士を縦横に分割し、ドラッグでサイズを変更出来る","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vuejs/vuex","url":"https://github.com/vuejs/vuex","tags":["JavaScript","Flux","library"],"content":"Vue.js向けのFluxライクなライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"airbnb/enzyme","url":"https://github.com/airbnb/enzyme","tags":["JavaScript","React","testing"],"content":"React Componentをテストするための補助ライブラリ。\njsdomを使いレンダリングを再現した状態のテストも行える","relatedLinks":[]},{"category":"SoftwareLibrary","title":"eslint/typescript-eslint-parser","url":"https://github.com/eslint/typescript-eslint-parser","tags":["TypeScript","JavaScript","AST"],"content":"TypeScript ASTをESTree ASTに変換するパーサ。\nESLintでTypeScriptのコードをLintする目的","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mozilla/oghliner","url":"https://github.com/mozilla/oghliner","tags":["ServiceWorker","Tools","github"],"content":"GitHub Pagesをオフライン対応するためのテンプレートとデプロイツール。\nService Workerを使ってリソースをオフラインでも参照出来るようにしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Jam3/hihat","url":"https://github.com/Jam3/hihat","tags":["Electron","Chrome","debug","testing"],"content":"Electronを使ってChrome DevToolsを使ったNode REPLやテスト実行等を行えるツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sebmck/lerna","url":"https://github.com/sebmck/lerna","tags":["npm","JavaScript","Tools"],"content":"Babelのような一つのリポジトリに複数のパッケージがある(monorepo)を扱うためのツール。\nnpm installやnpm publishの補助をしてくれる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"WebTorrent - Streaming browser torrent client","url":"https://webtorrent.io/","tags":["WebRTC","BitTorrent"],"content":"torrentのストリーミングをWebRTCで行うライブラリ","relatedLinks":[]},{"category":"Book","title":"The Pragmatic Bookshelf | Reactive Programming with RxJS","url":"https://pragprog.com/book/smreactjs/reactive-programming-with-rxjs","tags":["Rx","JavaScript","book"],"content":"RxJSについての書籍\nCycle.jsについても書かれている","relatedLinks":[]}]},{"meta":{"title":"2015-12-14のJS: ES2016 Draft、JavaScript開発者アンケート、JSer.infoイベント開催予定","author":"azu","layout":"post","date":"2015-12-14T10:51:00.000Z","category":"JSer","tags":["ECMAScript","アンケート","JSer","イベント"],"url":"https://jser.info/2015/12/14/es2016draft-survey/"},"items":[{"category":"Headline","title":"Node v5.2.0 (Stable) | Node.js","url":"https://nodejs.org/en/blog/release/v5.2.0/","tags":["node.js","ReleaseNote"],"content":"Node v5.2.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Dev.Opera — Opera 34 released","url":"https://dev.opera.com/blog/opera-34/","tags":["Opera","Chrome","ReleaseNote"],"content":"Opera 34(based on Chromium 47)リリース。\n`Array.prototype.includes`、rest parameters、`requestIdleCallback`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release ES2016 Draft 2015-12-10 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2016-draft-20151210","tags":["ECMAScript","spec","ReleaseNote"],"content":"ES2016 Draft 2015-12-10リリース。\n`Array.prototype.includes`が追加された。\nES2016から採用された仕様策定プロセスに則った形のものとして、初めて追加された新しい機能となる。","relatedLinks":[{"title":"The TC39 Process","url":"https://tc39.github.io/process-document/"},{"title":"ECMAScriptの仕様策定に関するカンニングペーパー | Web Scratch","url":"http://efcl.info/2015/10/18/ecmascript-paper/"}]},{"category":"Article","title":"JavaScript Developer Survey Results","url":"https://ponyfoo.com/articles/javascript-developer-survey-results","tags":["JavaScript","まとめ"],"content":"JavaScript開発者アンケート結果が公開された。毎年DailyJSがやっていたものと同様のもの。\nテストを書く人が半数を上回り、フレームワークではReactがもっとも使われるようになり、ES6を全く使ったことのない人は20％以下となるなど","relatedLinks":[{"title":"JavaScript Developer Survey 2014: Results","url":"http://dailyjs.com/2014/12/16/1333-javascript-survey-results/"}]},{"category":"Article","title":"ESLint のカスタムルールを作ろう! (その1) - Qiita","url":"http://qiita.com/mysticatea/items/cc3f648e11368799e66c","tags":["JavaScript","AST"],"content":"ESLintのルールの作り方","relatedLinks":[]},{"category":"Article","title":"Proxyについて - JS.next","url":"http://js-next.hatenablog.com/entry/2015/12/03/045720","tags":["ECMAScript","JavaScript"],"content":"ES6 Proxyについての解説","relatedLinks":[]},{"category":"Article","title":"Universal React ◆ 24 ways","url":"https://24ways.org/2015/universal-react/","tags":["React","サーバー","tutorial"],"content":"Reactをサーバサイドで扱う方法について","relatedLinks":[]},{"category":"Article","title":"webpack+babel-loader+power-assert+jsdomでフロントエンド開発環境を作る - yutaponのブログ","url":"http://yutapon.hatenablog.com/entry/webpack%2Bbabel-loader%2Bpower-assert%2Bjsdom-skeleton","tags":["JavaScript","設定"],"content":"BabelによるビルドとMochaでのテスト構成についての記事。\nWebpackの設定、jsdomを使ったユニットテストについて","relatedLinks":[]},{"category":"Article","title":"How do Promises Work? - Quils in Space","url":"http://robotlolita.me/2015/11/15/how-do-promises-work.html","tags":["JavaScript","Promises"],"content":"Promiseの小さな実装を書きながらPromiseについて学ぶ話","relatedLinks":[]},{"category":"Article","title":"notes/Do-not-underestimate-credentials-leaks.md at master · ChALkeR/notes","url":"https://github.com/ChALkeR/notes/blob/master/Do-not-underestimate-credentials-leaks.md","tags":["node.js","セキュリティ"],"content":"主にNode.js関連のプロジェクトでのトークンやパスワードなど漏れが起きるパターンについて。\nもし漏らしていた場合の影響や変更方法について書かれている","relatedLinks":[]},{"category":"Article","title":"Performance Calendar » WebPageTest: Year in Review","url":"http://calendar.perfplanet.com/2015/webpagetest-year-in-review/","tags":["performance","まとめ"],"content":"今年WebPageTestに追加された機能や連携サービスについて。","relatedLinks":[{"title":"WebPagetest - Website Performance and Optimization Test","url":"http://www.webpagetest.org/"}]},{"category":"SlideVideo","title":"Chrome Dev Summit 2015 Notes","url":"https://danoc.me/blog/chrome-dev-summit-2015-notes/","tags":["google","イベント","動画"],"content":"Chrome Dev Summit 2015の動画とそれぞれの要点メモ。\nサマリがまとまってるのでどの動画を見るかの参考になる","relatedLinks":[]},{"category":"SlideVideo","title":"JSConf US LastCall - Track B - YouTube","url":"https://www.youtube.com/playlist?list=PL37ZVnwpeshG7ThPHHHRvPFTeU1_F_tcP","tags":["JavaScript","イベント","動画"],"content":"JSConf US 2015の動画一覧","relatedLinks":[{"title":"JSConf US Last Call - jsconf.micDrop()","url":"http://lastcall.jsconf.us/"}]},{"category":"WebsiteDocument","title":"oneuijs/You-Dont-Need-jQuery","url":"https://github.com/oneuijs/You-Dont-Need-jQuery","tags":["jQuery","JavaScript"],"content":"jQuery使わなくてもDOM APIを使って大体同じ事が出来るというまとめ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Jam3/web-audio-player","url":"https://github.com/Jam3/web-audio-player","tags":["web","audio","library"],"content":"後方互換性の問題やバージョン毎のバグが多いWeb Audio APIをラップしてクロスブラウザで再生をサポートするライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"peerigon/updtr","url":"https://github.com/peerigon/updtr","tags":["npm","Tools"],"content":"`npm outdated`ベースで、それぞれのモジュールをupdateしてnpm testを行うことで、テストが通ったモジュールのみをアップデート出来るツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Khaos - Easily generate oft-used project templates.","url":"http://khaos.io/","tags":["JavaScript","Tools"],"content":"対話式のテンプレートジェネレーターツール。\nテンプレートに使った変数を対話形式で埋められるプロジェクト設定のテンプレートを作れる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"embed.js","url":"http://riteshkr.com/embed.js/","tags":["JavaScript","library"],"content":"Twitter、gistやYouTube、絵文字など色々なものを埋め込み出来るライブラリ","relatedLinks":[]}]},{"meta":{"title":"JSer.info 5周年記念イベントを1/16(土)に開催します","author":"azu","layout":"post","date":"2015-12-14T12:53:00.000Z","category":"イベント","tags":["JSer"],"url":"https://jser.info/2015/12/14/jser-info-announce-5-years/"},"items":[]},{"meta":{"title":"2015-12-22のJS: AngularJS 2β、ServiceWorker Cookbook、非標準CSSの修正","author":"azu","layout":"post","date":"2015-12-22T12:06:00.000Z","category":"JSer","tags":["Angular","ServiceWorker","CSS","webkit"],"url":"https://jser.info/2015/12/22/angular2beta-ServiceWorker-css/"},"items":[{"category":"Headline","title":"Angular 2 Beta","url":"http://angularjs.blogspot.jp/2015/12/angular-2-beta.html","tags":["AngularJS","ReleaseNote"],"content":"AngularJS 2βリリース。\nAngularJS 1からのアップグレードガイドも公開されている","relatedLinks":[{"title":"Upgrading from 1.x - ts","url":"https://angular.io/docs/ts/latest/guide/upgrade.html"}]},{"category":"Headline","title":"RxJS/CHANGELOG.md at 5.0.0-beta.0 · ReactiveX/RxJS","url":"https://github.com/ReactiveX/RxJS/blob/5.0.0-beta.0/CHANGELOG.md","tags":["JavaScript","Rx","library","ReleaseNote"],"content":"RxJS 5.0.0-beta.0リリース","relatedLinks":[]},{"category":"Headline","title":"Firefox 43.0 リリースノート","url":"http://www.mozilla.jp/firefox/43.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 43リリース。\nES2016の`Array.prototype.includes`がデフォルトで有効、Subresource integrityの対応など","relatedLinks":[{"title":"Firefox 43 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/43"},{"title":"Firefox 43 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/versions/43/"}]},{"category":"Headline","title":"Node v5.3.0 (Stable) | Node.js","url":"https://nodejs.org/en/blog/release/v5.3.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v5.3.0リリース。\n`Buffer.prototype.includes()`の追加、REPLで外部モジュールを`require`できないバグを修正など","relatedLinks":[]},{"category":"Headline","title":"flow/Changelog.md at master · facebook/flow","url":"https://github.com/facebook/flow/blob/master/Changelog.md#v0200","tags":["flowtype","ReleaseNote"],"content":"Flow 0.20.0リリース。\n`this`型のサポート、`.json`ファイルロードの解釈に対応、エラーメッセージの改善など","relatedLinks":[]},{"category":"Headline","title":"Release ES2016 Draft 2015-12-20 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2016-draft-20151220","tags":["ECMAScript","ReleaseNote"],"content":"ES2016 Draft 2015-12-20リリース","relatedLinks":[]},{"category":"Article","title":"総行数57,000の巨大CSS群をLessに書き換えた軌跡 - mixi Engineers&#x27; Blog","url":"http://alpha.mixi.co.jp/entry/2015/12/20/000000","tags":["CSS","LESS","webkit"],"content":"-webkit- prefixから標準への書き換えを行った話。\nCSS:fixmeで標準記法へ直し、Autoprefixerでプレフィックス対応し、Lessを使い構造的に管理しやすくしていく","relatedLinks":[{"title":"マルチブラウザやりました (DMM.Study Night)","url":"http://www.slideshare.net/sugibigmuff/dmmstudy-night"}]},{"category":"Article","title":"An Intro To Using npm and ES6 Modules for Front End Development | Wes Bos","url":"http://wesbos.com/javascript-modules/","tags":["JavaScript","ECMAScript"],"content":"ES6 modulesの使い方についてまとまっている。\nどのようにパスを解決したりするかはECMAScriptで定義されていないため、今のところbundlerの機能でしかないという点についても触れている。","relatedLinks":[]},{"category":"Article","title":"HTTP/2のNode.js実装node-http2を読む - Qiita","url":"http://qiita.com/takaaki7/items/70898443050ca260e94c","tags":["node.js","HTTP2","stream"],"content":"node-http2の実装について。\nNode Streamを使い、それをフロー制御している","relatedLinks":[]},{"category":"Article","title":"Beyond Offline ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2015/12/beyond-offline/","tags":["ServiceWorker"],"content":"Service Workerをオフライン対応以外の用途で使う方法について。\nクックブック形式で色々なパターンを紹介している","relatedLinks":[{"title":"ServiceWorker Cookbook","url":"https://serviceworke.rs/"},{"title":"the-offline-cookbook-ja/ja.md at master · kuu/the-offline-cookbook-ja","url":"https://github.com/kuu/the-offline-cookbook-ja/blob/master/ja.md"}]},{"category":"Article","title":"FluxのActionとStoreをちゃんと分ける話 - pixiv inside","url":"http://inside.pixiv.net/entry/2015/12/19/113746","tags":["Flux","JavaScript"],"content":"Actionでデータを構築し、StoreへDispatchする。\nまたDispatchするデータは`Entity`にすることで、役割を分けるという話","relatedLinks":[]},{"category":"Article","title":"deku で Virtual DOM を使う | スマホ神 – JavaScript 受託開発 –","url":"http://smart.ataglance.jp/2015-12-17-use-virtual-dom-with-deku/","tags":["JavaScript","VirtualDOM","library"],"content":"dekuの使い方について。\nJSXで書いてBabelで変換する方法","relatedLinks":[]},{"category":"Article","title":"More Responsive Tapping on iOS | WebKit","url":"https://webkit.org/blog/5610/more-responsive-tapping-on-ios/","tags":["safari","webkit","ios"],"content":"iOSのWebKitでもタップの350ms遅延が解消される。\nviewportのwidthなど特定の条件では遅延がなくなる。","relatedLinks":[{"title":"300ms tap delay, gone away | Web Updates - Google Developers","url":"https://developers.google.com/web/updates/2013/12/300ms-tap-delay-gone-away"}]},{"category":"WebsiteDocument","title":"ServiceWorker Cookbook","url":"https://serviceworke.rs/","tags":["ServiceWorker","document"],"content":"Service Workerのパターンを集めたクックブック。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"A-Frame – Building Blocks for the VR Web","url":"https://aframe.io/","tags":["VR","HTML","WebComponents"],"content":"WebVRをCustom Elementのタグを書くだけで出来るライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jaredly/treed","url":"https://github.com/jaredly/treed","tags":["JavaScript","UI","editor","library"],"content":"ツリーエディタライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pzavolinsky/react-unit","url":"https://github.com/pzavolinsky/react-unit","tags":["React","testing","library"],"content":"React Componentをテストするためのライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"paldepind/snabbdom","url":"https://github.com/paldepind/snabbdom","tags":["JavaScript","VirtualDOM","library"],"content":"Virtual DOMライブラリ","relatedLinks":[]},{"category":"Book","title":"Amazon: ゲームで学ぶJavaScript入門 HTML5&amp;CSSも身に付く!: 田中 賢一郎","url":"http://www.amazon.co.jp/dp/4844339788","tags":["JavaScript","game","book"],"content":"ゲームを作りながらJavaScriptについて学ぶ書籍","relatedLinks":[]},{"category":"Book","title":"Learning React Native - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920041511.do","tags":["React","book"],"content":"React Nativeについての書籍","relatedLinks":[]}]},{"meta":{"title":"2015-12-30のJS: core-js 2.0.0、React開発者アンケート、JavaScript用語集","author":"azu","layout":"post","date":"2015-12-30T12:49:00.000Z","category":"JSer","tags":["ECMAScript","library","React","JavaScript","dictionary"],"url":"https://jser.info/2015/12/30/corejs2.0.0-react-javascript-jargon/"},"items":[{"category":"Headline","title":"React v0.14.4 | React","url":"https://facebook.github.io/react/blog/2015/12/29/react-v0.14.4.html","tags":["React","ReleaseNote"],"content":"React v0.14.4リリース","relatedLinks":[]},{"category":"Headline","title":"Release 2.0.0 - 2015.12.24 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v2.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"core-js 2.0.0リリース。\nTyped Arrayの実装追加、`System.global`、`Error.isError`、MathのProposal実装を追加。 Promiseの仕様追従、`String#{padStart, padEnd}`へリネーム。\n`NodeList`、`DOMTokenList`、`MediaList`、`StyleSheetList`、`CSSRuleList`をIterableとする再定義の追加など","relatedLinks":[]},{"category":"Article","title":"React Developer Survey Results - AngularClass","url":"https://angularclass.com/react-developer-survey-results/","tags":["React","JavaScript"],"content":"Reactに関するアンケートの結果。\n8割の人がBabelを使っていることや、Reactと共に使うアーキテクチャやライブラリについてのアンケート結果が公開されている。","relatedLinks":[]},{"category":"Article","title":"Making a Mini-Lisp: Introduction to Transpilers - AngularClass","url":"https://angularclass.com/making-a-mini-lisp-introduction-to-transpilers/","tags":["JavaScript"],"content":"小さなLispをJavaScriptに変換する実装を書きながら、Transpilerの仕組みについて学ぶ話","relatedLinks":[]},{"category":"Article","title":"Mercateo/component-check","url":"https://github.com/Mercateo/component-check","tags":["JavaScript","library","React","AngularJS"],"content":"コンポーネント指向のフレームワークを使い、コンポーネントを表示するまでの手順をそれぞれ比較した記事。\nAngularJS1/2、Ember、Cycle.js、Reactにおいて4種類のコンポーネントを実装し比較している。","relatedLinks":[]},{"category":"Article","title":"ES6 Rest/Spread, Defaults and Destructuring","url":"http://www.datchley.name/es6-rest-spread-defaults-and-destructuring/","tags":["JavaScript","ECMAScript"],"content":"spread operator、rest parameter、デフォルト引数について。\nデフォルト引数での評価、`Function#apply`ではなく`...`を使う方法、Destructuringの使い方についてなど","relatedLinks":[{"title":"sebmarkbage/ecmascript-rest-spread","url":"https://github.com/sebmarkbage/ecmascript-rest-spread"}]},{"category":"Article","title":"&quot;Real&quot; Mixins with JavaScript Classes","url":"http://justinfagnani.com/2015/12/21/real-mixins-with-javascript-classes/","tags":["JavaScript","ECMAScript"],"content":"ES6 Classesで多重継承やmixinは構文として用意されていないので、`class`を式として扱うことで解決する実装について。\n`class MyClass extends mix(MySuperClass).with(A, B) {}`","relatedLinks":[]},{"category":"Article","title":"Dissection of Flux architecture or how to write your own","url":"http://krasimirtsonev.com/blog/article/dissection-of-flux-architecture-or-how-to-write-your-own-react","tags":["Flux","JavaScript"],"content":"fluxinyという高階関数をベースとした小さなFlux実装を見ていきながらFluxについて学ぶ。","relatedLinks":[{"title":"krasimir/fluxiny","url":"https://github.com/krasimir/fluxiny"}]},{"category":"Article","title":"Asynchronous Iterative &amp; Recursive Patterns for Node.js - Part 1","url":"http://mostafa-samir.github.io/async-iterative-patterns-pt1/","tags":["JavaScript","node.js"],"content":"JavaScriptの非同期なイテレーションについての記事。\nよくやってしまう間違いなど色々なアプローチについて書かれている。","relatedLinks":[]},{"category":"Article","title":"Should I use React.createClass, ES6 Classes or stateless functional components? - James K Nelson","url":"http://jamesknelson.com/should-i-use-react-createclass-es6-classes-or-stateless-functional-components/","tags":["React","JavaScript"],"content":"React Componentを書く方法として`React.createClass`、ES6 Classes、Stateless Componentがある。\nそれらの使い分けについて書かれている。","relatedLinks":[]},{"category":"Article","title":"bouzuya&#x27;s RxJS Advent Calendar 2015 - Adventar","url":"http://www.adventar.org/calendars/1200","tags":["Rx","JavaScript","まとめ"],"content":"RxJSについてのアドベントカレンダー。\nRxJSの概要やObservable、Operatorなどについて書かれている","relatedLinks":[]},{"category":"Article","title":"André Staltz - How to debug RxJS code","url":"http://staltz.com/how-to-debug-rxjs-code.html","tags":["Rx","JavaScript","debug"],"content":"RxJSのコードをどうやってデバッグするのかについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"loverajoel/jstips","url":"https://github.com/loverajoel/jstips","tags":["JavaScript","Tips"],"content":"JavaScriptのTipsを1日1つづつ紹介していくプロジェクト","relatedLinks":[]},{"category":"WebsiteDocument","title":"KittyGiraudel/SJSJ","url":"https://github.com/KittyGiraudel/SJSJ","tags":["JavaScript","dictionary","まとめ"],"content":"JavaScript関連の用語集","relatedLinks":[]},{"category":"WebsiteDocument","title":"WASM.NEWS","url":"https://wasm.news/","tags":["WebAssembly","news"],"content":"WebAssemblyのニュースサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"CSP Header Inspector and Validator","url":"https://cspvalidator.org/","tags":["CSP","Tools"],"content":"CSPバリデーションツール。\n指定されてるCSP Headerのチェックが出来る","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vega/datalib","url":"https://github.com/vega/datalib","tags":["JavaScript","library","統計"],"content":"JSON、CSV、TSV等からデータを読み込み、データを加工できるライブラリ","relatedLinks":[]}]},{"meta":{"title":"2016-01-06のJS: Reactエコシステム入門、ベンダープレフィックスとウェブ標準、Babelセットアップ本","author":"azu","layout":"post","date":"2016-01-06T09:22:00.000Z","category":"JSer","tags":["React","WebKit","CSS","Babel","Book"],"url":"https://jser.info/2016/01/06/react-vender-prefix-babel-book/"},"items":[{"category":"Article","title":"petehunt/react-howto","url":"https://github.com/petehunt/react-howto","tags":["React","Tools","JavaScript","tutorial"],"content":"React作者によるReactのエコシステム入門のガイドライン","relatedLinks":[]},{"category":"Article","title":"Revisiting Firefox’s DevTools – Smashing Magazine","url":"http://www.smashingmagazine.com/2015/12/revisiting-firefox-devtools/","tags":["firefox","debug"],"content":"Firefox開発者ツールを改めて紹介している記事。\n最近色々な機能が追加されている。","relatedLinks":[]},{"category":"Article","title":"Angular 2 versus React: There Will Be Blood — Medium","url":"https://medium.com/@housecor/angular-2-versus-react-there-will-be-blood-66595faafd51","tags":["AngularJS","React"],"content":"AngularJSとReactの対比。\n\n> Angular 2 continues to put “JS” into HTML. React puts “HTML” into JS.","relatedLinks":[]},{"category":"Article","title":"Well, I&#x27;m Back: innerText: Cleaning A Dark Corner Of the Web","url":"http://robert.ocallahan.org/2016/01/innertext.html","tags":["firefox","DOM"],"content":"IEやWebKitにも存在する`innerText`は仕様と相互互換性がなかった。\nWebKitを前提とするモバイルサイトで多く使われているため、Firefoxでも実装することとなった。\n同時に仕様とテストケースを書いたという話","relatedLinks":[{"title":"The poor, misunderstood innerText — Perfection Kills","url":"http://perfectionkills.com/the-poor-misunderstood-innerText/"},{"title":"Webkit! RESOLVED FIXED - otsukare","url":"http://www.otsukare.info/2016/01/04/webkit-resolved-fixed"}]},{"category":"Article","title":"Webkit! RESOLVED FIXED - otsukare","url":"http://www.otsukare.info/2016/01/04/webkit-resolved-fixed","tags":["firefox","webkit"],"content":"FirefoxでCSSの`-webkit-` prefixを解釈するオプションがデフォルトで有効となった。\n`-webkit-` prefixしか書かれてないサイトも表示できるようにするのが目的","relatedLinks":[{"title":"1213126 – Enable layout.css.prefixes.webkit by default","url":"https://bugzilla.mozilla.org/show_bug.cgi?id=1213126"},{"title":"総行数57,000の巨大CSS群をLessに書き換えた軌跡 - mixi Engineers","url":"http://alpha.mixi.co.jp/entry/2015/12/20/000000"}]},{"category":"Article","title":"ChromeDevTool - Chrome Developer Toolsでパフォーマンス計測・改善 - Qiita","url":"http://qiita.com/y_fujieda/items/a0a69151cf7307039f74","tags":["Chrome","debug"],"content":"Chrome開発者ツールのそれぞれのパネルの図解。\n操作方法や項目の意味などについて書かれてる。","relatedLinks":[]},{"category":"Article","title":"JavaScript - AudioWorker を試してみる - Qiita","url":"http://qiita.com/mohayonao/items/ce357230946cfa2303c2","tags":["audo","JavaScript"],"content":"Web Audio APIのAudioWorkerについて。","relatedLinks":[{"title":"mohayonao/audio-worker-shim","url":"https://github.com/mohayonao/audio-worker-shim"}]},{"category":"Article","title":"Managing the private data of ES6 classes","url":"http://www.2ality.com/2016/01/private-data-classes.html","tags":["ECMAScript","JavaScript"],"content":"ES6 Classesでプライベート風味なデータ保持パターン","relatedLinks":[]},{"category":"Article","title":"Lerna を使って、 Babel や React が採用している monorepo を試してみる - Qiita","url":"http://qiita.com/kimamula/items/0b4dff363933bfe74506","tags":["JavaScript","library"],"content":"Babelのようなmonorepoをlernaを使って管理する方法について","relatedLinks":[]},{"category":"Article","title":"Flux explained for newbies – Part 1 | DevButze","url":"https://devbutze.com/p/216","tags":["Flux","tutorial"],"content":"コンポーネントベースでUIを考えていった時になぜFluxのようなアーキテクチャが必要となっていくかについての連載","relatedLinks":[]},{"category":"Article","title":"Day 2: Testing React Applications – 12 Devs of Xmas","url":"http://12devsofxmas.co.uk/2015/12/day-2-testing-react-applications/","tags":["React","JavaScript","testing"],"content":"React Componentのテストについて。\njsdom、Enzymeを使ったテスト方法など","relatedLinks":[]},{"category":"Article","title":"AddyOsmani.com - Offline installation of npm packages","url":"https://addyosmani.com/blog/using-npm-offline/","tags":["npm"],"content":"npm installをオフラインでも出来るようにするためのTips。\n`--cache-min`、local-npm、npm_lazyについて","relatedLinks":[]},{"category":"Article","title":"the new code – Create Fullscreen HTML5 Page Background Video","url":"http://thenewcode.com/777/Create-Fullscreen-HTML5-Page-Background-Video","tags":["JavaScript","動画"],"content":"HTML5 Videoを背景に使う方法や注意点について","relatedLinks":[{"title":"Should I use a video as a background? | CSS-Tricks","url":"https://css-tricks.com/should-i-use-a-video-as-a-background/"}]},{"category":"SlideVideo","title":"Getting Started with Redux - Course by @dan_abramov @eggheadio","url":"https://egghead.io/series/getting-started-with-redux","tags":["redux","JavaScript","React"],"content":"Redux作者によるRedux入門のスクリーンキャスト","relatedLinks":[{"title":"tayiorbeii/egghead.io","url":"https://github.com/tayiorbeii/egghead.io_redux_course_notes"}]},{"category":"SlideVideo","title":"Node.js Interactive 2015 - YouTube","url":"https://www.youtube.com/playlist?list=PLfMzBWSH11xYjL8oFumSfzOf6-kr8_t-o","tags":["node.js","動画","まとめ"],"content":"Node.js Interactive 2015の動画まとめ","relatedLinks":[{"title":"Node.js Interactive 2015 | Linux Conferences and Linux Events | The Linux Foundation","url":"http://events.linuxfoundation.org/events/node-interactive"},{"title":"duffn/nodeinteractive-2015","url":"https://github.com/duffn/nodeinteractive-2015"}]},{"category":"WebsiteDocument","title":"orizens/angular-es2015-styleguide","url":"https://github.com/orizens/angular-es2015-styleguide","tags":["AngularJS"],"content":"AngularJS 1.xとES2015を組み合わせたスタイルガイド","relatedLinks":[]},{"category":"WebsiteDocument","title":"HTML 5 Canvas Cheat Sheet - WebsiteSetup.org","url":"http://websitesetup.org/html-5-canvas-cheat-sheet/","tags":["HTML5","canvas","チートシート"],"content":"Canvasのチートシート","relatedLinks":[]},{"category":"WebsiteDocument","title":"WPO Stats","url":"https://wpostats.com/","tags":["performance","まとめ"],"content":"ウェブパフォーマンスの最適化について書かれた記事などのまとめ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Lucifier129/react-lite","url":"https://github.com/Lucifier129/react-lite","tags":["React","library"],"content":"ReactのCore APIに関しての互換実装ライブラリ。\nサーバサイドレンダリング、`React.PropTypes`、addonsなどを取り除いて、より小さなファイルサイズとすることを目的としている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"substack/hyperx","url":"https://github.com/substack/hyperx","tags":["JavaScript","React","VirtualDOM","library"],"content":"virtual-dom、React、hyperscriptに対応したTemplate Stringsを使ったビルダーライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"narirou/jconv","url":"https://github.com/narirou/jconv","tags":["JavaScript","文字コード","library"],"content":"Pure JavaScriptで書かれたShift_JIS(CP932)、ISO-2022-JP(-1)、EUC-JP、UTF-8、UNICODEの相互変換を行うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"unit-coverage/unit-coverage","url":"https://github.com/unit-coverage/unit-coverage","tags":["JavaScript","testing"],"content":"コードカバレッジツール。\nコード同士の関係もカバレッジのレポートに含める事が出来る。\nJSCSなどで利用されている","relatedLinks":[{"title":"Coverage report","url":"http://jscs.info/jscs/coverage.html"}]},{"category":"Book","title":"Setting up ES6 by Axel Rauschmayer [Leanpub PDF/iPad/Kindle]","url":"https://leanpub.com/setting-up-es6","tags":["JavaScript","ECMAScript","ebook"],"content":"Dr.AxelのBabelを使ったES6の導入についての電子書籍。\nloaderの仕組みがtranspilerやCommonJSに依存している中で、モジュール周りの挙動の誤解を解く内容が書かれてる","relatedLinks":[]}]},{"meta":{"title":"2016-01-13のJS: jQuery 2.2、lodash 4.0.0、IE8サポート終了","author":"azu","layout":"post","date":"2016-01-13T11:33:00.000Z","category":"JSer","tags":["jQuery","IE","library"],"url":"https://jser.info/2016/01/13/jquer-2.2-lodash4.0-ie8/"},"items":[{"category":"Headline","title":"jQuery 2.2 and 1.12 Released | Official jQuery Blog","url":"http://blog.jquery.com/2016/01/08/jquery-2-2-and-1-12-released/","tags":["jQuery","ReleaseNote"],"content":"jQuery 2.2と1.12リリース。\nSVGのclass属性を操作可能に、`jQuery.post`/`jQuery.get`の追加、`jQuery.htmlPrefilter`の追加、`Symbol.iterator`を実装しjQueryオブジェクトがiterableとなるなど","relatedLinks":[]},{"category":"Headline","title":"Release 4.0.0 · lodash/lodash","url":"https://github.com/lodash/lodash/releases/tag/4.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"lodash 4.0.0リリース。\nIE8以下のサポート終了、underdashのCore APIを実装したバージョンの提供、ES6との互換性向上、絵文字などのサロゲートペアを扱えるようになるなど","relatedLinks":[{"title":"Changelog · lodash/lodash Wiki","url":"https://github.com/lodash/lodash/wiki/Changelog#compatibility-warnings"},{"title":"underdash/underdash","url":"https://github.com/underdash/underdash"}]},{"category":"Headline","title":"Release v1.0.0 · testem/testem","url":"https://github.com/testem/testem/releases/tag/v1.0.0","tags":["JavaScript","testing","ReleaseNote"],"content":"Test Runnerであるtestem 1.0.0リリース。\nMochaなどそれぞれのテストライブラリのファイルはバンドルしないでCDNのものを利用するようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v6.4.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v6.4.0","tags":["babel","ReleaseNote"],"content":"Babel 6.4.0リリース。\nFlowTypeの更新追従、`--nolazy`の引数に対応など","relatedLinks":[]},{"category":"Headline","title":"Node v5.4.0 (Stable) | Node.js","url":"https://nodejs.org/en/blog/release/v5.4.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v5.4.0リリース。\nHTTP Status Codeに`451`を追加、`process.env`や`process.hrtime()`のパフォーマンス改善など","relatedLinks":[{"title":"mnot’s blog: Why 451?","url":"https://www.mnot.net/blog/2015/12/18/451"}]},{"category":"Headline","title":"Safari 9.1","url":"https://developer.apple.com/library/prerelease/mac/releasenotes/General/WhatsNewInSafari/Articles/Safari_9_1.html","tags":["safari","ReleaseNote"],"content":"Safari 9.1のリリースノート。\n`<picture>`要素のサポート、Web Inspectorの改善、特定条件下でのタップ遅延の除去、CSS Variableのサポートなど","relatedLinks":[]},{"category":"Headline","title":"node-browserify/changelog.markdown at v13.0.0 · substack/node-browserify","url":"https://github.com/substack/node-browserify/blob/v13.0.0/changelog.markdown","tags":["browserify","ReleaseNote"],"content":"Browserify 13.0.0リリース。\n`buffer`モジュールが更新されたため、`buffer.toArrayBuffer()`は削除された。\n`buffer`のパフォーマンス改善など","relatedLinks":[]},{"category":"Headline","title":"Internet Explorer のサポートポリシーが変わります - MSBC","url":"https://www.microsoft.com/japan/msbc/Express/ie_support/","tags":["IE"],"content":"IEのサポートポリシーが変更され、\"OSに対応した最新版のIE\"のみがサポート対象となった。\nそれによりIE8はサポート対象から外れた。","relatedLinks":[{"title":"Internet Explorer End of Support","url":"https://www.microsoft.com/en-us/WindowsForBusiness/End-of-IE-support"},{"title":"レガシーブラウザのサポートは本日で 終了です。～さようならOld IE～ - monoe","url":"http://blogs.msdn.com/b/osamum/archive/2016/01/13/legacy-browser-died-good-bye-old-ie.aspx"}]},{"category":"Article","title":"Simple Guide to Finding a JavaScript Memory Leak in Node.js","url":"http://www.alexkras.com/simple-guide-to-finding-a-javascript-memory-leak-in-node-js/","tags":["node.js","debug"],"content":"Node.jsのアプリでメモリリークが起きた場合にどこで起きてるのかを見つける方法について","relatedLinks":[]},{"category":"Article","title":"RxJSで副作用を扱うにはどうするか - Schedulerを交えて - snyk_s log","url":"http://saneyukis.hatenablog.com/entry/2016/01/04/055932","tags":["JavaScript","Rx"],"content":"RxJSでの副作用を扱うときに考えるべきこと。\n意図せず複数回呼ばれないようにHot Observableへ変換する、race conditionを避ける、副作用があった事を後続に通知することについて。","relatedLinks":[]},{"category":"Article","title":"Promiseはどう動作するのか – Promiseを実装してみる | プログラミング | POSTD","url":"http://postd.cc/how-do-promises-work/","tags":["JavaScript","Promises","翻訳"],"content":"[How do Promises Work? - Quils in Space](http://robotlolita.me/2015/11/15/how-do-promises-work.html \"How do Promises Work? - Quils in Space\")の翻訳","relatedLinks":[]},{"category":"Article","title":"Future JavaScript — &lt; Jedi JS &gt; — Medium","url":"https://medium.com/jedi-js/future-javascript-d9baab4663f3","tags":["JavaScript","ECMAScript"],"content":"ES6などで追加されている新しい構文についての連載","relatedLinks":[]},{"category":"Article","title":"exploring-async/exploring_async.md at master · thalesmello/exploring-async","url":"https://github.com/thalesmello/exploring-async/blob/master/exploring_async.md","tags":["JavaScript","tutorial"],"content":"JavaScriptの非同期処理について要素ごとに書かれてる。\nコールバック、Promise、Generator、Async/Await、Rx、CSP","relatedLinks":[]},{"category":"SlideVideo","title":"ES6/WhatWG Loader &amp; Node - Google スライド","url":"https://docs.google.com/presentation/d/1tXziuBheum53jk-FgtFkEUGKNVTdHzbpzhJLk7FatGc/edit#slide=id.p","tags":["ECMAScript","node.js","CommonJS","スライド"],"content":"ES6 Modules/WHATWG LoaderとNode.jsについてのスライド/動画。\n構文、モジュール内/exportした値の扱いの違い、循環参照、キャッシュ","relatedLinks":[{"title":"Node ","url":"https://www.youtube.com/watch?v=NdOKO-6Ty7k"},{"title":"Loader","url":"http://whatwg.github.io/loader/"}]},{"category":"WebsiteDocument","title":"OverReact","url":"http://www.overreact.io/","tags":["React","Tools"],"content":"ワイヤフレームを作ってReact Componentとしてダウンロードすることができるサービス","relatedLinks":[]},{"category":"WebsiteDocument","title":"Front End Newsletter","url":"http://frontendnewsletter.com/","tags":["JavaScript","mail"],"content":"フロントエンドに関するWeeklyメールマガジン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"goessner/g2","url":"https://github.com/goessner/g2","tags":["JavaScript","SVG","canvas","library"],"content":"コマンドパターンでCanvasに描画したり、SVGとして出力出来るライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"roman01la/html-to-react-components","url":"https://github.com/roman01la/html-to-react-components","tags":["HTML","React","Tools"],"content":"HTMLをReact Componentに変換するツール","relatedLinks":[]},{"category":"Book","title":"Real-Time Communication with WebRTC, 2nd Edition - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920044796.do","tags":["WebRTC","JavaScript","book"],"content":"2016年3月発売\nWebRTCについての書籍","relatedLinks":[]},{"category":"Book","title":"Amazon.co.jp： フロントエンドエンジニアのための現在とこれからの必須知識: 斉藤 祐也, 水野 隼登, 谷 拓樹, 菅原 のびすけ, 林 優一, 古沢 宏太: 本","url":"http://www.amazon.co.jp/dp/4839956758/","tags":["JavaScript","book"],"content":"2016年1月28日発売\n\n> フロントエンドを1、2年以上担当した人を対象に、「今知っておかないといけない情報」と、「今後役に立つ情報」をピックアップしてまとめた本","relatedLinks":[]}]},{"meta":{"title":"JSer.infoの遊び方","author":"azu","layout":"post","date":"2016-01-15T01:01:00.000Z","category":"Article","tags":["JSer"],"url":"https://jser.info/2016/01/15/how-to-play-jser-info/"},"items":[]},{"meta":{"title":"JSer.info 5周年記念イベントを開催しました","author":"azu","layout":"post","date":"2016-01-16T14:06:00.000Z","category":"イベント","tags":["JSer","JavaScript","イベント"],"url":"https://jser.info/2016/01/16/jser-5years/"},"items":[]},{"meta":{"title":"2016-01-20のJS: jQuery 3.0β、ES.next News、ChakraCore OSS","author":"azu","layout":"post","date":"2016-01-20T13:57:00.000Z","category":"JSer","tags":["jQuery","ECMAScript","MSEdge","CHakraCore"],"url":"https://jser.info/2016/01/20/jquery3beta-esnext-news-chkracore/"},"items":[{"category":"Headline","title":"jQuery 3.0 Beta Released | Official jQuery Blog","url":"http://blog.jquery.com/2016/01/14/jquery-3-0-beta-released/","tags":["jQuery","ReleaseNote"],"content":"jQuery 3.0βリリース。\njQuery10周年を記念してのリリース","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember.js 2.3 and 2.4 Beta Released","url":"http://emberjs.com/blog/2016/01/15/ember-2-3-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember.js 2.3リリース。\nFastBootに`visit`メソッドの追加","relatedLinks":[]},{"category":"Headline","title":"Release 6.3 “Pro rege et lege” · postcss/autoprefixer","url":"https://github.com/postcss/autoprefixer/releases/tag/6.3.0","tags":["CSS","Tools"],"content":"Autoprefixer 6.3リリース。\nGrid Layoutのサポート、自前で用意したUA別のデータからブラウザの種類を決められる機能の追加","relatedLinks":[]},{"category":"Headline","title":"axios/CHANGELOG.md at v0.9.0 · mzabriskie/axios","url":"https://github.com/mzabriskie/axios/blob/v0.9.0/CHANGELOG.md","tags":["JavaScript","Promises","XHR","library","ReleaseNote"],"content":"axios 0.9.0リリース。\nXDomainRequestの対応改善、`adapter`プロパティの追加など","relatedLinks":[]},{"category":"Headline","title":"MooTools Blog: 1.6.0 is out!","url":"http://mootools.net/blog/2016/01/14/mootools-1-6-0-release","tags":["JavaScript","library","ReleaseNote"],"content":"MooTools 1.6.0リリース。\nPromises/A+互換の`Class.Thenable`を追加。\n次回のメジャーアップデートではIE11+のみのサポートとなる。\nまた`Array.from`はES6と名前が被っているためリネームされる","relatedLinks":[]},{"category":"Headline","title":"ES.next News: The 5 best ECMAScript links of the week","url":"http://esnextnews.com/","tags":["JavaScript","ECMAScript","mail"],"content":"ES.nextについての週刊メルマガ。\nJavaScriptの補完的な感じ。\nby Dr.Axel Rauschmayer and Johannes Weber.","relatedLinks":[{"title":"ES.next News: a weekly email newsletter","url":"http://www.2ality.com/2016/01/esnext-news.html"}]},{"category":"Headline","title":"ChakraCore GitHub repository is now open | Microsoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2016/01/13/chakracore-now-open/","tags":["MS","JavaScript"],"content":"MSEdgeのJavaScriptエンジンであるChakraのCore部分がオープンソースとして公開された。","relatedLinks":[{"title":"Microsoft/ChakraCore","url":"https://github.com/Microsoft/Chakracore"}]},{"category":"Headline","title":"Enable Node.js to run with Microsoft&#x27;s ChakraCore engine by kunalspathak · Pull Request #4765 · nodejs/node","url":"https://github.com/nodejs/node/pull/4765","tags":["node.js","JavaScript","issue"],"content":"Node.jsにChakraCoreビルドを追加するPull Request","relatedLinks":[{"title":"Submitting a Pull Request to Node.js with ChakraCore | Microsoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2016/01/19/nodejs-chakracore-mainline/"}]},{"category":"Headline","title":"Renaming jade -&gt; pug · Issue #2184 · pugjs/jade","url":"https://github.com/pugjs/jade/issues/2184","tags":["JavaScript","issue","news","node.js"],"content":"Jadeはpugにリネームされる","relatedLinks":[]},{"category":"Article","title":"babel-plugin-typecheck を使って flowtype 文法で書かれたJSをランタイムチェックする - Qiita","url":"http://qiita.com/mizchi/items/30a5f9560e86e0d5ab31","tags":["flowtype","babel","JavaScript"],"content":"FlowTypeの型定義構文を使ってランタイムチェックを行うBabelプラグインについて","relatedLinks":[]},{"category":"Article","title":"Browserify VS Webpack - JS Drama","url":"http://blog.namangoel.com/browserify-vs-webpack-js-drama","tags":["browserify","webpack"],"content":"Browserifyとwebpackの思想の違い、静的リソースの扱い、どちらをどういう理由で選ぶべきかについて","relatedLinks":[]},{"category":"Article","title":"React.js Best Practices for 2016 | @RisingStack","url":"https://blog.risingstack.com/react-js-best-practices-for-2016/","tags":["React"],"content":"Reactの使い方、データの持ち方、テストなどのプラクティス","relatedLinks":[]},{"category":"Article","title":"JSといえばjQueryだったWebデザイナーが、Reactを1年間使って感じたメリット | dwango creators&#x27; blog（ドワンゴクリエイターズブログ）","url":"http://creator.dwango.co.jp/3413.html","tags":["React","design"],"content":"デザイナーから見たReactについて","relatedLinks":[]},{"category":"Article","title":"Enumify: better enums for JavaScript","url":"http://www.2ality.com/2016/01/enumify.html","tags":["JavaScript","ECMAScript","library"],"content":"classを使ったEnumのライブラリについて","relatedLinks":[{"title":"rauschma/enumify","url":"https://github.com/rauschma/enumify"}]},{"category":"WebsiteDocument","title":"MicheleBertoli/css-in-js - JavaScript","url":"https://github.com/MicheleBertoli/css-in-js","tags":["React","CSS"],"content":"React系のCSS in JSライブラリの比較まとめ","relatedLinks":[]},{"category":"WebsiteDocument","title":"cheeaun/javascript-error-logging","url":"https://github.com/cheeaun/javascript-error-logging","tags":["JavaScript","webservice","debug"],"content":"JavaScriptのerror loggingサービスのまとめ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Progressive Web Apps | Web Fundamentals - Google Developers","url":"https://developers.google.com/web/progressive-web-apps","tags":["web"],"content":"Progressive Web AppについてのGoogleのまとめページ。\nProgressive Web Appとは何かについて書かれている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"thejameskyle/babel-handbook","url":"https://github.com/thejameskyle/babel-handbook","tags":["JavaScript","babel","tutorial"],"content":"Babelのセットアップ方法やプラグイン開発について書かれたハンドブック","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ariporad/pirates","url":"https://github.com/ariporad/pirates","tags":["JavaScript","node.js","babel"],"content":"`require.extensions`のhookを扱うライブラリ。\n一つの拡張子に複数のhookを行う部分を管理する。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kolodny/deact - JavaScript","url":"https://github.com/kolodny/deact","tags":["JavaScript","DOM"],"content":"Template Stringsを使ってJSXライクな書き方ができるテンプレートエンジン。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Jotted — Showcase self-hosted HTML, CSS and JavaScript demos, with editable source","url":"https://ghinda.net/jotted/","tags":["JavaScript","library"],"content":"JS BinとかJSFiddleのような形式でHTML/CSS/JSを埋め込み表示出来るライブラリ","relatedLinks":[]}]},{"meta":{"title":"2016-01-26のJS: JavaScriptとOOP、Fetch with Stream、ES6チートシート","author":"azu","layout":"post","date":"2016-01-26T09:18:00.000Z","category":"JSer","tags":["OOP","Fetch","JavaScript","ES6"],"url":"https://jser.info/2016/01/26/oop-fetch-stream-es6-cheatsheet/"},"items":[{"category":"Headline","title":"Release v2.9.0 · jscs-dev/node-jscs","url":"https://github.com/jscs-dev/node-jscs/releases/tag/v2.9.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"JSCS v2.9.0リリース。\n`requireCapitalizedConstructors`ルールの追加、ルールの更新、バグ修正など","relatedLinks":[]},{"category":"Headline","title":"Node v5.5.0 (Stable) | Node.js","url":"https://nodejs.org/en/blog/release/v5.5.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v5.5.0リリース。\nREPLでも`--require`が動作するように、`fs.createWriteStream`で`autoClose`オプションをサポートするなど","relatedLinks":[]},{"category":"Headline","title":"Release ES2016 Draft 2016-01-20 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2016-draft-20160120","tags":["ECMAScript","ReleaseNote"],"content":"ES2016 Draft 2016-01-20リリース","relatedLinks":[]},{"category":"Article","title":"Simulating Website Thumbnails using Iframes — Medium","url":"https://medium.com/@jamesfuthey/simulating-the-creation-of-website-thumbnail-screenshots-using-iframes-7145269891db","tags":["HTML","CSS"],"content":"iframeを使ってサイトのサムネイル的な表示をする方法について","relatedLinks":[]},{"category":"Article","title":"Understand promises before you start using async/await — Medium","url":"https://medium.com/@bluepnume/learn-about-promises-before-you-start-using-async-await-eb148164a9c8","tags":["JavaScript","Promises"],"content":"async/awaitを使う前にPromiseについて理解しようという話","relatedLinks":[]},{"category":"Article","title":"OO Relationships — Medium","url":"https://medium.com/@DmitrySoshnikov/oo-relationships-5020163ab162","tags":["ECMAScript","JavaScript","OOP"],"content":"JavaScriptとオブジェクト指向プログラミングについて。\nstatic/dynamic dispatch、prototypeベース、縦/横の継承、\nclass、mixin、traits、ダックタイピング、compositionなどについて","relatedLinks":[]},{"category":"Article","title":"2016 - the year of web streams - JakeArchibald.com","url":"https://jakearchibald.com/2016/streams-ftw/","tags":["JavaScript"],"content":"Fetch with Streamについて。\nreadable stream、transform streamを使ったMPEG to GIFの例","relatedLinks":[]},{"category":"Article","title":"JavaScriptのコードを分解してよく使われてる機能を分析する | Web Scratch","url":"http://efcl.info/2016/01/22/es-usage-rate/","tags":["JavaScript","ECMAScript","Tools"],"content":"コードをパースして機能ごとの出現回数を調べるツールを書いたという話","relatedLinks":[]},{"category":"Article","title":"rollup.js - Rollupがちょうどいい感じ - Qiita","url":"http://qiita.com/cognitom/items/e3ac0da00241f427dad6","tags":["JavaScript","browserify","webpack"],"content":"Bundlerであるrollup.jsについて。\nx to ES6をしてから変換する話、Tree Shaking、基本的な使い方や設定について","relatedLinks":[]},{"category":"SlideVideo","title":"Cycle.js Fundamentals - Course by @andrestaltz @eggheadio","url":"https://egghead.io/series/cycle-js-fundamentals","tags":["JavaScript","Rx","動画"],"content":"Cycle.js作者によるCycle.jsとRxJSについてのスクリーンキャスト。","relatedLinks":[]},{"category":"SlideVideo","title":"ECMAScript 2015 by David Leonard","url":"http://slides.com/drksephy/ecmascript-2015#/","tags":["JavaScript","ECMAScript","スライド"],"content":"ES5でのややこしい書き方、それをES6で書いた場合にどうなるかなどについて書かれたスライド。\nアノテーションでどの部分が違うのかがわかりやすく表示されている。","relatedLinks":[{"title":"DrkSephy/es6-cheatsheet","url":"https://github.com/DrkSephy/es6-cheatsheet"}]},{"category":"WebsiteDocument","title":"DrkSephy/es6-cheatsheet","url":"https://github.com/DrkSephy/es6-cheatsheet","tags":["JavaScript","ECMAScript"],"content":"ES6チートシート。\nES5での書き方とES6での書き方を比較してる形","relatedLinks":[]},{"category":"WebsiteDocument","title":"Pa11y - Your automated accessibility testing pal","url":"http://pa11y.org/","tags":["アクセシビリティ","Tools"],"content":"アクセシビリティチェック as a Service。\n毎日実行し結果を集計し、ダッシュボードで見ることが出来る。\nまたCLIからチェックすることも出来る","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Umbrella JS","url":"http://umbrellajs.com/","tags":["JavaScript","DOM","library"],"content":"jQueryのようなDOM操作やAjax周りの機能を提供する小さなライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"stomita/clipboard-hook","url":"https://github.com/stomita/clipboard-hook","tags":["JavaScript","クリップボード"],"content":"要素ごとのイベントを移譲することで、全体としての`cut`/`copy`/`paste`イベントに対するhookを書けるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Jam3/devtool: runs Node.js programs through Chromium DevTools","url":"https://github.com/Jam3/devtool","tags":["node.js","debug","Electron","console","Tools"],"content":"Electron上でNode.jsを実行し開発者ツールでデバッグ出来るツール。\nコマンドラインでNode.jsのファイルを指定するだけで実行できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"skerit/janeway: A curses-based console for node.js","url":"https://github.com/skerit/janeway","tags":["JavaScript","node.js","debug"],"content":"curses/blessedベースのJavaScript REPL。\nブラウザの開発者ツールのようにインタラクティブな動作を目的としている","relatedLinks":[]},{"category":"Book","title":"JavaScript Master - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/9780994346933.do","tags":["JavaScript","book"],"content":"2016年3月発売","relatedLinks":[]}]},{"meta":{"title":"メジャーブラウザのMath.random()のアルゴリズムがXorShift128+になった","author":"azu","layout":"post","date":"2016-01-27T02:32:00.000Z","category":"Browser","tags":["JavaScript","Browser"],"url":"https://jser.info/2016/01/27/math.random-xsfhit/"},"items":[]},{"meta":{"title":"ECMAScript 2016 features & changes","author":"azu","layout":"post","date":"2016-02-01T09:34:00.000Z","category":"JavaScript","tags":["ECMAScript"],"url":"https://jser.info/2016/02/01/es2016/"},"items":[]},{"meta":{"title":"2016-02-02のJS: Firefox 44.0、ES2016の追加機能、webpack2β","author":"azu","layout":"post","date":"2016-02-02T10:57:00.000Z","category":"JSer","tags":["Firefox","ECMAScript","webpack"],"url":"https://jser.info/2016/02/02/firefox44-es2016-new-feature-webpack2beta/"},"items":[{"category":"Headline","title":"V8 JavaScript Engine: V8 Release 4.9","url":"http://v8project.blogspot.com/2016/01/v8-release-49.html","tags":["V8","ReleaseNote"],"content":"V8 4.9リリース。\nDestructuring、Proxy、Reflect、デフォルトパラメータなどES6の仕様追従。\n`Math.random()`のアルゴリズム改善など","relatedLinks":[{"title":"メジャーブラウザのMath.random()のアルゴリズムがXorShift128+になった - JSer.info","url":"http://jser.info/2016/01/27/math.random-xsfhit/"}]},{"category":"Headline","title":"jQuery UI 1.12.0 Beta 1 | jQuery UI Blog","url":"http://blog.jqueryui.com/2016/01/jquery-ui-1-12-0-beta-1/","tags":["jQuery","UI","library","ReleaseNote"],"content":"jQuery UI 1.12.0 Beta 1リリース。\ncontrolgroupとcheckboxradioの追加、npmサポート、IE7サポート終了など","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at master · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/master/Changelog.md","tags":["JavaScript","DOM","ReleaseNote"],"content":"jsdom 8.0.0リリース。\nIDLからコードを生成することで仕様との互換性の向上、`Element#insertAdjacentHTML`と`Node#adoptNode`の実装など","relatedLinks":[]},{"category":"Headline","title":"Firefox 44.0 リリースノート","url":"http://www.mozilla.jp/firefox/44.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 44.0リリース。\n`Symbol.toPrimitive`の実装、letやconstがES6の仕様に追従、OffscreenCanvas APIをフラグ付きで追加、WebRTCから接頭辞の削除など","relatedLinks":[{"title":"Firefox 44 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/44"},{"title":"Firefox 44 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/versions/44/"},{"title":"const や let で定義された変数は window 上のプロパティとならなくなり、let による再宣言は例外が投げられます | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/docs/2015/variables-defined-with-const-and-let-are-no-longer-properties-on-window-redeclaration-with-let-will-throw/"}]},{"category":"Headline","title":"Announcing TypeScript 1.8 Beta - TypeScript - Site Home - MSDN Blogs","url":"http://blogs.msdn.com/b/typescript/archive/2016/01/28/announcing-typescript-1-8-beta.aspx","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 1.8βリリース。\ntscにJavaScriptファイルを扱う `--allowJs` が追加された。\nES6 to ES5をTypeScript Compilerで変換、d.tsがないライブラリとかをtscが直接扱えるようになる。\nUnreachable codeの検出、String literal typesの追加、JSXの対応改善など","relatedLinks":[{"title":"What","url":"https://github.com/Microsoft/TypeScript/wiki/What%27s-new-in-TypeScript#typescript-18-upcoming"}]},{"category":"Headline","title":"PhantomJS 2.1 Release Notes | PhantomJS","url":"http://phantomjs.org/release-2.1.html","tags":["JavaScript","browser","software","ReleaseNote"],"content":"PhantomJS 2.1リリース。\nSSL Client Authentication、context menuイベントのサポート","relatedLinks":[]},{"category":"Headline","title":"Release v3.1.0 · rackt/redux","url":"https://github.com/rackt/redux/releases/tag/v3.1.0","tags":["redux","ReleaseNote"],"content":"Redux 3.1.0リリース。\n`createStore()`が`applyMiddleware()`をオプションとして受け入れられるようになった。","relatedLinks":[]},{"category":"Headline","title":"Deprecate TSD · Issue #269 · DefinitelyTyped/tsd","url":"https://github.com/DefinitelyTyped/tsd/issues/269","tags":["TypeScript","issue"],"content":"TypeScriptの型定義ファイルを管理するツールであるtsdが非推奨となり、代わりにtypingsを利用することが推奨されている。","relatedLinks":[{"title":"typings/typings - TypeScript","url":"https://github.com/typings/typings"},{"title":"vvakame/dtsm - TypeScript","url":"https://github.com/vvakame/dtsm"}]},{"category":"Article","title":"ECMAScript 2016 features &amp; changes - JSer.info","url":"http://jser.info/2016/02/01/es2016/","tags":["ECMAScript","proposal"],"content":"ES2016で追加される機能が確定したことについて。\nまた新機能以外の変更点やどこを見れば仕様の変更が分かるかなどについて","relatedLinks":[]},{"category":"Article","title":"What&#x27;s new in webpack 2","url":"https://gist.github.com/sokra/27b24881210b56bbaff7","tags":["webpack"],"content":"webpack 2での変更点について。\nES6 modulesをベースとした最適化、`System.import`を使った動的ロード向けのモジュール分離に対応するなど","relatedLinks":[]},{"category":"Article","title":"Front-end Application Libraries and Component Architectures - Telerik Developer Network","url":"http://developer.telerik.com/featured/front-end-application-frameworks-component-architectures/","tags":["JavaScript","library","まとめ"],"content":"コンポーネントを扱うライブラリの仕組みや構成、ルーター、サポートブラウザなどについての比較まとめ。\nPolymer、React、Riot.js、Vue.js、Aurelia、Angular2について","relatedLinks":[]},{"category":"Article","title":"Spencer Dixon - Test Driven React Tutorial","url":"http://spencerdixon.com/blog/test-driven-react-tutorial.html","tags":["React","testing"],"content":"Reactのテストについてのチュートリアル","relatedLinks":[]},{"category":"Article","title":"Adding ESLint to Your Project is Now Easier than Ever","url":"http://devnull.guru/adding-eslint-to-your-project-is-easier-than-ever/","tags":["JavaScript","Bluetooth"],"content":"ESLint 2.xで導入されてる`--init`によるAutomatic Configurationについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"CreateJS入門 - ICS MEDIA","url":"https://ics.media/tutorial-createjs/index.html","tags":["JavaScript","canvas","tutorial"],"content":"CreateJS入門サイト","relatedLinks":[]},{"category":"WebsiteDocument","title":"Styleguide: Accessibility · edx/ux-pattern-library Wiki","url":"https://github.com/edx/ux-pattern-library/wiki/Styleguide:-Accessibility","tags":["アクセシビリティ","まとめ","WAI-ARIA"],"content":"アクセシビリティについてスタイルガイド","relatedLinks":[]},{"category":"SoftwareLibrary","title":"naomiaro/waveform-playlist: Multitrack Web Audio editor and player with canvas waveform preview. Set cues, fades and shift multiple tracks in time. Project inspired by Audacity.","url":"https://github.com/naomiaro/waveform-playlist","tags":["web","audio","editor"],"content":"AudacityインスパイアなWeb Audioを使った音声エディタ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sinsoku/clairvoyance","url":"https://github.com/sinsoku/clairvoyance","tags":["CSS","testing","Tools"],"content":"CSSのカバレッジ計測ツール。\nCSSファイルに書かれたスタイルがHTMLの中でどのくらい使われてるかを計測できるツール","relatedLinks":[{"title":"CSS のカバレッジを計測する Clairvoyance というツールを作りました - アジャイルSEの憂鬱","url":"http://sinsoku.hatenablog.com/entry/2016/01/31/174155"}]},{"category":"SoftwareLibrary","title":"juliankrispel/decaf: Coffeescript to ES.next transpiler","url":"https://github.com/juliankrispel/decaf","tags":["CoffeeScript","JavaScript","Tools"],"content":"CoffeeScriptのコードをJavaScriptに変換するツール。","relatedLinks":[{"title":"Issues · decaffeinate/decaffeinate","url":"https://github.com/decaffeinate/decaffeinate"}]},{"category":"SoftwareLibrary","title":"dfilatov/vidom: Library to build UI based on virtual DOM","url":"https://github.com/dfilatov/vidom","tags":["JavaScript","React","library"],"content":"ReactインスパイアなVirtual DOMを持つUIライブラリ。\nReactより小さく早いものを目的としている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"developit/preact: Fast 3kb React alternative with the same ES6 API. Components &amp; Virtual DOM.","url":"https://github.com/developit/preact","tags":["JavaScript","React","library","ReleaseNote"],"content":"Reactのコアを再実装することを目的としたライブラリ。\nContextやPropTypesなどを削除している。\npreact-compatというReactの互換レイヤーを別モジュールとして持っている。","relatedLinks":[{"title":"Differences to React · developit/preact Wiki","url":"https://github.com/developit/preact/wiki/Differences-to-React"},{"title":"developit/preact-compat - JavaScript","url":"https://github.com/developit/preact-compat"}]},{"category":"SoftwareLibrary","title":"zeithq/micro: Micro — Async HTTP microservices","url":"https://github.com/zeithq/micro","tags":["HTTP","node.js"],"content":"小さなHTTPサーバライブラリ。\nリクエストを受け取りレスポンスを返すというシンプルなもの。\nasync/awaitをデフォルトで使えるようになっている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sindresorhus/got: Simplified HTTP/HTTPS requests","url":"https://github.com/sindresorhus/got","tags":["node.js","HTTP","library","Promises"],"content":"Node.js向けのHTTPクライアントライブラリ。`request`と同じ立ち位置のライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Viewer.js","url":"http://fengyuanchen.github.io/viewerjs/","tags":["JavaScript","画像","library"],"content":"多機能な画像ビューアライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"stylelint/stylelint","url":"https://github.com/stylelint/stylelint","tags":["CSS","Tools"],"content":"ルールやプラグインで拡張できるCSSのスタイルLintツール","relatedLinks":[]}]},{"meta":{"title":"2016-02-08のJS: Babel 6.5.0、Angular 1.5、letとconst","author":"azu","layout":"post","date":"2016-02-08T11:19:00.000Z","category":"JSer","tags":["ES6","Babel","AngularJS"],"url":"https://jser.info/2016/02/08/babel6.5.0-angular1.5-let-const/"},"items":[{"category":"Headline","title":"Release v6.5.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v6.5.0","tags":["babel","ReleaseNote"],"content":"Babel 6.5.0リリース。\nBabel 6から一度のコード変換で全てされていたが、それを複数に分けられる`passPerPreset`オプションの追加。\nV8のString実装への最適化を行いコード生成を高速化するなど","relatedLinks":[]},{"category":"Headline","title":"Dev.Opera — Opera 35 released","url":"https://dev.opera.com/blog/opera-35/","tags":["Opera","Chrome","ReleaseNote"],"content":"Opera 35(based on Chromium 48)リリース。\n`document.fonts`がSetらいくなオブジェクトとなり`entries()`などが利用できるように、`TouchEvent`イベントコンストラクタの追加など","relatedLinks":[]},{"category":"Headline","title":"Angular 1.5.0 - ennoblement-facilitation has been released!","url":"http://angularjs.blogspot.com/2016/02/angular-150-ennoblement-facilitation.html","tags":["AngularJS","ReleaseNote"],"content":"AngularJS 1.5.0リリース。\nAngularJS 2へのアップグレードパスの改善。\n`module.component()`の追加、one-wayバインディングの対応、ES6 Classesの対応改善など","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 49 Beta: CSS custom properties, background sync with service workers, and new ES2015 features","url":"http://blog.chromium.org/2016/02/chrome-49-beta-css-custom-properties.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 49 Betaリリース。\nCSS custom propetires(CSS Variable)、ES6の対応改善、` Object.observe()`が非推奨となるなど","relatedLinks":[]},{"category":"Article","title":"Looking ahead: Microsoft Edge for developers in 2016 | Microsoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2016/02/03/2016-platform-priorities/","tags":["MSEdge","JavaScript"],"content":"MSEdgeのロードマップ。\nアクセシビリティの改善、ES6 modules、Fetch API、Web Notifications、Beacon APIなどの対応を予定している","relatedLinks":[]},{"category":"Article","title":"typings で d.ts の管理をする | スマホ神 – JavaScript 受託開発 –","url":"http://smart.ataglance.jp/2016-02-04-manage-dts-by-typings/","tags":["TypeScript"],"content":"`typings`を遣ったd.tsの管理について","relatedLinks":[]},{"category":"Article","title":"Handling props and class names in React – simonsmith.io – Portfolio and blog of a London based front-end web developer","url":"http://simonsmith.io/handling-props-and-classnames-in-react/","tags":["React"],"content":"React ComponentとclassNameの管理パターン。\nclassnamesモジュールを使う方法とテストについて","relatedLinks":[]},{"category":"Article","title":"For and against &#x27;let&#x27;","url":"https://davidwalsh.name/for-and-against-let","tags":["ECMAScript","JavaScript"],"content":"`let`とスコープについての詳しい解説","relatedLinks":[]},{"category":"Article","title":"ES6 const is not about immutability · Mathias Bynens","url":"https://mathiasbynens.be/notes/es6-const","tags":["ECMAScript","JavaScript"],"content":"`const`は値を不変(immutable)にするのではなく、値へのバインディングを不変にするという意味。\nそのためオブジェクトのプロパティへの代入は可能のままだが、オブジェクトの不変については`Object.freeze()`が扱う。また`let`と`const`の使い分けについて","relatedLinks":[]},{"category":"Article","title":"Developer Edition 46 – More memory tooling, improved @media sidebar and more ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2016/02/developer-edition-46-more-memory-tooling-improved-media-sidebar-and-more/","tags":["firefox","debug"],"content":"Firefox 46の開発者ツール変更点について。\nDominator viewの追加、開発者ツールが閉じてても`debugger`ステートメントでブレークするようになるなど","relatedLinks":[]},{"category":"Article","title":"Introducing ES2015 Proxies | Web Updates - Google Developers","url":"https://developers.google.com/web/updates/2016/02/es2015-proxies","tags":["JavaScript","ECMAScript"],"content":"ES2015 Proxiesの使い方について。\nReflect APIとの組み合わた使い方などについて","relatedLinks":[]},{"category":"SlideVideo","title":"다함께, FluxUtils 한바퀴!","url":"http://www.slideshare.net/UyeongJu/fluxutils","tags":["Flux","スライド"],"content":"flux utilsについてのスライド。\nflux utilsのソースコードを見ながらどのようなシーケンスでやり取りしてるのか、fluxアーキテクチャでの非同期処理についてなどがわかりやすく解説されてる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Top | Diff of HTMLs","url":"http://diffofhtmls.herokuapp.com/","tags":["HTML","W3C","WHATWG","spec"],"content":"W3CとWHATWGのHTML仕様書のdiffを見ることが出来るサイト","relatedLinks":[]},{"category":"WebsiteDocument","title":"vasanthk/css-refresher-notes: CSS Refresher!","url":"https://github.com/vasanthk/css-refresher-notes","tags":["CSS","tutorial"],"content":"CSS再入門。\nよく使う機能や指定の仕方について詳しく解説されてる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"start-runner/start: Dead simple tasks runner","url":"https://github.com/start-runner/start","tags":["JavaScript","Promises","Tools"],"content":"Promiseベースのタスク自動化ツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Teamweek/instadate: A minimal high performance date library for Node.js and Browser","url":"https://github.com/Teamweek/instadate","tags":["JavaScript","library"],"content":"日付、時間処理を扱うライブラリ","relatedLinks":[]},{"category":"Book","title":"Thinking In React","url":"https://www.thinkinginreact.xyz/","tags":["React","redux","Flux","book"],"content":"Reactを扱う場合においての現実問題に対する解を考えていく電子書籍。","relatedLinks":[]}]},{"meta":{"title":"2016-02-15のJS: Grunt 1.0.0 RC1、ESLint 2.0.0、Underscore/Lodash","author":"azu","layout":"post","date":"2016-02-15T11:07:00.000Z","category":"JSer","tags":["JavaScript","Grunt","ESLint","underscore","lodash","Vanilla"],"url":"https://jser.info/2016/02/15/grunt-eslint2.0.0-underscore-lodash/"},"items":[{"category":"Headline","title":"Release 2.1.0 - 2016.02.09 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v2.1.0","tags":["JavaScript","ECMAScript","library","ReleaseNote"],"content":"core-js 2.1.0リリース。\nES5 polyfillの分離。\n`Reflect.enumerate`の削除、Metadata Reflection APIの追加など","relatedLinks":[{"title":"decorators/metadata.md at master · jonathandturner/decorators","url":"https://github.com/jonathandturner/decorators/blob/master/specs/metadata.md"}]},{"category":"Headline","title":"February 2016 Security Release Summary | Node.js","url":"https://nodejs.org/en/blog/vulnerability/february-2016-security-releases/","tags":["node.js","セキュリティ","ReleaseNote"],"content":"Node.jsのセキュリティアップデート。\n0.1x、4.x、5.xのアップデートがそれぞれ公開されている。","relatedLinks":[]},{"category":"Headline","title":"Grunt 1.0.0 rc1 released - Grunt: The JavaScript Task Runner","url":"http://gruntjs.com/blog/2016-02-11-grunt-1.0.0-rc1-released","tags":["Grunt","ReleaseNote"],"content":"Grunt 1.0.0 RC1リリース。\nメジャーアップデートとなるため`peerDependencies`についての注意、`grant`モジュールにCLIが含まれるように、依存モジュールのアップデートなど","relatedLinks":[]},{"category":"Headline","title":"ESLint v2.0.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/02/eslint-v2.0.0-released","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 2.0.0リリース。\n`eslint --init`で既存コードから判定して利用するルールの設定を作為する機能の追加、`eslint:recommended`のアップデート、既存ルールの挙動変更やオプションの非互換な変更など","relatedLinks":[{"title":"ESLint v2.0.0 の変更点まとめ - Qiita","url":"http://qiita.com/mysticatea/items/8bcecd821cca9e849078"},{"title":"Documentation - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/docs/user-guide/migrating-to-2.0.0"}]},{"category":"Headline","title":"StrongLoop | A New Day for Express!","url":"https://strongloop.com/strongblog/a-new-day-for-express/","tags":["node.js","community"],"content":"expressがNode.js FoundationのTop-Level Projectとなり、strongloop(IBM)から  https://github.com/expressjs へ移管された。","relatedLinks":[{"title":"TSC/Express.md at master · nodejs/TSC","url":"https://github.com/nodejs/TSC/blob/master/Applications/Express.md"}]},{"category":"Article","title":"Introducing the Accessible Modal Dialog","url":"http://dev.edenspiekermann.com/2016/02/11/introducing-accessible-modal-dialog/","tags":["JavaScript","UI","アクセシビリティ","library","WAI-ARIA"],"content":"AccessibleなモーダルUIライブラリ","relatedLinks":[]},{"category":"Article","title":"timaschew/postcss-compare-packs: compare most popular postcss packs like cssnext, rucksack and precss","url":"https://github.com/timaschew/postcss-compare-packs","tags":["CSS","PostCSS","まとめ"],"content":"cssnext、rucksack、precssなどのPostCSSパックの比較","relatedLinks":[]},{"category":"Article","title":"ECMAScript, TC39 Meeting Notesの読み方と修正方法 | Web Scratch","url":"http://efcl.info/2016/02/12/tc39-meeting-notes/","tags":["ECMAScript","JavaScript"],"content":"ECMA TC39ミーティングノートの読み方とこのミーティングノートにはどういうことが書かれているのかについて","relatedLinks":[]},{"category":"Article","title":"cht8687/You-Dont-Need-Lodash-Underscore: Lists of Javascript methods which you can use natively","url":"https://github.com/cht8687/You-Dont-Need-Lodash-Underscore","tags":["JavaScript"],"content":"underscore/lodashのメソッドをネイティブで同じ表現をする書き方について","relatedLinks":[{"title":"stevemao/You-Dont-Know-About-Lodash-Underscore: In response to You-Dont-Need-Lodash-Underscore","url":"https://github.com/stevemao/You-Dont-Know-About-Lodash-Underscore"}]},{"category":"Article","title":"An update on strong mode - Google グループ","url":"https://groups.google.com/forum/#!msg/strengthen-js/ojj3TDxbHpQ/5ENNAiUzEgAJ","tags":["V8","JavaScript"],"content":"V8のstrong modeの実装ステータスや結果について。\n性能が想定よりでなかった、ES6の仕様に性能のブロッカーがある。複雑になりすぎるなど。\nそのため次期V8ではstrong modeのサポートは削除予定","relatedLinks":[]},{"category":"Article","title":"web-perf/react-worker-dom: Experiments to see the advantages of using Web Workers to Render React Virtual DOM","url":"https://github.com/web-perf/react-worker-dom","tags":["webworker","React"],"content":"ReactをWebWorkerで動かす実装とデモ","relatedLinks":[]},{"category":"WebsiteDocument","title":"AriaFallah/WebpackTutorial: A simple webpack tutorial","url":"https://github.com/AriaFallah/WebpackTutorial","tags":["webpack","tutorial"],"content":"webpackのチュートリアル。\n色々なパターンについて設定やなぜそう書くのかについて書かれてる","relatedLinks":[]},{"category":"WebsiteDocument","title":"React Newsletter","url":"http://reactjsnewsletter.com/","tags":["React","mail"],"content":"ReactのWeeklyメールマガジン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"marten-de-vries/kneden: Transpile ES7 async/await to vanilla ES6 Promise chains: a Babel plugin","url":"https://github.com/marten-de-vries/kneden","tags":["babel","plugin","JavaScript"],"content":"async/awaitをPromiseを使ったreadableなコードへ変換する目的のBabelプラグイン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ruyadorno/ntl: Npm Task List: Interactive cli menu to list/run npm tasks","url":"https://github.com/ruyadorno/ntl","tags":["npm","console","Tools"],"content":"npm run-scriptをインタラクティブに選択肢て実行出来るツール","relatedLinks":[]},{"category":"Book","title":"JavaScript glossary… by Andrea Giammarchi [PDF/iPad/Kindle]","url":"https://leanpub.com/jsglossary","tags":["JavaScript","book"],"content":"JavaScriptを使った開発に出てくる用語を解説することを目的とした書籍","relatedLinks":[{"title":"My new JavaScript book","url":"https://www.webreflection.co.uk/blog/2016/02/08/jsglossary"}]}]},{"meta":{"title":"2016-02-24のJS: TypeScript 1.8、Reactのバージョニング、Draft.js","author":"azu","layout":"post","date":"2016-02-24T01:11:00.000Z","category":"JSer","tags":["TypeScript","React"],"url":"https://jser.info/2016/02/24/typescript1.8-react-semver-draft/"},"items":[{"category":"Headline","title":"Node v5.7.0 (Stable) | Node.js","url":"https://nodejs.org/en/blog/release/v5.7.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 5.7.0リリース。\n`Buffer#fill`が`encoding`引数をサポート、`spawn()`が`shell`オプションをサポートするなど","relatedLinks":[]},{"category":"Headline","title":"jQuery 1.12.1 and 2.2.1 Released | Official jQuery Blog","url":"http://blog.jquery.com/2016/02/22/jquery-1-12-1-and-2-2-1-released/","tags":["jQuery","ReleaseNote"],"content":"jQuery 1.12.1と2.2.1リリース\n`.position()`のバグを修正","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 1.8 | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2016/02/22/announcing-typescript-1-8-2/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 1.8リリース。\nString Literal Typesのサポート、コントロールフローを解析しUnreachableなコードを検出するなど","relatedLinks":[]},{"category":"Headline","title":"ESLint v2.2.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/02/eslint-v2.2.0-released","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 2.2.0リリース\n`// eslint-disable-next-line`のサポート","relatedLinks":[]},{"category":"Headline","title":"Release ES2016 Draft 2016-02-15 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2016-draft-20160215","tags":["ECMAScript","ReleaseNote"],"content":"ES2016 Draft 2016-02-15リリース。\nexponentiation operatorの追加、`Object.prototype`はimmutableに、Unicode 8.0へアップデート、`[[Enumerate]]`と`Reflect.enumerate`の削除など","relatedLinks":[]},{"category":"Headline","title":"Release v2.10.0 · jscs-dev/node-jscs","url":"https://github.com/jscs-dev/node-jscs/releases/tag/v2.10.0","tags":["JavaScript","ReleaseNote"],"content":"JSCS 2.10.0リリース。\n`disallowSpacesInsideTemplateStringPlaceholders`、`requireImportsAlphabetized`の追加","relatedLinks":[]},{"category":"Headline","title":"New Versioning Scheme | React","url":"http://facebook.github.io/react/blog/2016/02/19/new-versioning-scheme.html","tags":["React"],"content":"Reactの次期バージョンは15.0.0としてリリース予定。\nSemver的なバージョニングに合わせるため。また、React ComponentにおけるReactの依存バージョンの書き方についても解説されてる","relatedLinks":[]},{"category":"Article","title":"Why using &#x60;_.chain&#x60; is a mistake. — Making Internets — Medium","url":"https://medium.com/making-internets/why-using-chain-is-a-mistake-9bc1f80d51ba","tags":["JavaScript","library"],"content":"lodashの`_.chanin`は拡張が難しい、lodashに含めることでbundleサイズが大きいという問題がある。\n4.1から`lodash/fp`にfunctionalな関数が用意されており、同等の表現はより小さなbundleサイズで実現できるという話","relatedLinks":[]},{"category":"Article","title":"DevTools へのセキュリティ パネル導入について - Google Developers Japan","url":"http://googledevjp.blogspot.com/2016/02/draft-devtools.html","tags":["Chrome","debug"],"content":"Chrome開発者ツールに\"Security\"パネルが追加された。\nTLS証明書、Mixed Contentなどを確認出来る","relatedLinks":[]},{"category":"Article","title":"JavaScript Safe Navigation","url":"https://gist.github.com/dakaraphi/6a87168db66fd8f032d2","tags":["JavaScript","proxy"],"content":"ProxyとSymbolを使って `?.` 的なプロパティチェインを繋げるように書く実装。\n`safe(o).isNull.next.next.$` のように書ける","relatedLinks":[]},{"category":"Article","title":"Aerotwist - The Hack is Back!","url":"https://aerotwist.com/blog/the-hack-is-back/","tags":["JavaScript","canvas"],"content":"`createImageBitmap`とWebWorkerを使うことで、画像のデコード処理を別スレッドで行う方法について","relatedLinks":[]},{"category":"Article","title":"Delivering Octicons with SVG","url":"https://github.com/blog/2112-delivering-octicons-with-svg","tags":["fonts","SVG"],"content":"GitHubはアイコンフォントをやめて、SVGを使ったアイコンを利用するように切り替えた。\nSVGをアイコンとして埋め込む方法、パフォーマンス、欠点や落とし穴について","relatedLinks":[]},{"category":"SlideVideo","title":"talk/webtalk_2016-02-20.pdf at master · momdo/talk","url":"https://github.com/momdo/talk/blob/master/webtalk_2016-02-20.pdf","tags":["W3C","WHATWG","spec","スライド"],"content":"ウェブの仕様は継続的に更新されているという話。\nWHATWG HTMLから見るW3C HTML、CSS SnapshotはCSS WGが安定していると認識したものを記述しているという話について","relatedLinks":[]},{"category":"SlideVideo","title":"Google と Udacity による JavaScript Promise オンライン コースのご紹介 - Google Developers Japan","url":"http://googledevjp.blogspot.com/2016/02/google-udacity-javascript-promise.html","tags":["JavaScript","Promises"],"content":"Promiseに関するオンラインコース","relatedLinks":[]},{"category":"WebsiteDocument","title":"npm Discover · see what everyone else is using","url":"http://www.npmdiscover.com/","tags":["npm","library","webservice","検索"],"content":"特定のnpmパッケージとよく一緒に使われているものを一覧表示してくれるサイト。\n「`react`と一緒に使われているツールやライブラリが何か」という事を検索できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"trueadm/inferno: An extremely fast, isomorphic JavaScript library for building modern user interfaces","url":"https://github.com/trueadm/inferno","tags":["JavaScript","VirtualDOM","React","library"],"content":"ReactライクなVirtual DOMライブラリ。\nテンプレートからVirtual DOM Elementを作る段階で、静的/動的なのかを調べている。\nこれにより実行時にはdiff/patchを行わないフラグメントを作ることでパフォーマンスの向上を狙っている。","relatedLinks":[{"title":"What","url":"https://github.com/trueadm/inferno/issues/21"}]},{"category":"SoftwareLibrary","title":"ziyasal/scientist.js: A JavaScript interpretation of the Ruby library Scientist, a library for carefully refactoring critical paths.","url":"https://github.com/ziyasal/scientist.js","tags":["JavaScript","testing"],"content":"リファクタリングを補助するRubyライブラリであるscienceのJavaScript版","relatedLinks":[{"title":"trello/scientist: A Node.js library for carefully refactoring critical paths in production","url":"https://github.com/trello/scientist"},{"title":"github/scientist: A Ruby library for carefully refactoring critical paths.","url":"https://github.com/github/scientist"}]},{"category":"SoftwareLibrary","title":"dthree/cash: Cross-platform Linux commands in pure ES6","url":"https://github.com/dthree/cash","tags":["JavaScript","node.js","library","Tools"],"content":"JavaScriptで書かれたLinuxコマンド集。\nクロスプラットフォームで動く`mv`や`cp`といった単体のコマンドとしてもインストールできる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Draft.js | Rich Text Editor Framework for React","url":"https://facebook.github.io/draft-js/","tags":["React","editor","facebook","library"],"content":"Facebook Notesやmessengerで使われてるReactのリッチエディタフレームワーク。\nimmutable-jsを利用している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ProjectSeptemberInc/gl-react: OpenGL / WebGL bindings for React to implement complex effects over images and content, in the descriptive VDOM paradigm","url":"https://github.com/ProjectSeptemberInc/gl-react","tags":["WebGL","React","library"],"content":"OpenGL / WebGLを使ったReact Componentライブラリ。","relatedLinks":[]},{"category":"Book","title":"Happy Learn JavaScript Tutorial","url":"http://www.happylearnjavascripttutorial.com/","tags":["JavaScript","book"],"content":"JavaScript楽しく学ぶ目的の書籍","relatedLinks":[]},{"category":"Book","title":"JavaScript-mancy by Jaime González García [PDF/iPad/Kindle]","url":"https://leanpub.com/javascriptmancy-mastering-arcane-art-of-writing-awesome-javascript-for-csharp-developers","tags":["JavaScript","book"],"content":"C#開発者向けJavaScript本","relatedLinks":[]}]},{"meta":{"title":"2016-03-03のJS: Ember.js LTS、ECMA i18n API 3rd Edition RC、jQuery 3での変更点","author":"azu","layout":"post","date":"2016-03-03T12:53:00.000Z","category":"JSer","tags":["Ember","i18n","ECMAScript","jQuery"],"url":"https://jser.info/2016/03/03/ember-lts-402-i18n-rc-jquery3/"},"items":[{"category":"Headline","title":"Release v6.6.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v6.6.0","tags":["babel","ReleaseNote"],"content":"Babel 6.6.0リリース。\ntransform-es3-member-expression-literalsが再度組み合わせて利用できるように、Babel 6で削除されたオプションに関するエラーをわかりやすく表示されるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Announcing Ember&#x27;s First LTS Release","url":"http://emberjs.com/blog/2016/02/25/announcing-embers-first-lts.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember.jsがLTS(Long Term Support)リリースを行う予定。\nEmber.js 2.4が最初のLTSリリースとなる","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember.js 2.4 and 2.5 Beta Released","url":"http://emberjs.com/blog/2016/02/29/ember-2-4-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember.js 2.4と2.5 Betaリリース。\n2.5では`Object.assign`のpolyfillである`Ember.assign`の追加、イベントのテストヘルパーの追加","relatedLinks":[]},{"category":"Headline","title":"Release 3rd Edition - Release Candidate · tc39/ecma402 · GitHub","url":"https://github.com/tc39/ecma402/releases/tag/3.0-rc-1","tags":["ECMAScript","spec","ReleaseNote"],"content":"ECMAScript Internationalization API 3rd Edition RCリリース。 i18n APIについて定義されてる仕様書","relatedLinks":[]},{"category":"Article","title":"What&#x27;s New in jQuery 3 - Telerik Developer Network","url":"http://developer.telerik.com/featured/whats-new-in-jquery-3/","tags":["jQuery"],"content":"jQuery 3についての解説。\nfor/ofでの列挙、`$.get`/`$.post`のシグネチャ追加、requestAnimationFrameの対応、`data()`の動作変更、DeferredがPromise/A+互換に、SVGのサポートなど","relatedLinks":[]},{"category":"Article","title":"Step by Step Guide To Building React Redux Apps — Medium","url":"https://medium.com/@rajaraodv/step-by-step-guide-to-building-react-redux-apps-using-mocks-48ca0f47f9a","tags":["React","redux","tutorial"],"content":"React+Reduxをステップバイステップで学ぶチュートリアル","relatedLinks":[]},{"category":"Article","title":"Design by Contract with Flow, React, and ESLint · Jeff Winkler","url":"https://react.rocks/blog/post/propTypes_React_Flow/","tags":["React","flowtype"],"content":"ReactのコードをESLint + FlowTypeでチェックする仕組みについての記事","relatedLinks":[]},{"category":"Article","title":"Preload: What Is It Good For? – Smashing Magazine","url":"https://www.smashingmagazine.com/2016/02/preload-what-is-it-good-for/","tags":["browser"],"content":"`<link rel=\"preload\">`でのpreloadについての詳しい解説。\nブラウザがちゃんと優先度を扱える、CSPと同居できる、`as`属性を使い適切な形でリソースを読み込めるなどの特徴について書かれている。","relatedLinks":[]},{"category":"Article","title":"Building command line tools with Node.js - Atlassian Developers","url":"https://developer.atlassian.com/blog/2015/11/scripting-with-node/?categories=node.js","tags":["node.js","console","tutorial"],"content":"Node.jsでCLI作るチュートリアル","relatedLinks":[]},{"category":"Article","title":"Falcor入門 1日目 Falcorとは何者か - Qiita","url":"http://qiita.com/Quramy/items/5cf4f112d715c2e2d300","tags":["API","JavaScript","library"],"content":"Falcorとはどういうものなのかについての解説。\nデータの透過性と一貫性について\n\n> Falcorを利用する大きなメリットの1つは「データがサーバにあるのか、クライアントにあるのか意識することなく扱えるようになること」","relatedLinks":[]},{"category":"Article","title":"TypeScriptの型定義管理ツールTypingsについて - Qiita","url":"http://qiita.com/literalice/items/d83249a5646abcb0bec6","tags":["TypeScript"],"content":"typingsの使い方について","relatedLinks":[]},{"category":"Article","title":"async/await: It’s Good and Bad — Medium","url":"https://medium.com/@benlesh/async-await-it-s-good-and-bad-15cf121ade40","tags":["ECMAScript","JavaScript"],"content":"async/awaitのメリット/デメリットについて。","relatedLinks":[]},{"category":"Article","title":"gaearon/react-makes-you-sad: Here’s a flowchart to make you happy again!","url":"https://github.com/gaearon/react-makes-you-sad","tags":["React","tutorial","画像"],"content":"Reactの学ぶ手順やエコシステムについてのアドバイス的な図","relatedLinks":[{"title":"日本語訳","url":"http://qiita.com/kuy/items/bfe5975205c9237ebd26"}]},{"category":"Article","title":"Examples of name clashes in JavaScript’s standard library","url":"http://www.2ality.com/2016/02/js-name-clashes.html","tags":["ECMAScript","JavaScript"],"content":"新たに追加するメソッド名が衝突したBreak the webの例とSymbolについて。\n`Symbol.unscopables`が導入された経緯について","relatedLinks":[]},{"category":"Article","title":"Elmish: Functional Programming in Javascript — Medium","url":"https://medium.com/@chetcorcos/elmish-functional-programming-in-javascript-50995f1d4b9e","tags":["JavaScript","設計"],"content":"Elm的なアーキテクチャをJavaScriptで実装しながら学んでみたという話","relatedLinks":[{"title":"ccorcos/elmish: A Javascript UI library inspired by Elm","url":"https://github.com/ccorcos/elmish"}]},{"category":"SlideVideo","title":"ConFoo: Measuring SPA Performance // Speaker Deck","url":"https://speakerdeck.com/bluesmoon/confoo-measuring-spa-performance","tags":["JavaScript","performance","スライド"],"content":"SPAでパフォーマンスをどう計測するについてのスライド。\nXHRのhook、MutationObserver、FetchObserverについて","relatedLinks":[]},{"category":"SlideVideo","title":"React.js Conf 2016 - YouTube","url":"https://www.youtube.com/playlist?list=PLb0IAmt7-GS0M8Q95RIc2lOM6nc77q1IY","tags":["React","イベント","動画 "],"content":"React.js Conf 2016の動画まとめ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Doclets","url":"https://www.doclets.io/","tags":["JavaScript","document","Markdown","webservice"],"content":"JSDocとMarkdownのドキュメントホスティングサイト。\nymlにソースとMarkdownファイルを指定すれば、ドキュメントを作ってくれる","relatedLinks":[]},{"category":"WebsiteDocument","title":"HTML Standard 日本語訳","url":"https://momdo.github.io/html/","tags":["WHATWG","HTML","翻訳"],"content":"WHATWG Living Standardの日本語訳","relatedLinks":[{"title":"HTML Living Standard訳はじめました - 水底の血","url":"http://momdo.hatenablog.jp/entry/20160301/1456833788"}]},{"category":"SoftwareLibrary","title":"rtsao/csjs: Modular, scoped CSS with ES6","url":"https://github.com/rtsao/csjs","tags":["JavaScript","CSS"],"content":"Template Stringsを使ったCSSのカプセル化を行うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mohayonao/web-audio-mock-api: mock API which implements the Web Audio API&#x27;s interfaces only","url":"https://github.com/mohayonao/web-audio-mock-api","tags":["web ","audio","API","testing","library"],"content":"Web Audio APIのモックライブラリ","relatedLinks":[]},{"category":"Book","title":"Introduction | React Webpack cookbook","url":"https://christianalfoni.github.io/react-webpack-cookbook/","tags":["React","book","webpack"],"content":"webpackとReactでのビルド環境構築系のGitBook","relatedLinks":[]},{"category":"Book","title":"Amazon.co.jp： ブラウザハック Webブラウザからの攻撃手法とその防御法総覧: Wade Alcorn, Christian Frichot, Michele Orru, 園田 道夫, はせがわ ようすけ, 西村 宗晃, 株式会社プロシステムエルオーシー: 本","url":"http://www.amazon.co.jp/%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B6%E3%83%8F%E3%83%83%E3%82%AF-Web%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B6%E3%81%8B%E3%82%89%E3%81%AE%E6%94%BB%E6%92%83%E6%89%8B%E6%B3%95%E3%81%A8%E3%81%9D%E3%81%AE%E9%98%B2%E5%BE%A1%E6%B3%95%E7%B7%8F%E8%A6%A7-Wade-Alcorn/dp/479814343X","tags":["browser","security","book"],"content":"2016年3月16日発売\n攻撃者目線から学ぶブラウザ/ウェブのセキュリティについての書籍","relatedLinks":[]}]},{"meta":{"title":"2016-03-08のJS: React v15.0 RC、Reactパフォーマンス調査、DDD","author":"azu","layout":"post","date":"2016-03-08T14:49:00.000Z","category":"JSer","tags":["JavaScript","DDD","React","Perf"],"url":"https://jser.info/2016/03/08/react15.0rc-perf-ddd/"},"items":[{"category":"Headline","title":"React v15.0 Release Candidate | React","url":"https://facebook.github.io/react/blog/2016/03/07/react-v15-rc1.html","tags":["React","ReleaseNote"],"content":"React v15.0 RC1リリース。\n`data-reactid`がクライアントサイドのレンダリングではなくなる、`null`をコメントとしてレンダリングするようになる。\nまた非推奨となっていたメソッドが`react`と`react-dom`それぞれから削除された。\nまた、警告メッセージの改善などが行われている。","relatedLinks":[]},{"category":"Headline","title":"ESLint v2.3.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/03/eslint-v2.3.0-released","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint v2.3.0リリース。\nルールのoff/wan/errorを0,1,2という数字ではなく文字列で指定出来るように、ES2016で追加される`**`の対応など","relatedLinks":[]},{"category":"Article","title":"Performance Engineering with React","url":"http://benchling.engineering/performance-engineering-with-react/","tags":["React","performance"],"content":"Reactにおけるパフォーマンス調査の手法やどのようにボトルネックを見つけるかについて","relatedLinks":[]},{"category":"Article","title":"僕がネイティブな CSS 変数にわくわくする理由","url":"http://terkel.github.io/why-im-excited-about-native-css-variables/","tags":["CSS","翻訳"],"content":"CSS Custom Propertyについて書かれた\"Why I'm Excited About Native CSS Variables\"の翻訳。\nコンポーネント名接頭辞にした変数名を使うという命名規則についてなど","relatedLinks":[{"title":"僕がネイティブな CSS 変数にわくわくする理由","url":"http://terkel.github.io/why-im-excited-about-native-css-variables/"}]},{"category":"Article","title":"High-performance Web Worker messages | Read the Tea Leaves","url":"http://nolanlawson.com/2016/02/29/high-performance-web-worker-messages/","tags":["webworker","performance","JavaScript"],"content":"単純なデータ転送についてのWeb Workerのパフォーマンステスト。\n\n- `JSON.stringify()`/`JSON.parse()`の利用\n- 一部のみ適応\n- 生オブジェクトのまま\nをそれぞれ比較したもの\n\n- [How fast are web workers? ★ Mozilla Hacks – the Web developer blog](https://hacks.mozilla.org/2015/07/how-fast-are-web-workers/ \"How fast are web workers? ★ Mozilla Hacks – the Web developer blog\")\n- [Fast legoization | Better world by better software](https://glebbahmutov.com/blog/fast-legoization/ \"Fast legoization | Better world by better software\")","relatedLinks":[]},{"category":"Article","title":"Fast legoization | Better world by better software","url":"https://glebbahmutov.com/blog/fast-legoization/","tags":["JavaScript","webworker","performance"],"content":"Web Workerを使って画像データを効率よく処理するテクニックについて","relatedLinks":[]},{"category":"Article","title":"なぜ絵文字を含む文字を1文字ずつに分けるのにArray.fromだけで十分なのか？ - Qiita","url":"http://qiita.com/alucky0707/items/697598e49ff56191c139","tags":["JavaScript","ECMAScript"],"content":"`split(\"\")`だと絵文字などでサロゲートペアの問題が起きるため、ES6で追加された`Array.from`などを使うことで正しく扱えるという話","relatedLinks":[]},{"category":"Article","title":"JavaScript ASTを始める最初の一歩 | Web Scratch","url":"http://efcl.info/2016/03/06/ast-first-step/","tags":["JavaScript","AST","tutorial"],"content":"JavaScriptのASTを扱ったツールを書きたい人が最初に把握しておくといい部分についてのまとめ","relatedLinks":[]},{"category":"Article","title":"Data structures in JavaScript - Ben&#x27;s Blog","url":"http://blog.benoitvallon.com/data-structures-in-javascript/data-structures-in-javascript/","tags":["JavaScript","アルゴリズム"],"content":"JavaScriptでデータ構造やアルゴリズムについて学ぶシリーズ記事","relatedLinks":[]},{"category":"Article","title":"Introducing the WebVR 1.0 API Proposal ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2016/03/introducing-the-webvr-1-0-api-proposal/","tags":["web ","VR"],"content":"WebVR 1.0 APIについての解説記事","relatedLinks":[]},{"category":"Article","title":"ECMA262のIteration protocolsで遅延評価するIteratorを作る - snyk_s log","url":"http://saneyukis.hatenablog.com/entry/2016/03/04/030337","tags":["ECMAScript","JavaScript"],"content":"ECMAScriptの`Symbol.iterator`を使い遅延評価出来るコレクション処理を行うという話","relatedLinks":[]},{"category":"Article","title":"Understanding Transducers in JavaScript — Medium","url":"https://medium.com/@roman01la/understanding-transducers-in-javascript-3500d3bd9624","tags":["JavaScript","performance"],"content":"Transformer protocolを実装したコレクション処理を実装することで、一度の処理で同時に複数の変換を行うことが出来るようにする仕組みであるTransducersについて","relatedLinks":[{"title":"cognitect-labs/transducers-js: Transducers for JavaScript","url":"https://github.com/cognitect-labs/transducers-js"}]},{"category":"Article","title":"matthewmueller/28kb-react-redux-routing: React + Redux + Routing Stack for just 28kb","url":"https://github.com/matthewmueller/28kb-react-redux-routing","tags":["JavaScript","React","redux"],"content":"React + Redux + ルーティングというよくある構成を28kbで実現するというコンセプトリポジトリ。\nReactの代わりにPreact、Reduxの代わりにラップしたSocrates、ルーティングはenroute + Reduxミドルウェアを使っている","relatedLinks":[]},{"category":"SlideVideo","title":"大型フロントエンド開発におけるTypeScriptとDDD // Speaker Deck","url":"https://speakerdeck.com/armorik83/da-xing-hurontoendokai-fa-niokerutypescripttoddd","tags":["TypeScript","DDD","AngularJS","スライド"],"content":"大規模なクライアントサイドを書く場合の構造やテスト、環境についてのスライド。\nTypeScriptでちゃんとしたドメインモデルを構築し、Viewのレイヤーとの分離を図る仕組みの作り方について","relatedLinks":[]},{"category":"SlideVideo","title":"React.js Conf 2016 - Steve McGuire - Performance Without Compromise - YouTube","url":"https://www.youtube.com/watch?v=kDARP5QZ6nU&list=PLb0IAmt7-GS0M8Q95RIc2lOM6nc77q1IY&index=28","tags":["JavaScript","動画 ","React"],"content":"Netflixのクライアントサイドのアーキテクチャについて。\nmixinじゃなくて高階関数でレイヤーを表現、宣言的にするためのルールとしての\"No refs\"。\nまたパフォーマンス面では、Transducersの話、静的なpropと動的なpropは分けることでの最適化についてなど。","relatedLinks":[]},{"category":"SlideVideo","title":"Designing in React: Why and How // Speaker Deck","url":"https://speakerdeck.com/fand/designing-in-react-why-and-how","tags":["React","CSS","DOM","スライド"],"content":"React語圏でどういう試みがあって何を解決しようとしてたかという話\nCSS、アニメーションについて","relatedLinks":[]},{"category":"SlideVideo","title":"gulp: The Good Parts // Speaker Deck","url":"https://speakerdeck.com/jmblog/gulp-the-good-parts","tags":["gulp","スライド"],"content":"gulpのプラクティスについて。\nタスクの分割、設定の外部ファイル化、v4を見据えたタスクの書き方、v4の変更点について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Code Cartoons — Medium","url":"https://code-cartoons.com/","tags":["JavaScript","React","redux"],"content":"Cartoonsで学ぶFlux、Redux、Relayなどのデータコントロールフロー","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Rebass","url":"http://jxnblk.com/rebass/","tags":["React","UI","library"],"content":"Reactを使ったUIライブラリ。\nステートレスコンポーネントとして実装されている。\nコンポーネントづくりの参考になりそう","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tryolabs/fetch-it: An enhanced HTTP client based on fetch.","url":"https://github.com/tryolabs/fetch-it","tags":["HTTP","JavaScript","library"],"content":"Fetch APIをベースにしたHTTPクライアントライブラリ。\nmiddlewareで処理を追加できる仕組みを持っている","relatedLinks":[{"title":"fetch-it: enhanced HTTP client based on fetch | Tryolabs | Blog","url":"http://blog.tryolabs.com/2016/03/02/fetch-it-enhanced-http-client-based-on-fetch/"}]},{"category":"SoftwareLibrary","title":"cognitect-labs/transducers-js: Transducers for JavaScript","url":"https://github.com/cognitect-labs/transducers-js","tags":["JavaScript","performance","library"],"content":"Transformer protocolを実装したコレクション処理を実装することで、一度の処理で同時に複数の変換を行うことが出来るようにする仕組みとライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"uber-common/react-vis","url":"https://github.com/uber-common/react-vis","tags":["React","グラフ","library"],"content":"Uberのグラフやビジュアライズ系のReact Componentライブラリ。\n棒グラフ、折れ線グラフ、円グラフ、テーブル、ツリーマップなど色々な表現が用意されてる","relatedLinks":[]},{"category":"Book","title":"Quick Browserify by Sandeep Kumar Patel [Leanpub PDF/iPad/Kindle]","url":"https://leanpub.com/browserify","tags":["browserify","book"],"content":"Browserifyについての書籍","relatedLinks":[]}]},{"meta":{"title":"2016-03-17のJS: React.js v15.0 RC、WebAssembly、最近のJavaScriptツール/ライブラリ","author":"azu","layout":"post","date":"2016-03-17T13:03:00.000Z","category":"JSer","tags":["React","WebAssembly","JavaScript"],"url":"https://jser.info/2016/03/17/react-webassembly-art-of-javascript/"},"items":[{"category":"Headline","title":"V8 JavaScript Engine: V8 Release 5.0","url":"http://v8project.blogspot.com/2016/03/v8-release-50.html","tags":["V8","ReleaseNote"],"content":"V8 5.0リリース。\nRegExp Unicode flagのサポート、RegExpのwell-known symbolsをサポート、`Object.keys()`やrest parameterの速度改善など","relatedLinks":[]},{"category":"Headline","title":"Release v6.7.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v6.7.0","tags":["babel","ReleaseNote"],"content":"Babel v6.7.0リリース。\nasync/await周りのバグ修正、内部的な変更してAST上に存在したキャッシュをWeakMapベースで保存するように変更。","relatedLinks":[]},{"category":"Headline","title":"node/CHANGELOG.md at v5.8.0 · nodejs/node","url":"https://github.com/nodejs/node/blob/v5.8.0/CHANGELOG.md","tags":["node.js","ReleaseNote"],"content":"Node.js 5.8.0リリース。\n`path.normalize`のレグレッションを修正、`util.format`のパフォーマンス改善。","relatedLinks":[{"title":"Node 5.7.1 path.normalize broken · Issue #5585 · nodejs/node","url":"https://github.com/nodejs/node/issues/5585"},{"title":"util: improve util.format performance by evanlucas · Pull Request #5360 · nodejs/node","url":"https://github.com/nodejs/node/pull/5360"}]},{"category":"Headline","title":"Node v5.9.0 (Stable) | Node.js","url":"https://nodejs.org/en/blog/release/v5.9.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 5.9.0リリース。\n`vm`モジュールのメモリ使用量の削減、`zlib`モジュールがconcatenated archivesをサポート","relatedLinks":[]},{"category":"Headline","title":"Release v1.5.0 · testem/testem","url":"https://github.com/testem/testem/releases/tag/v1.5.0","tags":["JavaScript","testing","library"],"content":"testem v1.5.0リリース。\n複数のTest Pageを指定するとparallel実行できるように、Mochaのテストにかかった時間を表示できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"React.js v15.0 changes - blog.koba04.com","url":"http://blog.koba04.com/post/2016/03/09/react-js-v15-changes/","tags":["React","ReleaseNote"],"content":"React.js v15.0 RCの変更点まとめ","relatedLinks":[]},{"category":"Article","title":"A WebAssembly Milestone: Experimental Support in Multiple Browsers ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2016/03/a-webassembly-milestone/","tags":["WebAssembly","status"],"content":"WebAssemblyの仕様、ブラウザの実装のステータスについて。\n最初のbinary formatドラフト仕様がでており、Firefox、Chrome、ChackraCoreのNightlyで試験的な実装がされている。","relatedLinks":[{"title":"V8 JavaScript Engine: Experimental support for WebAssembly in V8","url":"http://v8project.blogspot.jp/2016/03/experimental-support-for-webassembly.html"},{"title":"Previewing WebAssembly experiments in Microsoft Edge | Microsoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2016/03/15/previewing-webassembly-experiments/"}]},{"category":"Article","title":"Firefox 開発ツールを使った Service Workers と Push のデバッグ | Mozilla Developer Street (modest)","url":"https://dev.mozilla.jp/2016/03/debugging-service-workers-and-push-with-firefox-devtools/","tags":["firefox","debug","ServiceWorker"],"content":"FirefoxでのService WorkerとPush Notificationsのデバッグについて。\n`about:debugging`というデバッグのダッシュボード画面についても書かれている","relatedLinks":[]},{"category":"Article","title":"State of the Art JavaScript in 2016 — JavaScript and Opinions — Medium","url":"https://medium.com/javascript-and-opinions/state-of-the-art-javascript-in-2016-ab67fc68eb0b","tags":["JavaScript","Tools","library"],"content":"最近のJavaScriptにおける主流となったライブラリやツールについて。\nReact、Redux、Babel、ESLint、npm、webpack、mochaなどのテストツールなどや人について\n\n> If you don’t need it, don’t use it\n\nと書かれているように全てに対するベストではないという話も書かれている","relatedLinks":[]},{"category":"Article","title":"Learning React Without Using React Part 1 — JavaScript Inside — Medium","url":"https://medium.com/javascript-inside/learn-the-concepts-part-1-418952d968cb","tags":["React","tutorial"],"content":"ツールなどは使わないで学ぶReactのチュートリアル。","relatedLinks":[]},{"category":"Article","title":"Webpack FTW!!!!","url":"https://k94n.com/webpack-ftw","tags":["webpack"],"content":"webpackはどんなことができるのかというのをわかりやすく簡単に紹介してる","relatedLinks":[{"title":"Webpack FTW // Speaker Deck","url":"https://speakerdeck.com/k9ordon/webpack-ftw"}]},{"category":"Article","title":"特集：C#×JavaScript：ECMAScriptの最新情報を得るには (1/2) - ＠IT","url":"http://www.atmarkit.co.jp/ait/articles/1603/11/news042.html","tags":["ECMAScript"],"content":"ECMAScriptの仕様策定のプロセスやリソースがどこにあるかがまとまってる記事","relatedLinks":[]},{"category":"Article","title":"Jest | &quot;JavaScript Unit Testing Performance&quot;","url":"http://facebook.github.io/jest/blog/2016/03/11/javascript-unit-testing-performance.html","tags":["JavaScript","testing","library","performance"],"content":"テストフレームワークのJestが実行時間を改善するためにやっていることについて","relatedLinks":[]},{"category":"Article","title":"JavaScript Proposal for weak references: WeakRef","url":"https://ponyfoo.com/articles/weakref","tags":["ECMAScript","JavaScript","proposal"],"content":"`WeakRef` Proposalについての解説。\nWeakMapと同じようにWeakな扱いだが、WeakMapと違いGCで回収された時に呼ばれる`executor`を指定できる。(WeakMap/Setは回収されたタイミングを知ることができない)","relatedLinks":[{"title":"proposal-weakrefs/weakrefs.md at master · tc39/proposal-weakrefs","url":"https://github.com/tc39/proposal-weakrefs/blob/master/specs/weakrefs.md"}]},{"category":"Article","title":"Node.js Buffer API Changes — Medium","url":"https://medium.com/@jasnell/node-js-buffer-api-changes-3c21f1048f97","tags":["node.js"],"content":"Node.js v6で予定されているBuffer APIの変更についての解説","relatedLinks":[]},{"category":"SlideVideo","title":"Fluent Conference 2016 (San Francisco, CA) - YouTube","url":"https://www.youtube.com/watch?v=9UYoKyuFXrM&list=PL055Epbe6d5bQubu5EWf_kUNA3ef_qbmL","tags":["JavaScript","イベント","動画 "],"content":"Fluent Conference 2016の動画が公開された","relatedLinks":[]},{"category":"WebsiteDocument","title":"PostCSS.parts | A searchable catalog of PostCSS plugins","url":"http://postcss.parts/","tags":["PostCSS","検索"],"content":"PostCSSのカタログサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Introducing InversifyJS 2.0","url":"http://blog.wolksoftware.com/introducing-inversify-2","tags":["TypeScript","library"],"content":"Inversion of control (IoC)コンテナーのTypeScript向けライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rajasegar/compack: An awesome bundler for Web Components","url":"https://github.com/rajasegar/compack","tags":["WebComponents","Tools"],"content":"Web Componentsのscaffoldingとbundleするツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"eanplatter/enclave: A simpler way to compile React applications http://enclave.js.org","url":"https://github.com/eanplatter/enclave","tags":["React","babel","Tools"],"content":"`npm install`して`npm start`するだけで、React+Babelな環境を動かせるブートストラップ的なツール","relatedLinks":[]}]},{"meta":{"title":"2016-03-23のJS: Chrome 50β、Reactのパフォーマンス調査改善、Node.js compat table","author":"azu","layout":"post","date":"2016-03-23T14:26:00.000Z","category":"JSer","tags":["Chrome","React","perf","Node.js"],"url":"https://jser.info/2016/03/23/chrom50beta-react-perf-node-compat-table/"},"items":[{"category":"Headline","title":"Announcing Marko v3: From HTML to HTML-JS | Marko","url":"http://markojs.com/blog/announcing-marko-v3/","tags":["JavaScript","template","library","ReleaseNote"],"content":"テンプレートエンジンのMarko v3リリース。\nHTML-JS syntaxというJavaScriptのように書けるテンプレート表現のサポート、コンパイル時最適化の対応など","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 50 Beta: Push notification improvements and declarative preload","url":"http://blog.chromium.org/2016/03/chrome-50-beta-push-notification.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 50 Betaリリース。\n`<link rel='preload'>`、`HTMLCanvasElement.toBlob()`のサポート、iframeのsandbox属性値がサポートされているかを判定出来るように、`Document.defaultCharset`を削除など","relatedLinks":[{"title":"DOMTokenList Validation Added in Chrome 50 | Web Updates - Google Developers","url":"https://developers.google.com/web/updates/2016/03/domtokenlist-validation-added-in-chrome-50?hl=en"},{"title":"Preload: What Is It Good For? – Smashing Magazine","url":"https://www.smashingmagazine.com/2016/02/preload-what-is-it-good-for/"}]},{"category":"Headline","title":"protractor/CHANGELOG.md at 3.2.0 · angular/protractor","url":"https://github.com/angular/protractor/blob/3.2.0/CHANGELOG.md","tags":["E2E","testing","library","ReleaseNote"],"content":"Protractor 3.2.0リリース。\nTypeScriptサポートのための変更追加、任意のバージョンのWebDriverを指定できるようになるなど","relatedLinks":[{"title":"Typescript support · Issue #1203 · angular/protractor","url":"https://github.com/angular/protractor/issues/1203#issuecomment-168777170"}]},{"category":"Headline","title":"Google Cloud Platform Blog: Node.js on Google App Engine goes beta","url":"https://cloudplatform.googleblog.com/2016/03/Node.js-on-Google-App-Engine-goes-beta.html","tags":["node.js","google"],"content":"GAEでNode.jsがβサポートされた","relatedLinks":[]},{"category":"Article","title":"Developer Edition 47 – User agent emulation, popup debugging and more ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2016/03/developer-edition-47-user-agent-emulation-popup-debugging-and-more/","tags":["firefox","JavaScript","debug"],"content":"Firefox 47の開発者ツールの新しい機能について。\nどういう流れでオブジェクトが保持されているのかを可視化、コンソールへ複数行入力出来るように、Storage InspectorでCache APIをサポートなど","relatedLinks":[]},{"category":"Article","title":"Debugging with Node","url":"http://krasimirtsonev.com/blog/article/debugging-with-node","tags":["node.js","debug","tutorial"],"content":"Node.jsに元々入っている`node debug`コマンドの使い方について","relatedLinks":[]},{"category":"Article","title":"reBEM: React ♥ BEM — Medium","url":"https://medium.com/@mistadikay/rebem-react-bem-20d875157017","tags":["React","library","CSS"],"content":"ReactとBEMの組み合わせについて。\nreBEM layersという考え方について","relatedLinks":[]},{"category":"Article","title":"An Introduction to jQuery&#x27;s Deferred Objects","url":"http://www.sitepoint.com/introduction-jquery-deferred-objects/","tags":["jQuery"],"content":"jQuery Deferredの歴史や使い方について\n1.x、2.x、3.xそれぞれでの違いについて書かれている","relatedLinks":[]},{"category":"Article","title":"Animating with React, Redux, and d3 | A geek with a hat","url":"http://swizec.com/blog/animating-with-react-redux-and-d3/swizec/6775","tags":["React","redux","d3.js","SVG"],"content":"ReactとD3.jsを組み合わせてアニメーションするComponentを作る話。\nContainer ComponentにStateが出てくるためReduxで管理している。\nパーティクルを表示するなかでどこにボトルネックがあるかについて","relatedLinks":[]},{"category":"Article","title":"Reactを使ったプロダクトのパフォーマンスを改善した話 | GMOメディア エンジニアブログ","url":"http://tech.gmo-media.jp/post/141458071484/react-perf-tuning","tags":["React","performance","debug"],"content":"React Componentで作成したアプリにのボトルネックの調査方法や改善手法について。\nreact-addons-perfを使ってプロファイルを見ながらやっていく話","relatedLinks":[]},{"category":"Article","title":"Redux Middleware in Depth - Qiita","url":"http://qiita.com/kuy/items/c6784fe443f1d5c7bbdc","tags":["redux"],"content":"Reduxのmiddlewareについて。\nmiddlewareの適応順や実行順により起きる問題や解決方法について詳しく書かれている。","relatedLinks":[]},{"category":"Article","title":"Why I Write Plain JavaScript Modules","url":"https://ponyfoo.com/articles/why-i-write-plain-javascript-modules","tags":["DOM","library"],"content":"なぜDOMのライブラリをReact/AngularJSなど特定のフレームワーク向けではなく、PureなDOMライブラリとして書くのかについて","relatedLinks":[]},{"category":"Article","title":"The State of Browser APIs - 1","url":"http://hwclass.in/2016/03/09/the-next-generation-of-browser-apis/","tags":["JavaScript","WebPlatformAPI"],"content":"現在ブラウザで使える色々な新しいAPIについての紹介","relatedLinks":[{"title":"AurelioDeRosa/HTML5-API-demos: A repository where you can find information about many JavaScript and HTML5 APIs.","url":"https://github.com/AurelioDeRosa/HTML5-API-demos"}]},{"category":"Article","title":"JavaScriptのPromiseオブジェクトについて調べた事 | QUARTETCOM TECH BLOG","url":"http://tech.quartetcom.co.jp/2016/03/22/javascript-promise/","tags":["Promises","JavaScript"],"content":"Promiseについて簡潔にまとまった内容。\nAngularJSの`$q`についても扱われてる","relatedLinks":[]},{"category":"WebsiteDocument","title":"Node.js ES2015/ES6 support","url":"http://node.green/","tags":["node.js","まとめ"],"content":"Node.js版 ECMAScript compat-table","relatedLinks":[]},{"category":"WebsiteDocument","title":"Your first Progressive Web App","url":"https://codelabs.developers.google.com/codelabs/your-first-pwapp/","tags":["ProgressiveWebApp","tutorial"],"content":"Progressive Web Appについて学ぶワークショップ資料","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gravmatt/force-js: The easy way to scroll and animate your page","url":"https://github.com/gravmatt/force-js","tags":["JavaScript","animation","library"],"content":"要素をアニメーションする依存のないライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"danigb/tonal: Music tonal elements —pitches, chords, scales, keys— in Javascript","url":"https://github.com/danigb/tonal","tags":["web ","audio","library"],"content":"Web MIDI、Web Audio APIを扱う小さなライブラリを集めたmono repo。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"GoogleChrome/proxy-polyfill: Proxy object polyfill","url":"https://github.com/GoogleChrome/proxy-polyfill","tags":["JavaScript","ECMAScript","library"],"content":"ES6 Proxyのpolyfillライブラリ。\nget/set/apply/constructなど一部のtrapのみをサポートしている","relatedLinks":[]}]},{"meta":{"title":"2016-03-29のJS: Safari 9.1、Backbone.jsの近況、Web Performance API","author":"azu","layout":"post","date":"2016-03-29T00:46:00.000Z","category":"JSer","tags":["Safari","perf","backbone.js"],"url":"https://jser.info/2016/03/29/safari-91backbonejsweb-performance-api/"},"items":[{"category":"Headline","title":"Backbone.js","url":"http://backbonejs.org/","tags":["backbone.js","ReleaseNote"],"content":"Backbone. 1.3.2リリース。\n`findIndex`、`findLastIndex`の追加、`component.json`のサポートを終了","relatedLinks":[{"title":"Remove component.json support? · Issue #2601 · marionettejs/backbone.marionette","url":"https://github.com/marionettejs/backbone.marionette/issues/2601"}]},{"category":"Headline","title":"Release v1.0.0 · mozilla/sweet.js","url":"https://github.com/mozilla/sweet.js/releases/tag/v1.0.0","tags":["JavaScript","Tools"],"content":"JavaScriptにhygienic macrosを導入するsweet.js 1.0.0リリース。","relatedLinks":[{"title":"Redesign by disnet · Pull Request #485 · mozilla/sweet.js","url":"https://github.com/mozilla/sweet.js/pull/485"}]},{"category":"Headline","title":"ESLint v2.5.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/03/eslint-v2.5.0-released","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint 2.5.0リリース。\n依存してるライブラリもESLintのパッケージに含めて配布できる`bundledDependencies`を利用するように、ルールの追加/修正など。","relatedLinks":[{"title":"ESLint v2.5.0 - Qiita","url":"http://qiita.com/mysticatea/items/7018ca26abfa7701debc"}]},{"category":"Article","title":"Safari 9.1","url":"https://developer.apple.com/library/mac/releasenotes/General/WhatsNewInSafari/Articles/Safari_9_1.html","tags":["safari","ReleaseNote"],"content":"Safari 9.1の変更点について。\n`<picture>`要素のサポート、Web Inspectorの改善、Fast Tap、Canvasが`imageSmoothingQuality`プロパティ、CSS Custom Propertiesのサポートなど","relatedLinks":[]},{"category":"Article","title":"CSS Variables in WebKit | WebKit","url":"https://webkit.org/blog/5989/css-variables-in-webkit/","tags":["CSS"],"content":"Safari 9.1でサポートされたCSS Custom Propertiesについての解説\n`--name`で変数を定義し、CSS内から`var(--name)`で参照できる。\nJavaScriptからも`getPropertyValue/setProperty`で読み書きができる","relatedLinks":[]},{"category":"Article","title":"Safari on iOS 9.3, Responsive Images, iPhone SE, shrink-to-fit and other new APIs | Breaking the Mobile Web","url":"http://www.mobilexweb.com/blog/safari-on-ios-9-3-picture-shrink-fit-iphone-se","tags":["ios","safari","ReleaseNote"],"content":"iOS 9.3のSafariについて。\n`<picture>`、Fast Tap、CSS Custom Properties、ダイアログの変更、`shrink-to-fit`、Remote Inspectorなど","relatedLinks":[]},{"category":"Article","title":"JSDocをランタイムassertに変換するBabelプラグインを書いた | Web Scratch","url":"http://efcl.info/2016/03/25/jsdoc-to-assert/","tags":["JavaScript","testing","Tools","babel"],"content":"JSDocをassertに変換するBabelプラグインについて。\nJSDocの型をランタイムassertにすることで、定義されてる型と実際の値が一致しているかを検証できる","relatedLinks":[]},{"category":"Article","title":"Shadow DOM CSS Cheat Sheet","url":"http://robdodson.me/shadow-dom-css-cheat-sheet/","tags":["CSS"],"content":"Shadown DOMのCSS(`:host`など)、CSS Custom Properties(`--var`)についてのチートシート","relatedLinks":[]},{"category":"Article","title":"Status of Static Typing in ECMAScript | ECMAScript Daily","url":"https://ecmascript-daily.github.io/pages/status-of-static-typing-in-ecmascript/","tags":["ECMAScript","proposal","まとめ"],"content":"ECMAScriptにおける静的型関連Proposalのステータスまとめ。","relatedLinks":[]},{"category":"Article","title":"Gordux.js - The redux pattern in vanilla.js","url":"https://k94n.com/gordux-js-the-redux-pattern-in-vanilla-js","tags":["JavaScript","redux"],"content":"Reduxのようなデータフローを素のJavaScriptで実装してみるという話。\nEventにはCustom Eventを使ってPub/Subを行っている","relatedLinks":[]},{"category":"Article","title":"The Sad State of the Backbone Ecosystem","url":"http://benmccormick.org/2016/03/07/the-sad-state-of-the-backbone-ecosystem/","tags":["backbone.js"],"content":"Backbone.jsのエコシステムのアクティビティについて。\nBackbone.js本体やMarionette、関連するライブラリの状況についてまとめてる","relatedLinks":[]},{"category":"Article","title":"GitHub - benoitvallon/computer-science-in-javascript: Computer science reimplemented in JavaScript","url":"https://github.com/benoitvallon/computer-science-in-javascript","tags":["JavaScript","algorithm"],"content":"JavaScriptでデータ構造やソートアルゴリズムの実装例","relatedLinks":[{"title":"Data Structures in JavaScript posts - Ben","url":"http://blog.benoitvallon.com/category/data-structures-in-javascript/"}]},{"category":"Article","title":"Sinon Tutorial: JavaScript Testing with Mocks, Spies &amp; Stubs","url":"http://www.sitepoint.com/sinon-tutorial-javascript-testing-mocks-spies-stubs/","tags":["JavaScript","testing","library"],"content":"Sinon.jsを使ったテストについて。\nSinon.jsのmock, stub, spyについて","relatedLinks":[]},{"category":"Article","title":"Promise-based functions should not throw exceptions","url":"http://www.2ality.com/2016/03/promise-rejections-vs-exceptions.html","tags":["JavaScript","ECMAScript","Promises"],"content":"Promiseをベースとしてるasync/awaitを見据えながら、Promiseを返す関数は例外を投げないで`reject`したPromiseオブジェクトを返すべきという話","relatedLinks":[{"title":"JavaScript Promiseの本","url":"http://azu.github.io/promises-book/#not-throw-use-reject"}]},{"category":"SlideVideo","title":"ng-japan 2016 セッション資料まとめ - Qiita","url":"http://qiita.com/nyamogera/items/b83833d1e15a55d0bb66","tags":["AngularJS","イベント"],"content":"ng-japan 2016の動画とスライドまとめ","relatedLinks":[{"title":"ng-japan - The Angular conference in Tokyo, Japan (2016/3/21)","url":"http://ngjapan.org/"}]},{"category":"SlideVideo","title":"The Case for CSS Modules","url":"http://markdalgleish.github.io/presentation-the-case-for-css-modules/","tags":["CSS","スライド"],"content":"CSS Modulesについてのスライド","relatedLinks":[{"title":"css-modules/css-modules: Documentation about css-modules","url":"https://github.com/css-modules/css-modules"}]},{"category":"SlideVideo","title":"Fluent Conf 2016: Jeremy Fairbank - The rise of async JavaScript - YouTube","url":"https://www.youtube.com/watch?v=QtgR94Q2pt4","tags":["JavaScript","動画 "],"content":"async/awaitがどのように動くのかをPromiseをベースとして解説してる。\nエラーハンドリングの動作やasync functionがどのように動くのかを見ていく話","relatedLinks":[{"title":"Fluent Conf: Rise of Async JavaScript // Speaker Deck","url":"https://speakerdeck.com/jfairbank/fluent-conf-rise-of-async-javascript"}]},{"category":"WebsiteDocument","title":"A Primer for Web Performance Timing APIs","url":"https://w3c.github.io/perf-timing-primer/","tags":["web ","performance","document"],"content":"Web Performance Timing APIの概要をまとめたドキュメント","relatedLinks":[{"title":"ブラウザのPerformance APIの話","url":"http://www.slideshare.net/kawada_hiroshi/performance-api"}]},{"category":"WebsiteDocument","title":"WebpackBin","url":"http://www.webpackbin.com/","tags":["JavaScript","webpack","webservice"],"content":"http://requirebin.com/ のwebpack版。\nHTML/CSS/JavaScriptを書いて公開出来るサービス","relatedLinks":[]},{"category":"SoftwareLibrary","title":"GitHub - ozkxr/match: An JavaScript library to test JSON with some nice features.","url":"https://github.com/ozkxr/match","tags":["JavaScript","library","JSON"],"content":"JSONなどのオブジェクトに対してpredicate関数の結果を使ったmatchライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tusharmath/funjector: Dependency injection for functional paradigm","url":"https://github.com/tusharmath/funjector","tags":["JavaScript","library","testing"],"content":"関数に対するDIライブラリ。\n部分適応した関数を作り、それに対してinjectできる仕組みを提供する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pmdartus/snapline: Unleash your screenshots stored in Chrome Devtool timeline files","url":"https://github.com/pmdartus/snapline","tags":["Chrome","debug","画像"],"content":"Chrome開発者ツールのタイムラインをGIFアニメーション画像に変換出来るツール","relatedLinks":[]},{"category":"Book","title":"Majesty Of… by Alex Kyriakidis et al. [Leanpub PDF/iPad/Kindle]","url":"https://leanpub.com/vuejs/","tags":["JavaScript","book"],"content":"Vue.jsについての書籍","relatedLinks":[{"title":"hootlex/the-majesty-of-vuejs: educational","url":"https://github.com/hootlex/the-majesty-of-vuejs"}]}]},{"meta":{"title":"2016-04-04のJS: Node.js 5.10.0、npm security fix、Safari Technology Preview","author":"azu","layout":"post","date":"2016-04-04T10:46:00.000Z","category":"JSer","tags":["Node.js","npm","security","safari"],"url":"https://jser.info/2016/04/04/nodejs-5100npm-security-fixsafari-technology-preview/"},"items":[{"category":"Headline","title":"Node v5.10.0 (Stable) | Node.js","url":"https://nodejs.org/en/blog/release/v5.10.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 5.10.0リリース。\nnpmのセキュリティアップデートしたバージョンが含まれている。\nまた、`Buffer(size)`のallocation問題に対して`Buffer.alloc`/`Buffer.allocUnsafe`/`Buffer.from`と`--zero-fill-buffers`コマンドライン引数の追加など","relatedLinks":[{"title":"The npm Blog — fixing a bearer token vulnerability","url":"http://blog.npmjs.org/post/142036323955/fixing-a-bearer-token-vulnerability"},{"title":"Node.js Buffer API Changes | Linux.com","url":"https://www.linux.com/news/software/applications/893109-nodejs-buffer-api-changes"}]},{"category":"Headline","title":"Introducing Safari Technology Preview | WebKit","url":"https://webkit.org/blog/6017/introducing-safari-technology-preview/","tags":["safari","browser","debug"],"content":"Safariの開発者プレビュー版が公開された","relatedLinks":[]},{"category":"Headline","title":"Pixi.JS v4 Arrives - Goodboy™ — Goodboy™","url":"http://www.goodboydigital.com/pixi-js-v4/","tags":["game","WebGL","ReleaseNote","JavaScript"],"content":"PixiJS v4 RCリリース。\npixi-gl-coreというWebGL部分のコア実装を分離、RenderTextureのGCを任意のタイミングで走らせることが出来るように","relatedLinks":[{"title":"pixijs/pixi-gl-core: A set of tidy little pixi objects that make working with webGL simpler (WIP, will be moved to pixi group when ready)","url":"https://github.com/pixijs/pixi-gl-core"}]},{"category":"Article","title":"The npm Blog — fixing a bearer token vulnerability","url":"http://blog.npmjs.org/post/142036323955/fixing-a-bearer-token-vulnerability","tags":["npm","security","ReleaseNote"],"content":"npmにMITMできる脆弱性があったため2.xと3.xそれぞれセキュリティアップデートされている。\n`npm i -g`または`npm-windows-upgrade`を使うことで`npm`自体をアップデートできる","relatedLinks":[{"title":"felixrieseberg/npm-windows-upgrade: Upgrade npm on Windows","url":"https://github.com/felixrieseberg/npm-windows-upgrade"}]},{"category":"Article","title":"Webpack 2 Tree Shaking Configuration — Modus Create: Front End Development — Medium","url":"https://medium.com/modus-create-front-end-development/webpack-2-tree-shaking-configuration-9f1de90f3233","tags":["webpack"],"content":"webpack 1から2へのマイグレーションについて","relatedLinks":[]},{"category":"Article","title":"React vs Angular2: The fight rages on – Evojam Technology Blog","url":"http://tech.evojam.com/2016/03/31/react-vs-angular2-the-fight-rages-on/","tags":["React","AngularJS"],"content":"ReactとAngularJS 2の比較","relatedLinks":[]},{"category":"Article","title":"Houdini: Maybe The Most Exciting Development In CSS You&#x27;ve Never Heard Of – Smashing Magazine","url":"https://www.smashingmagazine.com/2016/03/houdini-maybe-the-most-exciting-development-in-css-youve-never-heard-of/","tags":["CSS"],"content":"W3C task forceのHoudiniは何を解決するのが目的でどういうものなのかについての解説。","relatedLinks":[]},{"category":"Article","title":"The JavaScript Event Loop: Explained","url":"http://blog.carbonfive.com/2013/10/27/the-javascript-event-loop-explained/","tags":["JavaScript"],"content":"JavaScriptのイベントループについての解説、図解。\nDOM EventやWebWorkerについて","relatedLinks":[]},{"category":"SlideVideo","title":"What&#x27;s New in TypeScript? | Build 2016 | Channel 9","url":"https://channel9.msdn.com/Events/Build/2016/B881","tags":["TypeScript","動画 "],"content":"近年のTypeScriptのリリースについて。\nまたnon-nullable typeやnpmとd.tsについてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Let&#x27;s Learn ES6 - YouTube","url":"https://www.youtube.com/playlist?list=PL57atfCFqj2h5fpdZD-doGEIs0NZxeJTX","tags":["ECMAScript","JavaScript","動画 "],"content":"ES6について学ぶスクリーンキャストの連載","relatedLinks":[]},{"category":"SoftwareLibrary","title":"buzinas/tslint-eslint-rules: Improve your TSLint with the missing ESLint rules","url":"https://github.com/buzinas/tslint-eslint-rules","tags":["TypeScript","JavaScript","Tools"],"content":"TSLint向けのESLintルール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"aadsm/jschardet: Character encoding auto-detection in JavaScript (port of python&#x27;s chardet)","url":"https://github.com/aadsm/jschardet","tags":["JavaScript","文字コード"],"content":"JavaScriptで文字コード判定をするライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rbuckton/prex: Async coordination primitives and extensions on top of ES6 Promises","url":"https://github.com/rbuckton/prex","tags":["JavaScript","Promises","library"],"content":"Promise周りの補助ライブラリ。\nCancellation、Semaphore、SchedulingのAPIを提供してる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"LiquidLabsGmbH/retractor: Expose react internals for E2E testing","url":"https://github.com/LiquidLabsGmbH/retractor","tags":["webdriver","React"],"content":"selenium-webderiverにReact Elementoを受け取れる`findElement`を拡張するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bfred-it/object-fit-images: Adds support to object-fit to images on IE9, IE10, IE11, Edge and other old browsers.","url":"https://github.com/bfred-it/object-fit-images","tags":["JavaScript","CSS","library"],"content":"`object-fit`をIEでも動かすJavaScriptライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"thejameskyle/the-super-tiny-compiler: Possibly the smallest compiler ever","url":"https://github.com/thejameskyle/the-super-tiny-compiler","tags":["JavaScript","tutorial"],"content":"JavaScriptで書かれた小さなCompiler/Transpilerの実装。\nコメントがしっかり付けられているのでコンパイルの作りについての学習する向け","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gajus/create-index: Creates ES6 ./index.js file in target directories that imports and exports all sibling files and directories.","url":"https://github.com/gajus/create-index","tags":["node.js","library","Tools"],"content":"ディレクトリを指定すると、そこにあるモジュールを`import`した`index.js`を作成してくれるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Babel Starter Kit ∙ A project template for authoring and publishing JavaScript libraries","url":"https://www.kriasoft.com/babel-starter-kit/","tags":["babel","JavaScript","tutorial"],"content":"Babelを使ったStarter Kit","relatedLinks":[]},{"category":"Book","title":"ECSS: Home Page","url":"http://ecss.io/","tags":["CSS","book"],"content":"ECSS(Enduring CSS)についての書籍\nCSSの設計、考え方について扱ってる","relatedLinks":[{"title":"Enduring CSS: writing style sheets for rapidly changing, long-lived projects – Ben Frain","url":"https://benfrain.com/enduring-css-writing-style-sheets-rapidly-changing-long-lived-projects/"}]}]},{"meta":{"title":"2016-04-11のJS: Grunt 1.0.0、React 15.0、ツールで学ぶJavaScript","author":"azu","layout":"post","date":"2016-04-11T11:00:00.000Z","category":"JSer","tags":["Grunt","React","Tutorial"],"url":"https://jser.info/2016/04/11/grunt-100react-150javascript/"},"items":[{"category":"Headline","title":"Grunt 1.0.0 released - Grunt: The JavaScript Task Runner","url":"http://gruntjs.com/blog/2016-04-04-grunt-1.0.0-released","tags":["Grunt","ReleaseNote"],"content":"Grunt 1.0.0リリース。\nGruntプラグインの`peerDependencies`には`\"grunt\": \">=0.4.0\"`を入れることを推奨してる。","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0 - Rosebud · SBoudrias/Inquirer.js","url":"https://github.com/SBoudrias/Inquirer.js/releases/tag/v1.0.0","tags":["node.js","console","library"],"content":"ターミナルで選択肢などインタラクティブな動作を行うInquirer.js 1.0.0リリース。\nPromiseベースのAPIへ変更","relatedLinks":[]},{"category":"Headline","title":"normalize.css/CHANGELOG.md at 4.0.0 · necolas/normalize.css","url":"https://github.com/necolas/normalize.css/blob/4.0.0/CHANGELOG.md","tags":["CSS","ReleaseNote","library"],"content":"normalize.css 4.0.0リリース。","relatedLinks":[{"title":"Normalize.scss v4 - Weblog - Hail2u.net","url":"https://hail2u.net/blog/webdesign/modularized-normalize-scss-v4.0.0.html"}]},{"category":"Headline","title":"AWS Lambda Supports Node.js 4.3","url":"https://aws.amazon.com/about-aws/whats-new/2016/04/aws-lambda-supports-node-js-4-3/","tags":["aws","node.js","ReleaseNote"],"content":"AWS LambdaでNode.js 4.3をサポート","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at 8.3.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/8.3.0/Changelog.md","tags":["DOM","JavaScript","ReleaseNote"],"content":"jsdom 8.3.0リリース。\nNode Canvasを使った外部リソースを使った`img`の処理を追加(optional)。\n`img.naturalWidth`などの実データに基づく値を取れるようになっています。\n\nまた、Page Visibility APIの基本的な実装を追加するなど","relatedLinks":[]},{"category":"Headline","title":"React v15.0 | React","url":"https://facebook.github.io/react/blog/2016/04/07/react-v15.html","tags":["React","ReleaseNote"],"content":"React v15.0リリース。\nIE8のサポート終了、semverに準拠してアップデートするように変更。\n0.14で非推奨なメッセージがでてなければ、そのままアップデートして動作する。","relatedLinks":[]},{"category":"Article","title":"Tools to Learn JavaScript By Doing -Telerik Developer Network","url":"http://developer.telerik.com/featured/tools-learn-javascript/","tags":["JavaScript","Tools","tutorial"],"content":"js-assessment、NodeSchool、Advent of CodeなどJavaScriptを学べるインタラクティブ性のあるツールについて","relatedLinks":[]},{"category":"Article","title":"Introducing the Microsoft Edge Platform Issue Tracker | Microsoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2016/04/06/edgehtml-issue-tracker/","tags":["MS","issue"],"content":"MS EdgeのIssue Trackerがアップデートされた。","relatedLinks":[{"title":"azu/browser-javascript-resource: Browser JavaScript Resource.","url":"https://github.com/azu/browser-javascript-resource"}]},{"category":"Article","title":"WebdriverIOで始めるE2EテストとPageObject - Qiita","url":"http://qiita.com/derui@github/items/9ee72c7533c9a57aa8d2","tags":["JavaScript","testing","E2E"],"content":"WebdriverIOを使ったE2EテストをPageObjectパターンで実装する話","relatedLinks":[]},{"category":"Article","title":"Reactコンポーネントをnpmパッケージとして開発する - Hatena Developer Blog","url":"http://developer.hatenastaff.com/entry/2016/04/09/180000","tags":["React","npm","library","JavaScript"],"content":"Reactコンポーネントをnpmでライブラリとして公開する方法とメリット/デメリットについて。","relatedLinks":[]},{"category":"Article","title":"Streaming template literals - JakeArchibald.com","url":"https://jakearchibald.com/2016/streaming-template-literals/","tags":["ECMAScript","JavaScript"],"content":"Template LiteralとWHATWG Streamをあわせる方法について","relatedLinks":[]},{"category":"Article","title":"Angular 2 — Unit Testing recipes — Google Developer Experts — Medium","url":"https://medium.com/google-developer-experts/angular-2-unit-testing-with-jasmine-defe20421584","tags":["AngularJS","testing"],"content":"AnguarJS2でのテストパターン","relatedLinks":[]},{"category":"SlideVideo","title":"Introduction to flux-util // Speaker Deck","url":"https://speakerdeck.com/joere/introduction-to-flux-util","tags":["Flux","library"],"content":"Facebookのflux utilについてのスライド。\nflux utilの機能や担当する役割について","relatedLinks":[]},{"category":"WebsiteDocument","title":"React.run - Beta","url":"http://www.react.run/","tags":["React","webservice"],"content":"React Componentのコードを実行/共有できるJSFiddle的なサービス","relatedLinks":[]},{"category":"WebsiteDocument","title":"Microsoft Edge Developer Resources","url":"https://dev.windows.com/en-us/microsoft-edge/platform/data/","tags":["MSEdge","webservice","統計"],"content":"MSEdgeのウェブサイトでのCSSプロパティの使用率やブラウザのAPIサポート率などのデータ。","relatedLinks":[{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features"}]},{"category":"SoftwareLibrary","title":"jdonaghue/es-search: Search ECMAScript structurally","url":"https://github.com/jdonaghue/es-search","tags":["AST","検索","JavaScript"],"content":"ASTベースでJavaScriptのコードから構造に一致する部分を検索するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"redfin/react-server: React server monorepo","url":"https://github.com/redfin/react-server","tags":["React","サーバー"],"content":"Reactを使ったexpress middlewareなどのサーバ関連の実装","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mohayonao/web-audio-engine: Pure JS implementation of the Web Audio API","url":"https://github.com/mohayonao/web-audio-engine","tags":["web ","audio","library"],"content":"Web Audio APIのPure JavaScript実装。\nPCM audioをNode Streamに吐くことができる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kenwheeler/cash: An absurdly small jQuery alternative for modern browsers","url":"https://github.com/kenwheeler/cash","tags":["jQuery","library"],"content":"jQuery Alternativeなライブラリ。\njQueryのDOM周りのメソッドを集めた感じ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"brigand/babel-plugin-flow-react-proptypes: A babel plugin to generate React PropTypes definitions from Flow type declarations.","url":"https://github.com/brigand/babel-plugin-flow-react-proptypes","tags":["flowtype","babel","plugin","React"],"content":"FlowTypeでReactのpropTypesを書くと、JavaScriptのpropTypesに変換してくれるBabelプラグイン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"c58/marsdb: MarsDB is a Promise based lightweight database with MongoDB query syntax, written on ES6","url":"https://github.com/c58/marsdb","tags":["JavaScript","Promises","library"],"content":"minimongoのようなクライアントサイド向けのデータベースライブラリ。\nAdpterでバックエンドとなる保存方法を変更できるため、BrowserやElectron、Node.jsなどで動作する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"PlasmaPower/assert-request: Assert responses to HTTP requests in Node.JS","url":"https://github.com/PlasmaPower/assert-request","tags":["node.js","testing"],"content":"Node.jsでrequestに対してresponseのassertを行うライブラリ","relatedLinks":[]},{"category":"Book","title":"Amazon.com: Isomorphic Application Development with JavaScrip eBook: Konstantin Tarkus: Kindle Store","url":"http://www.amazon.com/Isomorphic-Application-Development-JavaScrip-Konstantin-ebook/dp/B01DWFRFVG","tags":["JavaScript","book"],"content":"2017年2月4日発売\nIsomorphic JavaScriptについての書籍","relatedLinks":[]}]},{"meta":{"title":"2016-04-18のJS: JSCS 3.0とESLintへのマージ、SVG アイコン","author":"azu","layout":"post","date":"2016-04-18T10:42:00.000Z","category":"JSer","tags":["JSCS","ESLint","SVG","CSS"],"url":"https://jser.info/2016/04/18/jscs-30eslintsvg/"},"items":[{"category":"Headline","title":"Release Notes for Safari Technology Preview 2 | WebKit","url":"https://webkit.org/blog/6098/release-notes-for-safari-technology-preview-release-2/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 2リリース。\n`String#padStart`/`String#padEnd`/の追加、`for (var i = 20 in b){ }`がエラーとなるように。\nCSS media queryで`color-gamut`の対応、TP1で間違って公開されてたFetch APIをデフォルトでは無効に、Web Inspectorの改善など","relatedLinks":[]},{"category":"Headline","title":"ESLint v2.8.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/04/eslint-v2.8.0-released","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint v2.8.0リリース。","relatedLinks":[{"title":"ESLint v2.8.0 - Qiita","url":"http://qiita.com/mysticatea/items/8e7ca6f6ae402a494a6b"}]},{"category":"Headline","title":"Release 3.0.0 · jscs-dev/node-jscs","url":"https://github.com/jscs-dev/node-jscs/releases/tag/v3.0.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"JSCS 3.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Jest 11.0 · Jest","url":"http://facebook.github.io/jest/blog/2016/04/12/jest-11.html","tags":["testing","library","ReleaseNote"],"content":"Jest 11.0リリース。\n0.10から11.0へのメジャーアップデート","relatedLinks":[]},{"category":"Headline","title":"Release v0.23.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.23.0","tags":["flowtype","ReleaseNote"],"content":"Flow v0.23.0リリース。\n`flow init`で`.flowconfig`を作る時のオプション追加やコメントを書けるようになるなど","relatedLinks":[]},{"category":"Article","title":"Welcoming JSCS To ESLint - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/04/welcoming-jscs-to-eslint","tags":["JavaScript","Tools","ESLint"],"content":"JSCS 3.0.0で新規開発は終了し、3ヶ月を目処にサポートも終了する。\nJSCSチームはESLintに入り、ESLintのAutofixを動かすためにも必要なCSTの開発を行う。\nESLint側はJSCSからの移行/互換のサポートを予定している。","relatedLinks":[{"title":"Welcoming JSCS To ESLint - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/04/welcoming-jscs-to-eslint"},{"title":"JSCS, CST и новое начало / Хабрахабр","url":"https://habrahabr.ru/post/281635/"}]},{"category":"Article","title":"How to work with SVG icons","url":"http://fvsch.com/code/svg-icons/how-to/","tags":["SVG","画像"],"content":"SVGアイコンについての実践的な解説。\nCSSスプライトのようにSVGスプライトを使う方法、インラインSVGと外部SVGを読み込み違いや対応ブラウザ/polyfillについてなど。\nまたCSSからSVGのスタイルを変更する方法やSafariの問題などかなり詳細にまとまっている","relatedLinks":[]},{"category":"Article","title":"CSS @apply rule (native CSS mixins)","url":"https://blog.gospodarets.com/css_apply_rule","tags":["CSS"],"content":"CSSの`@aaply` Proposalについての解説","relatedLinks":[]},{"category":"Article","title":"power-assert + babel as a development tool | Web Scratch","url":"http://efcl.info/2016/04/14/espower-babel-is-deprecated/","tags":["JavaScript","testing","Tools"],"content":"power-assert+babel+mochaの構成について。\nデバッグビルド時は情報量の多いassert、プロダクションビルド時はassertを取り除き、JSDocからランタイムassertをしてチェックする話","relatedLinks":[]},{"category":"Article","title":"christianalfoni - RxJs the smartest dumbest tool ever","url":"http://www.christianalfoni.com/articles/2016_03_31_RxJs-the-smartest-dumbest-tool-ever","tags":["Rx","tutorial"],"content":"RxJSはどのような問題を解決するのかという話","relatedLinks":[]},{"category":"Article","title":"Scalable Single-Page Application Architecture – Minko Gechev&#x27;s blog","url":"http://blog.mgechev.com/2016/04/10/scalable-javascript-single-page-app-angular2-application-architecture/","tags":["AngularJS","JavaScript","設計"],"content":"AngularJS2 + RxJSでCQRS+EventSourcing的なアプローチ。 DIでの依存解決、レイヤー間の隔離やasync serviceの動きが面白い。","relatedLinks":[]},{"category":"Article","title":"Immutability is not enough","url":"https://codewords.recurse.com/issues/six/immutability-is-not-enough","tags":["JavaScript","設計"],"content":"Immutable.jsを使ったStateの更新について。\n単純にStateをimmutableにして、単純に関数を逐次的に適応すると、前のStateを参照しない問題が起こりえる。\nまた“lost update”の問題について","relatedLinks":[]},{"category":"Article","title":"react-storybookを用いたReactコンポーネント開発 - Hatena Developer Blog","url":"http://developer.hatenastaff.com/entry/2016/04/14/150000","tags":["React","Tools"],"content":"React Componentをストーリーにもとづき確認できるスタイルガイド的なreact-storybookについて","relatedLinks":[]},{"category":"Article","title":"Leveling Up with React: Redux | CSS-Tricks","url":"https://css-tricks.com/learning-react-redux/","tags":["redux","JavaScript","tutorial"],"content":"Reduxにおけるデータフローなどをわかりやすく解説したチュートリアル","relatedLinks":[]},{"category":"Article","title":"CoffeeScriptからES2015(ES6)へ移行しました - ペパボテックブログ","url":"http://tech.pepabo.com/2016/04/13/coffeescript-transpiled-es/","tags":["CoffeeScript","JavaScript"],"content":"CoffeeScriptをdecafを使って変換し、JavaScriptに移行する話。","relatedLinks":[]},{"category":"Article","title":"【意訳】Webpackの混乱ポイント - Qiita","url":"http://qiita.com/chuck0523/items/caacbf4137642cb175ec","tags":["webpack","翻訳"],"content":"\"Webpack — The Confusing Parts\"の翻訳。\nwebpackの設定において混乱しやすいことについてまとめられている。","relatedLinks":[]},{"category":"SlideVideo","title":"Let&#x27;s Learn ES6","url":"http://letslearnes6.com/","tags":["ECMAScript","JavaScript","動画 "],"content":"ES6について学ぶ動画シリーズのサイト","relatedLinks":[{"title":"Let","url":"https://www.youtube.com/playlist?list=PL57atfCFqj2h5fpdZD-doGEIs0NZxeJTX"}]},{"category":"WebsiteDocument","title":"Makeitopen.com - Open Source Learning","url":"http://makeitopen.com/","tags":["React"],"content":"React NativeでF8のアプリをどのように作っていったかの話","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Rich Harris / buble · GitLab","url":"https://gitlab.com/Rich-Harris/buble","tags":["babel","JavaScript"],"content":"BabelのようなES2015のコードをES5に変換するツール。\nBabelのような拡張性や仕様への準拠よりも、変換速度を重視した作りになっている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"thejameskyle/babel-react-optimize: A Babel preset and plugins for optimizing React code.","url":"https://github.com/thejameskyle/babel-react-optimize","tags":["React","babel","plugin"],"content":"React(JSX)の最適化をするBabelプラグイン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Our Justified Layout Goes Open Source | code.flickr.com","url":"http://code.flickr.net/2016/04/05/our-justified-layout-goes-open-source/","tags":["JavaScript","library","UI"],"content":"Flickerの画像をタイル的に敷き詰めるUIライブラリ","relatedLinks":[]}]},{"meta":{"title":"2016-04-26のJS: core-js 2.3.0、addEventListenerの第3引数、ウェブ関連仕様の翻訳","author":"azu","layout":"post","date":"2016-04-26T11:25:00.000Z","category":"JSer","tags":["ECMAScript","DOM","W3C","WHATWG","Spec","Translation"],"url":"https://jser.info/2016/04/26/core-js-230addeventlistener3/"},"items":[{"category":"Headline","title":"New Release: 2.9.2","url":"http://jshint.com/blog/2016-04-19/release-2-9-2/","tags":["JavaScript","Tools","ReleaseNote"],"content":"JSHint 2.9.2リリース","relatedLinks":[]},{"category":"Headline","title":"Release v3.5.0 · reactjs/redux","url":"https://github.com/reactjs/redux/releases/tag/v3.5.0","tags":["redux","ReleaseNote"],"content":"Redux 3.5.0リリース\nES.nextのStage 1 Proposalであるes obvervableに対応。\n`Symbol.observable`を実装を追加","relatedLinks":[]},{"category":"Headline","title":"Release 2.3.0 - 2016.04.24 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v2.3.0","tags":["JavaScript","library","ReleaseNote"],"content":"core-js 2.3.0リリース。\n`global.asap`、`Symbol.asyncIterator`、`Symbol.observable`の追加。\n`Map#toJSON`、`Set#toJSON`、`Error.isError`の削除など。TC39ミーティング内容の反映が中心","relatedLinks":[{"title":"tc39-notes/es7/2016-03 at master · rwaldron/tc39-notes","url":"https://github.com/rwaldron/tc39-notes/tree/master/es7/2016-03"}]},{"category":"Headline","title":"V8 JavaScript Engine: V8 Release 5.1","url":"http://v8project.blogspot.com/2016/04/v8-release-51.html","tags":["V8","ECMAScript","ReleaseNote"],"content":"V8 5.1リリース。\n`Symbol.species`、`Symbol.hasInstance`、 Function nameの仕様追従、パフォーマンス/メモリ使用量の改善など","relatedLinks":[]},{"category":"Headline","title":"Release Version 2.0.0 · chartjs/Chart.js","url":"https://github.com/chartjs/Chart.js/releases/tag/v2.0.0","tags":["canvas","グラフ","library"],"content":"Canvasを使ったグラフライブラリのChart.js 2.0.0リリース。","relatedLinks":[]},{"category":"Article","title":"DOM Listener: capture, passive, and once","url":"https://www.webreflection.co.uk/blog/2016/04/17/new-dom4-standards","tags":["WHATWG","DOM","JavaScript"],"content":"`node.addEventListener(type, handler, EventListenerOptions)` 第三引数に追加された`EventListenerOptions`について。\n`passive`と`capture`の解説","relatedLinks":[]},{"category":"Article","title":"How do I update to Gulp 4? - Liquid Light","url":"https://www.liquidlight.co.uk/blog/article/how-do-i-update-to-gulp-4/","tags":["gulp"],"content":"まだリリースはされてないが、gulp 4へのアップデートについて\nどのようにアップデートすればいいかが書かれている","relatedLinks":[]},{"category":"Article","title":"Stylelint | CSS-Tricks","url":"https://css-tricks.com/stylelint/","tags":["CSS","Tools"],"content":"CSSのLintツールであるStylelintについて。\nエディタとの連携、PostCSS、stylefmtについて","relatedLinks":[]},{"category":"Article","title":"emilbjorklund/svg-weirdness: A repository of bugs and plain weird behavior in SVG","url":"https://github.com/emilbjorklund/svg-weirdness","tags":["SVG","browser","issue"],"content":"SVGのバグを集めたリポジトリ","relatedLinks":[]},{"category":"Article","title":"中級者向け Service Worker Tutorial | blog.jxck.io","url":"https://blog.jxck.io/entries/2016-04-24/service-worker-tutorial.html","tags":["ServiceWorker","動画 "],"content":"ServiceWorkerを使って開発する際に出てくる問題や挙動について解説しているスクリーンキャスト","relatedLinks":[]},{"category":"SlideVideo","title":"EmberConf 2016 - YouTube","url":"https://www.youtube.com/playlist?list=PL4eq2DPpyBblc8aQAd516-jGMdAhEeUiW","tags":["JavaScript","イベント","動画 "],"content":"EmberConf 2016の動画まとめ","relatedLinks":[{"title":"EmberConf 2016 - March 29 ","url":"http://emberconf.com/"}]},{"category":"SlideVideo","title":"Dev.Opera — Front-End Performance: The Dark Side","url":"https://dev.opera.com/blog/timing-attacks/","tags":["performance","動画 "],"content":"フロントエンドのパフォーマンスについての動画","relatedLinks":[]},{"category":"WebsiteDocument","title":"Flexbox Patterns","url":"http://www.flexboxpatterns.com/home","tags":["CSS"],"content":"Flexboxのパターン集","relatedLinks":[]},{"category":"WebsiteDocument","title":"ウェブ関連仕様 日本語訳","url":"https://triple-underscore.github.io/","tags":["web ","spec","翻訳"],"content":"WHATWGやW3Cなどの仕様書を翻訳しているサイト","relatedLinks":[]},{"category":"WebsiteDocument","title":"はじめてのプログレッシブ ウェブアプリ","url":"https://codelabs.developers.google.com/codelabs/your-first-pwapp-ja/","tags":["ProgressiveWebApp"],"content":"プログレッシブウェブアプリについて学ぶチュートリアル","relatedLinks":[]},{"category":"SoftwareLibrary","title":"evcohen/eslint-plugin-jsx-a11y: Static AST checker for a11y rules on JSX elements.","url":"https://github.com/evcohen/eslint-plugin-jsx-a11y","tags":["React","accessibility","ESLint"],"content":"JSX要素のアクセシビリティをチェックするESLintルール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"VictorBjelkholm/autochecker: Test your JavaScript modules simultaneously in 32 different versions of NodeJS","url":"https://github.com/VictorBjelkholm/autochecker","tags":["node.js","testing"],"content":"Node.jsの複数のバージョンでテストするツール。 matrix test","relatedLinks":[]},{"category":"SoftwareLibrary","title":"staltz/xstream: An extremely intuitive, small, and fast functional reactive stream library for JavaScript","url":"https://github.com/staltz/xstream","tags":["JavaScript","Rx","library"],"content":"Hot onlyなRxJSライクなStreamライブラリ。","relatedLinks":[{"title":"André Staltz - Why we built xstream","url":"http://staltz.com/why-we-built-xstream.html"}]},{"category":"SoftwareLibrary","title":"jonathanewerner/webpack-validator: Validates your webpack config with Joi","url":"https://github.com/jonathanewerner/webpack-validator","tags":["webpack","Tools"],"content":"webpackの設定ファイルのバリデーションツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"webpack/memory-fs: A simple in-memory filesystem. Holds data in a javascript object.","url":"https://github.com/webpack/memory-fs","tags":["node.js","library"],"content":"memory上で読み書きするfsモジュール","relatedLinks":[]}]},{"meta":{"title":"2016-05-03のJS: Node.js 6.0.0、GitHub Fetch 1.0.0、-webkit- prefixのポリシー","author":"azu","layout":"post","date":"2016-05-03T13:50:00.000Z","category":"JSer","tags":["Node.js","Fetch","WebKit","polyfill"],"url":"https://jser.info/2016/05/03/nodejs-600github-fetch-100-webkit-prefix/"},"items":[{"category":"Headline","title":"Node v6.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v6.0.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 6.0.0(LTS)リリース。\nv8のアップデートを含むため、Native addonは`npm rebuid`での再ビルドが必要。\nBuffer APIが新しくなり、古いAPIは非推奨へ、`worker.suicide`は`worker.exitedAfterDisconnect`に変更、`querystring.parse()`が返すオブジェクトは`Object.prototype`を継承しないようになるなど","relatedLinks":[{"title":"Node.js v6.0 (Current) がリリースされました。 - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2016/04/27/110027"}]},{"category":"Headline","title":"Chromium Blog: Chrome 51 Beta: Credential Management API and reducing the overhead of offscreen rendering","url":"http://blog.chromium.org/2016/04/chrome-51-beta-credential-management.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 51 Betaリリース。\nCredential Management APIのサポート。\noffscreenの場合、crosss originのframeにおいては`requestAnimationFrame()`が呼ばれないように、Intersection Observer 、`passive`イベントオプション、V8 5.1へのアップデートなど。","relatedLinks":[{"title":"V8 JavaScript Engine: V8 Release 5.1","url":"http://v8project.blogspot.jp/2016/04/v8-release-51.html"},{"title":"IntersectionObserver/explainer.md at gh-pages · WICG/IntersectionObserver","url":"https://github.com/WICG/IntersectionObserver/blob/gh-pages/explainer.md"},{"title":"Throttling Blink","url":"https://docs.google.com/document/d/1Dd4qi1b_iX-OCZpelvXxizjq6dDJ76XNtk37SZEoTYQ/pub"},{"title":"Power usage impact of render pipeline throttling - Google ドキュメント","url":"https://docs.google.com/document/d/1jMuvRYWptZfP5zpvWmPJPRL-iowtgBVX45rSvew0VH4/edit"}]},{"category":"Headline","title":"Release v6.8.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v6.8.0","tags":["babel","ReleaseNote"],"content":"Babel v6.8.0リリース。\nBabel自体がBabel 6でTranspileするようになり、runtimeが5に依存していた問題が修正された","relatedLinks":[]},{"category":"Headline","title":"Release Fetch 1.0.0 · github/fetch","url":"https://github.com/github/fetch/releases/tag/v1.0.0","tags":["JavaScript","htto","library"],"content":"Fetch APIのpolyfillであるGitHub Fetch 1.0.0リリース。\nIE9のサポートを終了、`timeout`イベントをハンドルするように、`URLSearchParams`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"ESLint v2.9.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/04/eslint-v2.9.0-released","tags":["JavaScript","Tools","ReleaseNote"],"content":"ESLint v2.9.0リリース。\nAutofix `--fix` オプションの改善。\n今までは一度のパスで適応できないものは諦めていたが、複数回のパスで修正を適応を試みるようになった。","relatedLinks":[{"title":"ESLint v2.9.0 - Qiita","url":"http://qiita.com/mysticatea/items/1d377b67465664009ad5"}]},{"category":"Headline","title":"Release SlimerJS 0.10.0 · laurentj/slimerjs","url":"https://github.com/laurentj/slimerjs/releases/tag/0.10.0","tags":["firefox","ReleaseNote"],"content":"Firefox版のPhantomJS APIの互換実装であるSlimerJS 0.10.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 3 | WebKit","url":"https://webkit.org/blog/6143/release-notes-for-safari-technology-preview-3/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 3リリース。\n`Symbol.isConcatSpreadable`などのwell-known Symbol実装の追加、\n`:host()`擬似クラス、IndexedDBが`Blob`をサポート、`Crypto`、CSP周りの仕様準拠度の向上など","relatedLinks":[]},{"category":"Article","title":"Scroll-linked effects - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Performance/Scroll-linked_effects","tags":["JavaScript","document"],"content":"`onscroll`にhookして同期的に位置を変更する処理に対しては警告メッセージが出るようになった。\nその場合の対処法についてのドキュメント","relatedLinks":[{"title":"スクロール連動位置合わせは非同期スクロールと相性が悪い場合があり、コンソールに警告が表示されます | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/docs/2016/scroll-linked-positioning-effects-may-not-work-well-with-async-scrolling-console-warns/"}]},{"category":"Article","title":"Announcing Vue.js 2.0 — The Vue Point — Medium","url":"https://medium.com/the-vue-point/announcing-vue-js-2-0-8af1bde7ab9","tags":["JavaScript","DOM","library"],"content":"Vue.js 2.0のパブリックプレビュー版リリース。\nSnabbdomベースのVirtua lDOM実装の追加など","relatedLinks":[{"title":"paldepind/snabbdom: A virtual DOM library with focus on simplicity, modularity, powerful features and performance.","url":"https://github.com/paldepind/snabbdom"}]},{"category":"Article","title":"Updating Our Prefixing Policy | WebKit","url":"https://webkit.org/blog/6131/updating-our-prefixing-policy/","tags":["webkit","safari"],"content":"Safari/WebKitは新しい機能などは今後Vendor prefixではなく、フラグのON/OFFを追加していくようにするポリシーの変更について。\n`-webkit-` prefixがあまりに使われてしまい、後方互換性のためにprefixが標準仕様となってしまった歴史などもあるため","relatedLinks":[{"title":"Feature Policy | WebKit","url":"https://webkit.org/feature-policy/"}]},{"category":"Article","title":"How to Make Your React Apps 15x Faster – ReactJS News","url":"https://reactjsnews.com/how-to-make-your-react-apps-10x-faster","tags":["React","設定"],"content":"Reactはデバッグ向けのコードが大量に入っているため、production(`NODE_ENV=production`)ビルドや機械的に最適化できるBabelプラグインを導入するだけでも速度が大分変わるという話","relatedLinks":[{"title":"thejameskyle/babel-react-optimize: A Babel preset and plugins for optimizing React code.","url":"https://github.com/thejameskyle/babel-react-optimize"}]},{"category":"Article","title":"V8 JavaScript Engine: ES6, ES7, and beyond","url":"http://v8project.blogspot.com/2016/04/es6-es7-and-beyond.html","tags":["ECMAScript","V8","JavaScript"],"content":"V8が既存のウェブとの互換性を持ちつつ次期ECMAScriptの仕様を実装しているかのプロセスについて。\nES6の実装が完了する前にドラフトバージョンを実装することで見つけられる後方互換性の問題がある話。\nまたECMAScriptという複雑な言語仕様のtest suiteであるtest262について。","relatedLinks":[]},{"category":"Article","title":"npmで同じライブラリの複数バージョンをインストールして使う方法 | Web Scratch","url":"http://efcl.info/2016/05/02/npm-package-mixed-multiple-versions-demo/","tags":["npm","Tips","node.js","JavaScript"],"content":"一つのプロジェクト内に同名ライブラリの複数バージョンをインストールして扱う方法について","relatedLinks":[]},{"category":"Article","title":"A look at ES6 Maps - Barbarian Meets Coding","url":"http://www.barbarianmeetscoding.com/blog/2016/04/27/a-look-at-es6-maps","tags":["JavaScript","ECMAScript"],"content":"ES6 Mapについての解説。\nデータ構造としてのMap、Iterableについて","relatedLinks":[]},{"category":"Article","title":"Turbocharged JavaScript refactoring with codemods — Airbnb Engineering &amp; Data Science — Medium","url":"https://medium.com/airbnb-engineering/turbocharged-javascript-refactoring-with-codemods-b0cae8b326b9","tags":["JavaScript","Tools"],"content":"codemodを使ったリファクタリングについて","relatedLinks":[]},{"category":"SlideVideo","title":"Almin.js | JavaScriptアーキテクチャ","url":"http://azu.github.io/slide/2016/child_process_sushi/almin-javascript-architecture.html","tags":["JavaScript","スライド"],"content":"[Almin.js](https://github.com/almin/almin \"Almin.js\")の設計の概念的な話やパターンについて。\nFluxやCQRSといったパターンにおいて、ドメインモデルをどうやったら考えて実装できるようになるかという話。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Diffee Checker","url":"http://una.im/diffee/","tags":["CSS "],"content":"CSS blend modesを使いiframe同士の描画結果の差分を表示するデモ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Galooshi/import-js: A tool to simplify importing JS modules","url":"https://github.com/Galooshi/import-js","tags":["JavaScript","Tools","editor"],"content":"指定した関数名から、該当するモジュールのimport文を自動的に探索して追加できるツール。\n各種エディタ連携などもある","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ericholiveira/studio: A nodejs framework to create decoupled and scalable applications","url":"https://github.com/ericholiveira/studio","tags":["node.js"],"content":"ActorモデルインスパイアなNode.jsのフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"flickr/yakbak: Record and playback HTTP responses","url":"https://github.com/flickr/yakbak","tags":["node.js","HTTP","testing","library"],"content":"ProxyとしてHTTPリクエストとレスポンスを記録し、リプレイしたレスポンスを返すことができるNode.jsライブラリ","relatedLinks":[{"title":"Introducing yakbak: Record and playback HTTP interactions in NodeJS | code.flickr.com","url":"http://code.flickr.net/2016/04/25/introducing-yakbak-record-and-playback-http-interactions-in-nodejs/"}]},{"category":"SoftwareLibrary","title":"jeromeetienne/babel-plugin-jsdoced: babel plugin which use jsdoc to implement strong typing in javascript","url":"https://github.com/jeromeetienne/babel-plugin-jsdoced","tags":["babel","JSDoc","plugin"],"content":"jsdoced.jsを使いJSDocからランタイムassertを追加するBabelプラグイン。\njsdoc-to-assertと似てるが、返り値のチェックやProxy APIを使ってプロパティの代入もチェックしている","relatedLinks":[{"title":"jsdoced.js - test your code with jsdoc","url":"http://jsdocedjs.org/"},{"title":"JSDocをランタイムassertに変換するBabelプラグインを書いた | Web Scratch","url":"http://efcl.info/2016/03/25/jsdoc-to-assert/"}]}]},{"meta":{"title":"2016-05-10のJS: Angular 2 RC、Firefox開発者ツールの新機能、クロージャーの解説","author":"azu","layout":"post","date":"2016-05-10T13:16:00.000Z","category":"JSer","tags":["Angular","Firefox","debug","JavaScript"],"url":"https://jser.info/2016/05/10/angular2-firefox48-dev/"},"items":[{"category":"Headline","title":"Release 2.4.0 - 2016.05.08 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v2.4.0","tags":["JavaScript","library","ReleaseNote"],"content":"core-js 2.4.0リリース。\nStage 1 Proposalの`Observable`を追加など","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at 9.0.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/9.0.0/Changelog.md","tags":["JavaScript","DOM","libre","ReleaseNote"],"content":"jsdom 9.0.0リリース。\nmutation eventsの削除し今後MutationObserverを追加する予定。\n`DOMTokenList#replace`、`DOMTokenList#contains`、XHRの改善など","relatedLinks":[]},{"category":"Headline","title":"Node v6.1.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v6.1.0/","tags":["node.js","ReleaseNote"],"content":"Node v6.1.0リリース。\n`deepEqual()/deepStrictEqual()`が循環参照してるオブジェクトを扱えるように、`process.cpuUsage()`の追加、`util.inspect()`にオプションを追加するなど","relatedLinks":[]},{"category":"Headline","title":"Dev.Opera — What’s new in Chromium 50 and Opera 37","url":"https://dev.opera.com/blog/opera-37/","tags":["Opera","Chrome","ReleaseNote"],"content":"Opera 37 (based on Chromium 50)リリース。\n`/regexp/u`、well-known symbols、preload link、`DomTokenList#supports`、非推奨or削除するメソッドの更新など","relatedLinks":[{"title":"DOMTokenList Validation Added in Chrome 50 | Web Updates - Google Developers","url":"https://developers.google.com/web/updates/2016/03/domtokenlist-validation-added-in-chrome-50"}]},{"category":"Headline","title":"angular/CHANGELOG.md at 2.0.0-rc.1 · angular/angular","url":"https://github.com/angular/angular/blob/2.0.0-rc.1/CHANGELOG.md","tags":["AngularJS","ReleaseNote"],"content":"Angular2 RCリリース。\nScoped Packagesを使うように変更、Offline Compilerを使ったstaticな方式とbootstrap時に処理する方式の両方をサポート、名前空間の変更など","relatedLinks":[{"title":"Angular 2 RCリリースについて | Angular2 Info","url":"http://ng2-info.github.io/2016/05/09/angular-2-rc-1/"}]},{"category":"Article","title":"A Taste of JavaScript’s New Parallel Primitives ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2016/05/a-taste-of-javascripts-new-parallel-primitives/","tags":["JavaScript"],"content":"SharedArrayBufferについて。\nWebWorkerでのメモリを共有した並列処理について","relatedLinks":[{"title":"tc39/ecmascript","url":"https://github.com/tc39/ecmascript_sharedmem"}]},{"category":"Article","title":"Introducing Global CSS Property Usage on Microsoft Edge Dev | Microsoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2016/04/11/css-usage-platform-data/","tags":["Chrome","MSEdge","browser","CSS"],"content":"MSEdgeとChromeでクロールしたCSSプロパティの使用率の統計情報が見れるGlobal CSS Property Usageについて","relatedLinks":[{"title":"View usage statistics and common patterns for APIs on the web platform.","url":"https://developer.microsoft.com/en-us/microsoft-edge/platform/usage/"},{"title":"MicrosoftEdge/css-usage: This script is used within our Bing and Interop crawlers to determine the properties used on a page and generalized values that could have been used.","url":"https://github.com/MicrosoftEdge/css-usage"}]},{"category":"Article","title":"Developer Edition 48 – Firebug features, editable storage, inspector improvements and more… ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2016/04/developer-edition-48-firebug-features-editable-storage-inspector-improvements-and-more/","tags":["firefox","debug"],"content":"Firefox 48の開発者ツールについて。\nFirebug由来のDOMパネル、コンソール機能の追加、localStorageなどの編集機能、メモリ使用量の表示改善しGCされてないオブジェクトを見つけやすくなるなど","relatedLinks":[{"title":"Developer Edition 48 – Firebug 由来の機能、ストレージの編集、インスペクタの改良、etc | Mozilla Developer Street (modest)","url":"https://dev.mozilla.jp/2016/05/developer-edition-48-firebug-features-editable-storage-inspector-improvements-and-more/"}]},{"category":"Article","title":"Custom elementsはES6のclass記法で定義可能になりそうです - Qiita","url":"http://qiita.com/yoichiro@github/items/fdb8372bd8a68c754dc3","tags":["WebComponents"],"content":"Custom Elementsの仕様が大幅にアップデートされて、classを継承した形で新しい要素を定義できるようになる仕様について","relatedLinks":[{"title":"Large custom element spec rewrite to implement some F2F decisions by domenic · Pull Request #405 · w3c/webcomponents","url":"https://github.com/w3c/webcomponents/pull/405"}]},{"category":"Article","title":"Let’s Learn JavaScript Closures — Free Code Camp","url":"https://medium.freecodecamp.com/lets-learn-javascript-closures-66feb44f6a44","tags":["JavaScript"],"content":"JavaScriptのクロージャーについて詳しい解説。\nEnviroment、RealmなどのECMAScriptの言語仕様に触れながら、どのような仕組みになっているかを解説してる","relatedLinks":[]},{"category":"Article","title":"IntersectionObserver’s Coming into View | Web Updates - Google Developers","url":"https://developers.google.com/web/updates/2016/04/intersectionobserver","tags":["WebPlatformAPI","performance","JavaScript"],"content":"Chrome 51で入るIntersectionObserverについての解説記事。\n要素がviewport内に表示されたら発火するイベントを設定できる。(発火するしきい値も指定できる)\nまた、rootに対する`ClientRect`の情報なども取得でき、lazyloadや無限リストなどの実装に利用できる","relatedLinks":[]},{"category":"SlideVideo","title":"Forward 4 Web Summit - YouTube","url":"https://www.youtube.com/watch?v=57MmZtd03ks&list=PLndbWGuLoHebKI8krCzJU88Rf3TwhNZvH&index=17","tags":["JavaScript","イベント","動画 "],"content":"Forward 4 Web Summitの動画一覧","relatedLinks":[{"title":"Forward - Web Technology Summits, Workshops and Online Content","url":"http://forwardjs.com/"}]},{"category":"WebsiteDocument","title":"MaintainableCSS - an approach to writing modular, scalable and maintainable CSS | By Adam Silver","url":"http://maintainablecss.com/","tags":["CSS","設計"],"content":"メンテナンスしやすいCSSについて書かれたサイト。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"outbrain/postit: An elegant wrapper for postMessage","url":"https://github.com/outbrain/postit","tags":["JavaScript","library"],"content":"postMessageのラッパーライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"twada/universal-deep-strict-equal: A port of Node v6&#x27;s internal _deepEqual function in a universal style","url":"https://github.com/twada/universal-deep-strict-equal","tags":["JavaScript","library","testing"],"content":"ブラウザでも動作する`deepStrictEqual`の実装ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bbc/VideoContext: An experimental HTML5 &amp; WebGL video composition and rendering API.","url":"https://github.com/bbc/VideoContext","tags":["動画 ","audio","API"],"content":"Web Audio APIのような形でVideoを処理できるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"edenspiekermann/iframify: Replace a node with an iframe version of itself","url":"https://github.com/edenspiekermann/iframify","tags":["DOM","JavaScript"],"content":"DOM要素をiframe内に同じものを作って入れ替えるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"perflint/perflint: Perflint is a tool to identify unexpected performance levels of a Website","url":"https://github.com/perflint/perflint","tags":["performance","console","Tools"],"content":"WebPageTestのCLIフロントエンド。\nよくみるLint風の結果表示をしてくれる。","relatedLinks":[]},{"category":"Book","title":"Service Worker Development Cookbook, Sean Amarasinghe, eBook - Amazon.com","url":"http://www.amazon.com/Service-Worker-Development-Cookbook-Amarasinghe-ebook/dp/B01F3LATMY","tags":["ServiceWorker","book"],"content":"2016年11月4日発売\nService Workerについての書籍","relatedLinks":[]}]},{"meta":{"title":"2016-05-16のJS: Electron 1.0、ブレークポイントの使い方、Bublé","author":"azu","layout":"post","date":"2016-05-16T10:36:00.000Z","category":"JSer","tags":["Electron","Chrome","debug","Babel","ES2015"],"url":"https://jser.info/2016/05/16/electron-10buble/"},"items":[{"category":"Headline","title":"Electron 1.0","url":"http://electron.atom.io/blog/2016/05/11/electron-1-0","tags":["Electron","ReleaseNote"],"content":"Electron 1.0リリース。","relatedLinks":[]},{"category":"Headline","title":"ESLint v2.10.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/05/eslint-v2.10.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v2.10.0リリース。","relatedLinks":[{"title":"ESLint v2.10.0 - Qiita","url":"http://qiita.com/mysticatea/items/5df2d679283d0a84b296"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 4 | WebKit","url":"https://webkit.org/blog/6210/release-notes-for-safari-technology-preview-4/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 4リリース。\n`String.prototype.localeCompare`の実装、object literalでも`super()`が呼べるように、`var log = console.log`が可能になるなど","relatedLinks":[]},{"category":"Article","title":"ブレークポイントを使ったJavaScriptデバッグを整理してみた【再入門】 - Qiita","url":"http://qiita.com/nekoneko-wanwan/items/02aed17773833c3ad3b2","tags":["JavaScript","debug"],"content":"Chrome開発者ツールのブレークポイントの使い方や各種ブレークポイントについて。\n画像と共に項目が解説されているので分かりやすい。","relatedLinks":[]},{"category":"Article","title":"するするさせたい：サイボウズ採用情報のアニメーション（その1） - fragmentary","url":"http://myakura.hatenablog.com/entry/2016/05/12/083000","tags":["CSS","Chrome","performance"],"content":"CSSアニメーションのパフォーマンス問題を見つけ方と解決方法について","relatedLinks":[]},{"category":"Article","title":"An Ultimate Guide To CSS Pseudo-Classes And Pseudo-Elements – Smashing Magazine","url":"https://www.smashingmagazine.com/2016/05/an-ultimate-guide-to-css-pseudo-classes-and-pseudo-elements/","tags":["CSS"],"content":"CSSの擬似要素と擬似クラスの網羅的な解説","relatedLinks":[]},{"category":"Article","title":"Get to Know the Page Visibility API | Scotch","url":"https://scotch.io/tutorials/get-to-know-the-page-visibility-api","tags":["JavaScript","WebPlatformAPI"],"content":"Page Visibility APIの使い所や使い方について","relatedLinks":[]},{"category":"Article","title":"ちゃんと使い分けてる? dependenciesいろいろ。 - Qiita","url":"http://qiita.com/cognitom/items/acc3ffcbca4c56cf2b95","tags":["npm"],"content":"npmのdependenciesの種類についての解説。\n\n- dependencies\n- devDependencies\n- peerDependencies\n- optionalDependencies\n- bundledDependencies","relatedLinks":[]},{"category":"Article","title":"runtastic/flow-guide: Our definitive guide for using Flow static JavaScript type checker (https://flowtype.org)","url":"https://github.com/runtastic/flow-guide","tags":["flowtype","tutorial"],"content":"Flowの導入チュートリアル","relatedLinks":[]},{"category":"Article","title":"redux-observable — Medium","url":"https://medium.com/@benlesh/redux-observable-ec0b00d2eb52","tags":["JavaScript","redux","Rx"],"content":"Netflixで使ってる`redux-observable`について。\nなぜ`redux-`なのか? - ReduxはReact周りでよく知られているパターンであり、既に様々なRedux関連ツールが存在するからであるという話","relatedLinks":[{"title":"blesh/redux-observable: RxJS middleware for Redux","url":"https://github.com/blesh/redux-observable"}]},{"category":"Article","title":"Streamlining the Sign-in Flow Using Credential Management API | Web Updates - Google Developers","url":"https://developers.google.com/web/updates/2016/04/credential-management-api","tags":["JavaScript","WebPlatformAPI","Chrome"],"content":"Credential Management APIについて。\n自動サインインを実装しながら使い方について学ぶチュートリアル","relatedLinks":[{"title":"Credential Management API を使ったサインインフローの効率化 | Web Updates - Google Developers","url":"https://developers.google.com/web/updates/2016/04/credential-management-api?hl=ja"}]},{"category":"Article","title":"About document.ready","url":"https://www.webreflection.co.uk/blog/2016/05/10/document.ready","tags":["DOM","JavaScript","Promises"],"content":"Promiseを返す`document.ready`をどう実装するかという話。\n`document.readyState`と`DOMContentLoaded`について","relatedLinks":[]},{"category":"SlideVideo","title":"ng-conf 2016 - YouTube","url":"https://www.youtube.com/playlist?list=PLOETEcp3DkCq788xapkP_OU-78jhTf68j","tags":["AngularJS","動画 "],"content":"ng-conf 2016の動画一覧","relatedLinks":[{"title":"ng-conf May 4th - 6th 2016 - The World","url":"https://www.ng-conf.org/#/"}]},{"category":"SlideVideo","title":"How to make your Webpack builds 10x faster","url":"http://www.slideshare.net/trueter/how-to-make-your-webpack-builds-10x-faster","tags":["webpack","スライド","performance"],"content":"webpackのビルド速度改善についてのスライド","relatedLinks":[]},{"category":"WebsiteDocument","title":"tc39/proposals: Tracking ECMAScript Proposals","url":"https://github.com/tc39/proposals","tags":["ECMAScript","proposal"],"content":"ECMAScriptのProposalまとめリポジトリ。\nActive/InActive/Finished/Stage 0のProposalが一覧できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Bublé – the blazing fast, batteries-included ES2015 compiler","url":"https://buble.surge.sh/guide/","tags":["JavaScript","Tools","babel"],"content":"BabelのようにES2015のコードをES5に変換するツール。\n設定なしで動作し、サポートしたいブラウザバージョンを指定することで変換内容を選択できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"garbles/why-did-you-update: Puts your console on blast when React is making unnecessary updates.","url":"https://github.com/garbles/why-did-you-update","tags":["React","performance","library"],"content":"Reactで`props`の中身が一致する場合にも、renderが呼ばれている事を検知してコンソールに表示するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"leo/args: Minimal toolkit for building CLIs","url":"https://github.com/leo/args","tags":["node.js","JavaScript","library"],"content":"minimistを使った引数処理、ヘルプ表示、サブコマンドなどに対応したライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"florian/x18n: A sane JavaScript internationalisation library","url":"https://github.com/florian/x18n","tags":["i18n","JavaScript","library"],"content":"r18n gem互換記法が使えるi18nライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"documentationjs/globals-docs: Documentation URIs for JavaScript globals.","url":"https://github.com/documentationjs/globals-docs","tags":["JavaScript","library","Mozilla"],"content":"JavaScriptの型やオブジェクトを渡すと、対応するMDNのドキュメントURLを返してくれるライブラリ","relatedLinks":[]}]},{"meta":{"title":"2016-05-23のJS: MSEdgeがES6 Modulesをサポート、jQuery 3.0 RCリリース","author":"azu","layout":"post","date":"2016-05-23T10:45:00.000Z","category":"JSer","tags":["MSEdge","modules","jQuery","Google","動画"],"url":"https://jser.info/2016/05/23/msedgees6-modulesjquery-30-rcgoogle-io/"},"items":[{"category":"Headline","title":"Previewing ES6 Modules and more from ES2015, ES2016 and beyond | Microsoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2016/05/17/es6-modules-and-beyond/","tags":["MSEdge","ReleaseNote"],"content":"MSEdge build 14342リリース。\nES6 modulesを扱える`<script type=\"module\">`をフラグ付きでサポート、ES2016/2017の新しい機能である`**`、`Object.values`、`Object.entries`、`String#pad*`のサポートなど","relatedLinks":[{"title":"Microsoft Edge で Modules を使ってみる - Browser","url":"http://browser.hatenablog.com/entry/2016/05/22/220131"}]},{"category":"Headline","title":"Release v15.1.0 · facebook/react","url":"https://github.com/facebook/react/releases/tag/v15.1.0","tags":["React","ReleaseNote"],"content":"React v15.1.0リリース。\nChromeの`Object.assign`に順序バグがあるため対応するpolyfillをアップデート、react-addons-perfが書き直された。","relatedLinks":[{"title":"Add new ReactPerf by gaearon · Pull Request #6046 · facebook/react","url":"https://github.com/facebook/react/pull/6046"},{"title":"Add feature test against buggy V8 versions by spicyj · Pull Request #32 · sindresorhus/object-assign","url":"https://github.com/sindresorhus/object-assign/pull/32"}]},{"category":"Headline","title":"Node v6.2.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v6.2.0/","tags":["node.js","ReleaseNote"],"content":"Node v6.2.0リリース。\n`--no-deprecation`をランタイムに設定できる `process.noDeprecation = true;` が用意されるなど","relatedLinks":[]},{"category":"Headline","title":"Release v6.9.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v6.9.0","tags":["babel","ReleaseNote"],"content":"Babel v6.9.0リリース。\ncore-jsのアップデート、`systemGlobal`オプションの追加など","relatedLinks":[{"title":"Releases · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases"}]},{"category":"Headline","title":"jQuery 3.0 Release Candidate…Released! | Official jQuery Blog","url":"http://blog.jquery.com/2016/05/20/jquery-3-0-release-candidate-released/","tags":["jQuery","ReleaseNote"],"content":"jQuery 3.0 RCリリース","relatedLinks":[]},{"category":"Article","title":"Refactoring a JavaScript video store","url":"http://martinfowler.com/articles/refactoring-video-store-js/","tags":["JavaScript","リファクタリング"],"content":"マーティン・ファウラーによるJavaScript(ES2015)のリファクタリング","relatedLinks":[]},{"category":"Article","title":"Iterators and Generators in JavaScript | Kenneth Truyers","url":"https://www.kenneth-truyers.net/2016/05/20/iterators-and-generators-in-javascript/","tags":["JavaScript","ECMAScript"],"content":"Iterator/Iterable/Generatorについての簡潔なまとめ","relatedLinks":[]},{"category":"Article","title":"How to Make Accessible Web Components — a Brief Guide","url":"https://www.sitepoint.com/accessible-web-components/","tags":["accessibility","HTML","WebComponents"],"content":"Custom Elementで作った要素をAccessibleに実装するチュートリアル。\nキーボード対応、WAI-ARIA、ハイコントラストモードでの確認など","relatedLinks":[]},{"category":"Article","title":"The 7 Cross-Browser Testing Tools You Need in 2016","url":"https://www.sitepoint.com/the-7-cross-browser-testing-tools-you-need-in-2016/","tags":["browser","webservice"],"content":"テスト用のクロスブラウザを扱えるサービスのまとめ","relatedLinks":[]},{"category":"Article","title":"ここがすごいぞ！ stylelint！ - Qiita","url":"http://qiita.com/inuscript/items/ff4f6972c988afbec3a8","tags":["CSS","Tools"],"content":"CSSのLintをするstylelintについて","relatedLinks":[]},{"category":"Article","title":"step by stepで始めるKarma - Qiita","url":"http://qiita.com/howdy39/items/b9d704e7f84053924da3","tags":["JavaScript","testing","browser"],"content":"karmaの導入チュートリアル","relatedLinks":[]},{"category":"Article","title":"Six nifty ES6 tricks","url":"http://www.2ality.com/2016/05/six-nifty-es6-tricks.html","tags":["ECMAScript","JavaScript"],"content":"ES6の少しテクニカルな使い方\nデフォルト引数を使った必須引数のチェック、for of + `Object.entries`、サロゲートペア、配列の入れ方、template literal、mixinなどについて","relatedLinks":[]},{"category":"SlideVideo","title":"Learn Redux Video Tutorial Course","url":"https://learnredux.com/","tags":["redux","動画"],"content":"Reduxを使ったウェブアプリ開発に関するスクリーンキャスト","relatedLinks":[]},{"category":"SlideVideo","title":"Web and Chrome at Google I/O 2016 - YouTube","url":"https://www.youtube.com/user/ChromeDevelopers","tags":["google","動画"],"content":"Google I/O 2016の動画まとめ","relatedLinks":[{"title":"Google I/O 2016","url":"https://events.google.com/io2016/"}]},{"category":"SlideVideo","title":"Web Performance Tooling - Google I/O 2016 - YouTube","url":"https://www.youtube.com/watch?v=iMqi55rcR00","tags":["Chrome","debug"],"content":"Chrome開発者ツールのパフォーマンス周りの使い方や見かたについて。\nケーススタディ毎にどの部分が遅いのかを見つけて、開発者ツールで本当にそれが原因なのかを確認したり、俯瞰の仕方についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Instant Loading: Building offline-first Progressive Web Apps - Google I/O 2016 - YouTube","url":"https://www.youtube.com/watch?v=cmGr0RszHc8","tags":["ServiceWorker","JavaScript"],"content":"Service Workerを使ったオフラインファーストについての発表。\n電波状態が悪いケースを想定した動作、IndexedDBを使ったデータの保存など","relatedLinks":[{"title":"pazguille/offline-first: Everything you need to know to create offline-first web apps.","url":"https://github.com/pazguille/offline-first"}]},{"category":"WebsiteDocument","title":"Lerna · A tool for managing JavaScript projects with multiple packages.","url":"https://lernajs.io/","tags":["JavaScript","Tools","npm"],"content":"Babelで使われてるmonorepoを管理するツールであるLernaの公式サイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"brigand/react-mixin: mixins in react with es6 style classes","url":"https://github.com/brigand/react-mixin","tags":["React","JavaScript","library"],"content":"React Componentに対してES6 Classesでmixinをするライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"yoshuawuyts/choo: - framework for creating sturdy web applications","url":"https://github.com/yoshuawuyts/choo","tags":["JavaScript","redux","library"],"content":"小さなモジュールを組み合わせたReduxライクな仕組みを持つフレームワーク。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"maxogden/yo-yo: A tiny library for building modular UI components using DOM diffing and ES6 tagged template literals","url":"https://github.com/maxogden/yo-yo","tags":["JavaScript","DOM","library"],"content":"https://www.npmjs.com/package/morphdom をベースにtagged template literalsを使ったViewライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"wssgcg1213/babel-plugin-inline-replace-varibles: babel plugin to inline replace varibles","url":"https://github.com/wssgcg1213/babel-plugin-inline-replace-varibles","tags":["babel","plugin"],"content":"Babelで文字列に値をインライン展開するプラグイン","relatedLinks":[]},{"category":"Book","title":"Exploring ES2016… by Axel Rauschmayer [Leanpub PDF/iPad/Kindle]","url":"https://leanpub.com/exploring-es2016-es2017","tags":["ECMAScript","book","JavaScript"],"content":"Exploring ES6のES2016/2017対応版","relatedLinks":[]}]},{"meta":{"title":"2016-05-30のJS: 初めてのnpm publish、Node.jsでのメモリリークデバッグ","author":"azu","layout":"post","date":"2016-05-30T11:41:00.000Z","category":"JSer","tags":["npm","V8","Node.js","memory","debug"],"url":"https://jser.info/2016/05/30/npm-publishnodejs/"},"items":[{"category":"Headline","title":"Deco - React Native IDE","url":"https://www.decosoftware.com/may-2016-update","tags":["React","editor","ReleaseNote"],"content":"React Native IDEであるDecoがオープンソースとしてリリースされた","relatedLinks":[]},{"category":"Headline","title":"ESLint v2.11.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/05/eslint-v2.11.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v2.11.0リリース。\nJSCS互換のルールの追加、`obj.hasOwnProperty`の利用に関するルールの追加など","relatedLinks":[{"title":"ESLint v2.11.0 - Qiita","url":"http://qiita.com/mysticatea/items/979bee6cd462f135f217"},{"title":"Suggestion: Object.hasOwnProperty","url":"https://esdiscuss.org/topic/suggestion-object-hasownproperty"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 5 | WebKit","url":"https://webkit.org/blog/6415/release-notes-for-safari-technology-preview-5/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 5リリース。\n`NodeList`がiterableに、`window.scroll`が`ScrollToOptions`をサポート、sourceMappingURLが相対パスを扱えない問題を修正など","relatedLinks":[]},{"category":"Article","title":"Publishing Your First Package to npm","url":"https://eladnava.com/publishing-your-first-package-to-npm/","tags":["npm","tutorial"],"content":"npmでパッケージを公開するまでの流れを書いたチュートリアル","relatedLinks":[]},{"category":"Article","title":"Fullstack React : React Tutorial: Cloning Yelp","url":"https://www.fullstackreact.com/articles/react-tutorial-cloning-yelp/","tags":["React","tutorial"],"content":"YelpのクローンをReactで作るチュートリアル","relatedLinks":[]},{"category":"Article","title":"IntersectionObserverを使ってlazyload-imageを書き直した - 1000ch.net","url":"https://1000ch.net/posts/2016/intersection-observer-lazyload.html","tags":["JavaScript","WebComponents"],"content":"`IntersectionObserver`を使った画像の遅延ロードの実装について。\nfallbackはただの`<img>`として動作する","relatedLinks":[]},{"category":"Article","title":"[翻訳] Airbnb React/JSX Style Guide - Qiita","url":"http://qiita.com/koukun/items/e64762e407b8dd5e0247","tags":["React","翻訳"],"content":"Airbnb React/JSXのコーディングスタイルガイドの翻訳","relatedLinks":[]},{"category":"Article","title":"RxJS の代わりに xstream を使う - Qiita","url":"http://qiita.com/masakielastic/items/f34f5b297abee0e80ddc","tags":["JavaScript","Rx"],"content":"RxライクなStreamライブラリであるxstreamについて","relatedLinks":[{"title":"staltz/xstream: An extremely intuitive, small, and fast functional reactive stream library for JavaScript","url":"https://github.com/staltz/xstream"}]},{"category":"Article","title":"React/Redux Introduction // Speaker Deck","url":"https://speakerdeck.com/adwd/redux-introduction","tags":["React","redux","スライド"],"content":"React/ReduxでTodo的アプリを作る話。\nチュートリアル的な内容のスライド","relatedLinks":[]},{"category":"Article","title":"Implementing a Stepping Debugger in JavaScript","url":"http://jlongster.com/Implementing-Stepping-Debugger-JavaScript","tags":["JavaScript","editor"],"content":"JavaScriptをステップ実行できるエディタをどうやって実装するか。\nregeneratorとステートマシーン、コールスタックの実装、ブレークポイントの対応など","relatedLinks":[{"title":"jlongster/unwinder: An implementation of continuations in JavaScript","url":"https://github.com/jlongster/unwinder"}]},{"category":"Article","title":"Testing Your Style With ESLint and Mocha","url":"https://robots.thoughtbot.com/testing-your-style-with-eslint-and-mocha","tags":["ESLint","testing","JavaScript"],"content":"ESLintをMochaのテストとして動かす話","relatedLinks":[]},{"category":"Article","title":"npm-scripts でクロスプラットフォームに環境変数を参照するための npm を作成してみた – アカベコマイリ","url":"http://akabeko.me/blog/2016/05/cross-conf-env-1-0-release/","tags":["npm","node.js","Tools"],"content":"`package.json`の`config` fieldに環境変数を定義して、それをクロスプラットフォームで利用できるようにするツール","relatedLinks":[]},{"category":"Article","title":"Understanding ASTs by Building Your Own Babel Plugin","url":"https://www.sitepoint.com/understanding-asts-building-babel-plugin/","tags":["babel","AST"],"content":"Babelプラグインを書きながらASTについて学ぶチュートリアル","relatedLinks":[]},{"category":"Article","title":"Announcing React Server - @Redfin","url":"https://www.redfin.com/blog/2016/05/announcing-react-server.html","tags":["React","サーバー"],"content":"Reactのサーバサイドレンダリングを行うためのフレームワーク","relatedLinks":[]},{"category":"SlideVideo","title":"Node Conf London 2016 - YouTube","url":"https://www.youtube.com/playlist?list=PL0CdgOSSGlBYnHAl_DZoy9BWvdVQjNKE2","tags":["node.js","イベント","動画"],"content":"Node Conf London 2016 の動画まとめ","relatedLinks":[{"title":"NodeConf London 2016","url":"http://london.nodeconf.com/"}]},{"category":"SlideVideo","title":"JSConfUY 2016 - YouTube","url":"https://www.youtube.com/user/jsconfuy","tags":["JavaScript","イベント","動画"],"content":"JSConf Uruguay 2016の動画まとめ","relatedLinks":[{"title":"JSConf Uruguay 2016 - Montevideo, April 15th-16th","url":"https://jsconf.uy/"}]},{"category":"SoftwareLibrary","title":"tonyganch/gonzales-pe: CSS parser with support of preprocessors","url":"https://github.com/tonyganch/gonzales-pe","tags":["CSS","library"],"content":"CSS Parserライブラリ。\nCSS/less/Sassをサポートしてる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"QuorraJS","url":"https://quorrajs.org/","tags":["node.js","library"],"content":"LaravelインスパイアなNode.jsフレームワーク","relatedLinks":[{"title":"Introducing QuorraJS — Medium","url":"https://medium.com/@quorrajs/we-are-just-getting-started-f6593e4ae06b"}]},{"category":"SoftwareLibrary","title":"ALM Tools for TypeScript","url":"http://alm.tools/","tags":["browser","TypeScript","editor"],"content":"ブラウザで動くTypeScriptエディタ","relatedLinks":[]},{"category":"Book","title":"初めてのThree.js 第2版 : Jos Dirksen, あんどうやすし : 本 : Amazon.co.jp","url":"http://www.amazon.co.jp/%E5%88%9D%E3%82%81%E3%81%A6%E3%81%AEThree-js-%E7%AC%AC2%E7%89%88-Jos-Dirksen/dp/4873117704","tags":["JavaScript","book","WebGL","翻訳"],"content":"2016年7月25日発売\nThree.js本","relatedLinks":[]}]},{"meta":{"title":"2016-06-07のJS: Shadow DOM v1、React近況、JavaScriptのプラグイン設計本","author":"azu","layout":"post","date":"2016-06-07T00:40:00.000Z","category":"JSer","tags":["WebComponent","React","JavaScript","plguin","book"],"url":"https://jser.info/2016/06/07/shadow-dom-v1reactjavascript/"},"items":[{"category":"Headline","title":"V8 JavaScript Engine: Release 5.2","url":"http://v8project.blogspot.com/2016/06/release-52.html","tags":["V8","ReleaseNote"],"content":"V8 5.2リリース。\n Exponentiation operator `**`のサポート、`Array.isArray`、`in` operator、`Function#bind`のパフォーマンス改善など","relatedLinks":[]},{"category":"Article","title":"Getting Started with TDD in React - Semaphore","url":"https://semaphoreci.com/community/tutorials/getting-started-with-tdd-in-react","tags":["React","JavaScript","testing"],"content":"Enzymeを使ったReact Componentのテストについて","relatedLinks":[]},{"category":"Article","title":"What&#x27;s New in Shadow DOM v1 (by examples) — hayato.io","url":"http://hayato.io/2016/shadowdomv1/","tags":["WebComponents"],"content":"Shadow DOM v0とv1の違いについて。\n[@shadow_hayato](https://twitter.com/shadow_hayato \"@shadow_hayato\")さん(仕様策定者)によるコード例を元にした解説。","relatedLinks":[{"title":"Shadow DOM v1: Status updates - Google グループ","url":"https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/BUGxw_Yx5Lo"},{"title":"Issues · w3c/webcomponents","url":"https://github.com/w3c/webcomponents/issues?utf8=%E2%9C%93&q=is%3Aissue+is%3Aopen+label%3Av1+label%3Ashadow-dom"}]},{"category":"Article","title":"Chromeのヘッドレスブラウザがやってくる。というわけで試してみた。 - Qiita","url":"http://qiita.com/devneko/items/51f2e114a7e0b3389435","tags":["Chrome"],"content":"Chromeのヘッドレスブラウザについて","relatedLinks":[{"title":"Issues - chromium - An open-source project to help move the web forward. - Monorail","url":"https://bugs.chromium.org/p/chromium/issues/list?q=label:Proj-Headless"}]},{"category":"Article","title":"Infinite collections with ES6 generators - Advanced Web Machinery","url":"https://advancedweb.hu/2016/05/31/infinite-collections-with-es6-generators/","tags":["JavaScript"],"content":"Iteratorを使った無限リストについて","relatedLinks":[{"title":"sashee/gentoo: Tools for ES6 generators","url":"https://github.com/sashee/gentoo"}]},{"category":"Article","title":"Why we chose MobX over Redux for Spectacle Editor","url":"http://formidable.com/blog/2016/06/02/why-we-chose-mobx-over-redux-for-spectacle-editor/","tags":["JavaScript","redux"],"content":"Reduxとかと同じくアプリケーションのStateを管理するMobXの特徴についての紹介","relatedLinks":[{"title":"mobxjs/mobx: Simple, scalable state management.","url":"https://github.com/mobxjs/mobx"}]},{"category":"Article","title":"Creating A Living Style Guide: A Case Study – Smashing Magazine","url":"https://www.smashingmagazine.com/2016/05/creating-a-living-style-guide-case-study/","tags":["CSS"],"content":"スタイルガイドのケーススタディ","relatedLinks":[]},{"category":"Article","title":"Improving Your CSS with Parker – CSS Wizardry – CSS, OOCSS, front-end architecture, performance and more, by Harry Roberts","url":"http://csswizardry.com/2016/06/improving-your-css-with-parker/","tags":["CSS","Tools"],"content":"CSSの解析ツールであるParkerについて","relatedLinks":[{"title":"katiefenn/parker: Stylesheet analysis tool.","url":"https://github.com/katiefenn/parker/"}]},{"category":"Article","title":"webpackのDLLバンドルを使ってビルドを速くする - Qiita","url":"http://qiita.com/pirosikick/items/c77db84dbed4c447a6fe","tags":["webpack","performance"],"content":"webpackのビルド速度の改善について。\nvendorライブラリだけ別にビルドし読み込んで使うDLLバンドル、`cacheDirectory`、`externals`との違いについてなど","relatedLinks":[]},{"category":"SlideVideo","title":"The state of React.js 2016 // Speaker Deck","url":"https://speakerdeck.com/koba04/the-state-of-react-dot-js-2016","tags":["React","スライド"],"content":"Reactの最近の変更や今後の変更、非推奨になる予定の機能についてなど","relatedLinks":[{"title":"第65回 HTML5とか勉強会 ー React最新情報 - YouTube","url":"https://www.youtube.com/watch?v=C8bMahvTkHA"}]},{"category":"SlideVideo","title":"ReactEurope 2016 - Day 1 - YouTube","url":"https://www.youtube.com/channel/UCorlLn2oZfgOJ-FUcF2eZ1A","tags":["React","動画"],"content":"ReactEurope 2016の動画まとめ","relatedLinks":[]},{"category":"SlideVideo","title":"Building React Applications with Idiomatic Redux - Course by @dan_abramov @eggheadio","url":"https://egghead.io/courses/building-react-applications-with-idiomatic-redux","tags":["redux","動画","tutorial"],"content":"Redux作者によるReduxでアプリケーションを作るスクリーンキャスト","relatedLinks":[{"title":"Dan Abramov - The Redux Journey at react-europe 2016 - YouTube","url":"https://www.youtube.com/watch?v=uvAXVMwHJXU"}]},{"category":"SlideVideo","title":"Next Vue.js 2.0 // Speaker Deck","url":"https://speakerdeck.com/kazupon/next-vue-dot-js-2-dot-0","tags":["JavaScript","スライド"],"content":"Vue.js 2.0のレンダリングフローについて","relatedLinks":[]},{"category":"SlideVideo","title":"Flow vs TypeScript","url":"http://djcordhose.github.io/flow-vs-typescript/2016_hhjs.html#/","tags":["TypeScript","flowtype"],"content":"TypeScriptとFlowTypeの型指定の比較についてのスライド","relatedLinks":[]},{"category":"WebsiteDocument","title":"HyperDev","url":"https://hyperdev.com/","tags":["webservice","node.js","JavaScript"],"content":"サーバも書けるJSFiddle的なサービス。\nNode.jsでサーバ側、HTML/CSS/JSなフロントも一緒に書けるエディタサービス","relatedLinks":[]},{"category":"WebsiteDocument","title":"Front-end Hyperpolyglot","url":"http://jeffcarp.github.io/frontend-hyperpolyglot/","tags":["DOM","library"],"content":"React/Angular1,2/Ember/Polymer/Vueのテンプレートの書き方比較","relatedLinks":[{"title":"Programming Languages - Hyperpolyglot","url":"http://hyperpolyglot.org/"}]},{"category":"SoftwareLibrary","title":"epoberezkin/ajv: The fastest JSON schema Validator. Supports v5 proposals","url":"https://github.com/epoberezkin/ajv","tags":["JavaScript","JSON","library"],"content":"JSON Schema validatorライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"MJB-code6/SkyPort: Add offline functionality to your web app","url":"https://github.com/MJB-code6/SkyPort","tags":["ServiceWorker","library"],"content":"Service Workerを使ったオフラインモードを実現するライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Frend — A collection of accessible, modern front-end components.","url":"http://frend.co/","tags":["DOM","library","accessibility","WAI-ARIA"],"content":"AccessibleなDOM UIを実現するためのJavaScriptライブラリ。CSSフレームワークのように特定のクラスを付けた要素にWAI-ARIAの属性を付加していく。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"GoogleChrome/lighthouse: auditing and performance metrics for Progressive Web Apps","url":"https://github.com/GoogleChrome/lighthouse","tags":["performance","Tools"],"content":"Service Workerを使ってのオフライン対応の有無、Speed IndexなどのロードパフォーマンスなどProgressive Web Appsに関する計測ツール","relatedLinks":[]},{"category":"Book","title":"JavaScript Plugin Architectureというプラグイン設計について学ぶ無料の電子書籍を書いた | Web Scratch","url":"http://efcl.info/2016/06/06/JavaScript-Plugin-Architecture/","tags":["JavaScript","ebook"],"content":"JavaScriptのプラグイン設計のケーススタディ本。\njQuery、ESLint、Connect、gulp、Reduxなどのプラグインの仕組みを実装しながら学ぶ電子書籍","relatedLinks":[{"title":"azu/JavaScript-Plugin-Architecture: JavaScriptプラグインアーキテクチャの本","url":"https://github.com/azu/JavaScript-Plugin-Architecture"}]}]},{"meta":{"title":"2016-06-13のJS: jQuery 3.0、Firefox 47.0、Web Audio API入門","author":"azu","layout":"post","date":"2016-06-13T06:30:00.000Z","category":"JSer","tags":["Firefox","jQuery","WebAudioAPI"],"url":"https://jser.info/2016/06/13/jQuery3-Firefox47-WebAudioAPI/"},"items":[{"category":"Headline","title":"jQuery 3.0 Final Released! | Official jQuery Blog","url":"http://blog.jquery.com/2016/06/09/jquery-3-0-final-released/","tags":["jQuery","ReleaseNote"],"content":"jQuery 3.0リリース。\najaxとeffectを取り除いたslimビルドの公開。\n`jQuery.Deferred`がPromise A/+互換に、非推奨イベントの削除、再度`requestAnimationFrame`を利用するように変更など","relatedLinks":[{"title":"jQuery Core 3.0 Upgrade Guide | jQuery","url":"http://jquery.com/upgrade-guide/3.0/"},{"title":"jquery/jquery-migrate: APIs and features removed from jQuery core","url":"https://github.com/jquery/jquery-migrate#migrate-older-jquery-code-to-jquery-30"},{"title":"【翻訳まとめ】jQuery 3.0 アップグレードガイド - Qiita","url":"http://qiita.com/fmy/items/345a264a1cf2e2a73f62"}]},{"category":"Headline","title":"Firefox 47.0 リリースノート","url":"https://www.mozilla.jp/firefox/47.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 47リリース。\nWidevine CDM(DMRなストリーミング)のサポート、Service Worker/Push APIのデバッグ機能の改善、 `about:debugging`の追加、ES2017の` Object.values()`と`Object.entries()`の実装など","relatedLinks":[{"title":"Mozilla To Test Widevine CDM in Firefox Nightly | Future Releases","url":"https://blog.mozilla.org/futurereleases/2016/04/08/mozilla-to-test-widevine-cdm-in-firefox-nightly/"},{"title":"Firefox 47 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/47"},{"title":"Firefox 47 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/versions/47/"},{"title":"Firefox 47 がリリース、CSS Mask Image プロパティへの対応やVP9サポートの有効化など | WWW WATCH","url":"https://hyper-text.org/archives/2016/06/firefox_47_release.shtml"}]},{"category":"Headline","title":"Release v6.10.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v6.10.0","tags":["babel","ReleaseNote"],"content":"Babel 6.10.0リリース。\n`--watch`時に、初回はビルドしない`--skip-initial-build`オプションの追加、バグ修正など","relatedLinks":[]},{"category":"Headline","title":"ESLint v2.12.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/06/eslint-v2.12.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v2.12.0リリース。\nJSCS互換のルールの追加、全てのビルトインルールを読み込む`eslint:all`の追加、パフォーマンスの改善など","relatedLinks":[{"title":"Utilize glob ignore option for massive perf win by samccone · Pull Request #6215 · eslint/eslint","url":"https://github.com/eslint/eslint/pull/6215"},{"title":"ESLint v2.12.0 - Qiita","url":"http://qiita.com/mysticatea/items/7bf844b32f8295eeb061"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 6 | WebKit","url":"https://webkit.org/blog/6531/release-notes-for-safari-technology-preview-6/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 6リリース。\n関数の引数におけるtrailing commasのドラフトをサポート、CSSの`normal`値をサポートなど","relatedLinks":[{"title":"Trailing Commas in Function Param Lists","url":"https://jeffmo.github.io/es-trailing-function-commas/"}]},{"category":"Headline","title":"Dev.Opera — What’s new in Chromium 51 and Opera 38","url":"https://dev.opera.com/blog/opera-38/","tags":["Opera","Chrome","ReleaseNote"],"content":"Opera 38(based on Chromium 51)リリース。\nES6 `Symbol.hasInstance`、`Symbol.species`、関数式の`fn.name`対応、`querySelector`の返り値がiterableに、`KeyboardEvent#key`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 52 Beta: CSS containment, simpler performance measurement, streamable responses from service workers, and more options for web push","url":"http://blog.chromium.org/2016/06/chrome-52-beta-css-containment-simpler.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 52 Betaリリース。\nCSS `contain`プロパティ、`PerformanceObserver`のサポート。\nFetch APIがreferrer policyをサポート。\nmetaタグでの`X-Frame-Option`が無効となるなど","relatedLinks":[{"title":"CSS Containment in Chrome 52 | Web Updates - Google Developers","url":"https://developers.google.com/web/updates/2016/06/css-containment"},{"title":"Fetch Referrer Policy Sample","url":"https://googlechrome.github.io/samples/fetch-api/fetch-referrer-policy.html"},{"title":"CSS Containment Module Level 3 （日本語訳）","url":"https://triple-underscore.github.io/css-containment-ja.html"}]},{"category":"Article","title":"Open Sourcing CloudFlare’s UI Framework","url":"http://blog.cloudflare.com/cf-ui/","tags":["React","UI","library"],"content":"小さなReact Componentをmonorepoで管理して公開する話。\nコンポーネントの粒度、テスト方法、デバッグ、アクセシビリティなどについて","relatedLinks":[]},{"category":"Article","title":"DOM Features You Didn’t Know Existed (Video &amp; Slides) | Impressive Webs","url":"https://www.impressivewebs.com/dom-features-you-didnt-know-existed-video-slides/","tags":["JavaScript","DOM"],"content":"いろんなDOM APIについて紹介してる記事","relatedLinks":[]},{"category":"Article","title":"Passive Event Listeners によるスクロールの改善 | blog.jxck.io","url":"https://blog.jxck.io/entries/2016-06-09/passive-event-listeners.html","tags":["JavaScript","performance"],"content":"`addEventListener(type, handler, options)`の第三引数として追加されてた `passive`オプションについて。\n`passive: true` とした場合の効果、Feature detectの方法についてなど","relatedLinks":[{"title":"addEventListener()の第３引数の意味とかをちゃんと理解する為のメモ - 今日もスミマセン。","url":"http://d.hatena.ne.jp/snaka72/20100925/1285404467"},{"title":"Add feature test for passive event listener support · Issue #1894 · Modernizr/Modernizr","url":"https://github.com/Modernizr/Modernizr/issues/1894"}]},{"category":"Article","title":"Performance Observer - Efficient Access to Performance Data | Web Updates - Google Developers","url":"https://developers.google.com/web/updates/2016/06/performance-observer","tags":["JavaScript","API","performance"],"content":"`PerformanceObserver`についての解説記事。\nブラウザがアイドル時に、非同期でTiming情報を取る事ができる。","relatedLinks":[]},{"category":"Article","title":"Memory Debugging with Web Inspector | WebKit","url":"https://webkit.org/blog/6425/memory-debugging-with-web-inspector/","tags":["webkit","safari","debug"],"content":"Safari TPの新しいメモリプロファイラについて","relatedLinks":[]},{"category":"SlideVideo","title":"Practical React with MobX - YouTube","url":"https://www.youtube.com/watch?v=XGwuM_u7UeQ","tags":["JavaScript","動画","library"],"content":"MobXについてのスクリーンキャスト。\nMobXを使ってどのようにStateを管理するのか、どのようなサイクルで状態の変更を描画するのかについて","relatedLinks":[{"title":"mobxjs/mobx: Simple, scalable state management.","url":"https://github.com/mobxjs/mobx"}]},{"category":"WebsiteDocument","title":"web audio lesson","url":"http://mohayonao.github.io/web-audio-lesson/","tags":["web ","audio","tutorial","document"],"content":"Web Audio APIの基礎から応用までの課題付きチュートリアル。\nコードをその場で実行できるようになっている。","relatedLinks":[{"title":"web-audio-lesson : Web Audio API初学者向けのテキストを書きました - 音の鳴るブログ","url":"http://mohayonao.hatenablog.com/entry/2016/06/12/154735"}]},{"category":"WebsiteDocument","title":"npms","url":"https://npms.io/","tags":["npm","検索"],"content":"バックエンドにElasticsearchを使ったnpm検索サービス。\nQuality、Maintenance、Popularity、Personalities(未実装)という指標も一緒に表示してくれる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"airbnb/hypernova: A service for server-side rendering your JavaScript views","url":"https://github.com/airbnb/hypernova","tags":["React","node.js","rails"],"content":"AirbnbのReactサーバサイドレンダリングモジュール。\nRailsとの統合する設定も公開されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Kakapo.js","url":"http://devlucky.github.io/kakapo-js","tags":["HTTP","testing","library"],"content":"HTTPモックライブラリ。\nモックデータ入りの開発サーバを作れるライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rill-js/rill: Isomorphic web application framework.","url":"https://github.com/rill-js/rill","tags":["HTTP","JavaScript","library","browser","node.js"],"content":"Browser、Node.jsで動くisomorphicなHTTPミドルウェアライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"benjamn/reify: Enable ECMAScript 2015 modules in Node today. No caveats. Full stop.","url":"https://github.com/benjamn/reify","tags":["ECMAScript","node.js","Tools"],"content":"ECMAScript moduleをNode.jsに変換/ランタイム変換するツール。","relatedLinks":[]},{"category":"Book","title":"CSSシークレット ―ウェブデザイナーが知るべき47のキーポイント : Lea Verou, 牧野 聡 : 本 : Amazon.co.jp","url":"http://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","tags":["CSS","book"],"content":"2016年6月25日発売\nCSS Secretsの翻訳","relatedLinks":[{"title":"CSS Secrets - O","url":"http://shop.oreilly.com/product/0636920031123.do"}]}]},{"meta":{"title":"2016-06-21のJS: ECMAScript 2016リリース、QUnit 2.0","author":"azu","layout":"post","date":"2016-06-21T00:26:00.000Z","category":"JSer","tags":["ECMAScript","Spec","i18n","QUnit"],"url":"https://jser.info/2016/06/21/ecmascript2016-unit2.0/"},"items":[{"category":"Headline","title":"ECMAScript® 2016 Language Specification","url":"http://www.ecma-international.org/ecma-262/7.0/","tags":["ECMAScript","spec"],"content":"ECMAScript 2016リリース。\n毎年リリース体制になってから初リリース","relatedLinks":[{"title":"Standard ECMA-262","url":"http://www.ecma-international.org/publications/standards/Ecma-262.htm"},{"title":"tc39/ecma262: Status, process, and documents for ECMA262","url":"https://github.com/tc39/ecma262"},{"title":"ECMAScript 2016 features ","url":"http://jser.info/2016/02/01/es2016/"}]},{"category":"Headline","title":"ECMAScript® 2016 Internationalization API Specification","url":"http://www.ecma-international.org/ecma-402/3.0/","tags":["ECMAScript","i18n","spec"],"content":"ECMAScript 2016 Internationalization API仕様リリース。\nUnicode 8.0を必要とするようになり、`Intl.getCanonicalLocales()`の追加。","relatedLinks":[]},{"category":"Headline","title":"Release v1.9.0 · testem/testem","url":"https://github.com/testem/testem/releases/tag/v1.9.0","tags":["testing","JavaScript","ReleaseNote","library","Tools"],"content":"testem 1.9.0リリース。\nカスタムレポーターがmetaデータを受け取る事ができるようになった","relatedLinks":[]},{"category":"Headline","title":"Release 2.0.0 · jquery/qunit","url":"https://github.com/jquery/qunit/releases/tag/2.0.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"QUnit 2.0.0リリース。\n非推奨のグローバル関数を削除、メソッドのリネームなど破壊的な変更が含まれれる\n\n- `module()`、`test()`はそれぞれ`QUnit.*`以下に移動\n- `start()`、`stop()`の代わりに`assert.async()`\n- `setup`/`teardown`は`beforeEach`/`afterEach`に\n- `QUnit.init`と`QUnit.reset`の削除\n\nアップグレードガイドは以下を参照","relatedLinks":[{"title":"QUnit 2.x Upgrade Guide | QUnit","url":"http://qunitjs.com/upgrade-guide-2.x/"}]},{"category":"Headline","title":"ESLint v2.13.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/06/eslint-v2.13.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v2.13.0リリース。\n2.x系では最後になり、次は3.0.0が予定されている","relatedLinks":[{"title":"Proposal for 3.0.0 · Issue #6356 · eslint/eslint","url":"https://github.com/eslint/eslint/issues/6356"}]},{"category":"Headline","title":"RC2 Now Available","url":"http://angularjs.blogspot.com/2016/06/rc2-now-available.html","tags":["AngularJS","ReleaseNote"],"content":"Angular2 RC2リリース","relatedLinks":[{"title":"Angular 2 RC.2がリリースされました | Angular2 Info","url":"http://ng2-info.github.io/2016/06/16/angular-2-rc-2/"}]},{"category":"Headline","title":"Safari 10.0","url":"https://developer.apple.com/library/prerelease/content/releasenotes/General/WhatsNewInSafari/Articles/Safari_10_0.html","tags":["safari","ReleaseNote"],"content":"Safari 10のリリースノート。\nIndexedDB、CSP、Shadow DOM v1、ES6、ECMA i18n APIなど","relatedLinks":[]},{"category":"Article","title":"ReactでTDD（テスト駆動開発）を始めよう : 環境構築からテスト作成、機能実装までの詳解ガイド | プログラミング | POSTD","url":"http://postd.cc/getting-started-with-tdd-in-react/","tags":["React","testing","翻訳"],"content":"React ComponentをTDDする話","relatedLinks":[]},{"category":"Article","title":"A Quick Introduction To Polymer — WebComponents.org","url":"http://webcomponents.org/articles/a-quick-polymer-introduction/","tags":["WebComponents","library","tutorial"],"content":"Polymer入門向けの概要を説明した文章","relatedLinks":[]},{"category":"Article","title":"実例とともに学ぶECMAScript 2015 〜Generator〜 – NET BIZ DIV. TECH BLOG","url":"https://tech.recruit-mp.co.jp/front-end/post-10358/","tags":["ECMAScript","JavaScript"],"content":"Generator、Iteratorについて。\nIterableを扱うfor of、`Array.from`、spread operatorについて。\n「GeneratorはIteratorを返す関数」に至るまでを丁寧に解説してる記事","relatedLinks":[]},{"category":"Article","title":"The SoundCloud Client in React + Redux - RWieruch","url":"http://www.robinwieruch.de/the-soundcloud-client-in-react-redux/","tags":["React","redux","tutorial"],"content":"React+ReduxでSoundcloudのクライアントを作るチュートリアル","relatedLinks":[]},{"category":"Article","title":"The Future of Declaration Files | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2016/06/15/the-future-of-declaration-files/","tags":["npm","TypeScript"],"content":"npmからTypeScriptの型定義ファイルをインストールして使えるようになるという話。\n\n`npm install --save @types/lodash` のような形で他にツールを必要としない","relatedLinks":[{"title":"TypeScript Types Search","url":"http://microsoft.github.io/TypeSearch/"}]},{"category":"SlideVideo","title":"Tips &amp; Tricks in Front-End Development // Speaker Deck","url":"https://speakerdeck.com/forloop/tips-and-tricks-in-front-end-development","tags":["CSS","スライド","Tips"],"content":"`object-fit`、Viewport unit、既読リンクの扱い、壊れた`<img />`の表示、要素内が空の場合の表示、postMessage、SVGなどのフロントエンド向けのTips","relatedLinks":[]},{"category":"SlideVideo","title":"CSS Animations, Orchestrated by David Khourshid","url":"http://slides.com/davidkhourshid/deck-17#/","tags":["CSS","スライド"],"content":"CSSアニメーションのまとめかたについてのスライド","relatedLinks":[]},{"category":"SlideVideo","title":"Resource (pre)loading","url":"http://yoavweiss.github.io/link_htmlspecial_16/","tags":["HTML","スライド"],"content":"`<link rel>`についてのスライド\nprefetch、resource loading、feature detectionについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"mgiuca/web-share: Web API proposal for sharing data from a web page","url":"https://github.com/mgiuca/web-share","tags":["WebPlatformAPI","spec"],"content":"`navigator.share`のAPIについてのドキュメント。\nAndroidのintents、iOSのUIActivityViewControllerのような共有するためのAPI。\nChromeで実装検討中","relatedLinks":[{"title":"Web Share - Chrome Platform Status","url":"https://www.chromestatus.com/feature/5668769141620736"},{"title":"Web Share API for sharing content to arbitrary destination - APIs - WICG","url":"https://discourse.wicg.io/t/web-share-api-for-sharing-content-to-arbitrary-destination/1561/4"}]},{"category":"SoftwareLibrary","title":"fed135/Kalm: Node socket wrapper and optimizer","url":"https://github.com/fed135/Kalm","tags":["WebSocket","JavaScript","node.js","WebRTC","library"],"content":"WebSocketやWebRTCなど双方向の通信を行うライブラリ。\nNagleアルゴリズムの実装など効率よくパケットを送れるような仕組みを持っている。\nAdapterで利用するプロトコルを変更できるようになっている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"af/envalid: Environment variable validation for Node.js","url":"https://github.com/af/envalid","tags":["node.js","JavaScript","library"],"content":"Node.jsの`process.env`の値をバリデーションするライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"headless - chromium/src - Git at Google","url":"https://chromium.googlesource.com/chromium/src/+/master/headless/","tags":["Chrome"],"content":"Chromiumヘッドレスブラウザのリポジトリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"alexreardon/raf-stub: Accurate and predictable testing of requestAnimationFrame and cancelAnimationFrame","url":"https://github.com/alexreardon/raf-stub","tags":["JavaScript","animation","testing","library"],"content":"`requestAnimationFrame`のstubライブラリ。\nステップごとにframeを進めることができる","relatedLinks":[]},{"category":"Book","title":"Manning | Angular 2 in Action","url":"https://www.manning.com/books/angular-2-in-action","tags":["AngularJS","book"],"content":"Angular 2についての書籍","relatedLinks":[{"title":"Angular 2 in Action","url":"https://github.com/angular-in-action/"}]}]},{"meta":{"title":"2016-06-27のJS: Babel 6.11.0、Safari TP7、Firefox 49の開発者ツール","author":"azu","layout":"post","date":"2016-06-27T11:03:00.000Z","category":"JSer","tags":["Babel","Safari","Firefox","debug"],"url":"https://jser.info/2016/06/27/babel-6110safari-tp7firefox-49/"},"items":[{"category":"Headline","title":"Release v6.11.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v6.11.0","tags":["babel","ReleaseNote"],"content":"Babel 6.11.0リリース。\n`es2016` presetを追加、その他のProposalも現在のStageに追従。","relatedLinks":[{"title":"tc39/proposals: Tracking ECMAScript Proposals","url":"https://github.com/tc39/proposals"}]},{"category":"Headline","title":"Release v1.0.0 · karma-runner/karma","url":"https://github.com/karma-runner/karma/releases/tag/v1.0.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Karma 1.0.0リリース。\npreprocessorの実行順序をファイル種別で制御できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at 9.3.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/9.3.0/Changelog.md","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"jsdom 9.3.0リリース。\n`Audio`コンストラクタのサポート、`Image`の挙動を仕様準拠となるように修正など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview Release 7 | WebKit","url":"https://webkit.org/blog/6640/release-notes-for-safari-technology-preview-release-7/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 7リリース。\n`addEventListener`がEventListenerOptionsをサポート、`window.onerror`で`error`オブジェクトを受け取れるように。\n[関数の引数における末尾カンマ](http://jeffmo.github.io/es-trailing-function-commas/)のサポート、`::placeholder`のprefixが外れるなど","relatedLinks":[{"title":"jeffmo/es-trailing-function-commas","url":"https://github.com/jeffmo/es-trailing-function-commas"}]},{"category":"Article","title":"ESLint Part 1: Exploration | Scott Nonnenberg","url":"https://blog.scottnonnenberg.com/eslint-part-1-exploration/","tags":["ESLint","tutorial"],"content":"ESLintの導入から設定についてのチュートリアル","relatedLinks":[]},{"category":"Article","title":"Developer Edition 49: Network Request Stack Traces and more ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2016/06/developer-edition-49-network-request-stack-traces-and-more/","tags":["firefox","debug"],"content":"Firefox 49の開発者ツールについて。\nネットワークパネルでどこから通信が発生したのかスタックトレースできるように、エラーメッセージの詳細をMDNで見られるように、アクセシビリティの改善など","relatedLinks":[{"title":"David Baron","url":"http://dbaron.org/log/20150916-compositor-animations"},{"title":"Developer Edition 49：ネットワークモニタでのスタックトレース表示、など | Mozilla Developer Street (modest)","url":"https://dev.mozilla.jp/2016/06/developer-edition-49-network-request-stack-traces-and-more/"}]},{"category":"Article","title":"A 𝝺-calculus interpreter","url":"http://tadeuzagallo.com/blog/writing-a-lambda-calculus-interpreter-in-javascript/","tags":["JavaScript","tutorial"],"content":"JavaScriptで小さなλ言語のパーサとインタプリタを実装するチュートリアル。","relatedLinks":[]},{"category":"Article","title":"15 Ways to Write Self-documenting JavaScript","url":"https://www.sitepoint.com/self-documenting-javascript/","tags":["JavaScript"],"content":"Self-documentingなコードを書く方法について","relatedLinks":[]},{"category":"Article","title":"Debugging Node.js Nightlies with Chrome DevTools — Medium","url":"https://medium.com/@paul_irish/debugging-node-js-nightlies-with-chrome-devtools-7c4a1b95ae27","tags":["node.js","V8"],"content":"Node.jsのnightlyに入ったChromeの開発者ツールでのデバッグの方法について","relatedLinks":[]},{"category":"Article","title":"Autoprefixer on Twitter: &quot;To clean CSS from prefixes run Autoprefixer with browsers: [] https://t.co/5CVdedVFMV&quot;","url":"https://twitter.com/autoprefixer/status/745762946626764804","tags":["CSS","設定"],"content":"CSSからprefixを外すには対象ブラウザの設定無しにしたAutoPrefixerを実行すれば良いというTips","relatedLinks":[]},{"category":"Article","title":"RxJS(5.x)で行うテストファーストな機能開発 | MMMブログ","url":"http://blog.mmmcorp.co.jp/blog/2016/06/25/testing-rxjs-5/","tags":["Rx","testing"],"content":"RxJS 5のObservableをマーブル記法というDSLで書いてテストする方法について","relatedLinks":[]},{"category":"Article","title":"TypeScript の型定義ファイルと仲良くなろう - Hatena Developer Blog","url":"http://developer.hatenastaff.com/entry/2016/06/27/140931","tags":["TypeScript"],"content":"TypeScriptの型定義でのハマりどころや、型定義ファイルの読み書きに必要な知識について","relatedLinks":[]},{"category":"WebsiteDocument","title":"JavaScript error reference - JavaScript | MDN","url":"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors","tags":["JavaScript","debug","document","リファレンス"],"content":"JavaScriptのよくあるエラーメッセージのリファレンス。\n何が問題で起きてるのか、実際に起きるサンプルコードがまとめられている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Monaco Editor","url":"https://microsoft.github.io/monaco-editor/","tags":["JavaScript","editor","library"],"content":"VS Codeのエディタ部分であるMonaco Editorが個別のパッケージとして公開された","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tmanderson/babelconf: Conveniently create a .babelrc configuration","url":"https://github.com/tmanderson/babelconf","tags":["babel","設定","Tools"],"content":"`.babelrc` の設定を選択式で作成できるCLI","relatedLinks":[]},{"category":"SoftwareLibrary","title":"thoov/mock-socket: Javascript mocking library for websockets and socket.io","url":"https://github.com/thoov/mock-socket","tags":["WebSocket","library"],"content":"WebSocketsとSocket.IOのモックライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"davidmarkclements/0x: Flame Graph Profiling with a Single Command","url":"https://github.com/davidmarkclements/0x","tags":["JavaScript","library"],"content":"インタラクティブなフレームグラフを作成できるツール。\n\nNode.jsで実行したアプリのスタックトレースをフレームグラフで可視化できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"markerikson/redux-ecosystem-links: A categorized list of Redux-related addons, libraries, and utilities","url":"https://github.com/markerikson/redux-ecosystem-links","tags":["redux","まとめ"],"content":"Redux関連のライブラリなどについてのまとめ","relatedLinks":[]},{"category":"Book","title":"Amazon.co.jp： Js.next: Ecmascript 6: Aaron Frost: 洋書","url":"https://www.amazon.co.jp/Js-next-Ecmascript-6-Aaron-Frost/dp/1449336361","tags":["JavaScript","book"],"content":"2017年4月25日発売\nES6についての書籍","relatedLinks":[{"title":"JS.Next - O","url":"http://shop.oreilly.com/product/0636920026396.do"}]},{"category":"Book","title":"SVG Animations: From Common UX Implementations to Complex Responsive Animation: Sarah Drasner: 9781491939703: Amazon.com: Books","url":"https://www.amazon.com/SVG-Animations-Implementations-Responsive-Animation/dp/1491939702","tags":["SVG","book"],"content":"2017年1月25日発売\nSVGアニメーションについての書籍","relatedLinks":[]}]},{"meta":{"title":"2016-07-04のJS: D3 4.0.0、Servo Nightly、ECMAScript as a Living Standard","author":"azu","layout":"post","date":"2016-07-04T13:32:00.000Z","category":"JSer","tags":["D3","SVG","Servo","browser","ECMAScript"],"url":"https://jser.info/2016/07/04/d3-400servo-nightlyecmascript-as-a-living-standard/"},"items":[{"category":"Headline","title":"Release Cycle Diversity · cyclejs/core","url":"https://github.com/cyclejs/core/releases/tag/v7.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"Cycle.js 7.0.0リリース。\nRxJS、most.js、xstreamを選んで使えるように、TypeScriptで書き直し、vDOMとしてsnabbdomを使うようになるなど","relatedLinks":[{"title":"snabbdom","url":"https://github.com/paldepind/snabbdom/"}]},{"category":"Headline","title":"Release v15.2.0 · facebook/react","url":"https://github.com/facebook/react/releases/tag/v15.2.0","tags":["React","ReleaseNote"],"content":"React 15.2.0リリース。\nエラーコードが追加されURLから詳細が見られるように、warningメッセージにコンポーネントスタック情報を追加、`React.PropTypes.symbol`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release 2.0.0 · sweet-js/sweet.js","url":"https://github.com/sweet-js/sweet.js/releases/tag/v2.0.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"JavaScriptでマクロを扱うsweet.js 2.0.0リリース。\ncontext APIが変更された","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · d3/d3","url":"https://github.com/d3/d3/releases/tag/v4.0.0","tags":["JavaScript","SVG","library"],"content":"D3.js 4.0.0リリース。\n`d3-scale`や`d3-time`のようにそれぞれの機能がモジュールに分割され、npmパッケージとして個別にインストールできる。\n合わせて機能追加や修正が行われている","relatedLinks":[{"title":"d3/CHANGES.md at master · d3/d3","url":"https://github.com/d3/d3/blob/master/CHANGES.md"}]},{"category":"Headline","title":"ESLint v3.0.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/07/eslint-v3.0.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 3.0.0リリース。\n`eslint:recommended`のアップデート、設定ファイル/設定が指定されてない場合は警告がでるように、Node.js 0.12のサポート終了など","relatedLinks":[{"title":"ESLint v3.0.0 - Qiita","url":"http://qiita.com/mysticatea/items/9c8a8b1219d5f94441e8"}]},{"category":"Article","title":"Servo Nightly Builds Available","url":"https://blog.servo.org/2016/06/30/servo-nightlies/","tags":["browser","Mozilla"],"content":"Mozillaの開発するレンダリングエンジンのServoのDeveloper Preview版が公開された","relatedLinks":[]},{"category":"Article","title":"How to Upgrade a Node Module The Right Way - Jama Software","url":"http://www.jamasoftware.com/blog/upgrade-node-module-right-way/","tags":["JavaScript","npm","webpack"],"content":"依存モジュールの非互換性なアップデートをどうやってアップグレードしていくかについて。react-routerを例に紹介してる。\nwebpackのaliasを使ってFeature Flagを作り、フラグ切り替えで新旧の実装を並べて書いていく。","relatedLinks":[]},{"category":"Article","title":"Intersection Observer を用いた要素出現検出の最適化 | blog.jxck.io","url":"https://blog.jxck.io/entries/2016-06-25/intersection-observer.html","tags":["DOM"],"content":"Intersection Observerの使い方や従来の方法との違いについて。\nスクロール量や要素の表示に応じた処理","relatedLinks":[]},{"category":"SlideVideo","title":"ECMAScript as a Living Standard","url":"http://azu.github.io/slide/2016/node-es/ecmascript.html","tags":["ECMAScript","スライド","JavaScript","browser"],"content":"ECMAScript仕様策定のプロセスを理解することで、ECMAScriptに関する情報を見る方法がわかるという話。\nES2015は毎年リリースに向けてのベースとなるような仕様であるため、これから足りない部分については議論が進んで行く","relatedLinks":[{"title":"Node学園 21時限目でECMAScript as a Living Standardという発表をした | Web Scratch","url":"http://efcl.info/2016/06/29/node-ecmascript/"}]},{"category":"WebsiteDocument","title":"holyjs/holyjs: HolyJS - NodeJS Server Project Starter","url":"https://github.com/holyjs/holyjs","tags":["node.js","サーバー","template"],"content":"Node.jsでサーバサイドのプロジェクトテンプレート","relatedLinks":[]},{"category":"SoftwareLibrary","title":"juliangarnier/anime: Javascript Animation Engine","url":"https://github.com/juliangarnier/anime","tags":["JavaScript","CSS","animation","library"],"content":"CSSアニメーション管理ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"planttheidea/vidz: A zero-dependency, framework-agnostic video implementation","url":"https://github.com/planttheidea/vidz","tags":["JavaScript","動画","library"],"content":"Video要素でのロードやイベントハンドリングなどを扱うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"planttheidea/crio: Immutable objects and arrays in a natural way","url":"https://github.com/planttheidea/crio","tags":["JavaScript","library"],"content":"ArrayとObjectのImmutable版を提供するライブラリ。\nMutableとして操作したい場合は、ネイティブのもので操作してラップするか、`.mutable(array => {})`を利用できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"leebyron/iterall: Minimal zero-dependency utilities for using Iterables in all JavaScript environments.","url":"https://github.com/leebyron/iterall","tags":["JavaScript","library"],"content":"ArrayやArray-likeなどをiterableとして扱う`forEach`の処理を書くためのライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ejs - Readable JavaScript Errors","url":"https://i-break-codes.github.io/ejs/","tags":["JavaScript","library","debug"],"content":"`window.onerror`でJavaScriptのエラーを整形してコンソールに表示してくれるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"caiogondim/fast-memoize.js: Fastest possible memoization library","url":"https://github.com/caiogondim/fast-memoize.js","tags":["JavaScript","library"],"content":"メモ化ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gcanti/babel-plugin-tcomb: Babel plugin for static and runtime type checking using Flow and tcomb","url":"https://github.com/gcanti/babel-plugin-tcomb","tags":["flowtype","babel","JavaScript"],"content":"FlowTypeの型をtcombを使いランタイムassertに変換するBabelプラグイン","relatedLinks":[]},{"category":"Book","title":"Modular JS: Practical ES6 - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920047124.do","tags":["JavaScript","ECMAScript","book"],"content":"2016年8月発売\nES6についての書籍","relatedLinks":[]}]},{"meta":{"title":"2016-07-11のJS: jQuery 3.1、Node.js 6.3、Web Animations API入門","author":"azu","layout":"post","date":"2016-07-11T11:19:00.000Z","category":"JSer","tags":["jQuery","Node.js","animation"],"url":"https://jser.info/2016/07/11/jquery-31nodejs-63web-animations-api/"},"items":[{"category":"Headline","title":"jQuery 3.1.0 Released – No More Silent Errors | Official jQuery Blog","url":"http://blog.jquery.com/2016/07/07/jquery-3-1-0-released-no-more-silent-errors/","tags":["jQuery","ReleaseNote"],"content":"jQuery 3.1.0リリース。\n`jQuery.readyException`で`ready`時に起きたエラーのログを取れるように","relatedLinks":[{"title":"Bugsnag Blog - A Warning About jQuery 3","url":"http://blog.bugsnag.com/a-warning-about-jquery-3"}]},{"category":"Headline","title":"angular/CHANGELOG.md at 2.0.0-rc.4 · angular/angular","url":"https://github.com/angular/angular/blob/2.0.0-rc.4/CHANGELOG.md","tags":["AngularJS","ReleaseNote"],"content":"Angular 2 RC4リリース。\nテスト周りの構造が大きく変化し、JasmineではなくMochaでもテストを実行できるようになるなど","relatedLinks":[{"title":"Angular 2 RC.4の変更点 | Angular2 Info","url":"http://ng2-info.github.io/2016/07/08/angular-2-rc-4/"},{"title":"Cannot use Mocha to write angular2 tests · Issue #5395 · angular/angular","url":"https://github.com/angular/angular/issues/5395"}]},{"category":"Headline","title":"Node v6.3.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v6.3.0/","tags":["node.js","ReleaseNote"],"content":"Node v6.3.0リリース。\n`buffer.swap64()`の追加、shared libraryとしてNode.jsを使えるようにビルドオプションの追加、`setImmediate()`のパフォーマンス改善、V8 inspectorを実験的にサポートしChromeの開発者ツールでデバッグできるようになるなど","relatedLinks":[{"title":"Debugging Node.js Nightlies with Chrome DevTools — Medium","url":"https://medium.com/@paul_irish/debugging-node-js-nightlies-with-chrome-devtools-7c4a1b95ae27"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview Release 8 | WebKit","url":"https://webkit.org/blog/6744/release-notes-for-safari-technology-preview-release-8/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 8リリース。\nES6の実装完了、Apple Payのコードをリポジトリに移動、`:focus-within`のサポートなど","relatedLinks":[]},{"category":"Article","title":"Teach Access Portal","url":"https://teachaccess.github.io/tutorial/","tags":["accessibility","WAI-ARIA","tutorial"],"content":"WAI-ARIAなどのaccessibleなHTMLの書き方のチュートリアル。\n実際に書きながら試す事ができる","relatedLinks":[]},{"category":"Article","title":"Accessible SVGs | CSS-Tricks","url":"https://css-tricks.com/accessible-svgs/","tags":["SVG","accessibility","WAI-ARIA"],"content":"AccessibleなSVGの作り方について","relatedLinks":[]},{"category":"Article","title":"metagrover/ES6-for-humans: A kickstarter guide to writing ES6.","url":"https://github.com/metagrover/ES6-for-humans","tags":["JavaScript","tutorial"],"content":"ES6で増えた構文や機能の簡単な紹介","relatedLinks":[]},{"category":"Article","title":"How well do you know CSS display?","url":"https://www.chenhuijing.com/blog/how-well-do-you-know-display/","tags":["CSS"],"content":"CSSのdisplayプロパティに指定できる値とそれぞれの挙動についての解説","relatedLinks":[]},{"category":"Article","title":"Backbone.jsにReduxを導入してみる - Qiita","url":"http://qiita.com/takeshy/items/2bca340ffa157841a482","tags":["backbone.js","redux"],"content":"Backbone.jsのみで管理していたStateをReduxを使い管理するようにしてみた話。\nredux-devtools-extensionを使ってStateの変化を確認する方法について","relatedLinks":[{"title":"Mihail Diordiev - Debugging flux applications in production at react-europe 2016 - YouTube","url":"https://www.youtube.com/watch?v=cbXLohVbzNI"},{"title":"redux-devtools-extension","url":"https://github.com/zalmoxisus/redux-devtools-extension"}]},{"category":"SlideVideo","title":"BlinkOn 6 - Munich, Germany - YouTube","url":"https://www.youtube.com/watch?v=iCSAUHpPbiU","tags":["V8","Chrome","動画"],"content":"BlinkOn 6の動画一覧","relatedLinks":[{"title":"BlinkOn6 One Pager - Google ドキュメント","url":"https://docs.google.com/document/d/1eYSF1eUAJefn2mRyY6saUzQc4JWQE3tZZhwgLjohvDY/preview"}]},{"category":"WebsiteDocument","title":"Web Animations APIの基本的な使い方・まとめ","url":"http://www.h2.dion.ne.jp/~defghi/webanim/webanim.htm","tags":["animation","API","JavaScript"],"content":"Web Animations APIについての解説サイト。\n実際に動かしながらアニメーションの作成方法について学ぶことができる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"paulirish/devtools-timeline-model: Parse raw trace data into the Chrome DevTools&#x27; structured profiling data models","url":"https://github.com/paulirish/devtools-timeline-model","tags":["Chrome","library","performance"],"content":"Chrome開発者ツールのTimelineデータの処理ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"boopathi/babel-minify: Some babel plugins and tools to minify ES6+ code","url":"https://github.com/boopathi/babel-minify","tags":["babel","library"],"content":"Babelでminifyをするプラグインのpreset。\n使ってないコードの削除、インライン化、mangleなどを行う","relatedLinks":[]},{"category":"SoftwareLibrary","title":"filipelinhares/ress: A modern CSS reset","url":"https://github.com/filipelinhares/ress","tags":["CSS","library"],"content":"normalize.cssにいくつかデフォルト値やresetを追加したもの","relatedLinks":[]},{"category":"SoftwareLibrary","title":"thejameskyle/assert-equal-jsx: assertEqualJSX","url":"https://github.com/thejameskyle/assert-equal-jsx","tags":["jsx","testing","library"],"content":"JSXのタグ同士の比較を行うassertionライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"declandewet/common-tags: Useful template literal tags for dealing with strings in ES2015+","url":"https://github.com/declandewet/common-tags","tags":["ECMAScript","library"],"content":"Tagged Templateとして使える関数ライブラリ","relatedLinks":[]},{"category":"Book","title":"JavaScript Functions… by Amin Meyghani [PDF/iPad/Kindle]","url":"https://leanpub.com/javascript-closure","tags":["JavaScript","book"],"content":"JavaScriptの関数やクロージャー、prototypeなどについて扱う書籍。\n$0から購入できる","relatedLinks":[]},{"category":"Book","title":"Practical… by Daniel Schmitz et al. [Leanpub PDF/iPad/Kindle]","url":"https://leanpub.com/vue","tags":["JavaScript","book"],"content":"Vue.jsについて書籍","relatedLinks":[]}]},{"meta":{"title":"2016-07-19のJS: Async 2.0、aXe 2.0、TypeScript 2.0β","author":"azu","layout":"post","date":"2016-07-19T00:50:00.000Z","category":"JSer","tags":["async","promise","accessibility","TypeScript"],"url":"https://jser.info/2016/07/19/async-20axe-20typescript-20b/"},"items":[{"category":"Headline","title":"ESLint v3.1.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/07/eslint-v3.1.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 3.1.0リリース。\nルールがエラーの開始位置のみしかレポートできなかったのが、範囲指定してエラーレポートできるようになるなど","relatedLinks":[{"title":"ESLint v3.1.0 - Qiita","url":"http://qiita.com/mysticatea/items/723a467a4eb47e4913e2"}]},{"category":"Headline","title":"Release Zepto.js 1.2.0 · madrobby/zepto","url":"https://github.com/madrobby/zepto/releases/tag/v1.2.0","tags":["JavaScript","jQuery","library","ReleaseNote"],"content":"Zepto.js 1.2.0リリース。\n`__proto__`をコードベースから削除、`$.noop`や`$.isNumeric()`の追加など","relatedLinks":[]},{"category":"Headline","title":"async/CHANGELOG.md at v2.0.0 · caolan/async","url":"https://github.com/caolan/async/blob/v2.0.0/CHANGELOG.md","tags":["JavaScript","library"],"content":"async 2.0.0リリース。\nES2015版の`async-es`の提供、`race`などの機能追加。\n破壊的な変更として`waterfall`の挙動変更、`filter`や`reject`などのコールバック関数が受け取る引数を変更など","relatedLinks":[{"title":"Async v2.0.0 リリース - Qiita","url":"http://qiita.com/suguru03/items/b73ab97482d5394b8f43"}]},{"category":"Headline","title":"Deque Launches aXe 2.0","url":"http://www.deque.com/blog/introducing-axe-2-0/","tags":["accessibility","testing","browser","ReleaseNote"],"content":"ウェブサイトのAccessibilityテストエンジンであるaXe 2.0リリース","relatedLinks":[{"title":"dequelabs/axe-core: Accessibility engine for automated Web UI testing","url":"https://github.com/dequelabs/axe-core"}]},{"category":"Headline","title":"protractor/CHANGELOG.md at 4.0.0 · angular/protractor","url":"https://github.com/angular/protractor/blob/4.0.0/CHANGELOG.md","tags":["JavaScript","TypeScript","testing","library"],"content":"Protractor 4.0.0リリース。\n`webdriver-manager`が個別のnpmモジュールとしてインストール可能に、TypeScriptの型定義ファイルを追加など","relatedLinks":[{"title":"webdriver-manager","url":"https://www.npmjs.com/package/webdriver-manager"}]},{"category":"Headline","title":"Announcing TypeScript 2.0 Beta | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2016/07/11/announcing-typescript-2-0-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.0βリリース。\nNon-nullable Type、module定義に`*`などが使えるように。\n`never` typeの追加、tsconfigでglobサポート、built-inの型定義ファイルを`--lib`で指定できるように、`--skipLibCheck`の追加など","relatedLinks":[{"title":"What's new in TypeScript · Microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/What%27s-new-in-TypeScript#typescript-20"},{"title":"TypeScript 2.0 Beta 変更点 - Qiita","url":"http://qiita.com/vvakame/items/ae239f3d6f6f08f7c719"}]},{"category":"Article","title":"4 Types of Memory Leaks in JavaScript and How to Get Rid Of Them","url":"https://auth0.com/blog/2016/01/26/four-types-of-leaks-in-your-javascript-code-and-how-to-get-rid-of-them/","tags":["JavaScript","debug"],"content":"JavaScriptでよくあるメモリリークのパターンについて。\nChrome開発者ツールを使ってメモリリークを見つける方法について","relatedLinks":[]},{"category":"Article","title":"Node.js における Promise を使った例外処理 - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2016/07/12/103734","tags":["node.js","Promises"],"content":"Node.jsのuncaughtExceptionとPromiseを使った場合のunhandledRejectionについて。\nそれぞれの違いや動作について","relatedLinks":[]},{"category":"Article","title":"What’s inside jQuery 3.0 | jQuery 3.0 new features","url":"https://codebrahma.com/whats-new-jquery-3-0/","tags":["jQuery"],"content":"jQuery 3の細かな変更について。\nstrict mode、for of、`requestAnimationFrame()`、エスケープの仕組み、jqXHR、`.show()`/`hide()`の改善、`.width()`/`.height()`が整数値ではなくなるなど","relatedLinks":[]},{"category":"Article","title":"The Lumpy Web - Tales of a Developer Advocate","url":"https://paul.kinlan.me/the-lumpy-web/","tags":["web ","WebPlatformAPI","spec","browser"],"content":"Webとブラウザにおける問題は大きく分けて3つに分類できる。\nブラウザ毎の実装違い(実装のバージョン違い)、仕様と実装の齟齬、実装優先度の問題。\nこれらの問題に対してどこを参照すれば、どのカテゴリの問題であるかを把握できるかについて書かれてる","relatedLinks":[]},{"category":"Article","title":"JavaScript variables hoisting in details","url":"https://rainsoft.io/javascript-hoisting-in-details/","tags":["JavaScript"],"content":"`var`のhoisting(巻き上げ)についての解説。\nまた`let`や`const`、`class`とTDZについて","relatedLinks":[]},{"category":"Article","title":"Mixins Considered Harmful | React","url":"https://facebook.github.io/react/blog/2016/07/13/mixins-considered-harmful.html","tags":["React"],"content":"ReactのMixinでやっていることは、higher-order componentsやutilを使うなど別の方法で解決できるという話","relatedLinks":[]},{"category":"Article","title":"enzyme+mocha+power-assertでReactコンポーネントのフルレンダリングテスト - wadackel.me","url":"https://blog.wadackel.me/2016/react-enzyme-mocha-power-assert/","tags":["JavaScript","DOM","testing"],"content":"Reactコンポーネントをjsdomとenzymeでテストする話","relatedLinks":[]},{"category":"SlideVideo","title":"Redux Middleware Wars (Japanese) // Speaker Deck","url":"https://speakerdeck.com/shuhei/redux-middleware-wars-japanese","tags":["redux","スライド"],"content":"Reduxで非同期処理を扱うMiddlewareについてのスライド。\nredux-thunk、redux-promise、redux-saga、redux-loop、redux-observableの比較","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ianstormtaylor/slate: A completely customizable framework for building rich text editors in the browser.","url":"https://github.com/ianstormtaylor/slate","tags":["JavaScript","React","library","editor"],"content":"リッチエディタを実装できるReact Component。\nロジックはプラグインとして実装できるためカスタマイズしやすい作り。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sindresorhus/conf: Simple config handling for your app or module","url":"https://github.com/sindresorhus/conf","tags":["node.js","library"],"content":"Node.jsでシンプルな設定保存ライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"carteb/carte-blanche: An isolated development space with integrated fuzz testing for your components. See them individually, explore them in different states and quickly and confidently develop them.","url":"https://github.com/carteb/carte-blanche","tags":["React","Tools"],"content":"React Componentのチェックができるツール。\nランダム/任意のデータを入れて描画結果がどうなるかを確認できる。\nスタイルガイド的なツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ECMAScript Version Detector","url":"https://azu.github.io/ecmascript-version-detector/","tags":["ECMAScript","JavaScript","Tools"],"content":"JavaScriptのコードを入力すると、そのコードの構文のECMAScript versionを出してくれるツールとライブラリ。\n書いてるコードがProposal段階なのかを判定できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"zingchart/zingtouch: A JavaScript touch gesture detection library for the modern web","url":"https://github.com/zingchart/zingtouch","tags":["JavaScript","mobile","library"],"content":"TouchとGestureの管理ライブラリ。\n`ZingTouch.Region(element)`で領域を作成し、その領域に対してイベントを設定できる","relatedLinks":[]}]},{"meta":{"title":"2016-07-26のJS: AngularJS 2でのState管理、React Componentパターン、アクセシビリティガイドライン","author":"azu","layout":"post","date":"2016-07-26T00:43:00.000Z","category":"JSer","tags":["Angular2","React","Accessibility"],"url":"https://jser.info/2016/07/26/angular2-state-react-component-accessibility/"},"items":[{"category":"Headline","title":"Dojo Recap – June, 2016 | The Dojo Toolkit Blog","url":"http://dojotoolkit.org/blog/dojo-recap-june-2016","tags":["JavaScript","library","ReleaseNote"],"content":"Dojo 1.11.2リリース。\nまたDojo 2の進捗について","relatedLinks":[]},{"category":"Headline","title":"Release 2.0.1 · jquery/qunit","url":"https://github.com/jquery/qunit/releases/tag/2.0.1","tags":["JavaScript","testing","ReleaseNote"],"content":"QUnit 2.0.1リリース。\nSymbolのダンプができるように","relatedLinks":[]},{"category":"Headline","title":"Qt WebBrowser 1.0 - Qt Blog","url":"http://blog.qt.io/blog/2016/07/18/qt-webbrowser-1-0/","tags":["browser"],"content":"Qt WebBrowser 1.0リリース。\nQt WebEngine(Chromium)を使ったブラウザ。","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview Release 9 | WebKit","url":"https://webkit.org/blog/6800/release-notes-for-safari-technology-preview-release-9/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 9リリース。","relatedLinks":[]},{"category":"Headline","title":"V8 JavaScript Engine: V8 Release 5.3","url":"http://v8project.blogspot.com/2016/07/v8-release-53.html","tags":["V8","ReleaseNote"],"content":"V8 5.3リリース。\nIgnition Interpreterの追加、Promiseのパフォーマンス改善、V8 APIの変更など","relatedLinks":[{"title":"Ignition: An Interpreter for V8 ","url":"https://docs.google.com/presentation/d/1OqjVqRhtwlKeKfvMdX6HaCIu9wpZsrzqpIVIwQSuiXQ/edit#slide=id.ge4ef702cb_2_20"}]},{"category":"Article","title":"Why object literals in JavaScript are cool","url":"https://rainsoft.io/why-object-literals-in-javascript-are-cool/","tags":["JavaScript"],"content":"JavaScriptのオブジェクトリテラルについて。\nプロパティの定義やES2015のshorthandやcomputed property nameについて","relatedLinks":[]},{"category":"Article","title":"The Most In-Depth Yet Understandable ES6 Destructuring Tutorial (complete with Assembled Avengers) | Untangled","url":"http://untangled.io/in-depth-es6-destructuring-with-assembled-avengers/","tags":["JavaScript","ECMAScript"],"content":"ES2015のDestructuringの挙動についての記事。\n大量のサンプルと共に複雑なパターンのDestructuringについてを解説してる。\nまたDestructuringを応用した使い方についてなど","relatedLinks":[{"title":"Advanced ES6 Destructuring Techniques | Untangled","url":"http://untangled.io/advanced-es6-destructuring-techniques/"}]},{"category":"Article","title":"6 compelling use cases for ES6 proxies","url":"http://devbryce.com/use-cases-for-es6-proxies/","tags":["proxy","JavaScript","ECMAScript"],"content":"Proxy APIのユースケースについて。\nバリデーション、private、ログ、変更禁止、`Proxy.revocable`について","relatedLinks":[]},{"category":"Article","title":"Tackling State — angular2","url":"https://vsavkin.com/managing-state-in-angular-2-applications-caf78d123d02","tags":["redux","JavaScript","AngularJS"],"content":"AngularJS 2とRxJSでのstate管理について。\n\nImmutable State、ActionによってStateは変更される。\nApplicationはObservableを受け取りObservableを返す、ApplicationとViewは分離される。\nこれらのコンセプトをどのように実現するかについてかかれている。","relatedLinks":[]},{"category":"Article","title":"React.js in patterns","url":"http://krasimirtsonev.com/blog/article/react-js-in-design-patterns","tags":["React"],"content":"React Componentのパターン。\nコンポーネントの入れ子や`this.props.children`、propsのやり取り、コンポーネント間のstate管理、DIについてなど","relatedLinks":[]},{"category":"Article","title":"Debugging the Production Web — Medium","url":"https://medium.com/@jrullmann/debugging-the-production-web-d36373b9440","tags":["JavaScript","debug"],"content":"本番のウェブアプリケーションのログについて。\nブラウザからどのようなログをどのように集めるか、手順をどのように再現するか、DevToolsについて","relatedLinks":[]},{"category":"Article","title":"Create Apps with No Configuration | React","url":"https://facebook.github.io/react/blog/2016/07/22/create-apps-with-no-configuration.html","tags":["React","Tools","console"],"content":"設定なしでReactアプリを書き始められるツール。\n`npm start`でサーバを立てて、`npm run build`でビルドできる。\n`npm run eject`でロックインから外れる事ができる。","relatedLinks":[{"title":"facebookincubator/create-react-app: Create React apps with no build configuration.","url":"https://github.com/facebookincubator/create-react-app"}]},{"category":"Article","title":"The Service Worker Lifecycle","url":"https://bitsofco.de/the-service-worker-lifecycle/","tags":["ServiceWorker"],"content":"ServiceWorkerのライフサイクルについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Vox Product Accessibility Guidelines","url":"http://accessibility.voxmedia.com/","tags":["accessibility"],"content":"Vox Mediaのアクセシビリティガイドライン。\n職種ごとにチェックリストが書かれている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Object Model","url":"http://objectmodel.js.org/","tags":["JavaScript","library"],"content":"プロパティの型定義したモデルクラスを作れるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nodeca/pica: Resize image in browser with high quality and high speed","url":"https://github.com/nodeca/pica","tags":["JavaScript","画像","library"],"content":"TypedArray、WebWorker、WebGLを使った画像リサイズライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"stefanjudis/forrest: An npm scripts desktop client","url":"https://github.com/stefanjudis/forrest","tags":["npm","software"],"content":"npm run-scriptのGUIクライアント","relatedLinks":[]},{"category":"SoftwareLibrary","title":"diegomura/react-log: React for the Console","url":"https://github.com/diegomura/react-log","tags":["React","library"],"content":"console.logへの出力をJSXで書くことができるReact Component","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Download Blisk - a browser for web developers","url":"https://blisk.io/","tags":["browser","Chrome","debug"],"content":"開発者向けの機能を持ったChromeベースのブラウザ。\nモバイル向けの機能、自動更新、パフォーマンス やエラーの可視化など","relatedLinks":[]},{"category":"Book","title":"Manning | Web Performance in Action","url":"https://www.manning.com/books/web-performance-in-action","tags":["web ","performance","book"],"content":"2017年 春発売。\nウェブパフォーマンスについての書籍。\nブラウザでのレンダリング、HTTP/2などについて","relatedLinks":[]}]},{"meta":{"title":"2016-08-02のJS: Mocha 3.0、React 15.3.0、ECMAScript Proposalの進捗","author":"azu","layout":"post","date":"2016-08-01T14:28:00.000Z","category":"JSer","tags":["testing","React","ECMAScript"],"url":"https://jser.info/2016/08/01/mocha-30react-1530ecmascript-proposal/"},"items":[{"category":"Headline","title":"Aurelia 1.0 is Here!!!","url":"http://blog.durandal.io/2016/07/27/aurelia-1-0-is-here/","tags":["JavaScript","library","ReleaseNote"],"content":"Aurelia 1.0リリース","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember.js 2.7 and 2.8 Beta Released","url":"http://emberjs.com/blog/2016/07/25/ember-2-7-and-2-8-beta-released.html","tags":["JavaScript","ReleaseNote","library"],"content":"Ember.js 2.7と2.8 Betaリリース。\nEmber 2.8では`Ember.Engine`、`Array#includes`のpolyfill、`Ember.String.isHTMLSafe`などが追加される","relatedLinks":[]},{"category":"Headline","title":"mocha/CHANGELOG.md at master · mochajs/mocha","url":"https://github.com/mochajs/mocha/blob/master/CHANGELOG.md#300--2016-07-31","tags":["JavaScript","testing","ReleaseNote"],"content":"Mocha 3.0.0リリース。 非同期テスト時に`done()`の実装とPromiseを返すとエラーになる、`--grep`で正規表現リテラル的な文字列が指定可能に、`describe.only`の動作を改善など","relatedLinks":[]},{"category":"Headline","title":"Jest 14.0: React Tree Snapshot Testing · Jest","url":"http://facebook.github.io/jest/blog/2016/07/27/jest-14.html","tags":["React","testing","library"],"content":"Jest 14.0リリース。\nReact Componentのsnapshot testing、React Nativeサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v15.3.0 · facebook/react","url":"https://github.com/facebook/react/releases/tag/v15.3.0","tags":["React","ReleaseNote"],"content":"React 15.3.0リリース。\n`React.PureComponent`の追加、propTypesのバリデーション改善、テスト向けの`react-test-renderer`を公開など","relatedLinks":[]},{"category":"Headline","title":"ESLint v3.2.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/07/eslint-v3.2.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v3.2.0リリース。\n`no-tab`ルールの追加など","relatedLinks":[{"title":"ESLint v3.2.0 - Qiita","url":"http://qiita.com/mysticatea/items/706f4bb024d7ceb78f1d"}]},{"category":"Headline","title":"Release v6.12.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v6.12.0","tags":["babel","ReleaseNote"],"content":"Babel v6.12.0リリース。\n`babel-plugin-transform-runtime`に`helpers: false`を追加。\n` babel-plugin-transform-es2015-modules-umd `に`exactGlobals`オプションを追加など","relatedLinks":[]},{"category":"Article","title":"ECMAScript proposal updates @ 2016-07 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/2016/07/30/last-minutes-proposals-changes","tags":["ECMAScript","proposal"],"content":"2016年7月のミーティングのProposal statusの変化まとめ。\nAsync/Awaitとtrailing function commasがstage 4になった","relatedLinks":[]},{"category":"Article","title":"A Comprehensive Guide to Font Loading Strategies—zachleat.com","url":"https://www.zachleat.com/web/comprehensive-webfonts/","tags":["CSS","fonts"],"content":"Font Loadingの手法やそれぞれの良いところ、良くないところについてのまとめ","relatedLinks":[]},{"category":"Article","title":"A step-by-step TDD approach on testing React components using Enzyme","url":"http://thereignn.ghost.io/a-step-by-step-tdd-approach-on-testing-react-components-using-enzyme/","tags":["React","jsx","testing"],"content":"Enzymeを使ったReact ComponentのTDDについて。\nReact Componentをテスト駆動で開発するチュートリアル","relatedLinks":[]},{"category":"Article","title":"Taming requestAnimationFrame and requestIdleCallback","url":"https://www.webreflection.co.uk/blog/2016/07/31/taming-raf-and-rick","tags":["JavaScript","library"],"content":"requestAnimationFrame/requestIdleCallbackなどのスケジューリングを行うライブラリについて","relatedLinks":[{"title":"WebReflection/sob: Schedule on Browser","url":"https://github.com/WebReflection/sob"}]},{"category":"Article","title":"CSS: will-change指定時の挙動, パフォーマンスへの影響と考察 - Qiita","url":"http://qiita.com/damele0n/items/71352757d0e6fdf5b184","tags":["CSS","browser","performance"],"content":"CSSの`will-change`の効果の検証とブラウザの実装(ソースコード)について。\n指定した値毎の挙動についてなど","relatedLinks":[]},{"category":"Article","title":"React v0.14.x から v15.2.x へのアップデート録 ::ハブろぐ","url":"https://havelog.ayumusato.com/develop/javascript/e717-react_v15_upgrade.html","tags":["React"],"content":"React 0.14.xから15.2へのアップデートした際に出る警告と対処法について","relatedLinks":[]},{"category":"Article","title":"JavaScript Systems Music","url":"http://teropa.info/blog/2016/07/28/javascript-systems-music.html","tags":["JavaScript","music"],"content":"JavaScriptでSystems Music","relatedLinks":[{"title":"Systems music - Wikipedia, the free encyclopedia","url":"https://en.wikipedia.org/wiki/Systems_music"}]},{"category":"SlideVideo","title":"Vue.js @ Laracon - Google スライド","url":"https://docs.google.com/presentation/d/16MpK3I2LZz47QdLg3uMNkCC3PqmM0znXF3-FdCEpics/mobilepresent#slide=id.p","tags":["JavaScript","library","スライド"],"content":"Vue.js 2.0のコンセプトについてのスライド","relatedLinks":[]},{"category":"SlideVideo","title":"Async Redux Module 1 // Speaker Deck","url":"https://speakerdeck.com/freddyrangel/async-redux-module-1","tags":["redux","スライド"],"content":"Reduxでの非同期についてのスライド集。\nそもそも動きから、middleware、thunk、sagaについて","relatedLinks":[{"title":"Async Redux Module 2 // Speaker Deck","url":"https://speakerdeck.com/freddyrangel/async-redux-module-2"},{"title":"Async Redux Module 3 // Speaker Deck","url":"https://speakerdeck.com/freddyrangel/async-redux-module-3"},{"title":"Async Redux Module 4 // Speaker Deck","url":"https://speakerdeck.com/freddyrangel/async-redux-module-4"},{"title":"Async Redux Module 5 // Speaker Deck","url":"https://speakerdeck.com/freddyrangel/async-redux-module-5"}]},{"category":"SlideVideo","title":"Modern Javascript | AngularClass","url":"http://courses.angularclass.com/courses/modern-javascript","tags":["JavaScript","動画"],"content":"JavaScriptについての動画講座。\nES5の復習からES6の新しい機能、TypeScript、npm、webpackについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"はじめに | 目次","url":"http://vuex.vuejs.org/ja/","tags":["JavaScript","library","document","翻訳"],"content":"Vuexについてのドキュメント訳","relatedLinks":[]},{"category":"SoftwareLibrary","title":"CodeceptJS","url":"http://codecept.io/","tags":["php","JavaScript","testing","library"],"content":"PHPのCodeceptionインスパイアなJavaScriptテストフレームワーク。\nシナリオテストのハイレベルAPIで、Protractorなど他のtest runnerの中でも動かせる。","relatedLinks":[{"title":"Codeception","url":"http://codeception.com/"}]},{"category":"SoftwareLibrary","title":"rkendall/reffix: The Reference Fixer for analyzing and fixing broken path references in files.","url":"https://github.com/rkendall/reffix","tags":["JavaScript","Tools"],"content":"JavaScriptのrequireやimportのパス、HTMLのimgやscriptのパスのチェックと修正ができるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mgol/check-dependencies: Checks if currently installed npm dependencies are installed in the exact same versions that are specified in package.json","url":"https://github.com/mgol/check-dependencies","tags":["npm","library","console","Tools"],"content":"npmでインストールしているバージョンとpacakge.jsonのバージョンが同一なのかをチェックできるライブラリとCLI","relatedLinks":[]},{"category":"Book","title":"Front-End Web Development: The Big Nerd Ranch Guide: Chris Aquino, Todd Gandee: 9780134433943: Amazon.com: Books","url":"https://www.amazon.com/Front-End-Web-Development-Ranch-Guide/dp/0134433947","tags":["JavaScript","CSS","book"],"content":"2016年8月11日発売\nEmber.jsを使ったウェブアプリについての書籍","relatedLinks":[]}]},{"meta":{"title":"2016-08-09のJS: Firefox 48.0、Node/WHATWG Stream、webpackチュートリアル","author":"azu","layout":"post","date":"2016-08-09T00:19:00.000Z","category":"JSer","tags":["Firefo","Node.js","Stream","webpack"],"url":"https://jser.info/2016/08/09/firefox-480nodewhatwg-streamwebpack/"},"items":[{"category":"Headline","title":"Firefox — Notes (48.0) — Mozilla","url":"https://www.mozilla.org/en-US/firefox/48.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 48.0リリース。\nWebWorkerでWeb Crypto APIが動くように、CSS `calc()`の入れ子をサポート。\n`Element.animate()`がデフォルトで有効に、`insertAdjacentText()`の実装など","relatedLinks":[{"title":"Firefox 48 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/48"},{"title":"Firefox 48 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/versions/48/"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview Release 10 | WebKit","url":"https://webkit.org/blog/6823/release-notes-for-safari-technology-preview-release-10/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 10リリース。\n`**`のサポート、\"use strict\"の挙動を仕様へ追従、DOMTokenListがiterableに、nullを空文字として扱うように色々なAPIを修正など","relatedLinks":[{"title":"ECMAScript® 2017 Language Specification","url":"https://tc39.github.io/ecma262/#sec-arrow-function-definitions-static-semantics-early-errors"}]},{"category":"Article","title":"Flow: Mapping an object — Medium","url":"https://medium.com/@thejameskyle/flow-mapping-an-object-373d64c44592","tags":["flowtype","JavaScript"],"content":"map-objというライブラリを例に、FlowTypeでどのように型定義をしていくかというチュートリアル","relatedLinks":[{"title":"sindresorhus/map-obj: Map object keys and values into a new object","url":"https://github.com/sindresorhus/map-obj"}]},{"category":"Article","title":"step by stepで始めるwebpack - Qiita","url":"http://qiita.com/howdy39/items/48d85c430f90a21075cd","tags":["webpack","tutorial"],"content":"webpackの導入方法についてステップバイステップなチュートリアル","relatedLinks":[]},{"category":"Article","title":"From Mixins to Object Composition","url":"http://raganwald.com/2016/07/20/prefer-composition-to-inheritance.html","tags":["JavaScript","設計"],"content":"mixinではなく、objectのcompositionで機能拡張をする方法について","relatedLinks":[]},{"category":"Article","title":"JavaScript and Functional Programming – Beth Allchurch | Developer","url":"https://bethallchurch.github.io/JavaScript-and-Functional-Programming/","tags":["JavaScript","関数型プログラミング"],"content":"JavaScriptで関数型プログラミングをする場合に気をつけることやパターンについて。","relatedLinks":[]},{"category":"Article","title":"package.json の browser field 実践編 - Qiita","url":"http://qiita.com/shinout/items/911e024368e2cb29fd3d","tags":["browserify","webpack","npm"],"content":"package.jsonの\"browser\" fieldの解釈の違いについて。\nBrowserify、webpack、React Native Packagerの比較","relatedLinks":[]},{"category":"Article","title":"project毎のnpmコマンドをいい感じにするnpmrc &amp; config達 - Qiita","url":"http://qiita.com/inuscript/items/86dbfd26abe6905756c0","tags":["npm","設定"],"content":"npmrc(npm-config)の設定について","relatedLinks":[]},{"category":"Article","title":"Introducing EdgeHTML 14 with the Windows 10 Anniversary Update | Microsoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2016/08/04/introducing-edgehtml-14/","tags":["MSEdge"],"content":"Windows 10 Anniversary UpdateのEdgeHTML 14で入った機能のまとめ","relatedLinks":[]},{"category":"Article","title":"Animating like you just don’t care with Element.animate ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2016/08/animating-like-you-just-dont-care-with-element-animate/","tags":["firefox","JavaScript","animation"],"content":"Firefox 48で実装された`Element#animate()` APIについての解説","relatedLinks":[]},{"category":"SlideVideo","title":"Introducing A11ycasts! -- A11ycasts #01 - YouTube","url":"https://www.youtube.com/watch?v=HtTyRajRuyY","tags":["accessibility","動画"],"content":"アクセシビリティについての動画シリーズ","relatedLinks":[{"title":"Chrome Developers on Twitter: ","url":"https://twitter.com/ChromiumDev/status/760555781603360768"}]},{"category":"SlideVideo","title":"stream between nodejs and whatwg // Speaker Deck","url":"https://speakerdeck.com/jxck/stream-between-nodejs-and-whatwg","tags":["JavaScript","stream","スライド"],"content":"Node.js StreamとWHATWG Streamの違いについて。\n目的が異なるため、作りも異なるという話","relatedLinks":[]},{"category":"WebsiteDocument","title":"Is Houdini Ready Yet?","url":"https://ishoudinireadyyet.com/","tags":["CSS","browser","まとめ"],"content":"CSS Houdiniのそれぞれの仕様とブラウザの実装状況についてまとめられたサイト","relatedLinks":[{"title":"w3c/css-houdini-drafts: Mirror of https://hg.css-houdini.org/drafts","url":"https://github.com/w3c/css-houdini-drafts"}]},{"category":"SoftwareLibrary","title":"Introduction · Almin.js","url":"https://almin.js.org/","tags":["JavaScript","library","React","document","DDD"],"content":"Flux/CQRSなライブラリであるAlminの公式サイト。\nGitBookで書かれたドキュメントが置かれてる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jumpsuit/jumpsuit: Jump in. Zip up. Build great apps.","url":"https://github.com/jumpsuit/jumpsuit","tags":["JavaScript","library","Tools"],"content":"View(React)、State管理なライブラリ + CLIなども含んだワンセットなライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"How to stub promises using Sinon.JS – Temple Coding","url":"https://templecoding.com/blog/2016/02/29/how-to-stub-promises-using-sinonjs/","tags":["JavaScript","testing","Promises"],"content":"PromiseのstubをするSinon.jsの拡張ライブラリ","relatedLinks":[{"title":"substantial/sinon-stub-promise: Synchronous Promise stubbing for Sinon.JS","url":"https://github.com/substantial/sinon-stub-promise"}]},{"category":"SoftwareLibrary","title":"jvilk/BrowserFS: BrowserFS is an in-browser filesystem that emulates the Node JS filesystem API and supports storing and retrieving files from various backends.","url":"https://github.com/jvilk/BrowserFS","tags":["JavaScript","browser","library","node.js"],"content":"ブラウザ上でfs的なファイルシステムのエミュレートを行うライブラリ。\nmemory、localStorage、Dropboxなど色々なバックエンドを持っている","relatedLinks":[]},{"category":"Book","title":"Test-Driving JavaScript Applications - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/9781680501742.do","tags":["JavaScript","testing","book"],"content":"TDDについてのJavaScript本","relatedLinks":[]},{"category":"Book","title":"Understanding ECMAScript 6 - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/9781593277574.do","tags":["JavaScript","ECMAScript","book"],"content":"ES6について解説している書籍。\nUnderstanding ECMAScript 6 の書籍版","relatedLinks":[{"title":"Understanding… by Nicholas C. Zakas ","url":"https://leanpub.com/understandinges6"}]}]},{"meta":{"title":"2016-08-15のJS: Chrome 53 Beta、使わなくて良いイディオム、60FPS CSS Animation","author":"azu","layout":"post","date":"2016-08-15T01:17:00.000Z","category":"JSer","tags":["Chrome","ES5","CSS","animation"],"url":"https://jser.info/2016/08/15/chrome-53-beta60fps-css-animation/"},"items":[{"category":"Headline","title":"The State of Vue — The Vue Point — Medium","url":"https://medium.com/the-vue-point/the-state-of-vue-1655e10a340a","tags":["JavaScript","library","ReleaseNote"],"content":"Vue.js 2.0.0 RC1リリース。\nAPIはフリーズされたため、正式リリースまでにAPIはもう変更しないとのこと","relatedLinks":[{"title":"Release v2.0.0-rc.1 · vuejs/vue","url":"https://github.com/vuejs/vue/releases/tag/v2.0.0-rc.1"}]},{"category":"Headline","title":"ESLint v3.3.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/08/eslint-v3.3.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 3.3.0リリース。\n実体と名前が合ってないルールをリネーム(元ルールは非推奨)、新しいルールとして`no-template-curly-in-string`と`sort-keys`の追加など","relatedLinks":[{"title":"ESLint v3.3.0 - Qiita","url":"http://qiita.com/mysticatea/items/adf6ef3c63b35c01fc05"}]},{"category":"Headline","title":"Chromium Blog: Chrome 53 Beta: Shadow DOM, PaymentRequest, and Android autoplay","url":"http://blog.chromium.org/2016/08/chrome-53-beta-shadow-dom.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 53βリリース。\nShadow DOM v1、PaymentRequest APIのサポート、Video要素は`muted`なら`autoplay`で自動再生が可能に、`allow-presentation`の対応。\nHTTP/0.9が非推奨に、TextEncoderは常にutf-8を使うようなるなど","relatedLinks":[{"title":"Payment Request APIを試す - mmag","url":"http://joe-noh.hatenablog.com/entry/2016/08/08/213159"},{"title":"Muted autoplay on mobile: say goodbye to ","url":"https://developers.google.com/web/updates/2016/07/autoplay"}]},{"category":"Headline","title":"Google Chrome Blog: Flash and Chrome","url":"https://chrome.googleblog.com/2016/08/flash-and-chrome.html","tags":["Chrome"],"content":"Chrome 53でトラッキング用の小さなFlashをブロック。\nChrome 55で全てのFlashがデフォルトブロックとなり、初回アクセス時に許可を求めるダイアログがでる形","relatedLinks":[]},{"category":"Headline","title":"Angular 2 RC5 - NgModules, Lazy Loading and AoT compilation","url":"http://angularjs.blogspot.com/2016/08/angular-2-rc5-ngmodules-lazy-loading.html","tags":["AngularJS","ReleaseNote"],"content":"Angular 2 RC5リリース。\n`@NgModule`のサポートなど","relatedLinks":[{"title":"RC4 to RC5 Migration - ts","url":"https://angular.io/docs/ts/latest/cookbook/rc4-to-rc5.html"},{"title":"angular/CHANGELOG.md at master · angular/angular","url":"https://github.com/angular/angular/blob/master/CHANGELOG.md"}]},{"category":"Article","title":"Introducing #EdgeBug: File web platform bugs with a Tweet | Microsoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2016/08/11/edgebug-twitter/","tags":["MSEdge","issue"],"content":"Twitterで #EdgeBug のハッシュタグ経由でIssueを作成できるように","relatedLinks":[]},{"category":"Article","title":"API Deprecations and Removals in Chrome 53 | Web Updates - Google Developers","url":"https://developers.google.com/web/updates/2016/08/chrome-53-deprecations","tags":["Chrome","ReleaseNote"],"content":"Chrome 53で非推奨/削除されたAPIについて。\nまた非推奨となるプロセスとポリシーについて","relatedLinks":[]},{"category":"Article","title":"Make your JavaScript code shine: knockout old ES5 hacks","url":"https://rainsoft.io/make-your-javascript-code-shide-knockout-old-es5-hack/","tags":["JavaScript"],"content":"ES2015で導入された機能や構文で代替できるため、既に使わなくても良くなったES5のイディオムについて","relatedLinks":[]},{"category":"Article","title":"Developer Edition 50: Console, Memory Tool, Net Monitor and more ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2016/08/developer-edition-50-console-memory-tool-net-monitor-and-more/","tags":["firefox","debug"],"content":"Firefox 50の開発者ツールについて。\nコンソールにSource Mapを適応した行数の表示、HTTPログのコールスタックに対応、メモリツールがデフォルトで有効に、WebAssemblyのシンタックスハイライトに対応など","relatedLinks":[]},{"category":"Article","title":"従来のWebアプリの常識を変える! Service WorkerがもたらすWebの未来 | PLAID Engineer Blog","url":"http://tech.plaid.co.jp/cong-lai-nowebapurinochang-shi-wobian-eru-service-workergamotarasuwebnowei-lai/","tags":["ServiceWorker","JavaScript"],"content":"ServiceWorkerがどういうものかという概要的な話。","relatedLinks":[]},{"category":"Article","title":"Offline Google Analytics Made Easy | Web Updates - Google Developers","url":"https://developers.google.com/web/updates/2016/07/offline-google-analytics","tags":["JavaScript","google","アクセス解析","ServiceWorker"],"content":"Service Workerを使ったGoogle Analyticsのオフライン対応について","relatedLinks":[{"title":"GoogleChrome/sw-helpers: Service Worker helper libraries","url":"https://github.com/googlechrome/sw-helpers"}]},{"category":"Article","title":"SVG 2 new features · w3c/svgwg Wiki","url":"https://github.com/w3c/svgwg/wiki/SVG-2-new-features","tags":["SVG"],"content":"SVG 2の新しい機能や変更点について","relatedLinks":[]},{"category":"Article","title":"Smooth as Butter: Achieving 60 FPS Animations with CSS3 — OutSystems Experts — Medium","url":"https://medium.com/outsystems-experts/how-to-achieve-60-fps-animations-with-css3-db7b98610108","tags":["CSS","performance"],"content":"CSSアニメーションの60FPS出すまでをステップバイステップで見ていく話。\nスライドメニューを、position、transform、will-change、クラスの付け外しでそれぞれFPSにどのような変化があるかを見る","relatedLinks":[]},{"category":"Article","title":"flexboxのバグに立ち向かう（flexboxバグまとめ） - Qiita","url":"http://qiita.com/hashrock/items/189db03021b0f565ae27","tags":["CSS","issue"],"content":"CSS flexboxのバグについてスクリーンショットと共に紹介してる","relatedLinks":[{"title":"luisrudge/postcss-flexbugs-fixes: PostCSS plugin that tries to fix all of flexbug","url":"https://github.com/luisrudge/postcss-flexbugs-fixes"},{"title":"philipwalton/flexbugs: A community-curated list of flexbox issues and cross-browser workarounds for them.","url":"https://github.com/philipwalton/flexbugs"}]},{"category":"Article","title":"What is Promise.try, and why does it matter? - joepie91&#x27;s Ramblings","url":"http://cryto.net/%7Ejoepie91/blog/2016/05/11/what-is-promise-try-and-why-does-it-matter/","tags":["JavaScript","Promises"],"content":"`Promise.try`のユースケースについて。\nECMAScript標準ではないが、`Promise.try`があることで同期的なエラーが扱いやすくなるという話","relatedLinks":[{"title":"ljharb/proposal-promise-try: ECMAScript Proposal, specs, and reference implementation for Promise.try","url":"https://github.com/ljharb/proposal-promise-try"}]},{"category":"WebsiteDocument","title":"permission.site","url":"https://permission.site/","tags":["WebPlatformAPI","browser","JavaScript"],"content":"HTTPSやパーミッションが必要なブラウザのAPIを試せるサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"zalando/tailor: A streaming layout service for front-end microservices","url":"https://github.com/zalando/tailor","tags":["node.js","HTML"],"content":"layout service libray for front-end","relatedLinks":[{"title":"Better streaming layouts for front-end microservices with Tailor - O","url":"https://www.oreilly.com/ideas/better-streaming-layouts-for-frontend-microservices-with-tailor"}]},{"category":"SoftwareLibrary","title":"js-joda/js-joda: :clock2: Immutable date and time library for javascript","url":"https://github.com/js-joda/js-joda","tags":["JavaScript","library"],"content":"JSR-310/Joda timeのAPIをインスパイアした日付ライブラリ。","relatedLinks":[]},{"category":"Book","title":"Introduction · React Enlightenment [DRAFT]","url":"http://www.reactenlightenment.com/","tags":["React","JavaScript","book"],"content":"Reactについての電子書籍\n開眼JavaScriptのシリーズ。","relatedLinks":[{"title":"FrontendMasters/react-enlightenment: A thoughtful and complete introduction to React.","url":"https://github.com/FrontendMasters/react-enlightenment"}]},{"category":"Book","title":"Manning | RxJS in Action","url":"https://www.manning.com/books/rxjs-in-action","tags":["Rx","JavaScript","ReleaseNote"],"content":"2017年3月31日発売\nRxJSについての書籍","relatedLinks":[]}]},{"meta":{"title":"2016-08-23のJS: Web Audio APIの変更点、AngularJS 2 RC5のNgModule、Property-based Testing","author":"azu","layout":"post","date":"2016-08-23T00:38:00.000Z","category":"JSer","tags":["WebAudioAPI","Angular2","Testing"],"url":"https://jser.info/2016/08/23/web-audio-apiangularjs-2-rc5ngmoduleproperty-based-testing/"},"items":[{"category":"Headline","title":"Node v6.4.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v6.4.0/","tags":["node.js","ReleaseNote"],"content":"Node v6.4.0リリース","relatedLinks":[]},{"category":"Headline","title":"Release v0.31.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.31.0","tags":["flowtype","ReleaseNote"],"content":"Flow 0.31.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview Release 11 | WebKit","url":"https://webkit.org/blog/6883/release-notes-for-safari-technology-preview-release-11/","tags":["safari","webkit","ReleaseNote"],"content":"Safari Technology Preview Release 11リリース。\n`class extends null`の挙動をES2016準拠に、`DOMTokenList.replace()`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"WebVR 1.0 available in Firefox Nightly","url":"https://blog.mozvr.com/webvr-1-0-available-in-firefox-nightly/","tags":["firefox","VR"],"content":"WebVR 1.0 APIがFirefoxのNightlyで利用できるように","relatedLinks":[]},{"category":"Article","title":"What’s new in Web Audio? ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2016/08/whats-new-in-web-audio-2/","tags":["web ","audio"],"content":"ここ1年のWeb Audio APIの変更点について","relatedLinks":[{"title":"What’s new in Web Audio? | Mozilla Developer Street (modest)","url":"https://dev.mozilla.jp/2016/08/whats-new-in-web-audio-2/"}]},{"category":"Article","title":"Generative Testing in JavaScript — JavaScript Inside — Medium","url":"https://medium.com/javascript-inside/generative-testing-in-javascript-f91432247c27","tags":["JavaScript","testing"],"content":"JavaScriptでのProperty-based Testingについて。\nそもそもどのようなアプローチのテスト手法なのかやtestcheck-jsなどの既存のライブラリについて","relatedLinks":[{"title":"testcheck-js","url":"https://github.com/leebyron/testcheck-js"},{"title":"jsverify/jsverify: Property-based testing for JavaScript. Like QuickCheck.","url":"https://github.com/jsverify/jsverify"},{"title":"unexpected-check","url":"http://unexpected.js.org/unexpected-check/"}]},{"category":"Article","title":"performance.markでパフォーマンス計測する | Web Scratch","url":"http://efcl.info/2016/08/15/performance.mark/","tags":["JavaScript","performance"],"content":"`performance.mark`などのAPIを使ってある区間の処理時間を計測する方法や、パフォーマンスロガーの作り方などについて","relatedLinks":[]},{"category":"Article","title":"Angular2 RC5への更新とステート管理の変更、power-assertによるテストまで試す - undefined","url":"http://blog.bokuweb.me/entry/angular2_rc5","tags":["AngularJS","testing"],"content":"AngularJS 2 RC5で導入されたNgModuleについてや、ステート管理について。\nまた、`NgModule`を使ったテストについて","relatedLinks":[{"title":"Angular 2 RC.5がリリースされました · Angular2 Info","url":"https://ng2-info.github.io/2016/08/angular-2-rc-5/"},{"title":"NgModule導入について · Angular2 Info","url":"http://ng2-info.github.io/2016/07/preparing-for-ngmodule/"}]},{"category":"Article","title":"Vue.js 2.0のFeaturesを訳してみる - Qiita","url":"http://qiita.com/prismrism/items/66a9dfc31139326911d8","tags":["JavaScript","library","翻訳"],"content":"Vue.js 2.0の変更点についての訳","relatedLinks":[]},{"category":"Article","title":"Writing a JavaScript Framework - Execution timing, beyond setTimeout | @RisingStack","url":"http://blog.risingstack.com/writing-a-javascript-framework-execution-timing-beyond-settimeout/","tags":["JavaScript"],"content":"JavaScriptの非同期実行に関する記事。\nECMAScript、HTML、Node.jsそれぞれのjob queueの仕組みについて。\nそれらを使ってどのようにレンダリングのイベントループを実装するかについて","relatedLinks":[]},{"category":"Article","title":"The cost of small modules | Read the Tea Leaves","url":"https://nolanlawson.com/2016/08/15/the-cost-of-small-modules/","tags":["JavaScript","browserify","webpack"],"content":"Browserifyやwebpack、rollupなどのモジュール数とロード時間の相関関係について。 browserifyはrequireをエミュレート、rollupなどはインライン化するなどの特徴が現れてる","relatedLinks":[]},{"category":"SlideVideo","title":"CSS for Software Engineers for CSS Developers // Speaker Deck","url":"https://speakerdeck.com/csswizardry/css-for-software-engineers-for-css-developers","tags":["CSS","設計","thought"],"content":"CSSにおけるSOLIDの原則のような開発指針についてのスライド。\nDRY、単一責任の原則、関心の分離、Immutability、Open/Closed、直交性など","relatedLinks":[{"title":"Harry Roberts | CSS for Software Engineers for CSS Developers | CSS Day 2016 on Vimeo","url":"https://vimeo.com/177216958"}]},{"category":"SlideVideo","title":"The Progressive Framework - Google スライド","url":"https://docs.google.com/presentation/d/1WnYsxRMiNEArT3xz7xXHdKeH1C-jT92VxmptghJb5Es/present#slide=id.p","tags":["JavaScript","library","スライド"],"content":"Vue.js 2.0についてのスライド\n規模や状況に応じてツール/フレームワークを選ぶべきという話。\nVue.js 2.0は段階を踏んで使えるよという話","relatedLinks":[]},{"category":"SlideVideo","title":"Keynote","url":"http://henryzoo.com/babel-plugin-slides/assets/player/KeynoteDHTMLPlayer.html#0","tags":["babel","plugin","スライド"],"content":"Babel pluginについてのスライド。\nどのような仕組みで変換されているのかをDOM APIとの対比しながら見ていく話","relatedLinks":[]},{"category":"SoftwareLibrary","title":"siddharthkp/auto-install: Install dependencies as you code","url":"https://github.com/siddharthkp/auto-install","tags":["npm"],"content":"コードの変更を監視して自動的に`npm install`してくれるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"waud/waud: Web Audio Library","url":"https://github.com/waud/waud","tags":["web ","audio","library"],"content":"Web Audio APIを使った音を再生するライブラリ。\nAudio Spriteやbase64、iOSなどの再生にインタラクションが必要な物への対応など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"andywer/npm-launch: 🚀 Minimalistic task runner on steroids!","url":"https://github.com/andywer/npm-launch","tags":["JavaScript","Tools"],"content":"npm run-scriptの表記と互換性があるTask Runnerツール。\nコメントが書けるJSONまたはNode.jsスクリプトで書ける","relatedLinks":[]},{"category":"Book","title":"A Book Apart, Practical SVG","url":"https://abookapart.com/products/practical-svg","tags":["SVG","book"],"content":"SVGについての書籍","relatedLinks":[]},{"category":"Book","title":"書籍情報―JavaScriptとWebGLによる 画像処理プログラミング","url":"http://www.kohgakusha.co.jp/books/detail/978-4-7775-1958-3","tags":["WebGL","book"],"content":"WebGLでの画像処理についての書籍","relatedLinks":[]}]},{"meta":{"title":"2016-08-30のJS: pixi.js 4.0.0、Babel 6.14.0、JSフレームワークアンケート","author":"azu","layout":"post","date":"2016-08-30T00:40:00.000Z","category":"JSer","tags":["Canvas","WebGL","game","Babel","framwork","survery"],"url":"https://jser.info/2016/08/30/pixijs-babel-jsframwork/"},"items":[{"category":"Headline","title":"Release v4.0.0 · pixijs/pixi.js","url":"https://github.com/pixijs/pixi.js/releases/tag/v4.0.0","tags":["JavaScript","WebGL","library","ReleaseNote"],"content":"pixi.js 4.0.0リリース\nMulti texture rendereringのサポート、GPU GC管理、WebGLレンダーの改善、npmでパッケージの公開など","relatedLinks":[{"title":"PixiJS v4 Arrives - Goodboy™ — Goodboy™","url":"http://www.goodboydigital.com/pixi-js-v4/"}]},{"category":"Headline","title":"Release v6.14.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v6.14.0","tags":["babel","ReleaseNote"],"content":"Babel 6.14.0リリース。\n`es2017` presetと、ES2015+を扱う`latest` presetが追加された。","relatedLinks":[]},{"category":"Article","title":"The State Of JavaScript: Front-End Frameworks – Medium","url":"https://medium.com/@sachagreif/the-state-of-javascript-front-end-frameworks-1a2d8a61510","tags":["JavaScript","library"],"content":"JavaScriptのフレームワークについてアンケート結果。\n認知度はVue以外大体同じ。\n学びたいもの: React -> Vue -> Angular2\n満足度: React -> Vue -> Angular2","relatedLinks":[{"title":"The State Of JavaScript","url":"http://stateofjs.com/"}]},{"category":"Article","title":"Enable Chrome Accessibility Experiment","url":"https://gist.github.com/marcysutton/0a42f815878c159517a55e6652e3b23a","tags":["Chrome","accessibility","debug"],"content":"Chromeの試験的なAccessibility inspectorを有効にする方法。\n要素に対するWAI-ARIAの情報をElementsパネルで見ることができる","relatedLinks":[]},{"category":"Article","title":"Demythstifying Web Components – Back Alley Coder","url":"http://www.backalleycoder.com/2016/08/26/demythstifying-web-components/","tags":["WebComponents"],"content":"Web Componentsに関するよくある誤解について書かれたもの","relatedLinks":[]},{"category":"Article","title":"How To Use WebPageTest and its API | CSS-Tricks","url":"https://css-tricks.com/use-webpagetest-api/","tags":["web ","performance","API"],"content":"WebPageTest APIを使ったメトリクスについて","relatedLinks":[]},{"category":"Article","title":"Three Ways to Test Angular 2 Components – Angular 2","url":"https://vsavkin.com/three-ways-to-test-angular-2-components-dcea8e90bd8d","tags":["AngularJS","testing"],"content":"AngularJS 2のコンポーネントをテストする方法について","relatedLinks":[]},{"category":"Article","title":"You SHOULD Learn Vanilla JavaScript Before JS Frameworks - Snipcart","url":"https://snipcart.com/blog/learn-vanilla-javascript-before-using-js-frameworks","tags":["JavaScript","library","thought"],"content":"フレームワークを学ぶ前にJavaScriptを学ぼうという話","relatedLinks":[]},{"category":"Article","title":"jsdoc-to-assert を試す – アカベコマイリ","url":"http://akabeko.me/blog/2016/08/jsdoc-to-assert/","tags":["JavaScript","testing"],"content":"jsdoc-to-assertでのランタイムassertの導入について","relatedLinks":[]},{"category":"Article","title":"型定義ベースのアサーションライブラリ types-assert を書いた - Qiita","url":"http://qiita.com/KeitaMoromizato/items/e49185a0cd03c6cb8b3a","tags":["JavaScript","TypeScript"],"content":"TypeScriptの型定義ファイルを使ったassertionライブラリ","relatedLinks":[{"title":"KeitaMoromizato/types-assert: type-assert is dynamic type assertion library","url":"https://github.com/KeitaMoromizato/types-assert"}]},{"category":"SlideVideo","title":"From MVC to Flux - JS Monthly London - YouTube","url":"https://www.youtube.com/watch?v=p8tqhf5qKOI","tags":["JavaScript","Flux"],"content":"改めてFluxとはどういうコンセプトなのか、同様のコアコンセプトを持つReduxについての紹介","relatedLinks":[{"title":"From MVC to Flux - Pusher Blog","url":"https://blog.pusher.com/from-mvc-to-flux/"}]},{"category":"SlideVideo","title":"thejameskyle/itsy-bitsy-data-structures: All the things you didn&#x27;t know you wanted to know about data structures","url":"https://github.com/thejameskyle/itsy-bitsy-data-structures","tags":["JavaScript","アルゴリズム","document"],"content":"JavaScriptでリスト、ハッシュテーブル、スタックなどのデータ構造についての実装と解説リポジトリ。\nそれぞれの探索のコストや特徴などの解説がコメントに書かれている","relatedLinks":[{"title":"React Rally Day 2 - YouTube","url":"https://www.youtube.com/watch?v=nI0cQ-2YR1I"}]},{"category":"WebsiteDocument","title":"SAM - State | Action | Model","url":"http://sam.js.org/","tags":["JavaScript","設計","デザインパターン"],"content":"SAM (State-Action-Model)についてのドキュメントサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"babel/babel-minify: Babel preset for minification (Alpha)","url":"https://github.com/babel/babel-minify","tags":["babel","plugin"],"content":"Babelのminify plugin preset","relatedLinks":[]},{"category":"SoftwareLibrary","title":"google/closure-compiler-js: Package for the JS version of closure-compiler for use via npm","url":"https://github.com/google/closure-compiler-js","tags":["JavaScript","Tools"],"content":"Closure Compilerの一部機能を使えるツール。JavaScriptへのコンパイル済みファイルを含んでいるので、Javaを必要としない。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"reactjs/react-docgen: A CLI and toolbox to extract information from React component files for documentation generation purposes.","url":"https://github.com/reactjs/react-docgen","tags":["React","document","Tools"],"content":"ReactのpropTypesなどをパースしてASTとして取得できるライブラリ/CLI","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pakastin/redom: Tiny DOM library","url":"https://github.com/pakastin/redom","tags":["JavaScript","DOM","library"],"content":"DOM APIを使った小さなコンポーネントライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nolanlawson/slow-deps: 🐌 Measure which dependencies in a project are slowest to npm install","url":"https://github.com/nolanlawson/slow-deps","tags":["npm","Tools"],"content":"npmの依存モジュールがそれぞれどれくらいのインストール時間やサイズなのかを計測出来るツール","relatedLinks":[]},{"category":"Book","title":"Fluent JavaScript | PACKT Books","url":"https://www.packtpub.com/web-development/fluent-javascript","tags":["JavaScript","book"],"content":"2017年4月6日発売","relatedLinks":[{"title":"Amazon | Fluent JavaScript ","url":"https://www.amazon.co.jp/dp/B01F7HCB0C/"}]}]},{"meta":{"title":"2016-09-05のJS: Babili α、TypeScript 2.0 RC、Sass 3.5 RC","author":"azu","layout":"post","date":"2016-09-05T10:41:00.000Z","category":"JSer","tags":["Sass","Babel","TypeScript"],"url":"https://jser.info/2016/09/05/babili-atypescript20-rcsass-35-rc/"},"items":[{"category":"Headline","title":"esprima/ChangeLog at 3.0.0 · jquery/esprima","url":"https://github.com/jquery/esprima/blob/3.0.0/ChangeLog","tags":["JavaScript","AST","ReleaseNote"],"content":"esprima 3.0.0リリース。\nES2016 `**` をサポート、JSXのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Sass 3.5 Release Candidate « Sass Blog","url":"http://blog.sass-lang.com/posts/809572-sass-35-release-candidate","tags":["Sass","ReleaseNote"],"content":"Sass 3.5 RCリリース。\nlibsassがRuby版とほぼ100％の互換性を持つように。\nCSS Custom Propertyのサポートなど","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at 9.5.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/9.5.0/Changelog.md","tags":["JavaScript","DOM","ReleaseNote"],"content":"jsdom 9.5.0リリース。\n`document.scripts`、 `document.embeds`と `document.plugins`の追加。\n`document.getElementsByTagName`が`HTMLCollection`を返すようになるなど","relatedLinks":[]},{"category":"Headline","title":"Angular 2 RC6","url":"http://angularjs.blogspot.com/2016/09/angular-2-rc6_1.html","tags":["AngularJS","ReleaseNote"],"content":"Angular 2 RC6リリース\nRC5以下で非推奨となっていたAPIの削除、npmパッケージにES6 modules形式のソースを含むように、TypeScript 2.0に対応など","relatedLinks":[{"title":"Angular 2 RC.6がリリースされました · Angular2 Info","url":"https://ng2-info.github.io/2016/09/angular-2-rc-6/"},{"title":"angular/CHANGELOG.md at master · angular/angular","url":"https://github.com/angular/angular/blob/master/CHANGELOG.md#200-rc6-2016-08-31"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview Release 12 | WebKit","url":"https://webkit.org/blog/6928/release-notes-for-safari-technology-preview-release-12/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 12リリース。\nFetch APIがデフォルトで有効に、Resource Timingの仕様追従など","relatedLinks":[]},{"category":"Headline","title":"Node v6.5.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v6.5.0/","tags":["node.js","ReleaseNote"],"content":"Node v6.5.0リリース。\ninspectorがuncaught exceptionをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 2.0 RC | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2016/08/30/announcing-typescript-2-0-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.0 RCリリース。\nTagged Unions、numberとstringのLiteral Typeを強化、tsconfig.jsonでglobの対応など","relatedLinks":[]},{"category":"Article","title":"Babili (babel-minify) · Babel","url":"https://babeljs.io/blog/2016/08/30/babili","tags":["babel","plugin"],"content":"BabelのminifyプラグインであるBabili βリリース。\nUglifyと違って変換後のES5なコードではなく、ES2015+のコードに対して圧縮を行う。\nそのためFlowなどの型情報を使った圧縮なども可能になる。","relatedLinks":[]},{"category":"Article","title":"The Case for Custom Elements: Part 1 – Dev Channel – Medium","url":"https://medium.com/dev-channel/the-case-for-custom-elements-part-1-65d807b4b439","tags":["WebComponents"],"content":"Custome Elementのケーススタディ","relatedLinks":[]},{"category":"Article","title":"15K 行のアプリを TypeScript 1.8 から 2.0 に移行してみた - はやくプログラムになりたい","url":"http://rhysd.hatenablog.com/entry/2016/07/15/090000","tags":["TypeScript"],"content":"TypeScript 2系への移行とオプションについて","relatedLinks":[]},{"category":"Article","title":"the new code – Web Developer Reading List: Maths in JavaScript","url":"http://thenewcode.com/1131/Web-Developer-Reading-List-Maths-in-JavaScript","tags":["JavaScript","tutorial"],"content":"Mathについての学ぶチュートリアル","relatedLinks":[]},{"category":"SlideVideo","title":"Reactの最新動向とベストプラクティス // Speaker Deck","url":"https://speakerdeck.com/koba04/reactfalsezui-xin-dong-xiang-tobesutopurakuteisu","tags":["React","スライド"],"content":"Reactのコンポーネントの作り方やテスト、React周りで最近でてきたツールについてのスライド","relatedLinks":[]},{"category":"SlideVideo","title":"Service Worker Deep Dive - Google スライド","url":"https://docs.google.com/presentation/d/19x3yi7Jn-6In5igGYfEiK0tBfNI290BAclT0AiqDj4Q/pub#slide=id.p","tags":["ServiceWorker","Chrome","スライド"],"content":"ここ1年ぐらいのService Worker周りの変化についてのスライド。\nPush Notification、Stream、Background、Foreign Fetch、Header-based Install、Origin Trialなど","relatedLinks":[]},{"category":"SlideVideo","title":"Edge Web Technologies and Browser Vendors","url":"http://www.slideshare.net/dynamis/edge-web-technologies-and-browser-vendors","tags":["web ","browser","スライド"],"content":"ここ最近のウェブブラウザの変化についてのスライド。\nウェブ互換性への方針、新しい機能などについてざっくりと紹介されている","relatedLinks":[]},{"category":"SlideVideo","title":"WAI-ARIA珍プレー好プレー","url":"http://www.slideshare.net/mlca11y/waiaria-65618928","tags":["HTML","WAI-ARIA","accessibility","スライド"],"content":"> WAI-ARIAは表現やインタラクションを変えない\n\nrole=\"button\"を付けてキーボードによるインタラクションを忘れているケース、メニューの例などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"html-best-practices/README.ja.md at master · hail2u/html-best-practices","url":"https://github.com/hail2u/html-best-practices/blob/master/README.ja.md","tags":["HTML","翻訳"],"content":"HTML Best Practices日本語訳","relatedLinks":[{"title":"普通のHTMLの書き方（またはHTML Best Practices日本語版） - Weblog - Hail2u.net","url":"https://hail2u.net/blog/webdesign/html-best-practices-in-japanese.html"},{"title":"HTML5のSVG要素では名前空間宣言が省略できる - 週刊SVG","url":"http://ssvvgg.net/post/147494232850/html5%E3%81%AEsvg%E8%A6%81%E7%B4%A0%E3%81%A7%E3%81%AF%E5%90%8D%E5%89%8D%E7%A9%BA%E9%96%93%E5%AE%A3%E8%A8%80%E3%81%8C%E7%9C%81%E7%95%A5%E3%81%A7%E3%81%8D%E3%82%8B"}]},{"category":"SoftwareLibrary","title":"Top | Diff of HTMLs","url":"https://diffofhtmls.herokuapp.com/","tags":["WHATWG","HTML","webservice","Tools"],"content":"WHATWGとW3C HTMLのdiffを見ることができるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Async Redux Actions With RxJS - React Rally 2016","url":"http://www.slideshare.net/benlesh1/async-redux-actions-with-rxjs-react-rally-2016","tags":["redux","Rx","スライド"],"content":"_redux-observable_についてのスライド。\nReduxにおいて非同期処理を行う場合に、連続性やCancelなどを表現しやすいRxJSを使うという話","relatedLinks":[{"title":"redux-observable/redux-observable: RxJS middleware for action side effects in Redux using ","url":"https://github.com/redux-observable/redux-observable"}]},{"category":"SoftwareLibrary","title":"camwiegert/in-view: Get notified when a DOM element enters or exits the viewport.","url":"https://github.com/camwiegert/in-view","tags":["JavaScript","library","UI"],"content":"ある要素がviewportに含まれているかを判定して、入った時と出た時のハンドラを書けるライブラリ。\n将来的にIntersectionObserverへも対応予定","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dollarshaveclub/postmate: A powerful, simple, promise-based postMessage library 📭 📨 📬 📫 🚚","url":"https://github.com/dollarshaveclub/postmate","tags":["JavaScript","library"],"content":"PromiseベースのpostMessageライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sdkennedy/babel-preset-target: Babel preset that allows for target environments to be specified along with plugins and presets. If all environments have native support for a given plugin, it will be skipped.","url":"https://github.com/sdkennedy/babel-preset-target","tags":["babel","plugin"],"content":"サポートするブラウザを指定することで、対応したBabel pluginでの変換をしてくれるbabel preset","relatedLinks":[]},{"category":"Book","title":"Angular 2 Router by Victor Savkin [Leanpub PDF/iPad/Kindle]","url":"https://leanpub.com/router","tags":["AngularJS","book"],"content":"AngularJS 2のRouterについての電子書籍","relatedLinks":[]}]},{"meta":{"title":"2016-09-12のJS: Polymer 2.0 Preview、Service Worker入門、JSから型定義ファイルの生成","author":"azu","layout":"post","date":"2016-09-12T11:19:00.000Z","category":"JSer","tags":["Polymer","WebComponent","ServiceWorker","Flow","TypeScript"],"url":"https://jser.info/2016/09/12/polymer-20aservice-workerjs/"},"items":[{"category":"Headline","title":"Polymer 2.0 Preview - Polymer Project","url":"https://www.polymer-project.org/1.0/blog/2016-09-09-polymer-2.0","tags":["WebComponents","library"],"content":"Polymer 2.0 Previewリリース。\nShadow DOM v1、クラスベースで書けるようになるなど","relatedLinks":[]},{"category":"Headline","title":"V8 JavaScript Engine: V8 Release 5.4","url":"http://v8project.blogspot.com/2016/09/v8-release-54.html","tags":["V8","ReleaseNote"],"content":"V8 5.4リリース。\nメモリが少ない端末でのメモリ消費量の改善、起動速度の改善など","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember.js 2.8 and 2.9 Beta Released","url":"http://emberjs.com/blog/2016/09/08/ember-2-8-and-2-9-beta-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember.js 2.8と2.9βリリース\n2.8で`Ember.Engine` APIを追加など","relatedLinks":[]},{"category":"Headline","title":"Jest 15.0: New Defaults for Jest · Jest","url":"http://facebook.github.io/jest/blog/2016/09/01/jest-15.html","tags":["React","testing","ReleaseNote"],"content":"Jest 15.0リリース。\nCLIの表示を改善、Watchコマンドを追加、jest-react-nativeの改善など","relatedLinks":[]},{"category":"Headline","title":"Release v0.32.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.32.0","tags":["flowtype","ReleaseNote"],"content":"Flow 0.32.0リリース\n`{|`と`|}`を使ったexact object typeの追加、`flow gen-flow-files`コマンドの追加など","relatedLinks":[]},{"category":"Headline","title":"ESLint v3.5.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/09/eslint-v3.5.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 3.5.0リリース。\n新しいルールの追加、`--fix`の対応ルールの追加など","relatedLinks":[{"title":"ESLint v3.5.0 - Qiita","url":"http://qiita.com/mysticatea/items/875c801362f337bc4ce9"}]},{"category":"Headline","title":"Release Release 4.0.0 · ternjs/acorn","url":"https://github.com/ternjs/acorn/releases/tag/4.0.0","tags":["JavaScript","library","AST","ReleaseNote"],"content":"acorn 4.0.0リリース。\nデフォルトの`ecmaVersion`が`7`となり、async/awaitの構文をサポートなど","relatedLinks":[]},{"category":"Article","title":"ES2015で始めるJavaScript入門 - Qiita","url":"http://qiita.com/ABCanG1015/items/824681cb88676da4f9a8","tags":["JavaScript","tutorial"],"content":"ES2015ベースでJavaScriptについて学ぶレッスン式のチュートリアル","relatedLinks":[]},{"category":"Article","title":"わぁいアリア（WAI-ARIA）大好き | れいぶろぐ","url":"http://labe.wp.xdomain.jp/post/567","tags":["WAI-ARIA"],"content":"WAI-ARIAはどんなもので何のためにあるのかを分かりやすく解説してる","relatedLinks":[]},{"category":"Article","title":"Service Worker の紹介 | Web Fundamentals - Google Developers","url":"https://developers.google.com/web/fundamentals/primers/service-worker/","tags":["ServiceWorker","翻訳"],"content":"Service Workerについての紹介記事翻訳","relatedLinks":[]},{"category":"Article","title":"Service Workerの基本とそれを使ってできること - Qiita","url":"http://qiita.com/y_fujieda/items/f9e765ac9d89ba241154","tags":["ServiceWorker"],"content":"Service Workerのライフサイクルやどのような事ができるかの紹介記事。\nCache、Pushについて","relatedLinks":[]},{"category":"Article","title":"flowtype v0.32.0 changes - Please Drive Faster","url":"http://joe-re.hatenablog.com/entry/2016/09/06/101529","tags":["flowtype","Tools"],"content":"JavaScriptファイルからFlowの型定義ファイルを生成する`gen-flow-files`コマンドについて","relatedLinks":[]},{"category":"Article","title":"Untangling Deeply-Nested Promise Chains — Philip Walton","url":"https://philipwalton.com/articles/untangling-deeply-nested-promise-chains/","tags":["Promises","JavaScript"],"content":"Promiseでネストが深くなったものを、関数へ分割やasync/awaitを使いネストを浅くリファクタリングする話","relatedLinks":[]},{"category":"SlideVideo","title":"D3 V4 - What's new?","url":"https://iros.github.io/d3-v4-whats-new/#1","tags":["d3.js","スライド"],"content":"D3.js v4についてのスライド。\nモジュール分割、Canvasへの書き出し、分割されたモジュール毎の解説","relatedLinks":[]},{"category":"WebsiteDocument","title":"DevTools Timeline Viewer","url":"https://chromedevtools.github.io/timeline-viewer/","tags":["Chrome","debug"],"content":"Chromeの開発者ツールのTimelineデータを読み込ませて表示できるサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Microsoft/dts-gen: dts-gen creates starter TypeScript definition files for any module or library.","url":"https://github.com/Microsoft/dts-gen","tags":["TypeScript","Tools"],"content":"npmパッケージやコードからd.tsを自動生成してくれるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Fuse.js - JavaScript fuzzy-search library","url":"http://fusejs.io/","tags":["JavaScript","library","検索"],"content":"データからあいまい検索を行えるJavaScriptライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ebidel/appmetrics.js: A small (1.1kb) library for measuring things in your web app and reporting the results to Google Analytics.","url":"https://github.com/ebidel/appmetrics.js","tags":["JavaScript","performance","アクセス解析","library"],"content":"User Timing APIを使って計測したデータをGoogle Analyticsにレポートできるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jgornick/asyncp: Port of the Async.js API to use Promises","url":"https://github.com/jgornick/asyncp","tags":["JavaScript","library","Promises"],"content":"async.jsのAPIをPromiseを使って実装したライブラリ","relatedLinks":[]},{"category":"Book","title":"JavaScript: The New Toys: T. J. Crowder: 9781119367956: Amazon.com: Books","url":"https://www.amazon.com/JavaScript-Toys-T-J-Crowder/dp/1119367956","tags":["JavaScript","book"],"content":"2017年4月10日発売\nES2015+についての書籍","relatedLinks":[]},{"category":"Book","title":"改訂新版JavaScript本格入門　～モダンスタイルによる基礎から現場での応用まで：書籍案内｜技術評論社","url":"http://gihyo.jp/book/2016/978-4-7741-8411-1","tags":["JavaScript","book"],"content":"2016年9月30日発売\nJavaScript本格入門の改訂版","relatedLinks":[{"title":"JavaScript本格入門　～モダンスタイルによる基礎からAjax・jQueryまで：書籍案内｜技術評論社","url":"http://gihyo.jp/book/2010/978-4-7741-4466-5"}]}]},{"meta":{"title":"2016-09-20のJS: AngularJS 2、Node 6.6.0、Chrome 54の開発者ツール","author":"azu","layout":"post","date":"2016-09-20T00:48:00.000Z","category":"JSer","tags":["Angular","Node","Chrome","debug"],"url":"https://jser.info/2016/09/20/angularjs-2node-660chrome/"},"items":[{"category":"Headline","title":"Angular, version 2: proprioception-reinforcement","url":"http://angularjs.blogspot.com/2016/09/angular2-final.html","tags":["AngularJS","ReleaseNote"],"content":"AngularJS 2リリース","relatedLinks":[{"title":"🎉✨ Angular 2.0.0がリリースされました 🎉✨ · Angular2 Info","url":"https://ng2-info.github.io/2016/09/angular-2-final/"}]},{"category":"Headline","title":"Node v6.6.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v6.6.0/","tags":["node.js","ReleaseNote"],"content":"Node v6.6.0リリース。\nEventEmitterのmemory leak警告、\nPromiseのUnhandled rejectionの警告が、`process.on('warning', (warning) => { })`でキャッチできるように","relatedLinks":[]},{"category":"Headline","title":"jQuery UI 1.12.1 | jQuery UI Blog","url":"http://blog.jqueryui.com/2016/09/jquery-ui-1-12-1/","tags":["jQuery","UI","ReleaseNote"],"content":"jQuery UI 1.12.1リリース。\n新しいテーマの追加、`Checkboxradio　widget`の追加、`classes`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview Release 13 | WebKit","url":"https://webkit.org/blog/6937/release-notes-for-safari-technology-preview-release-13/","tags":["safari","webkit","ReleaseNote"],"content":"Safari Technology Preview Release 13 リリース。\n`adoptedCallback`のサポート、`CSS.escape`の実装、クロスオリジンのチェック強化など","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 54 Beta: Custom Elements V1, BroadcastChannel, and media platform improvements","url":"http://blog.chromium.org/2016/09/chrome-54-beta-custom-elements-v1.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 54βリリース。\nCustom Element v1、BroadcastChannelのサポート。\nResource Timing API のtransferやencoded/decodedのサポート、`initTouchEvent`の削除など","relatedLinks":[]},{"category":"Article","title":"Introducing debugger.html ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2016/09/introducing-debugger-html/","tags":["firefox","debug"],"content":"debugger.htmlというソースパネルライクな新しいデバッガーについて。\nFirefox、Chrome、Node.jsに対応し、Remote Debug Protocolでデータをやり取りする。\nFirefoxの開発者ツールに統合される予定","relatedLinks":[{"title":"debugger.html のご紹介 | Mozilla Developer Street (modest)","url":"https://dev.mozilla.jp/2016/09/introducing-debugger-html/"}]},{"category":"Article","title":"DevTools Digest, September 2016: Perf Roundup | Web Updates - Google Developers","url":"https://developers.google.com/web/updates/2016/09/devtools-digest","tags":["debug","Chrome"],"content":"Chrome 54での開発者ツールについて。\nCPU Throttling、TimelineにNetwork viewの表示、スクロールパフォーマンスのProfile、SourceパネルにTimelineのデータ表示など","relatedLinks":[]},{"category":"Article","title":"JS web frameworks benchmark – Round 4 | Stefan_Krause.blog()","url":"http://www.stefankrause.net/wp/?p=316","tags":["JavaScript","library"],"content":"AngularやReactなどのライブラリやフレームワークのベンチマーク比較","relatedLinks":[{"title":"Table Report","url":"http://stefankrause.net/js-frameworks-benchmark4/webdriver-ts/table.html"}]},{"category":"Article","title":"How Developers use Node.js - Survey Results | @RisingStack","url":"http://blog.risingstack.com/node-js-developer-survey-results-2016/","tags":["node.js","アンケート"],"content":"Node.jsを使ったサーバサイド開発についてのアンケート結果","relatedLinks":[]},{"category":"Article","title":"Why Use Flow? · Aria","url":"https://blog.aria.ai/post/why-use-flow/","tags":["flowtype"],"content":"FlowによるStatic typeについて","relatedLinks":[]},{"category":"SlideVideo","title":"The future of ES6 (Jafar Husain) - Full Stack Fest 2016 - YouTube","url":"https://www.youtube.com/watch?v=3pKNRgResq0","tags":["JavaScript","動画"],"content":"現在策定中の仕様も含めて非同期処理について。\nPromise、Async/Await。\nPullなAPIとしてGenerator(同期)、AsyncGenerator(Stage 2)。\nPushなAPIとしてObservable(Stage 1)について","relatedLinks":[]},{"category":"SlideVideo","title":"Пользовательские свойства как основа архитектуры CSS (FrontTalks) // Speaker Deck","url":"https://speakerdeck.com/lautsevich/pol-zovatiel-skiie-svoistva-kak-osnova-arkhitiektury-css-fronttalks","tags":["CSS","スライド"],"content":"CSS Custom Propertiesについてのスライド。\nFallback、i18n、CSS Custom Propertiesとcalc、JavaScriptからの利用、@supportsについてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Testing JavaScript with Jest - Lesson Playlist @eggheadio","url":"https://egghead.io/playlists/testing-javascript-with-jest-a36c4074","tags":["JavaScript","testing","video"],"content":"Jestを学ぶスクリーンキャスト","relatedLinks":[]},{"category":"SlideVideo","title":"Building Applications with React and Redux in ES6 | Zombie Code Kill","url":"https://zombiecodekill.com/2016/05/21/building-applications-with-react-and-redux-in-es6/","tags":["React","redux"],"content":"ReactとReduxの入門講座","relatedLinks":[{"title":"Building Applications with React and Redux in ES6 | Pluralsight","url":"https://www.pluralsight.com/courses/react-redux-react-router-es6"}]},{"category":"SlideVideo","title":"Developer&#x27;s guide to accessibility mechanics — Developer&#x27;s guide to accessibility mechanics","url":"https://ljwatson.github.io/decks/2016/fromthefront/index.html#cover","tags":["accessibility","スライド"],"content":"デフォルトの`<a>`はどういうサポートがあるからaccessibleであるかについてを独自のリンク実装で見ていく話。\nまたデフォルトではaccessibleでないツールチップ、タブパネルなどをどう実装するか。\n実際にスクリーンリーダーの音を聞きながら確認できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"avocode/combokeys: Web browser keyboard shortcuts. CommonJS, NPM.","url":"https://github.com/avocode/combokeys","tags":["JavaScript","キーボード","library"],"content":"Mousetrapをforkしたキーボードショートカットライブラリ。\nリファクタリングとdocumentへのlistenがデフォルトではないように変更されている","relatedLinks":[{"title":"Handle keyboard shortcuts in the browser with Combokeys","url":"https://blog.avocode.com/blog/handle-keyboard-shortcuts-in-the-browser-with-combokeys"}]},{"category":"SoftwareLibrary","title":"kentcdodds/match-sorter: Simple, expected, and deterministic best-match sorting of an array in JavaScript","url":"https://github.com/kentcdodds/match-sorter","tags":["JavaScript","library"],"content":"オブジェクトの配列から検索するライブラリ。\n指定したキーのみを対象にしたり、検索方法などを指定できる","relatedLinks":[]},{"category":"Book","title":"BUILD PACMAN by Jeffrey Biles [Leanpub PDF/iPad/Kindle]","url":"https://leanpub.com/buildpacman","tags":["JavaScript","game","book"],"content":"JavaScriptでパックマンを作る書籍。","relatedLinks":[]}]},{"meta":{"title":"2016-09-27のJS: Firefox 49.0、Safari 10.0、TypeScript 2.0、CoffeeScript 1.11.0","author":"azu","layout":"post","date":"2016-09-26T23:34:00.000Z","category":"JSer","tags":["Firefox","Safari","TypeScript","CoffeeScript"],"url":"https://jser.info/2016/09/27/firefox-490safari-100typescript-20coffeescript-1110/"},"items":[{"category":"Headline","title":"Dev.Opera — What’s new in Chromium 53 and Opera 40","url":"https://dev.opera.com/blog/opera-40/","tags":["Opera","ReleaseNote"],"content":"input patternのRegExpが`u`フラグ扱いに、Shadow DOM v1、MediaStreamTrack Constraints APIの追加など","relatedLinks":[]},{"category":"Headline","title":"Firefox 49.0 リリースノート","url":"https://www.mozilla.jp/firefox/49.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 49リリース。\n既存コンテンツの互換性のために`-webkit-` prefixのプロパティをサポート、`<a>`要素の`referrerpolicy`属性のサポート、Web Speech APIの音声合成をサポートなど","relatedLinks":[{"title":"Firefox 49 for developers","url":"https://developer.mozilla.org/ja/Firefox/Releases/49"},{"title":"Firefox 49 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/versions/49/"},{"title":"Firefox 49 fixes sites designed with WebKit in mind, and more ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2016/09/firefox-49-fixes-sites-designed-with-webkit-in-mind-and-more/"}]},{"category":"Headline","title":"Safari 10.0","url":"https://developer.apple.com/library/content/releasenotes/General/WhatsNewInSafari/Articles/Safari_10_0.html","tags":["apple","safari","ReleaseNote"],"content":"Safari 10.0リリース。\nIndexedDB、CSP 2.0、Shadow DOM v1、ES2015、Font Loading、ES i18n APIのサポートなど","relatedLinks":[]},{"category":"Headline","title":"PM2 v2 - Bradbury","url":"https://keymetrics.io/2016/08/24/pm2-v2-released/","tags":["node.js","Docker","ReleaseNote"],"content":"PM2 V2リリース。\npm2-docker、transpilerサポートなど","relatedLinks":[]},{"category":"Headline","title":"TypeScript 2.0 is now available! | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2016/09/22/announcing-typescript-2-0/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.0リリース。\nDefinitelyTypedの型定義ファイルをnpmモジュールとしてインストールできるように、non-nullable、read only modifierなど","relatedLinks":[{"title":"| TypeScript 2.0 Awesomeness | Blog | SitePen","url":"https://www.sitepen.com/blog/2016/09/01/typescript-2-0-awesomeness/"},{"title":"Breaking Changes · Microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/Breaking-Changes#typescript-20"},{"title":"What's new in TypeScript · Microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/What%27s-new-in-TypeScript#typescript-20"}]},{"category":"Headline","title":"CoffeeScript","url":"http://coffeescript.org/#1.11.0","tags":["CoffeeScript","ReleaseNote"],"content":"CoffeeScript 1.11.0リリース。\n`import`/`export`の構文をサポート、`--inline-map`コマンドラインオプションのサポートなど","relatedLinks":[{"title":"treat Infinity and NaN as reserved words · Issue #4218 · jashkenas/coffeescript","url":"https://github.com/jashkenas/coffeescript/issues/4218"},{"title":"Support import and export of ES2015 modules by GeoffreyBooth · Pull Request #4300 · jashkenas/coffeescript","url":"https://github.com/jashkenas/coffeescript/pull/4300"},{"title":"Opt-in ESNext features in 1.x · Issue #40 · coffeescript6/discuss","url":"https://github.com/coffeescript6/discuss/issues/40"}]},{"category":"Headline","title":"ESLint v3.6.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/09/eslint-v3.6.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 3.6.0リリース。\nasync/awaitの対応と既存ルールの修正、`--fix`対応ルールの追加など","relatedLinks":[{"title":"ESLint v3.6.0 - Qiita","url":"http://qiita.com/mysticatea/items/9fd48f9ac3faac578c62"}]},{"category":"Headline","title":"jQuery 3.1.1 Released! | Official jQuery Blog","url":"http://blog.jquery.com/2016/09/22/jquery-3-1-1-released/","tags":["jQuery","ReleaseNote"],"content":"jQuery 3.1.1リリース\n`:disabled`セレクタのバグ修正、AMDとして読み込んだときに`noConflict`を公開するようになるなど","relatedLinks":[]},{"category":"Article","title":"Ahead-of-Time Compilation in Angular 2 – Minko Gechev&#x27;s blog","url":"http://blog.mgechev.com/2016/08/14/ahead-of-time-compilation-angular-offline-precompilation/","tags":["AngularJS"],"content":"AnguarJS 2のAhead-of-Time (AOT)について","relatedLinks":[]},{"category":"Article","title":"Welcome to HTML 5.2!Telerik Developer Network","url":"http://developer.telerik.com/featured/welcome-to-html-5-2/","tags":["W3C","HTML"],"content":"W3C HTML5.2について。\n5.1からの差分について","relatedLinks":[]},{"category":"Article","title":"Snapshot Testing in React Storybook","url":"https://voice.kadira.io/snapshot-testing-in-react-storybook-43b3b71cec4f","tags":["React","testing"],"content":"React Storybookを使ったスナップショットテストについて","relatedLinks":[{"title":"kadirahq/storyshots: Snapshot testing for React Storybook","url":"https://github.com/kadirahq/storyshots"},{"title":"kadirahq/react-storybook: UI Component Dev Environment for React","url":"https://github.com/kadirahq/react-storybook"}]},{"category":"Article","title":"Testing Components in Angular 2 with Jasmine - Semaphore","url":"https://semaphoreci.com/community/tutorials/testing-components-in-angular-2-with-jasmine","tags":["AngularJS","testing"],"content":"AngularJS 2のコンポーネントをjasmineでテストする話","relatedLinks":[]},{"category":"Article","title":"Use Easy-Fix to Run Integration Tests Like Unit Tests – WalmartLabs – Medium","url":"https://medium.com/walmartlabs/use-easy-fix-to-run-integration-tests-like-unit-tests-834288ec446d","tags":["JavaScript","testing","library"],"content":"vcr系のテストライブラリ。\n実行結果を記録/リプレイするライブラリ。\n他のVCR系とは異なり非同期処理を記録することで、HTTPのみ限定していないという話","relatedLinks":[{"title":"walmartlabs/easy-fix: easy-fix: run integration tests like unit tests","url":"https://github.com/walmartlabs/easy-fix"}]},{"category":"SlideVideo","title":"WebAssembly: birth of a virtual ISA (Ben Smith) - Full Stack Fest 2016 - YouTube","url":"https://www.youtube.com/watch?v=vmzz17JGPHI","tags":["WebAssembly","video"],"content":"WebAssemblyが何であって、何でないか。\n歴史、asm.jsとの関係、コンパイル結果がどのような構造になってるかについての解説など","relatedLinks":[]},{"category":"WebsiteDocument","title":"Browser Bug Searcher","url":"https://browser-issue-tracker-search.appspot.com/","tags":["browser","issue","検索"],"content":"MSEdge、Firefox、Chrome、Opera、WebKitのIssue Trackerをまとめて検索できるサイト。\nブラウザのバグ検索エンジン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"CSP Evaluator","url":"https://csp-evaluator.withgoogle.com/","tags":["CSP","Tools"],"content":"CSPのポリシーディレクティブのチェックツール。\nポリシーの設定の構文エラー、設定の問題などを見つけてくれるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jumpinjackie/jsdoc-typescript-plugin: JSDoc plugin to generate TypeScript definition files (.d.ts) from JSDoc-annotated source","url":"https://github.com/jumpinjackie/jsdoc-typescript-plugin","tags":["JSDoc","TypeScript"],"content":"JSDocからTypeScriptの型定義ファイルを生成するJSDoc plugin","relatedLinks":[]},{"category":"Book","title":"Refactoring JavaScript - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920053262.do","tags":["JavaScript","book"],"content":"2017年1月発売\nJavaScriptのリファクタリングについての書籍","relatedLinks":[]}]},{"meta":{"title":"2016-10-03のJS: Vue.js 2.0、Babel 6.17.0、複雑なJavaScript","author":"azu","layout":"post","date":"2016-10-03T00:49:00.000Z","category":"JSer","tags":["Vue","Babel","JavaScript","DDD"],"url":"https://jser.info/2016/10/03/vuejs-20babel-6170javascript/"},"items":[{"category":"Headline","title":"Node v6.7.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v6.7.0/","tags":["node.js","ReleaseNote"],"content":"Node v6.7.0リリース。\nセキュリティアップデートが含まれる更新","relatedLinks":[]},{"category":"Headline","title":"Vue 2.0 is Here! – The Vue Point – Medium","url":"https://medium.com/the-vue-point/vue-2-0-is-here-ef1f26acf4b8","tags":["JavaScript","library","ReleaseNote"],"content":"Vue.js 2.0リリース。\n1.xからのマイグレーションヘルパーも公開されている。","relatedLinks":[{"title":"vuejs/vue-migration-helper: CLI tool to aid in migration from Vue 1.x to 2.0","url":"https://github.com/vuejs/vue-migration-helper"},{"title":"Migration from Vue 1.x - vue.js","url":"http://vuejs.org/guide/migration.html"}]},{"category":"Headline","title":"6.16.0 Released · Babel","url":"https://babeljs.io/blog/2016/09/28/6.16.0","tags":["babel","ReleaseNote"],"content":"Babel 6.16.0リリース。\nbabel-coreが`parserOpts`と`generatorOpts`をサポートするなど","relatedLinks":[]},{"category":"Headline","title":"Release v6.17.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v6.17.0","tags":["babel","ReleaseNote"],"content":"Babel v6.17.0リリース。\nProposalのStage変更を反映、async generatorとobject rest-spreadをstage3へ、optimize-js関連の変更など","relatedLinks":[{"title":"ECMAScript proposal updates @ 2016-10 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/2016/10/02/proposals-updates"}]},{"category":"Headline","title":"ESLint v3.7.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/09/eslint-v3.7.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v3.7.0リリース。\n`--fix`対応のルールの追加など","relatedLinks":[{"title":"ESLint v3.7.0 - Qiita","url":"http://qiita.com/mysticatea/items/dd90aff81eeb92683c5d"}]},{"category":"Headline","title":"RE:DOM is now 1.0! – RE:DOM – Medium","url":"https://medium.com/re-dom/re-dom-is-now-1-0-58ec0328a59d","tags":["JavaScript","DOM","ReleaseNote"],"content":"RE:DOM 1.0リリース\n合わせてRE:DOM向けのfake domであるNO:DOMも公開されてる","relatedLinks":[{"title":"pakastin/redom: Tiny, but super fast DOM library with 100 % test coverage!","url":"https://github.com/pakastin/redom"},{"title":"pakastin/nodom: fake DOM for RE:DOM","url":"https://github.com/pakastin/nodom"}]},{"category":"Headline","title":"Release v0.33.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.33.0","tags":["flowtype","ReleaseNote"],"content":"FlowType 0.33.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview Release 14 | WebKit","url":"https://webkit.org/blog/6969/release-notes-for-safari-technology-preview-release-14/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 14リリース。\n`URLSearchParams`の実装、safaridriverも含むようになるなど","relatedLinks":[]},{"category":"Article","title":"Node.js debugging with Chrome DevTools (in parallel with browser JavaScript)","url":"https://blog.hospodarets.com/nodejs-debugging-in-chrome-devtools","tags":["Chrome","debug","node.js"],"content":"Node.jsをChromeの開発者ツールでデバッグする方法について。\n設定を有効にする手順","relatedLinks":[]},{"category":"Article","title":"Master the DOM – Medium","url":"https://medium.com/@pakastin/master-the-dom-bc1a2a06089b","tags":["DOM","tutorial"],"content":"DOM APIでのDOM Treeの基本的な操作を見ていく話。","relatedLinks":[]},{"category":"Article","title":"Common CSS Mistakes (And How To Fix Them)","url":"https://blog.mariano.io/common-css-mistakes-and-how-to-fix-them-8ee0f5e88d64","tags":["CSS"],"content":"CSSのよくある間違いと修正方法","relatedLinks":[]},{"category":"Article","title":"requestAnimationFrame とタイマーの今更な比較とデモ ::ハブろぐ","url":"https://havelog.ayumusato.com/develop/javascript/e725-timer_vs_raf.html","tags":["JavaScript","browser"],"content":"`requestAnimationFrame`と`setTimeout`の比較。\n`setTimeout`は細かい処理でも影響を受けやすいという話","relatedLinks":[]},{"category":"Article","title":"hemanth/es-next: stage-0 to stage-4 ECMAscript proposals.","url":"https://github.com/hemanth/es-next","tags":["ECMAScript","proposal"],"content":"ECMAScript proposalsのStage別まとめ。\nそれぞれに小さなサンプルコードが書かれている。","relatedLinks":[]},{"category":"Article","title":"Loading Polyfills Only When Needed — Philip Walton","url":"https://philipwalton.com/articles/loading-polyfills-only-when-needed/","tags":["JavaScript","library"],"content":"polyfillをサポートしてない環境だけで動的に読み込みたいという話","relatedLinks":[]},{"category":"SlideVideo","title":"複雑なJavaScriptアプリケーションを考えながら作る話","url":"http://azu.github.io/slide/2016/react-meetup/large-scale-javascript.html","tags":["JavaScript","スライド","CQRS","DDD"],"content":"JavaScriptで複雑なアプリケーションを作る場合にどのように考えるかというスライド。\nドメインモデルをどのように考えて作っていくかについて。 Babel、React、Almin、PostCSSがベース。","relatedLinks":[{"title":"azu/large-scale-javascript: 複雑なJavaScriptアプリケーションを作るために考えること","url":"https://github.com/azu/large-scale-javascript"}]},{"category":"WebsiteDocument","title":"CodePen - React ES6 lifecycles","url":"http://codepen.io/netsi1964/full/NRgyZX/","tags":["React","document"],"content":"Reactのライフサイクルのまとめ。\n実際に動くコードがドキュメントになっていて、動作をさせながらライフサイクルメソッドの実行順について見ることができる","relatedLinks":[]},{"category":"WebsiteDocument","title":"Web Platform Feature Availability","url":"https://paulirish.github.io/web-feature-availability/","tags":["webservice","browser"],"content":"CanIUseとStatCounterを使いある機能がどれぐらいのプラットフォームで利用できるかを一覧できるサイト","relatedLinks":[]},{"category":"WebsiteDocument","title":"React Status: A Free, Weekly Email Newsletter","url":"http://react.statuscode.com/","tags":["React","news","mail"],"content":"Reactについてを扱うWeeklyメールマガジン","relatedLinks":[]},{"category":"WebsiteDocument","title":"Fix and prevent known vulnerabilities in Node.js apps | Snyk","url":"https://snyk.io/","tags":["node.js","security","webservice"],"content":"Node.js appの既知の脆弱性などを通知、修正などを行うサービス。\nCIで自動的にチェックできる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mkwtys/bundle-size: Show bundle file size of npm packages","url":"https://github.com/mkwtys/bundle-size","tags":["JavaScript","Tools"],"content":"指定したパッケージのファイルサイズを出力できるCLI。\nEnvironmentを指定できるのでdevelopmentとproductionのファイルサイズをminify、gzip済みで比較できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"krasimir/navigo: A simple vanilla JavaScript router with a fallback for older browsers","url":"https://github.com/krasimir/navigo","tags":["JavaScript","library"],"content":"シンプルなルーターライブラリ。\nマッピングに正規表現も利用できる","relatedLinks":[]},{"category":"Book","title":"TypeScript Design Patterns - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/9781785280832.do","tags":["TypeScript","デザインパターン","book"],"content":"TypeScriptでのデザインパターン本","relatedLinks":[]}]},{"meta":{"title":"JSer.info 300回目 && https化 && ユーザー投稿機能","author":"azu","layout":"post","date":"2016-10-10T14:37:00.000Z","category":"Article","tags":["JSer.info"],"url":"https://jser.info/2016/10/10/300posts/"},"items":[]},{"meta":{"title":"2016-10-10のJS: JavaScriptとUnicode、Web Components、npm-scripts","author":"azu","layout":"post","date":"2016-10-10T14:11:00.000Z","category":"JSer","tags":["Unicode","WebComponents","npm"],"url":"https://jser.info/2016/10/10/javascriptunicodeweb-componentsnpm-scripts/"},"items":[{"category":"Headline","title":"ECMAScript proposal updates @ 2016-10 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/2016/10/02/proposals-updates","tags":["ECMAScript","proposal"],"content":"2016年10月時点での、ECMAScript Proposalのステータスまとめ。 9月のミーティングで変更されたStageのまとめ","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at 9.6.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/9.6.0/Changelog.md","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"jsdom 9.6.0リリース。\nHTMLCollectionがiterableに対応など","relatedLinks":[]},{"category":"Article","title":"What every JavaScript developer should know about Unicode","url":"https://rainsoft.io/what-every-javascript-developer-should-know-about-unicode/","tags":["JavaScript","Unicode"],"content":"JavaScriptの文字列とUnicodeについて網羅的な解説。\nUnicodeにおける用語、Character、Code point、Plane、BMP、Code unit、サロゲートペア、Combing marks、エスケープシーケンス、文字列比較、Normalize、length、正規表現について","relatedLinks":[]},{"category":"Article","title":"Progressive Web Apps with React.js: Part 2 — Page Load Performance – Medium","url":"https://medium.com/@addyosmani/progressive-web-apps-with-react-js-part-2-page-load-performance-33b932d97cf2","tags":["webpack","React","performance"],"content":"初期表示を早くするために、Routingごとにファイルとして分けて動的にロードする話。\nwebpackを使っての分割と読み込み、link preloadを使っての先読み、キャッシュについて","relatedLinks":[]},{"category":"Article","title":"JavaScriptライブラリ/プロジェクトのファイルサイズの問題点を見つける方法 - Qiita","url":"http://qiita.com/azu/items/7b54d614dc816780034a","tags":["browser","browserify","webpack","Tools","library"],"content":"Browserifyやwebpackなどでbundleしたファイルのサイズや依存モジュールのサイズなどを確認する方法について","relatedLinks":[]},{"category":"Article","title":"npm-scripts で Web フロントエンド開発を管理する – アカベコマイリ","url":"http://akabeko.me/blog/2016/10/npm-scripts-web-front-end-development/","tags":["npm","console"],"content":"npm run-scriptについて詳しく書かれた記事。\ngulpなどのTask Runnerで行う典型的なユースケースをnpm run-scriptでやった場合にどうなるかや、クロスプラットフォームで動くツールについて書かれている。","relatedLinks":[]},{"category":"Article","title":"event.offsetX,Yの罠...どこが原点の座標値なのかを理解する (currentTargetとtarget) - Qiita","url":"http://qiita.com/yukiB/items/cc533fbbf3bb8372a924","tags":["JavaScript","DOM"],"content":"targetとcurrentTargetの違い、offsetX/Y、screenX/Y、getBoundingClientRect()などについて","relatedLinks":[{"title":"マウスイベントで取得されるカーソル座標パラメータの整理(offset, page, screen, client) - Qiita","url":"http://qiita.com/yukiB/items/31a9e9e600dfb1f34f76"}]},{"category":"SlideVideo","title":"Proper Error Handling // Speaker Deck","url":"https://speakerdeck.com/michelebertoli/proper-error-handling","tags":["JavaScript","React","スライド"],"content":"エラーハンドリング周りについてスライド。\n何のためにするのか、手法やReactなどにおけるエラーハンドリングについて","relatedLinks":[]},{"category":"SlideVideo","title":"create-react-app-introduction // Speaker Deck","url":"https://speakerdeck.com/adwd/create-react-app-introduction","tags":["React","Tools","スライド"],"content":"ReactのStarterKit的な`create-react-app`についての紹介","relatedLinks":[{"title":"facebookincubator/create-react-app: Create React apps with no build configuration.","url":"https://github.com/facebookincubator/create-react-app"}]},{"category":"SlideVideo","title":"Web Components 2016 &amp; Polymer v2","url":"https://1000ch.github.io/slide/webcomponents-2016/","tags":["WebComponents","library","スライド"],"content":"Web Componentsについてのスライド。\nShadow DOM v1、Custom Elements v1それぞれの変更点。\nPolymer v2や`is`属性についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"WebVR - virtual reality in your browsers // Speaker Deck","url":"https://speakerdeck.com/casarock/webvr-virtual-reality-in-your-browsers","tags":["JavaScript","browser","VR"],"content":"VRの歴史やWebVR APIについてのスライド。\nまたWebVR APIを使ったユースケースの紹介","relatedLinks":[]},{"category":"WebsiteDocument","title":"はてな教科書 JavaScript 編 · GitBook","url":"https://hatena.github.io/Hatena-Textbook-JavaScript/","tags":["JavaScript","ebook"],"content":"JavaScriptの基本文法やDOM、Node.js、jQueryについてをざっと見ていく内容","relatedLinks":[{"title":"はてなサマーインターン2016を終え、「はてな教科書」をアップデートしました - Hatena Developer Blog","url":"http://developer.hatenastaff.com/entry/2016/10/05/160000"},{"title":"hatena/Hatena-Textbook-JavaScript: はてな研修用JavaScript教科書","url":"https://github.com/hatena/Hatena-Textbook-JavaScript"}]},{"category":"SoftwareLibrary","title":"babel/babel-preset-env: WIP: Autoprefixer for Babel: target specific environments (browser, node, etc)","url":"https://github.com/babel/babel-preset-env","tags":["babel","browser","node.js"],"content":"targetでブラウザやNode.jsのバージョンを指定することで、それに対応した最小限の変換を行うbabel preset","relatedLinks":[]},{"category":"SoftwareLibrary","title":"DeNADev/wahid: A CreateJS-compatible library for games","url":"https://github.com/DeNADev/wahid","tags":["JavaScript","game","library"],"content":"CreateJS互換の(モバイル)ゲーム向けライブラリ","relatedLinks":[{"title":"CreateJS 互換ライブラリ wahid の開発 — Mobage Developers Blog","url":"http://developers.mobage.jp/blog/createjs-wahid"}]},{"category":"SoftwareLibrary","title":"UI-Router","url":"https://ui-router.github.io/","tags":["JavaScript","library"],"content":"AngularとReactに対応したルータライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Office UI Fabric","url":"http://dev.office.com/fabric","tags":["MS","UI","React","AngularJS"],"content":"Office 365とかのUIコンポーネントを提供するライブラリ。\nVanilla JS、React、Angular、iOS版がある。","relatedLinks":[]},{"category":"Book","title":"React Components - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/9781785889288.do","tags":["React","book"],"content":"React Componentについての書籍","relatedLinks":[]},{"category":"Book","title":"Manning | Functional Programming in JavaScript","url":"https://www.manning.com/books/functional-programming-in-javascript","tags":["JavaScript","関数型プログラミング","book"],"content":"関数型プログラミングについての書籍\nサンプルコードがES2015ベースで書かれている。","relatedLinks":[]},{"category":"Book","title":"JavaScript : Functional Programming for JavaScript Developers | PACKT Books","url":"https://www.packtpub.com/web-development/javascript-functional-programming-javascript-developers","tags":["JavaScript","関数型プログラミング"],"content":"JavaScriptでの関数型プログラミングのパターン本","relatedLinks":[]}]},{"meta":{"title":"2016-10-18のJS: JS Foundation、npmクライアントのyarn","author":"azu","layout":"post","date":"2016-10-18T00:39:00.000Z","category":"JSer","tags":["jQuery","JS","Yarn","npm"],"url":"https://jser.info/2016/10/18/js-foundation-npmyarn/"},"items":[{"category":"Headline","title":"jsdom/Changelog.md at 9.7.1 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/9.7.1/Changelog.md","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"jsdom 9.7.0リリース。\nEventListenerOptionsのサポート、`document.hasFocus()`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"ESLint v3.8.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/10/eslint-v3.8.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 3.8.0リリース。\n`executeOnFiles()`の結果の`source`プロパティにソースコードを含められるように、新しいルールの追加や修正など","relatedLinks":[{"title":"ESLint v3.8.0 - Qiita","url":"http://qiita.com/mysticatea/items/6f037c15057c57982453"}]},{"category":"Headline","title":"Angular 2.1.0 Now Available","url":"http://angularjs.blogspot.com/2016/10/angular-210-now-available.html","tags":["AngularJS","ReleaseNote"],"content":"Angular 2.1.0リリース。\nRouterがpreloadingのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 15 | WebKit","url":"https://webkit.org/blog/6987/release-notes-for-safari-technology-preview-15/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 15リリース。\nEl Capitan向けの最後のリリース、Fetch APIの改善、`download`属性のサポート、`DOMTokenList.prototype.supports()`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"The Linux Foundation Unites JavaScript Community for Open Web Development | The JS Foundation","url":"https://js.foundation/announcements/2016/10/17/Linux-Foundation-Unites-JavaScript-Community-Open-Web-Development/","tags":["JavaScript","jQuery"],"content":"jQuery FoundationはJS Foundationになった。","relatedLinks":[{"title":"JS Foundation (@the","url":"https://twitter.com/the_jsf"},{"title":"jquery on Twitter: The jQuery Foundation is now the JS Foundation, you can follow the Foundation on @the","url":"https://twitter.com/jquery/status/788012682494423040"}]},{"category":"Headline","title":"Node v6.8.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v6.8.0/","tags":["node.js","ReleaseNote"],"content":"Node v6.8.0リリース。\n`fs.existsSync`がdeprecatedではなくなった。`http.request`が`timeout`オプションを受け取れるようになるなど","relatedLinks":[]},{"category":"Article","title":"Exploring JavaScript: Typed Arrays","url":"https://codingbox.io/exploring-javascript-typed-arrays-c8fd4f8bd24f","tags":["JavaScript"],"content":"Typed Arraysについての入門的な解説","relatedLinks":[]},{"category":"Article","title":"Introduction to HTTP/2  |  Web  |  Google Developers","url":"https://developers.google.com/web/fundamentals/performance/http2/","tags":["HTTP2","tutorial"],"content":"HTTP/2入門記事。 HTTP/2の概要が簡潔にまとまっている","relatedLinks":[]},{"category":"Article","title":"JavaScriptの配列のパターン | Web Scratch","url":"http://efcl.info/2016/10/11/array-patterns/","tags":["JavaScript","ECMAScript"],"content":"ES2015+をベースにした配列のパターンについて。 `indexOf(x) === -1`とか使わなくていいパターンや代替となる方法などについてサンプルコードを中心にかかれている","relatedLinks":[]},{"category":"Article","title":"AbemaTV の番組表リニューアルに伴うパフォーマンス改善 - Qiita","url":"http://qiita.com/keyi8773/items/f435f062afa7c5dc8e13","tags":["JavaScript","DOM","React"],"content":"無限スクロール系のUIパフォーマンスの改善について。\nレンダリングの改善、`position: relative`による意図しないレイヤーが作成される問題、スロットリングなどの低減策についてなど","relatedLinks":[{"title":"GPUアクセラレーションとposition: relativeによるレイヤー生成について ::ハブろぐ","url":"https://havelog.ayumusato.com/develop/performance/e556-compositing_border_and_layer.html"}]},{"category":"Article","title":"アメブロ2016 ~ React/ReduxでつくるIsomorphic web app ~ | CyberAgent Developers Blog | サイバーエージェント デベロッパーズブログ","url":"https://developers.cyberagent.co.jp/blog/archives/636/","tags":["React","redux","JavaScript"],"content":"アメブロをReact/Reduxでサーバサイドレンダリングの構造に移行するまでの話。\nツール環境、CSS、アクセシビリティ、レンダリングについてなど","relatedLinks":[]},{"category":"Article","title":"Undo Functionality with the Command Pattern in JavaScript — Pyred","url":"http://pyred.net/coding/2016/10/12/undo-functionality-with-the-command-pattern-in-javascript","tags":["JavaScript","デザインパターン"],"content":"JavaScriptでのコマンドパターンについて","relatedLinks":[]},{"category":"Article","title":"Vue.js入門 ―最速で作るシンプルなWebアプリケーション：連載｜gihyo.jp … 技術評論社","url":"http://gihyo.jp/dev/serial/01/vuejs","tags":["JavaScript","library"],"content":"Vue.jsについての連載","relatedLinks":[]},{"category":"SlideVideo","title":"モダン日本語フォント指定 // Speaker Deck","url":"https://speakerdeck.com/tacamy/modanri-ben-yu-huontozhi-ding","tags":["CSS","fonts"],"content":"CSSのfont-familyについてのスライド。\nOSやブラウザでfontの情報が異なるため、`@font-face`を使い定義するという話","relatedLinks":[]},{"category":"WebsiteDocument","title":"JSPerf - Community Driven JavaScript Performance Benchmarks","url":"http://jsperf.co/","tags":["JavaScript","performance"],"content":"JavaScriptのコードのパフォーマンス計測サイト。\njsperf.com と似たような感じのサイト。\nデータはGitHubへ自動的にコミットされ、Jekyllを使った静的サイトとして配信されてる。","relatedLinks":[{"title":"hasharray/jsperf: JavaScript Performance Benchmarks","url":"https://github.com/hasharray/jsperf"}]},{"category":"WebsiteDocument","title":"emartech/angular2-phonecat: Angular 2 port of the original Angular Phonecat application with Webpack","url":"https://github.com/emartech/angular2-phonecat","tags":["AngularJS"],"content":"AngularJS 2にPhonecatを移植したもの","relatedLinks":[]},{"category":"WebsiteDocument","title":"pauliusuza/node-v7-async-await-demo: Node.js 7.x async / await support demonstration","url":"https://github.com/pauliusuza/node-v7-async-await-demo","tags":["node.js"],"content":"Node.js 7.xでasync/awaitを有効にするデモ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Yarn","url":"https://yarnpkg.com/","tags":["npm","node.js","Tools"],"content":"npmクライアントツール。\n`package.json`の扱いは既存のnpmと互換を持つ。\nキャッシュや並列処理を行い高速なインストール、`yarn.lock`を使った依存バージョン固定を正確に行える。","relatedLinks":[{"title":"Yarn: A new package manager for JavaScript | Engineering Blog | Facebook Code","url":"https://code.facebook.com/posts/1840075619545360"},{"title":"The npm Blog — Hello, Yarn!","url":"http://blog.npmjs.org/post/151660845210/hello-yarn"},{"title":"Migrating from npm | Yarn","url":"https://yarnpkg.com/en/docs/migrating-from-npm"}]},{"category":"SoftwareLibrary","title":"naptha/tesseract.js: Pure Javascript OCR for 62 Languages","url":"https://github.com/naptha/tesseract.js","tags":["JavaScript","OCR","library"],"content":"tesseract OCRのJavaScript port。\nブラウザやNodeでOCRできるライブラリ","relatedLinks":[{"title":"Compile to EMScripten/asm.js · Issue #75 · tesseract-ocr/tesseract","url":"https://github.com/tesseract-ocr/tesseract/issues/75"},{"title":"tesseract-ocr/tesseract: Tesseract Open Source OCR Engine (main repository)","url":"https://github.com/tesseract-ocr/tesseract"}]},{"category":"Book","title":"getify/Functional-Light-JS: A book about functional programming in JavaScript.","url":"https://github.com/getify/Functional-Light-JS","tags":["JavaScript","関数型プログラミング","ebook"],"content":"関数型JavaScriptについての無料の書籍","relatedLinks":[]}]},{"meta":{"title":"2016-10-24のJS: npm 4.0.0、Node.js v6.9.0 (LTS)、webpack@2へのマイグレーション","author":"azu","layout":"post","date":"2016-10-24T00:36:00.000Z","category":"JSer","tags":["npm","Node.js","webpack"],"url":"https://jser.info/2016/10/24/npm-4.0.0-node.js-v6.9.0-lts-webpack2/"},"items":[{"category":"Headline","title":"Release v4.0.0 · npm/npm","url":"https://github.com/npm/npm/releases/tag/v4.0.0","tags":["npm","ReleaseNote"],"content":"npm v4 Preリリース\n`npm i -g npm@4`でインストールができるように、`npm search`の速度改善、`publish`ライフサイクルがdepreated、代わりに`prepare`や`prepublishOnly`が利用可能に、\n`npm tag`が削除など","relatedLinks":[{"title":"node-gakuen-201610.md","url":"https://gist.github.com/othiym23/c98bd4ef5d9fb3f496835bd481ef40ae"},{"title":"$ npm search npm # on npm@4","url":"https://twitter.com/azu_re/status/789985478065790976"}]},{"category":"Headline","title":"Release JSHint 2.9.4 · jshint/jshint","url":"https://github.com/jshint/jshint/releases/tag/2.9.4","tags":["JavaScript","Tools","ReleaseNote"],"content":"JSHint 2.9.4リリース。\nTDZの対応、重複したエラー報告をしないようになるなど","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember.js 2.8-LTS, 2.9 and 2.10 Beta Released","url":"http://emberjs.com/blog/2016/10/17/ember-2-9-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember.js 2.8-LTS、2.9、2.10β リリース。\n2.8-LTSでは2018年2月までセキュリティパッチがリリースされる。","relatedLinks":[]},{"category":"Headline","title":"flux/CHANGELOG.md at 3.1.0 · facebook/flux","url":"https://github.com/facebook/flux/blob/3.1.0/CHANGELOG.md","tags":["facebook","Flux","library","ReleaseNote"],"content":"Facebook/flux 3.0.0リリース。\n`FluxMapStore`を削除","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 55 Beta: Input handling improvements and async/await functions","url":"https://blog.chromium.org/2016/10/chrome-55-beta-input-handling.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 55 Betaリリース。\nPointer Events、async/await、CSS `hyphens`、Persistent Storageのサポートなど\ncorss originでかつ2G回線における`document.write`をブロックするようになるなど","relatedLinks":[]},{"category":"Headline","title":"Node v6.9.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v6.9.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v6.9.0 (LTS)リリース。\nNode.js v4.x (LTS)からのマイグレーションガイドも書かれている。\nv6.xは2018年4月までアクティブなLTSとなる。","relatedLinks":[{"title":"Node.js v6 Transitions to LTS – Medium","url":"https://medium.com/@nodejs/node-js-v6-transitions-to-lts-be7f18c17159"}]},{"category":"Article","title":"Node.js v6 Transitions to LTS – Medium","url":"https://medium.com/@nodejs/node-js-v6-transitions-to-lts-be7f18c17159","tags":["node.js"],"content":"Node.js v6以降のLTSスケジュールについて\nNode.js v0.10/v0.12は2016年12月でEOLとなる。","relatedLinks":[]},{"category":"Article","title":"auxclick is Coming to Chrome 55  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2016/10/auxclick","tags":["Chrome","JavaScript"],"content":"左クリック以外に反応する`clicK`イベントである`auxclick`イベントについて。","relatedLinks":[]},{"category":"Article","title":"Once Upon an Event Listener  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2016/10/addeventlistener-once","tags":["JavaScript","DOM"],"content":"`HTMLElement#addEventListener`の`{once}`オプションについて。\n一度のみハンドリングするハンドラを指定できる","relatedLinks":[]},{"category":"Article","title":"Migrating to Webpack 2","url":"http://javascriptplayground.com/blog/2016/10/moving-to-webpack-2/","tags":["webpack","document"],"content":"webpack@1から@2へのマイグレーションについて","relatedLinks":[{"title":"How to Upgrade from Webpack 1?","url":"https://webpack.js.org/how-to/upgrade-from-webpack-1/"}]},{"category":"Article","title":"Async functions - making promises friendly  |  Web  |  Google Developers","url":"https://developers.google.com/web/fundamentals/getting-started/primers/async-functions","tags":["JavaScript"],"content":"async/awaitについて。\nsequentialとparallelな書き方の違いについてサンプルコードと共に解説してる","relatedLinks":[]},{"category":"Article","title":"Tips for using async functions (ES2017)","url":"http://www.2ality.com/2016/10/async-function-tips.html","tags":["JavaScript"],"content":"async/awaitの細かな注意点について。\nasyncの動作、awaitを忘れた場合の動画、`await Promise.all()`、コールバックとasync、unhandled rejectionについて","relatedLinks":[]},{"category":"Article","title":"TestCafeでブラウザの自動テスト(E2Eテスト) | Web Scratch","url":"http://efcl.info/2016/10/23/testcafe/","tags":["JavaScript","browser","testing","E2E"],"content":"ブラウザの自動テストフレームワークであるTestCafeの使い方についての解説。\n設定レスで動作する仕組み、リモートテスト、テストコードについて","relatedLinks":[]},{"category":"Article","title":"Syntax: language agnostic parser generator – Medium","url":"https://medium.com/@DmitrySoshnikov/syntax-language-agnostic-parser-generator-bd24468d7cfc","tags":["JavaScript","library"],"content":"言語を問わないagnosticなパーサ、ジェネレータツールキット","relatedLinks":[{"title":"DmitrySoshnikov/syntax: Syntactic analysis toolkit for education, tracing the parsing process, and parsers generation.","url":"https://github.com/DmitrySoshnikov/syntax"}]},{"category":"Article","title":"Pragmatic, Practical, and Progressive Theming with Custom Properties – CSS Wizardry – CSS, OOCSS, front-end architecture, performance and more, by Harry Roberts","url":"http://csswizardry.com/2016/10/pragmatic-practical-progressive-theming-with-custom-properties/","tags":["CSS"],"content":"CSS Custom Propertyを使ったテーマの実装","relatedLinks":[]},{"category":"SlideVideo","title":"Polymer Summit 2016 - YouTube","url":"https://www.youtube.com/playlist?list=PLNYkxOF6rcICc687SxHQRuo9TVNOJelSZ","tags":["JavaScript","WebComponents","イベント"],"content":"Polymer Summit 2016の動画一覧","relatedLinks":[{"title":"Polymer Summit 2016","url":"https://www.polymer-project.org/summit"}]},{"category":"WebsiteDocument","title":"A JavaScript library for building user interfaces - React","url":"https://facebook.github.io/react/","tags":[],"content":"Reactのドキュメントが新しくなった。\nCodepenでサンプルを実行できるように","relatedLinks":[{"title":"Dan Abramov on Twitter: ","url":"https://twitter.com/dan_abramov/status/789573515750076417"}]},{"category":"WebsiteDocument","title":"jsPerf: JavaScript performance playground","url":"https://jsperf.com/","tags":["JavaScript","performance","webservice"],"content":"JavaScriptスニペットのパフォーマンス計測サービスであるjsPerfのリニューアル公開","relatedLinks":[]},{"category":"SoftwareLibrary","title":"beautify-web/js-beautify · GitHub","url":"https://github.com/beautify-web/js-beautify","tags":["JavaScript","Tools"],"content":"JavaScriptを整形できるツールとサイト。 `.jsbeautifyrc`で設定を管理できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jgraph/mxgraph: mxGraph is a fully client side JavaScript diagramming library","url":"https://github.com/jgraph/mxgraph","tags":["JavaScript","SVG","library"],"content":"draw.ioで使われているSVGの作図ライブラリ。","relatedLinks":[{"title":"JavaScript Diagram Editor","url":"https://jgraph.github.io/mxgraph/javascript/"},{"title":"jgraph/draw.io: Source to www.draw.io","url":"https://github.com/jgraph/draw.io"}]},{"category":"SoftwareLibrary","title":"Automated browser testing for the modern web development stack | TestCafe","url":"http://devexpress.github.io/testcafe/","tags":["JavaScript","testing","E2E"],"content":"設定なしで使える自動テストフレームワーク。\nSeleniumを使わないので単独で動作する。\nBabelを内蔵しasync/awaitなどを扱え、自動的に一定時間待つなどの仕組みを持っている。","relatedLinks":[{"title":"TestCafeでブラウザの自動テスト(E2Eテスト) | Web Scratch","url":"http://efcl.info/2016/10/23/testcafe/"},{"title":"Why not use Selenium? - Questions - TestCafe Discussion Board","url":"https://testcafe-discuss.devexpress.com/t/why-not-use-selenium/47/2"}]},{"category":"SoftwareLibrary","title":"Hyperform - Capture form validation back from the browser","url":"https://hyperform.js.org/","tags":["JavaScript","library"],"content":"HTML5 form validation APIをpolyfill/置き換える実装を持つフォームバリデーションライブラリ","relatedLinks":[]},{"category":"Book","title":"JavaScript フレームワーク入門 : 掌田津耶乃 : 本 : Amazon.co.jp","url":"https://www.amazon.co.jp/JavaScript-%E3%83%95%E3%83%AC%E3%83%BC%E3%83%A0%E3%83%AF%E3%83%BC%E3%82%AF%E5%85%A5%E9%96%80-%E6%8E%8C%E7%94%B0%E6%B4%A5%E8%80%B6%E4%B9%83/dp/4798047848","tags":["JavaScript","library","book"],"content":"TypeScript、npmとBower、webpack、jQuery、Vue.js、Backbone.js、Angular、React、AureliaなどのJavaScriptの色々なツールやフレームワークについての本","relatedLinks":[]}]},{"meta":{"title":"2016-11-01のJS: Node.js v7、Node.js v0.10 EOL、WebAssembly Browser Preview","author":"azu","layout":"post","date":"2016-11-01T00:57:00.000Z","category":"JSer","tags":["Node.js","WebAssembly","Browser"],"url":"https://jser.info/2016/11/01/node.js-v7-node.js-v0.10-eol-webassembly-browser-preview/"},"items":[{"category":"Headline","title":"Node v7.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v7.0.0/","tags":["node.js","ReleaseNote"],"content":"Node v7.0.0リリース。\nV8のアップデート、WHATWG URL Parserの試験的サポートなど","relatedLinks":[]},{"category":"Headline","title":"6.18.0 Released · Babel","url":"https://babeljs.io/blog/2016/10/24/6.18.0","tags":["babel","ReleaseNote"],"content":"Babel v6.18.0リリース。\n`import()`のinitialサポート、`helper-builder-react-jsx`に`useBuiltIns`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 16 | WebKit","url":"https://webkit.org/blog/7030/release-notes-for-safari-technology-preview-16/","tags":["safari","URL","security"],"content":"Safari Technology Preview Release 16リリース。\nURLのパースがウェブ標準により準拠するように、Gamepad APIのサポート、`Intl.getCanonicalLocales`のサポート、ES2016のnon-simple parametersにおけるearly errorに対応など","relatedLinks":[]},{"category":"Headline","title":"ESLint v3.9.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/10/eslint-v3.9.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v3.9.0リリース。\n`codeframe` formatterの追加、カスタムパーサがルール向けに情報を提供するオブジェクト(`context.parserServices`)を定義できるようになるなど","relatedLinks":[{"title":"ESLint v3.9.0 - Qiita","url":"http://qiita.com/mysticatea/items/abc7885b373b5b37ce97"},{"title":"Proposal for Parser Services · Issue #6974 · eslint/eslint","url":"https://github.com/eslint/eslint/issues/6974"}]},{"category":"Article","title":"Redux without React — State Management in Vanilla JavaScript","url":"https://www.sitepoint.com/redux-without-react-state-management-vanilla-javascript/","tags":["redux","JavaScript"],"content":"Reactは使わずにReduxを扱ってみる話","relatedLinks":[]},{"category":"Article","title":"Visual Debugging with ES6 and Node.js – Good Eggs Product – Medium","url":"https://medium.com/good-eggs-product/visual-debugging-with-es6-and-node-js-44631b3b040f","tags":["node.js","debug"],"content":"Node.jsとBabelを組み合わせた場合のGUIデバッグ方法について","relatedLinks":[]},{"category":"Article","title":"V8 JavaScript Engine: WebAssembly Browser Preview","url":"http://v8project.blogspot.com/2016/10/webassembly-browser-preview.html","tags":["WebAssembly","V8"],"content":"Chromeがフラグ付きでWebAssernblyを実験的にサポート。フィードバックを募集している。","relatedLinks":[{"title":"WebAssembly","url":"http://webassembly.org/roadmap/"}]},{"category":"Article","title":"Different ways to debug JavaScript code – Medium","url":"https://medium.com/@sandeep.scet/different-ways-to-debug-javascript-code-579e7f58cf10","tags":["JavaScript","debug"],"content":"JavaScriptのデバッグ手法について。\nalert、console、breakpoint、`debugger;`、`debug`、`monitor`などのAPIや方法について","relatedLinks":[]},{"category":"Article","title":"Node v7 で入った WHATWG URL 実装について | blog.jxck.io","url":"https://blog.jxck.io/entries/2016-10-27/whatwg-url.html","tags":["WHATWG","URL"],"content":"Node.js v7で試験的に実装されたWHATWG URLについて","relatedLinks":[]},{"category":"Article","title":"ZEIT – Next.js","url":"https://zeit.co/blog/next","tags":["JavaScript","React","serverless","isomorphic"],"content":"Reactを使ったサーバサイドレンダリング向けのフレームワーク。\nCSS in JS、Head、ルーティングや開発ツールがセットになっている。","relatedLinks":[]},{"category":"SlideVideo","title":"Webpack &amp; React Performance in 16+ Steps","url":"http://www.slideshare.net/grgur/webpack-react-performance-in-16-steps","tags":["webpack","React","performance"],"content":"webpackとReactでパフォーマンスやサイズなど気をつける点についてのスライド","relatedLinks":[]},{"category":"WebsiteDocument","title":"timarney/react-faq: A collection of links to help answer your questions about React.js","url":"https://github.com/timarney/react-faq","tags":["React"],"content":"Reactに関するFAQをまとめたページ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Performance  |  Web  |  Google Developers","url":"https://developers.google.com/web/fundamentals/performance/","tags":["browser","Chrome","document"],"content":"ウェブサイトのパフォーマンス改善についてのドキュメント。\nクリティカルレンダリングパスの改善やネットワーク、アニメーションなど色々なパフォーマンスについての記事がまとめられている","relatedLinks":[]},{"category":"WebsiteDocument","title":"パフォーマンス - 開発ツール | MDN","url":"https://developer.mozilla.org/ja/docs/Tools/Performance","tags":["firefox","performance","document","browser","JavaScript"],"content":"Firefoxの開発者ツールのリファレンスページ。\n基本的な使い方やツールの見方について。\nまたカクカクなCSSアニメーション、UIスレッドをブロックしてしまうJSの問題などのシナリオ元にした改善方法についても書かれている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pelotoncycle/resize-observer","url":"https://github.com/pelotoncycle/resize-observer","tags":["JavaScript","library"],"content":"Resize Observerのpolyfill","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Raynos/jsig: From scratch type-checker","url":"https://github.com/Raynos/jsig","tags":["JavaScript","document","flowtype","Tools","TypeScript"],"content":"JSDocのような型アノテーションコメントと型推論から静的な型チェックを行うツール。\nFlowTypeとは異なりES5に焦点をおいてる事と曖昧さを許容しない作り","relatedLinks":[]},{"category":"SoftwareLibrary","title":"taichi/ci-yarn-upgrade: Keep NPM dependencies up-to-date with CI, providing version-to-version diff for each library","url":"https://github.com/taichi/ci-yarn-upgrade","tags":["JavaScript","npm","Tools"],"content":"yarnを使ってpackage.jsonの依存モジュールを更新するPRを出す事ができるツール。\nまた更新するモジュールの一覧を取得する事もできる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"azu/ui-event-observer: Provide performant way to subscribe to browser UI Events.","url":"https://github.com/azu/ui-event-observer","tags":["JavaScript","library"],"content":"同じ要素への同じイベントの複数の`addEventListener`を1つにまとめて扱うことができるライブラリ。","relatedLinks":[]},{"category":"Book","title":"Modular JavaScript Book Series","url":"https://mjavascript.com/","tags":["JavaScript","book"],"content":"クラウドファンディングで開始されたJavaScriptの書籍シリーズ","relatedLinks":[{"title":"Table of Contents — Practical ES6","url":"https://ponyfoo.com/books/practical-es6/chapters#toc"}]},{"category":"Book","title":"関数型プログラミングの基礎 JavaScriptを使って学ぶ : 立川察理, 長瀬嘉秀 : 本 : Amazon.co.jp","url":"https://www.amazon.co.jp/%E9%96%A2%E6%95%B0%E5%9E%8B%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9F%E3%83%B3%E3%82%B0%E3%81%AE%E5%9F%BA%E7%A4%8E-JavaScript%E3%82%92%E4%BD%BF%E3%81%A3%E3%81%A6%E5%AD%A6%E3%81%B6-%E7%AB%8B%E5%B7%9D%E5%AF%9F%E7%90%86/dp/4865940596","tags":["JavaScript","関数型プログラミング","book"],"content":"2016年10月29日発売\nJavaScriptでの関数型プログラミングについての書籍","relatedLinks":[{"title":"リックテレコム 書籍情報","url":"http://www2.ric.co.jp/create/book/contents/book_1059.html"}]}]},{"meta":{"title":"2016-11-08のJS: sitespeed.io 4.0、webpack 2 beta入門、JavaScriptスタックチュートリアル","author":"azu","layout":"post","date":"2016-11-08T01:44:00.000Z","category":"JSer","tags":["performance","webpack","JavaScript","framework"],"url":"https://jser.info/2016/11/08/sitespeed.io-4.0-webpack-2-beta-javascript/"},"items":[{"category":"Headline","title":"Welcome sitespeed.io 4.0","url":"https://www.sitespeed.io/sitespeed.io-4.0-is-released/","tags":["browser","performance","Tools"],"content":"Sitespeed.io 4.0リリース。\nDockerでgrafanaのダッシュボードを含んだセットアップが用意された、Pre/Postスクリプトでログインに対応、プラグイン、HTTP/2、HARファイルの対応改善、モバイル対応など","relatedLinks":[]},{"category":"Headline","title":"Release v0.34.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.34.0","tags":["flowtype","ReleaseNote"],"content":"FlowType v0.34.0リリース。\n`empty` typeの追加、AsyncIterationの対応など","relatedLinks":[]},{"category":"Headline","title":"async/await support in Firefox | Firefox Nightly News","url":"https://blog.nightly.mozilla.org/2016/11/01/async-await-support-in-firefox/","tags":["firefox","JavaScript"],"content":"Firefox Nightlyにasync/awaitが実装された。","relatedLinks":[]},{"category":"Article","title":"Getting Started with Webpack 2","url":"https://blog.madewithenvy.com/getting-started-with-webpack-2-ed2b86c68783","tags":["webpack","tutorial"],"content":"webpack 2を使ったビルドの設定について。\nmultiple entry、loader、bundleの分割などについて","relatedLinks":[]},{"category":"Article","title":"What&#x27;s New and What&#x27;s Changed in Bootstrap 4 -Telerik Developer Network","url":"http://developer.telerik.com/featured/whats-new-whats-changed-bootstrap-4/","tags":["CSS"],"content":"Bootstrap 4αでの変更点について","relatedLinks":[]},{"category":"Article","title":"Vue.js 1.x から 2.0 への移行のポイント | d.sunnyone.org","url":"http://d.sunnyone.org/2016/11/vuejs-1x-20.html","tags":["JavaScript","library"],"content":"Vue 1.xから2.0へのマイグレーションについて。\nテンプレートが事前コンパイルされるようになったことでの違いや移行方法、気をつけるポイントについて","relatedLinks":[]},{"category":"Article","title":"TypeScript 2.0: Read-Only Properties | Marius Schulz","url":"https://blog.mariusschulz.com/2016/10/31/typescript-2-0-read-only-properties","tags":["TypeScript"],"content":"TypeScript 2.0の`readonly`について","relatedLinks":[]},{"category":"Article","title":"Cooperative Scheduling with requestIdleCallback ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2016/11/cooperative-scheduling-with-requestidlecallback/","tags":["JavaScript","WebPlatformAPI"],"content":"Firefox 52で実装される`requestIdleCallback`についての解説。\n`timeRemaining()`、`timeout`オプションやキャンセルした場合についてなど。","relatedLinks":[{"title":"Cooperative Scheduling of Background Tasks（日本語訳）","url":"https://triple-underscore.github.io/requestidlecallback-ja.html"},{"title":"Using requestIdleCallback  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2015/08/using-requestidlecallback"}]},{"category":"Article","title":"Pointing the Way Forward  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2016/10/pointer-events","tags":["JavaScript"],"content":"Pointer eventsについて。\nPenやTouchなどのイベントモデルを抽象化したもの。\n`pointerType`でイベントの種類ごと扱う方法、`pointercancel`や`touch-action`について","relatedLinks":[]},{"category":"Article","title":"Build a Universal JavaScript App with Next.js","url":"https://auth0.com/blog/building-universal-apps-with-nextjs/","tags":["React","サーバー","library","tutorial"],"content":"Next.jsを使ったアプリケーションを作るチュートリアル。","relatedLinks":[]},{"category":"Article","title":"takahashim/js-stack-from-scratch: Step-by-step tutorial to build a modern JavaScript stack from scratch","url":"https://github.com/takahashim/js-stack-from-scratch","tags":["JavaScript","Tools","library","tutorial","翻訳"],"content":"JavaScriptのエコシステムや著名なライブラリを使ったチュートリアルの翻訳。\n色々なツールをあわせ使うことを前提に書かれたガイド","relatedLinks":[]},{"category":"Article","title":"jareware/css-architecture: 8 simple rules for a robust, scalable CSS architecture","url":"https://github.com/jareware/css-architecture","tags":["CSS","設計"],"content":"8つのルールを元にしたCSSのアーキテクチャ。\nコンポーネントとCSSの関係についてが中心","relatedLinks":[]},{"category":"WebsiteDocument","title":"vhf/v8-bailout-reasons: A list of Crankshaft bailout reasons with examples","url":"https://github.com/vhf/v8-bailout-reasons","tags":["V8","JavaScript"],"content":"V8のdeoptimizationがなぜ起きるのかについて\"Bailout reasons\"と共に理由を解説してるリポジトリ","relatedLinks":[{"title":"V8の最適化とIRHydraでの可視化とベンチマークについてのメモ | Web Scratch","url":"http://efcl.info/2014/09/13/v8-optimization-memo/"}]},{"category":"SoftwareLibrary","title":"turbo.js - Easy GPGPU","url":"https://turbo.github.io/","tags":["JavaScript","WebGL"],"content":"GLSLを使って演算処理を行うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tfennelly/browserify-tree: Generate a Browserify bundle dependency tree for bundled modules","url":"https://github.com/tfennelly/browserify-tree","tags":["browser","Tools"],"content":"Browserifyでbundleしたファイルの依存ツリーを見ることができるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"naver/egjs: Set of UI interactions, effects and utility components library using jQuery.","url":"https://github.com/naver/egjs","tags":["jQuery","library"],"content":"jQueryベースのUIインタラクション、エフェクトライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Grimoire.js","url":"https://grimoire.gl/","tags":["JavaScript","WebGL","library"],"content":"GOMLというHTMLライクなXMLシンタックスで記述して、WebGLを使った3D表現を行うライブラリ。\n`<scene>`や`<camera>`といったノードを組み合わせることで表現する。","relatedLinks":[]},{"category":"Book","title":"Securing Third-Party Code - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920051695.do","tags":["JavaScript","OSS","security","library","book"],"content":"2017年1月発売\nJavaScriptのサードパーティのコードを安全に使う方法についての書籍","relatedLinks":[]},{"category":"Book","title":"Developing SPAs - O&#x27;Reilly Media","url":"http://shop.oreilly.com/product/0636920046349.do","tags":["JavaScript","book"],"content":"2017年1月発売\n.NET開発者向けのSPA本","relatedLinks":[]},{"category":"Book","title":"Pro Angular 2: ADAM FREEMAN: 9781484223062: Amazon.com: Books","url":"https://www.amazon.com/Pro-Angular-2-ADAM-FREEMAN/dp/1484223063","tags":["AngularJS","book"],"content":"2017年5月8日発売\nAngularJS 2についての書籍","relatedLinks":[]},{"category":"Book","title":"WebデベロッパーのためのReact開発入門 JavaScript UI ライブラリの基本と活用 | 柴田 文彦 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/Web%E3%83%87%E3%83%99%E3%83%AD%E3%83%83%E3%83%91%E3%83%BC%E3%81%AE%E3%81%9F%E3%82%81%E3%81%AEReact%E9%96%8B%E7%99%BA%E5%85%A5%E9%96%80-JavaScript-UI-%E3%83%A9%E3%82%A4%E3%83%96%E3%83%A9%E3%83%AA%E3%81%AE%E5%9F%BA%E6%9C%AC%E3%81%A8%E6%B4%BB%E7%94%A8-%E6%9F%B4%E7%94%B0/dp/4295000337","tags":["JavaScript","React","book"],"content":"2016年11月25日発売\nReactの入門本","relatedLinks":[{"title":"WebデベロッパーのためのReact開発入門 JavaScript UIライブラリの基本と活用 - インプレスブックス","url":"http://book.impress.co.jp/books/1116101049"}]}]},{"meta":{"title":"2016-11-15のJS: TypeScript 2.1RC、Node.js v7.1.0リリース","author":"azu","layout":"post","date":"2016-11-15T01:22:00.000Z","category":"JSer","tags":["TypeScript","Node.js"],"url":"https://jser.info/2016/11/15/typescript-2.1rc-node.js-v7.1.0/"},"items":[{"category":"Headline","title":"TestCafe v0.10.0 Released | TestCafe","url":"http://devexpress.github.io/testcafe/blog/testcafe-v0-10-0-released.html","tags":["JavaScript","E2E","testing","ReleaseNote"],"content":"TestCafe v0.10.0リリース。\nSnapshot APIを扱いやすく、automatic waitの仕組みを改善、`speed`オプションでテストの実行速度をコントールできるようになるなど","relatedLinks":[]},{"category":"Headline","title":"TypeScript 2.1 RC: Better Inference, Async Functions, and More | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2016/11/08/typescript-2-1-rc-better-inference-async-functions-and-more/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.1 RCリリース。\n`any`型の改善、tsconfig.jsonの`extends`対応、async/awaitがES3/ES5へ出力できるようになるなど","relatedLinks":[{"title":"TypeScript 2.1.1 変更点 - Qiita","url":"http://qiita.com/vvakame/items/305749d3d6dc6bf877c6"}]},{"category":"Headline","title":"Node v7.1.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v7.1.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v7.1.0リリース。\nV8の仕様追従により意図しない破壊的な変更が起きていた。","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 17 | WebKit","url":"https://webkit.org/blog/7071/release-notes-for-safari-technology-preview-17/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 17リリース。\nNPAPIプラグインのサポート終了、Custom Elementのデフォルト有効化、`rel=noopener`のサポートなど","relatedLinks":[]},{"category":"Article","title":"Migrating to Jest – Medium","url":"https://medium.com/@kentcdodds/migrating-to-jest-881f75366e7e","tags":["JavaScript","React","testing"],"content":"AVAとMochaでのテストをJestにマイグレーションする方法とツール(codemods)について。\nUI testsの時間が短縮されてる。","relatedLinks":[{"title":"skovhus/jest-codemods: Codemods for migrating to Jest https://github.com/facebook/jest","url":"https://github.com/skovhus/jest-codemods"}]},{"category":"Article","title":"Migrating an Angular 1 App to Angular 2 - Part 1","url":"https://auth0.com/blog/migrating-an-angular-1-app-to-angular-2-part-1/","tags":["AngularJS","tutorial"],"content":"AngularJS 1.xのアプリをAngularJS 2へマイグレーションするチュートリアル","relatedLinks":[{"title":"auth0-blog/ng2-dinos: A sample Angular 2 application","url":"https://github.com/auth0-blog/ng2-dinos"}]},{"category":"Article","title":"FLOCSSを使ってCSSファイルを20,000行から9,000行にした話 - Qiita","url":"http://qiita.com/Atsss/items/4f9d98fb1d0546539c09","tags":["CSS","リファクタリング"],"content":"CSSのリファクタリング手法や方針について。\nどのようなフローでリファクタリングを進めていったかや進捗の可視化について","relatedLinks":[]},{"category":"Article","title":"2016年、Web Audio API はどう変わったのか? | g200kg Music &amp; Software","url":"http://www.g200kg.com/archives/2016/11/2016web-audio-a.html","tags":["web ","audio","API"],"content":"Web Audio APIの変更点について。\nAudioWorkerがAudioWorkletにリネーム、ConstantSourceNodeの追加、コンストラクタのサポートなど","relatedLinks":[]},{"category":"Article","title":"Writing a JavaScript Framework - Data Binding with ES6 Proxies | @RisingStack","url":"http://blog.risingstack.com/writing-a-javascript-framework-data-binding-es6-proxy/","tags":["JavaScript","library"],"content":"ProxyやReflect APIを使い、値の変更を監視するObservableライブラリ。\nES5のgetter/setterを使ったアプローチとの比較","relatedLinks":[{"title":"RisingStack/nx-observe: Next gen data observation/binding with ES6 Proxies","url":"https://github.com/RisingStack/nx-observe"}]},{"category":"Article","title":"Pitfall: not all objects can be proxied transparently","url":"http://www.2ality.com/2016/11/proxying-builtins.html","tags":["JavaScript","ECMAScript"],"content":"ES2015のProxyでhandlerオブジェクトが空である場合に透過的な動作を期待するがそうではないという話","relatedLinks":[]},{"category":"Article","title":"Logging Errors in Client-Side Applications","url":"https://www.sitepoint.com/logging-errors-client-side-apps/","tags":["JavaScript","debug","library"],"content":"クライアントサイドのロガーやエラー収集サービスについてのまとめ","relatedLinks":[]},{"category":"Article","title":"Improving Perceived Performance with Multiple Background Images – CSS Wizardry – CSS, OOCSS, front-end architecture, performance and more, by Harry Roberts","url":"http://csswizardry.com/2016/10/improving-perceived-performance-with-multiple-background-images/","tags":["CSS","画像"],"content":"`background-image`に指定した画像が表示されるまで、`linear-gradient`を使った模様を代替表示するFallbackについて","relatedLinks":[]},{"category":"SlideVideo","title":"Chrome Dev Summit 2016 - YouTube","url":"https://www.youtube.com/user/ChromeDevelopers","tags":["Chrome","video","イベント"],"content":"Chrome Dev Summit 2016の動画まとめ","relatedLinks":[{"title":"Chrome Dev Summit 2016","url":"https://developer.chrome.com/devsummit/"}]},{"category":"SoftwareLibrary","title":"deck.gl","url":"https://uber.github.io/deck.gl/","tags":["WebGL","library"],"content":"Uber製のWebGLを使ったデータビジュアライゼーションライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"doiuse...?","url":"http://www.doiuse.com/","tags":["CSS","tool"],"content":"CSSをペーストして指定したブラウザ(autoprefixerのフォーマット)で利用できるかをチェックできるツール","relatedLinks":[{"title":"anandthakker/doiuse: Lint CSS for browser support against caniuse database.","url":"https://github.com/anandthakker/doiuse"}]},{"category":"SoftwareLibrary","title":"caiogondim/logdown.js: Debug utility with markdown support that runs on browser and server","url":"https://github.com/caiogondim/logdown.js","tags":["JavaScript","debug","library"],"content":"ブラウザとNode.jsで動くシンプルなロガーライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"th0r/webpack-bundle-analyzer: Webpack plugin and CLI utility that represents bundle content as convenient interactive zoomable treemap","url":"https://github.com/th0r/webpack-bundle-analyzer","tags":["webpack","Tools"],"content":"webpackのbundleの構成要素やサイズをビジュアライズできるプラグイン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"DJWassink/Promise-parallel-throttle: It&#x27;s like Promise.all(), but throttled!","url":"https://github.com/DJWassink/Promise-parallel-throttle","tags":["JavaScript","Promises","library"],"content":"一度に実行する数を指定できる`Promise.all`的なライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dop251/goja: ECMAScript 5.1(+) implementation written in Go","url":"https://github.com/dop251/goja","tags":["ECMAScript","JavaScript","golang"],"content":"ECMAScriptのGo言語実装。\nES5.1相当の実装をしてる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dhamaniasad/HeadlessBrowsers: A list of (almost) all headless web browsers in existence","url":"https://github.com/dhamaniasad/HeadlessBrowsers","tags":["browser","まとめ"],"content":"ヘッドレスブラウザ(テストのためのライブラリも含む)のまとめ","relatedLinks":[]}]},{"meta":{"title":"2016-11-22のJS: Firefox 50、React v15.4.0、Custom Element v1","author":"azu","layout":"post","date":"2016-11-22T01:06:00.000Z","category":"JSer","tags":["Firefox","React","WebKit","WebComponents"],"url":"https://jser.info/2016/11/22/firefox-50-react-v15.4.0-custom-element-v1/"},"items":[{"category":"Headline","title":"Firefox 50.0 リリースノート","url":"https://www.mozilla.jp/firefox/50.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 50リリース。\nWebM EMEのサポート、`Symbol.hasInstance`の実装、コンソールがSource Mapを解釈するように。\n`addEventListener`が`once`オプション、`X-Content-Type-Options`ヘッダーのサポート、など","relatedLinks":[{"title":"Firefox 50 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/50"},{"title":"Firefox 50 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/versions/50/"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 18 | WebKit","url":"https://webkit.org/blog/7078/release-notes-for-safari-technology-preview-18/","tags":["webkit","ReleaseNote"],"content":"Safari Technology Preview Release 18リリース。","relatedLinks":[]},{"category":"Headline","title":"React v15.4.0 - React Blog","url":"https://facebook.github.io/react/blog/2016/11/16/react-v15.4.0.html","tags":["React","ReleaseNote"],"content":"React v15.4.0リリース。\n内部的に存在していた `react/lib/*` のPrivate APIを削除、`?react_perf`を付けることでUser Timingベースのプロファイリングを取れるようになるなど","relatedLinks":[]},{"category":"Headline","title":"6.19.0 Released · Babel","url":"https://babeljs.io/blog/2016/11/16/6.19.0","tags":["babel","ReleaseNote"],"content":"Babel v6.19.0リリース。\nbabel-plugin-transform-object-rest-spreadが単独のPluginとして動くように。\nstage-2 presetに`babel-plugin-syntax-dynamic-import`を追加など","relatedLinks":[{"title":"Object rest spread transform · Babel","url":"http://babeljs.io/docs/plugins/transform-object-rest-spread/"}]},{"category":"Headline","title":"Release 0.17.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v0.17.0","tags":["node.js","testing","ReleaseNote"],"content":"AVA 0.17.0リリース。\n`process.cws()`を`package.json`と同じディレクトリに変更、Node.js v4>=のみのサポート、`--require` CLIオプションの削除、`karma-ava`のサポートなど","relatedLinks":[{"title":"avajs/ava-codemods: Codemods for AVA","url":"https://github.com/avajs/ava-codemods#migrating-to-ava"}]},{"category":"Headline","title":"Release fetch 2.0.0 · github/fetch","url":"https://github.com/github/fetch/releases/tag/v2.0.0","tags":["JavaScript","github","library"],"content":"Fetch APIのpolyfillライブラリである`fetch` 2.0.0リリース。\n`Header.get()`の挙動変更、`Headers.getAll()`の削除など","relatedLinks":[]},{"category":"Headline","title":"Angular 2.2.0 Now Available","url":"http://angularjs.blogspot.com/2016/11/angular-220-now-available.html","tags":["AngularJS","ReleaseNote"],"content":"AngularJS 2.2.0リリース。\n`@anguar/upgrade`を使い1.xと2.xを共存させる場合にRouterでどちらも扱えるようにする仕組みの追加、JavaScriptで使う場合のガイドの追加など","relatedLinks":[{"title":"TypeScript to JavaScript - ts - COOKBOOK","url":"https://angular.io/docs/ts/latest/cookbook/ts-to-js.html"},{"title":"Migrating Angular 1 Applications to Angular 2 in 5 Simple Steps","url":"https://vsavkin.com/migrating-angular-1-applications-to-angular-2-in-5-simple-steps-40621800a25b"}]},{"category":"Headline","title":"These Weeks in Firefox: Issue 5 | Firefox Nightly News","url":"https://blog.nightly.mozilla.org/2016/11/16/these-weeks-in-firefox-issue-5/","tags":["firefox","ReleaseNote"],"content":"Firefox Nightly 52における変更点のハイライト。\nasync/awaitの対応、ネットワークのスロットリングツールの追加、`<input type=\"time\">`のUI改善など","relatedLinks":[]},{"category":"Article","title":"Introducing Custom Elements | WebKit","url":"https://webkit.org/blog/7027/introducing-custom-elements/","tags":["WebComponents"],"content":"Custom Elementについて。\nHTMLElementのサブクラスでの定義、ライフサイクルのコールバックイベントは同期的に呼ばれる点について。\nまた、非同期でCustom Elementが`deinfe`されたことを`whenDefined`で検知する方法について","relatedLinks":[]},{"category":"Article","title":"How to win in Web Framework Benchmarks – Medium","url":"https://medium.com/@localvoid/how-to-win-in-web-framework-benchmarks-8bc31af76ce7","tags":["JavaScript","DOM","VirtualDOM","benchmark"],"content":"kiviというReactのようなUIライブラリを作っていくにあたりベンチマークを見てどのような最適化をしていくかという話。\n色々なDOMライブラリのベンチマークを試し、どのような点を改善すれば結果がよくなったかという話","relatedLinks":[{"title":"localvoid/kivi: Javascript (TypeScript) library for building web user interfaces","url":"https://github.com/localvoid/kivi"}]},{"category":"Article","title":"Choosing Ember over React in 2016","url":"https://blog.instant2fa.com/choosing-ember-over-react-in-2016-41a2e7fd341","tags":["JavaScript"],"content":"Instant 2FAというサービスをEmberで作ってみて良かったところと良くなかったところについて。\n`ember-cli`について","relatedLinks":[]},{"category":"Article","title":"for..in versus for..of Loops","url":"https://bitsofco.de/for-in-vs-for-of/","tags":["JavaScript"],"content":"`for...of`と`for...in`の違いについて","relatedLinks":[]},{"category":"SlideVideo","title":"React with Reduxによる大規模商用サービスの開発 / nodefest2016 // Speaker Deck","url":"https://speakerdeck.com/yoshidan/nodefest2016","tags":["React","redux","スライド"],"content":"React + Reduxにおける注意点について。\n画面遷移とJavaScriptファイルの分割、サーバサイドレンダリングの手法とコストについて","relatedLinks":[{"title":"React + Reduxで作ったIsomorphic(Universal) JSなサービス開発の裏側 - Tech Blog - Recruit Lifestyle Engineer","url":"http://engineer.recruit-lifestyle.co.jp/techblog/2016-11-16-isomorphic-javascript/"}]},{"category":"SlideVideo","title":"💓 Vue.js","url":"https://nakajmg.github.io/s/161119-vue/","tags":["JavaScript","library","スライド"],"content":"Vue.jsについてのスライド。\nコンソールにTranscriptが出る。\nVue.js 2.xの特徴やエコシステム、ツールなどについて","relatedLinks":[]},{"category":"SlideVideo","title":"about\\_hiroppyさんの「ECMAScript」 / about\\_hiroppy さん - ニコナレ","url":"http://niconare.nicovideo.jp/watch/kn1937","tags":["JavaScript","スライド"],"content":"ECMAScriptの策定プロセスとES2016/2017について","relatedLinks":[{"title":"ECMAScript / about","url":"http://niconare.nicovideo.jp/watch/kn1936"}]},{"category":"SoftwareLibrary","title":"paulirish/pwmetrics: Progressive web metrics at your fingertipz","url":"https://github.com/paulirish/pwmetrics","tags":["performance","Tools"],"content":"lighthouseを使ったパフォーマンスメトリクスの可視化ツール","relatedLinks":[{"title":"GoogleChrome/lighthouse: auditing and performance metrics for Progressive Web Apps","url":"https://github.com/GoogleChrome/lighthouse/"}]},{"category":"SoftwareLibrary","title":"dylanb/react-axe: Accessibility auditing for React.js applications","url":"https://github.com/dylanb/react-axe","tags":["React","accessibility","library"],"content":"axe-coreをつかったアクセシビリティチェックを行うReactライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Victory","url":"https://formidable.com/open-source/victory/","tags":["React","グラフ","library"],"content":"React Componentとしてグラフを書く事ができるライブラリ。","relatedLinks":[{"title":"Flexible Charting in React with Victory (and Introducing FormidableCharts) | Formidable","url":"https://formidable.com/blog/2016/11/09/flexible-charting-in-react-with-victory/"}]}]},{"meta":{"title":"2016-11-29のJS: Node.js v7.2.0、Yarnでオフラインインストール","author":"azu","layout":"post","date":"2016-11-29T00:37:00.000Z","category":"JSer","tags":["Node","Yarn"],"url":"https://jser.info/2016/11/29/node.js-v7.2.0-yarn/"},"items":[{"category":"Headline","title":"Release v2.1.0 · vuejs/vue","url":"https://github.com/vuejs/vue/releases/tag/v2.1.0","tags":["JavaScript","library","ReleaseNote"],"content":"Vue.js 2.1.0リリース。\nScoped Slots、`v-else-if`、`dist`以下のファイルの変更、JSX対応の改善、サーバサイドレンダリングの際に`process.env.VUE_ENV=server`は不要になるなど","relatedLinks":[{"title":"2.1.0.md","url":"https://gist.github.com/yyx990803/faebe22e8763f5b17572b35ed96f52fe"}]},{"category":"Headline","title":"ESLint v3.11.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2016/11/eslint-v3.11.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v3.11.0リリース。\n`capitalized-comments`、`require-await`のルールを追加など","relatedLinks":[]},{"category":"Headline","title":"Node v7.2.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v7.2.0/","tags":["node.js","ReleaseNote","security"],"content":"Node v7.2.0リリース。\nWindows向けのセキュリティリリース、`process.memoryUsage().external`の追加など","relatedLinks":[{"title":"Weekly Update - November 24th, 2016 | Node.js","url":"https://nodejs.org/en/blog/weekly-updates/weekly-update.2016-11-24/"}]},{"category":"Headline","title":"Release notes · Riot.js","url":"http://riotjs.com/release-notes/#november-22-2016","tags":["JavaScript","library","ReleaseNote"],"content":"Riot.js 3.0リリース","relatedLinks":[{"title":"Riot 3.0.0 roadmap · Issue #1694 · riot/riot","url":"https://github.com/riot/riot/issues/1694"}]},{"category":"Article","title":" Running Yarn offline | Yarn","url":"https://yarnpkg.com/blog/2016/11/24/offline-mirror","tags":["npm"],"content":"yarnをオフラインで使う方法や、オフラインのミラーをリポジトリに含める方法について","relatedLinks":[]},{"category":"Article","title":"How CSS pseudo-classes work, explained with code and lots of diagrams","url":"https://medium.freecodecamp.com/explained-css-pseudo-classes-cef3c3177361","tags":["CSS"],"content":"`:*-of-type`と`:*-child`などの擬似クラスについての分かりやすい図解","relatedLinks":[]},{"category":"Article","title":"ES6 Iterators and Generators in Practice – Zsolt Nagy","url":"http://www.zsoltnagy.eu/es6-iterators-and-generators-in-practice/","tags":["JavaScript","ECMAScript"],"content":"Iterator、Iterable、Generatorについて。\nサンプルコード中心でどのような挙動になるかを解説してる","relatedLinks":[]},{"category":"Article","title":"DasSur.ma – How to read web specs Part IIa – Or: ECMAScript Symbols","url":"https://dassur.ma/things/reading-specs-2/","tags":["ECMAScript","spec"],"content":"ECMAScriptの仕様をどうやって読んでいくかについて。\n`@@iterator`とは何か?というところから`Symbol`の仕様を見ていく話","relatedLinks":[]},{"category":"Article","title":"TypeScript 2.0: Built-In Type Declarations | Marius Schulz","url":"https://blog.mariusschulz.com/2016/11/25/typescript-2-0-built-in-type-declarations","tags":["TypeScript"],"content":"TypeScript 2.0のBuilt-In Typeについて。\n`--lib`オプションで含めるビルトインのlibを指定できる","relatedLinks":[{"title":"Compiler Options · TypeScript","url":"https://www.typescriptlang.org/docs/handbook/compiler-options.html"}]},{"category":"Article","title":"Understanding JavaScript Micro-Templating – Medium","url":"https://medium.com/@zfrisch/understanding-javascript-micro-templating-f37a37b3b40e","tags":["JavaScript","template"],"content":"John Resig製の140bytesで動くMicro Templatingがどのような仕組みで動いているのかを見ていく記事。\nFunctionコンストラクタ、正規表現など構成要素を丁寧に解説してる","relatedLinks":[{"title":"John Resig - JavaScript Micro-Templating","url":"http://ejohn.org/blog/javascript-micro-templating/"},{"title":"John Resig's Micro-Templating in 140 bytes","url":"https://gist.github.com/Fedia/20d41d8533e0903f0123"}]},{"category":"Article","title":"The numbers on Webpack 1 vs 2 – Medium","url":"https://medium.com/@u_glow/the-numbers-on-webpack-1-vs-2-7f457bb4658c","tags":["webpack"],"content":"webpack 1.xと2.0βのビルドサイズやビルド時間(prod/dev)の比較","relatedLinks":[]},{"category":"Article","title":"Advanced Data Tables in React","url":"https://techblog.commercetools.com/advanced-data-tables-in-react-dbe33f8345ab","tags":["React","library"],"content":"Reactのgridライブラリの比較まとめ","relatedLinks":[]},{"category":"Article","title":"An Introduction to mo.js | CSS-Tricks","url":"https://css-tricks.com/introduction-mo-js/","tags":["JavaScript","animation","library"],"content":"宣言的なアニメーションライブラリであるmo.jsについてのチュートリアル","relatedLinks":[]},{"category":"Article","title":"katatema.js - ✘╹◡╹✘","url":"http://r7kamura.hatenablog.com/entry/2016/11/24/030101","tags":["React","webpack","Tools","HTML"],"content":"Next.jsみたいな形でディレクトリにReactのコンポーネントを置くとHTMLにそれぞれ変換できるツール","relatedLinks":[{"title":"r7kamura/katatema: A handy static site generator using React.js","url":"https://github.com/r7kamura/katatema"}]},{"category":"SlideVideo","title":"React at Product Hunt // Speaker Deck","url":"https://speakerdeck.com/rstankov/react-at-product-hunt","tags":["JavaScript","スライド"],"content":"ProductHuntのJavaScript変遷についてのスライド。\njQuery -> Backbone -> React + Redux。\nDuxyを使ったRest APIの操作についてなど","relatedLinks":[{"title":"producthunt/duxy: RESTful resources","url":"https://github.com/producthunt/duxy"}]},{"category":"SlideVideo","title":"azat-co/you-dont-know-node: You Don&#x27;t Know Node.js","url":"https://github.com/azat-co/you-dont-know-node","tags":["node.js","tutorial"],"content":"Node.jsとはどのような特徴を持っているかという入門者向けの紹介。\n非同期I/O、Stream、エラーハンドリング、ネイティブモジュールについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"CSS Reference - A free visual guide to the most popular CSS properties.","url":"http://cssreference.io/","tags":["CSS","リファレンス"],"content":"CSSリファレンスサイト。\nそれぞれのプロパティを当てた結果を表示してくれている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Feature.js","url":"http://featurejs.com/","tags":["JavaScript","library"],"content":"Modernizrのように色々な機能が利用できるかを一括で判定するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Reframe.js","url":"https://dollarshaveclub.github.io/reframe.js","tags":["JavaScript","library"],"content":"iframeなどの埋め込み要素をレスポンシブルに扱うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"immutable-css","url":"http://immutablecss.com/","tags":["CSS","Tools"],"content":"> A CSS linter for immutable selectors.\n\nセレクタのoverrideをチェックするLintツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nuxt/nuxt.js: A minimalistic framework for server-rendered Vue.js applications (inspired by Next.js)","url":"https://github.com/nuxt/nuxt.js","tags":["JavaScript","library"],"content":"Next.jsインスパイアのVue.js向けサーバサイドレンダリングフレームワーク","relatedLinks":[]}]},{"meta":{"title":"2016-12-06のJS: Ember.js 2.10、Front-End Tooling 2016アンケート、Svelte","author":"azu","layout":"post","date":"2016-12-06T00:55:00.000Z","category":"JSer","tags":["Ember","Tools","Framework"],"url":"https://jser.info/2016/12/06/ember.js-2.10-front-end-tooling-2016-svelte/"},"items":[{"category":"Headline","title":"Ember.js - Ember 2.10 and 2.11 Beta Released","url":"http://emberjs.com/blog/2016/11/30/ember-2-10-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember 2.10リリース。\nGlimmer 2を含んだ初のリリース。\n既存の仕組みと後方互換性を持っているため、そのままアップグレードが可能となっている。","relatedLinks":[{"title":"Ember.js - Announcing The Glimmer 2 Alpha","url":"http://emberjs.com/blog/2016/07/29/announcing-the-glimmer-2-alpha.html"}]},{"category":"Headline","title":"V8 JavaScript Engine: V8 Release 5.6","url":"http://v8project.blogspot.com/2016/12/v8-release-56.html","tags":["V8","ReleaseNote"],"content":"V8 5.6リリース。\nES2015のパフォーマンス改善、`String#padStart`と`String#padEnd`の実装など","relatedLinks":[]},{"category":"Headline","title":"Chrome Releases: Stable Channel Update for Desktop","url":"https://googlechromereleases.blogspot.com/2016/12/stable-channel-update-for-desktop.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 55リリース。\nPointer Event、async/await、Persistent Storageなど。\nHTML5 by Default(Flashのデフォルトブロック)はChrome 56に延期した。","relatedLinks":[{"title":"Chrome 55: Async and Await, Pointer Events, Persistent Storage and more - YouTube","url":"https://www.youtube.com/watch?v=OC7tgJP1D4s"},{"title":"Chromium Blog: Chrome 55 Beta: Input handling improvements and async/await functions","url":"https://blog.chromium.org/2016/10/chrome-55-beta-input-handling.html"},{"title":"(Update) Intent to Implement - HTML5 by Default - Google グループ","url":"https://groups.google.com/a/chromium.org/forum/#!msg/chromium-dev/ad7Posd6cdI/5EEOduWiCwAJ"}]},{"category":"Headline","title":"The State of Front-End Tooling 2016 - Results - AshleyNolan.co.uk - Blog and Portfolio for Ashley Nolan","url":"https://ashleynolan.co.uk/blog/frontend-tooling-survey-2016-results","tags":["JavaScript","Tools","library","CSS"],"content":"フロントエンド周りのツールやライブラリについてのアンケート結果。\n昨年の結果との比較も掲載されている。\nPostCSSやnpm scripts利用が増えた、使っているJSライブラリやツールについて","relatedLinks":[]},{"category":"Article","title":"JavaScript Developers: Watch Your Language! - Web Standards - Bocoup","url":"https://bocoup.com/weblog/javascript-developers-watch-your-language","tags":["ECMAScript","proposal"],"content":"ECMAScript ProposalのStageの解説。\nStage段階のものは、Babelなどで簡単に扱えるけど危険性も含んでいるから、TC39での議論は注視する必要がある。\nStage段階のものはExperimentalであることを理解して使おうという話。","relatedLinks":[]},{"category":"Article","title":"Step by Stepで始めるESLint - Qiita","url":"http://qiita.com/howdy39/items/6e2c75861bc5a14b2acf","tags":["ESLint","tutorial"],"content":"ESLintの設定をステップ・バイ・ステップで行うチュートリアル","relatedLinks":[]},{"category":"Article","title":"一から始めるJavaScriptユニットテスト - Hatena Developer Blog","url":"http://developer.hatenastaff.com/entry/2016/12/05/102351","tags":["JavaScript","DOM","testing","slide"],"content":"MochaをNode.jsで動くユニットテストから、Karmaを使いブラウザで動かすDOMのテストするまでをPull Request毎に解説してる。","relatedLinks":[]},{"category":"Article","title":"新しめのCSS設計まとめ 〜2016年冬〜 - Qiita","url":"http://qiita.com/usagi-f/items/dc719a8fd18abcdee4df","tags":["CSS","設計"],"content":"CSSの色々なアーキテクチャについての紹介。\nOOCSS、BEM、SMACSS、APBCSS(Atomic Design)、MOCSS、ECSS、ITCSSなど。\nそれぞれを簡単にまとめている","relatedLinks":[]},{"category":"Article","title":"Houdini、それはCSSの進化を促すプロジェクト - The future starts today","url":"http://shibe97.hatenablog.com/entry/2016/12/05/083000","tags":["CSS","spec"],"content":"CSSのHoudiniについて。\nCSSの低レベルAPIにJavaScriptからアクセスできるようにする仕様で、現在どのような仕様が考えられているかについてなど","relatedLinks":[]},{"category":"Article","title":"レガシーシステム上のJavaScriptをモダンビルドにしていくwebpack利用実例 - Qiita","url":"http://qiita.com/inuscript/items/97333a239c97094c39a6","tags":["JavaScript","webpack"],"content":"モジュールではないコードや古いライブラリをどのように現代のツールに載せていくかについて。\nモジュール化やwebpackを使ったビルドなどの手法について","relatedLinks":[]},{"category":"Article","title":"React/Redux… Where Do You Start? – MoFed – Medium","url":"https://medium.com/mofed/react-redux-where-do-you-start-500c98413d1f","tags":["React","redux"],"content":"React(とRedux)をどこから始めるかについて","relatedLinks":[]},{"category":"Article","title":"8種類あるSVGスプライト それぞれの特徴を比較してみた - 週刊SVG","url":"http://ssvvgg.net/post/153900731865/8%E7%A8%AE%E9%A1%9E%E3%81%82%E3%82%8Bsvg%E3%82%B9%E3%83%97%E3%83%A9%E3%82%A4%E3%83%88-%E3%81%9D%E3%82%8C%E3%81%9E%E3%82%8C%E3%81%AE%E7%89%B9%E5%BE%B4%E3%82%92%E6%AF%94%E8%BC%83%E3%81%97%E3%81%A6%E3%81%BF%E3%81%9F","tags":["SVG"],"content":"SVGスプライトといわれるものがどうのようなものであるか、またその手法についてまとめられた記事","relatedLinks":[]},{"category":"SlideVideo","title":"yarn VS. npm@2 VS. npm@3 // Speaker Deck","url":"https://speakerdeck.com/pine613/yarn-vs-npm-at-2-vs-npm-at-3","tags":["npm","yarn","presentation"],"content":"npmとyarnの比較スライド。\nGitHub Star上位100を対象にインストール時間を比較し、yarnの方が常に早いという結果になったという話","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dai-shi/es-beautifier: ECMAScript beautifier based on eslint","url":"https://github.com/dai-shi/es-beautifier","tags":["ESLint"],"content":"ESLintを使ったJavaScriptのフォーマッター","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gajus/babel-plugin-log-deprecated: Adds a console.warn statement to the functions annotated with @deprecated tag.","url":"https://github.com/gajus/babel-plugin-log-deprecated","tags":["babel","JSDoc"],"content":"JSDocの`@depreacted`タグを`console.warn`に変換するBabel plugin","relatedLinks":[]},{"category":"SoftwareLibrary","title":"wooorm/nspell: 📝 Hunspell compatible spell-checker","url":"https://github.com/wooorm/nspell","tags":["JavaScript","dictionary","library"],"content":"スペルチェッカーの実装ライブラリ。\nhunspell形式の辞書をサポートしてる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"RazrFalcon/svgcleaner: svgcleaner could help you to clean up your SVG files from the unnecessary data.","url":"https://github.com/RazrFalcon/svgcleaner","tags":["SVG","Tools"],"content":"SVGから不要なデータを削除してファイルサイズを削減するツール。\nsvgoに比べて高速に動作する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Svelte • The magical disappearing UI framework","url":"https://svelte.technology/","tags":["JavaScript","library","DOM","Tools"],"content":"Vueなどに似た書き方をするコンパイル前提のUIフレームワーク。\n変換後はただのDOM APIを使ったJavaScriptになり、ランタイムとしてのライブラリ読み込みが不要となる。","relatedLinks":[{"title":"Frameworks without the framework: why didn","url":"https://svelte.technology/blog/frameworks-without-the-framework/"}]}]},{"meta":{"title":"2016-12-12のJS: Chrome 56β、Babelの過去と現在と未来","author":"azu","layout":"post","date":"2016-12-12T01:14:00.000Z","category":"JSer","tags":["Chrome","Firefox","Babel"],"url":"https://jser.info/2016/12/12/chrome-56b-babel/"},"items":[{"category":"Headline","title":"Chromium Blog: Chrome 56 Beta: “Not Secure” warning, Web Bluetooth, and CSS position: sticky","url":"https://blog.chromium.org/2016/12/chrome-56-beta-not-secure-warning-web.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 56βリリース。\nWeb Bluetooth APIがデフォルトで有効化、CSS `position: sticky`の有効化、WebGL 2.0、FlashのClick to Playがデフォルト化、CSS Fontsの`system-ui`をサポート、SHA-1の対応終了など","relatedLinks":[{"title":"Chromium Blog: Roll-out plan for HTML5 by Default","url":"https://blog.chromium.org/2016/12/roll-out-plan-for-html5-by-default.html"},{"title":"Flash Roadmap - The Chromium Projects","url":"https://sites.google.com/a/chromium.org/dev/flash-roadmap#TOC-HTML5-By-Default-Target:-Chrome-55---Dec-2016-"},{"title":"Intent to Implement and Ship: The “system-ui” generic font family - Google グループ","url":"https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/hvN9YVvIb5c/5DrcunKSCAAJ"},{"title":"SSLサーバー証明書 : SHA-1 証明書の受付終了と SHA-2 証明書への移行について｜Cybertrust.ne.jp","url":"https://www.cybertrust.ne.jp/sureserver/productinfo/sha1ms.html"}]},{"category":"Headline","title":"Microsoft Edge build 14986 changelog - Microsoft Edge Development","url":"https://developer.microsoft.com/en-us/microsoft-edge/platform/changelog/desktop/14986/","tags":["MSEdge","ReleaseNote"],"content":"MSEdge build 14986リリース。\nCSS Custom Property、IntersectionObserverのサポート。\nFetchをフラグ付きでサポート、async/awaitをデフォルトで有効に","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 19 | WebKit","url":"https://webkit.org/blog/7093/release-notes-for-safari-technology-preview-19/","tags":["webkit","ReleaseNote"],"content":"Safari Technology Preview Release 19リリース。\nES6 modulesのサポート、Touch Barのサポート、Pointer Lock APIの有効化、WebDriver時は`navigator.webdriver`が触れるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 2.1 | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2016/12/07/announcing-typescript-2-1/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.1リリース。\nasync/await、Object Rest & Spread、`keyof` type、Mapped Typeのサポートなど","relatedLinks":[{"title":"TypeScript 2.1.4 変更点 - Qiita","url":"http://qiita.com/vvakame/items/fc7e37d0296c63f41f4f"}]},{"category":"Headline","title":"Angular 2.3.0 Now Available","url":"http://angularjs.blogspot.com/2016/12/angular-230-now-available.html","tags":["AngularJS","ReleaseNote"],"content":"Angular 2.3.0リリース。\nIDEなどと連携する向けにAngular Language Serviceをリリース、zone.jsのスタックトレースが分かりやすくなるように改善されるなど","relatedLinks":[]},{"category":"Headline","title":"TestCafe v0.11.0 Released | TestCafe","url":"http://devexpress.github.io/testcafe/blog/testcafe-v0-11-0-released.html","tags":["JavaScript","testing","ReleaseNote"],"content":"TestCafe v0.11.0リリース。\nSelectorの仕組みを変更、built-in assertionの追加、ブラウザに起動引数をわたせるように","relatedLinks":[]},{"category":"Headline","title":"Release 7.1.0 · developit/preact","url":"https://github.com/developit/preact/releases/tag/7.1.0","tags":["React","JavaScript","library"],"content":"小さなReactライクなライブラリであるPreact 7.1.0リリース。\n初期レンダリングの高速化など","relatedLinks":[]},{"category":"Headline","title":"parse5","url":"http://inikulin.github.io/parse5/#3-0-0","tags":["HTML","ReleaseNote"],"content":"HTMLパーサであるparse5 3.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release 2.1.0 · qunitjs/qunit","url":"https://github.com/qunitjs/qunit/releases/tag/2.1.0","tags":["JavaScript","testing","ReleaseNote"],"content":"QUnit 2.1.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release KITT · sass/libsass","url":"https://github.com/sass/libsass/releases/tag/3.4.0","tags":["Sass","ReleaseNote"],"content":"LibSass 3.4リリース","relatedLinks":[]},{"category":"Article","title":"The State of Babel · Babel","url":"https://babeljs.io/blog/2016/12/07/the-state-of-babel","tags":["babel"],"content":"Babelの現状について。\nbabel-preset-env、babili、コードカバレッジやプラグインエコシステム、ドキュメント、今後のロードマップについて","relatedLinks":[]},{"category":"Article","title":"今年のうちに対応したい、Node.jsのBufferに潜む危険性 - Yahoo! JAPAN Tech Blog","url":"https://techblog.yahoo.co.jp/advent-calendar-2016/node_new_buffer/","tags":["node.js","JavaScript","security"],"content":"Node.jsの`new Buffer`のセキュリティ的な問題点についての解説。\n非推奨となった`new Buffer`の代わりとなる`Buffer.from`/`Buffer.alloc`/`Buffer.allocUnsafe`について","relatedLinks":[{"title":"notes/Lets-fix-Buffer-API.md at master · ChALkeR/notes","url":"https://github.com/ChALkeR/notes/blob/master/Lets-fix-Buffer-API.md"}]},{"category":"Article","title":"Node.js v7 has updated V8 to 5.4 | Node.js","url":"https://nodejs.org/en/blog/community/update-v8-5.4/","tags":["V8","node.js","JavaScript"],"content":"Node.js v7で使えるようになったECMAScriptの機能や改善点について","relatedLinks":[]},{"category":"Article","title":"Variable Fontについて - console.blog(self);","url":"http://sadah.hatenablog.com/entry/variablefont","tags":["CSS","fonts"],"content":"Variable Fontの確認方法や仕様について。\nどのようにフォントの設定をCSSから変更するかについて。","relatedLinks":[]},{"category":"Article","title":"Vue.js Vueコンポーネントのユニットテストを書いてみよう - Qiita","url":"http://qiita.com/potato4d/items/8215941b84c11b845886","tags":["JavaScript"],"content":"Vueコンポーネントのユニットテストの方法について","relatedLinks":[]},{"category":"Article","title":"How to Snapshot Test Everything in Your Redux App With Jest – Medium","url":"https://medium.com/@jondot/how-to-snapshot-test-everything-in-your-redux-app-with-jest-fde305ebedea","tags":["React","redux","testing"],"content":"Jestを使ったReactコンポーネントのsnapshotテスト、enzymeを使ったインタラクションテスト、Reduxのreducerのテスト手法について","relatedLinks":[]},{"category":"Article","title":"Promise の all と race だけで書ける待ち合わせ、書けない待ち合わせ - Qiita","url":"http://qiita.com/Kuniwak/items/9ea447598b7652db78b9","tags":["JavaScript","Promises"],"content":"`Promise.all`と`Promise.race`を使った待ち合わせのパターンについて","relatedLinks":[]},{"category":"Article","title":"On Webpack and Source Map integration | Code.Art.Web","url":"http://lorefnon.me/2016/12/03/on-webpack-and-source-map-integration.html","tags":["webpack"],"content":"webpackの`devtool`で指定できるSource Mapオプションについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"prigara/javascript-conferences: List of conferences for frontend and Node.js developers in 2016","url":"https://github.com/prigara/javascript-conferences","tags":["JavaScript","イベント"],"content":"JavaScriptのカンファレンスをまとめているリポジトリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"andywer/webpack-blocks: 📦 Configure webpack using functional feature blocks.","url":"https://github.com/andywer/webpack-blocks","tags":["webpack","config","library"],"content":"webpackの設定を関数で書くことができるモジュール","relatedLinks":[]}]},{"meta":{"title":"2017年1月15日(日)に JSer.info 6周年 && 300回目記念イベント を開催します","author":"azu","layout":"post","date":"2016-12-13T00:26:00.000Z","category":"Article","tags":["イベント","JSer"],"url":"https://jser.info/2016/12/13/announcement-jser-info-6years-event/"},"items":[]},{"meta":{"title":"2016-12-20のJS: RxJS v5、Angular、date-fns","author":"azu","layout":"post","date":"2016-12-20T01:38:00.000Z","category":"JSer","tags":["Rx","Angular","Date","library"],"url":"https://jser.info/2016/12/20/rxjs-v5-angular-date-fns/"},"items":[{"category":"Headline","title":"rxjs/CHANGELOG.md at master · ReactiveX/rxjs","url":"https://github.com/ReactiveX/rxjs/blob/master/CHANGELOG.md","tags":["JavaScript","library","ReleaseNote"],"content":"RxJS 5.0.0リリース","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at 9.9.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/9.9.0/Changelog.md","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"jsdom 9.9.0リリース。\n`document.createCDATASection`、`node.wholeText`のサポート、バグ修正など","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · reactjs/react-redux","url":"https://github.com/reactjs/react-redux/releases/tag/v5.0.0","tags":["React","redux","ReleaseNote"],"content":"React-Redux v5.0.0リリース。\n後方互換性はあるけどメジャーアップデート、`connect()`のオプションを追加、`connectAdvanced()`を追加など","relatedLinks":[]},{"category":"Headline","title":"webpack 2.2: The Release Candidate – webpack – Medium","url":"https://medium.com/webpack/webpack-2-2-the-release-candidate-2e614d05d75f","tags":["webpack"],"content":"webpack 2.2.0 RCリリース。\n2.x系初のRCリリースとなってる","relatedLinks":[{"title":"Release v2.2.0-rc.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v2.2.0-rc.0"}]},{"category":"Headline","title":"Release v0.37.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.37.0","tags":["flowtype","ReleaseNote"],"content":"Flow v0.37.0 リリース。\nbuilt-in libの定義を更新、`declare module`内で`import type`と`import typeof`を使えるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Angular: Angular 1.6.0 released","url":"http://angularjs.blogspot.com/2016/12/angular-160-released.html","tags":["AngularJS","ReleaseNote"],"content":"AngularJS 1.6.0リリース。\njqLiteをjQuery 3の挙動に合わせるように、expression sandboxを削除。\nまた、JSONPリクエストはホワイトリストがデフォルトになるなど多數のBreaking Changeが含まれている","relatedLinks":[{"title":"angular.js/CHANGELOG.md at master · angular/angular.js","url":"https://github.com/angular/angular.js/blob/master/CHANGELOG.md#160-rainbow-tsunami-2016-12-08"},{"title":"AngularJS: Developer Guide: Migrating from Previous Versions","url":"https://docs.angularjs.org/guide/migration#migrating-from-1-5-to-1-6"},{"title":"Angular: Angular 1.6 - Expression Sandbox Removal","url":"http://angularjs.blogspot.jp/2016/09/angular-16-expression-sandbox-removal.html"}]},{"category":"Article","title":"Angular: Ok... let me explain: it&#x27;s going to be Angular 4.0, or just Angular","url":"http://angularjs.blogspot.com/2016/12/ok-let-me-explain-its-going-to-be.html","tags":["AngularJS"],"content":"AngularJSの次のメジャーバージョンは4を予定している話。\n既に`@angular/router`がv3であるため、合わせるためにv4へあげる。\n2017年3月にリリースする予定","relatedLinks":[]},{"category":"Article","title":"Performance Calendar » Prefer DEFER Over ASYNC","url":"http://calendar.perfplanet.com/2016/prefer-defer-over-async/","tags":["JavaScript","browser","performance"],"content":"deferとasync属性について。 どちらもHTMLパースのブロックはしないが、レンダリングのブロックは発生する。\ndeferは常にdomInteractiveが起きてから実行するため一定、しかしasyncはダウンロード速度によってはメインと被ることもある。\nメインコンテンツに関係ないレンダリングを行うスクリプトはdefer属性を試すことで、メインのレンダリングが邪魔されずに進むかを確認した方が良いという話。","relatedLinks":[]},{"category":"Article","title":"JavaScript Clean Coding Best Practices | @RisingStack","url":"http://blog.risingstack.com/javascript-clean-coding-best-practices-node-js-at-scale/","tags":["JavaScript"],"content":"読みやすいJavaScriptのコードを書くためのプラクティス","relatedLinks":[]},{"category":"Article","title":"Writing Declaration Files for @types | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2016/12/14/writing-dts-files-for-types/","tags":["TypeScript"],"content":"TypeSriptのDefinitelyTyped向けに型定義ファイルを書く方法について\n手で書く方法とdts-genを使う方法について","relatedLinks":[]},{"category":"Article","title":"実況中継シリーズ Vue.jsで実現するMVVMパターン Fluxアーキテクチャとの距離 - Re.Ra.Ku アドベントカレンダー day 13 - Re.Ra.Ku tech blog","url":"http://techblog.reraku.co.jp/entry/2016/12/13/080000","tags":["MVC","Flux","JavaScript"],"content":"MVVMとFluxのアーキテクチャに似ている部分と異なる部分について","relatedLinks":[]},{"category":"Article","title":"SurviveJS - Inferno - Blazing fast, React-like UI library - Interview with Dominic Gannaway","url":"http://survivejs.com/blog/inferno-interview/","tags":["JavaScript","React"],"content":"ReactライクなVirtual DOMを使ったUIライブラリであるInfernoの特徴について。\nどのような仕組みで動いているのか、Reactなどとの違いについて","relatedLinks":[]},{"category":"Article","title":"The Inner Workings Of Virtual DOM – Medium","url":"https://medium.com/@rajaraodv/the-inner-workings-of-virtual-dom-666ee7ad47cf","tags":["VirtualDOM","React"],"content":"(Preactの)Virtual DOMがどのような処理を経てレンダリングされているのかを追った記事。\nVirtual DOMの最適化処理についてなど","relatedLinks":[]},{"category":"Article","title":"Cross-Browser HTML5 Form Validation is Finally Here! Now What? -Telerik Developer Network","url":"http://developer.telerik.com/topics/web-development/cross-browser-html5-form-validation-finally-now/","tags":["HTML5","JavaScript"],"content":"HTML5 Form Validation APIについて。\nWebKitもサポートしたので、すべてのブラウザで利用できるようになった","relatedLinks":[]},{"category":"SlideVideo","title":"Professor Frisby Introduces Composable Functional JavaScript - Course by @drboolean @eggheadio","url":"https://egghead.io/courses/professor-frisby-introduces-function-composition","tags":["JavaScript","関数型プログラミング"],"content":"JavaScriptでのFunctionalプログラミングについてのスクリーンキャスト。\nEither的な実装やカリー化などについて解説してる","relatedLinks":[]},{"category":"SlideVideo","title":"Vue.js Fundamentals - YouTube","url":"https://www.youtube.com/playlist?list=PLwAKR305CRO_1yAao-8aZiQnBqJeyng4O","tags":["JavaScript","library","video"],"content":"Vue.js 2.0のチュートリアル動画","relatedLinks":[]},{"category":"SlideVideo","title":"ECMAScript: latest and upcoming features // Speaker Deck","url":"https://speakerdeck.com/rauschma/ecmascript-latest-and-upcoming-features","tags":["ECMAScript","slide"],"content":"ES2016/ES2017と今Stage 3であるProposalについての紹介スライド","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Npm Desktop Manager","url":"https://720kb.github.io/ndm/","tags":["npm","GUI"],"content":"npmのパッケージを管理するGUIアプリケーション","relatedLinks":[]},{"category":"SoftwareLibrary","title":"date-fns/date-fns: ⏳ Modern JavaScript date utility library ⌛️","url":"https://github.com/date-fns/date-fns","tags":["JavaScript","library"],"content":"Date周りの操作を提供するライブラリ。\nlodashのように利用する関数だけを取り出して使えるようにするのが目的となってる","relatedLinks":[{"title":"Add a brief comparison with Moment.js? · Issue #275 · date-fns/date-fns","url":"https://github.com/date-fns/date-fns/issues/275#issuecomment-264934189"}]},{"category":"SoftwareLibrary","title":"simple-statistics/simple-statistics: simple statistics for node &amp; browser javascript","url":"https://github.com/simple-statistics/simple-statistics","tags":["JavaScript","統計"],"content":"統計的な関数のコレクションライブラリ。\nPythonのsimplestatisticsのport。","relatedLinks":[{"title":"sheriferson/simplestatistics: Simple statistical functions implemented in readable Python.","url":"https://github.com/sheriferson/simplestatistics"}]}]},{"meta":{"title":"2016-12-27のJS: SharedArrayBufferとAtomics API、Node.js Stream、JavaScript obfuscator","author":"azu","layout":"post","date":"2016-12-27T00:58:00.000Z","category":"JSer","tags":["browser","ECMAScript","Node.js","Stream","Tools"],"url":"https://jser.info/2016/12/27/sharedarraybuffer-javascript-obfuscator-node.js-stream/"},"items":[{"category":"Headline","title":"Say allo&#x27; to yeoman-generator 1.0 | Yeoman","url":"http://yeoman.io/blog/hello-generator-1.0.html","tags":["ジェネレーター","Tools"],"content":"Yeoman-generator 1.0リリース。\n`composeWith`のAPIを簡略化、Yarnサポート、deprecatedなAPIを削除など","relatedLinks":[{"title":"Release v1.0.0 🎉 · yeoman/generator","url":"https://github.com/yeoman/generator/releases/tag/v1.0.0"}]},{"category":"Headline","title":"Release Notes · Microsoft/ChakraCore Wiki","url":"https://github.com/Microsoft/ChakraCore/wiki/Release-Notes#v140","tags":["MSEdge","JavaScript","ReleaseNote"],"content":"ChakraCore 1.4リリース。\nJITがLinuxやmacOSでも有効化、async/awaitをデフォルトで有効化、SharedArrayBufferを実験的にサポート、wasmの実験的サポートなど","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 20 | WebKit","url":"https://webkit.org/blog/7120/release-notes-for-safari-technology-preview-20/","tags":["safari","webkit","ReleaseNote"],"content":"Safari Technology Preview Release 20リリース。\nVisual Viewport、SharedArrayBufferを有効化、`block-all-mixed-content`の追加、BlinkからportしたCSSパーサを使うようになるなど","relatedLinks":[{"title":"What the Virtual Viewport?  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2015/01/What-the-Viewport"},{"title":"lars-t-hansen/ecmascript","url":"https://github.com/lars-t-hansen/ecmascript_sharedmem"}]},{"category":"Headline","title":"Release 3rd Mutation · canjs/canjs","url":"https://github.com/canjs/canjs/releases/tag/v3.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"CanJS 3.0リリース\nコードは`can-*`からなるモジュールに分割され、`.attr()`の代わりに`DefineMap`の導入など","relatedLinks":[{"title":"JavaScriptフレームワーク「CanJS 3.0」リリース | OSDN Magazine","url":"https://mag.osdn.jp/16/12/22/160000"},{"title":"donejs - donejs","url":"http://donejs.com/"}]},{"category":"Article","title":"ECMAScript proposal updates @ 2016-11 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2016/12/22/ecmascript-proposals","tags":["ECMAScript","proposal"],"content":"2016年11月のTC39ミーティングでのProposalのStage変動をまとめたもの","relatedLinks":[]},{"category":"Article","title":"Stream API入門 - Qiita","url":"http://qiita.com/Mizunashi_Mana/items/872354cd7bf25090932f","tags":["node.js","stream"],"content":"Node.jsのStream APIについて。\n非同期処理のコールバック、Promise、async/await、generatorを踏まえてのStreamについての解説。\nWrite/Read/Duplex、Stream処理が得意とすること、`objectMode`についてなど幅広く解説されてる","relatedLinks":[]},{"category":"Article","title":"CSS Writing Modes ◆ 24 ways","url":"https://24ways.org/2016/css-writing-modes/","tags":["CSS"],"content":"CSSの`writing-mode`プロパティについての解説","relatedLinks":[]},{"category":"Article","title":"かずぽんブログ • Vue.js 2016年まとめ &amp; 今後","url":"http://blog.kazupon.jp/post/154903508388/vuejs-2016-closing-and-future","tags":["JavaScript","library"],"content":"2016年のVue.jsの変化について。\nVue.js 2.0、コミュニティ、エコシステム、利用範囲や今後について","relatedLinks":[]},{"category":"Article","title":"Firebug lives on in Firefox DevTools ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2016/12/firebug-lives-on-in-firefox-devtools/","tags":["Firebug","firefox","debug"],"content":"Firebugは開発終了したが、多くの機能はFirefoxの開発者ツールに引き継がれている/引き継ぐ予定があるという話。\n\nまたFirebugはマルチプロセス対応を念頭に開発されたものではなかったため、Firebugを拡張するよりも、Firefoxの開発者ツールを拡張していく方が良いという決定がされた。","relatedLinks":[]},{"category":"Article","title":"Web アクセシビリティ向け Node.js 製の自動チェックツールや DevTools 用の拡張機能など ::ハブろぐ","url":"https://havelog.ayumusato.com/develop/a11y/e732-a11y_checking_automate.html","tags":["accessibility","test"],"content":"Webアクセシビリティの自動チェックツールや補助ツールの紹介。","relatedLinks":[]},{"category":"Article","title":"JavaScriptのUIライブラリはどうあるべきかという話とOnsen UIのアーキテクチャ - id:anatooのブログ","url":"http://blog.anatoo.jp/entry/2016/12/09/201511","tags":["JavaScript","UI"],"content":"特定のUIフレームワークに依存されないUIフレームワークの基盤をどのように作るかという話。\nCSS Components層、Web Components層、フレームワークバインディング層のレイヤー分けについて","relatedLinks":[]},{"category":"Article","title":"ServiceWorker内にExpressサーバーを立てる - Qiita","url":"http://qiita.com/narirou/items/738a0fe6656d0f905e28","tags":["ServiceWorker","node.js"],"content":"express-serviceがどのようにして実際のNode.jsで動くExpressのコードをServiceWorkerの中でも擬似的に動かしているのかについての解説","relatedLinks":[{"title":"express-service","url":"https://www.npmjs.com/package/express-service"}]},{"category":"WebsiteDocument","title":"Accessibility - Learn web development | MDN","url":"https://developer.mozilla.org/en-US/docs/Learn/Accessibility","tags":["accessibility","web "],"content":"アクセシビリティについてのガイド","relatedLinks":[]},{"category":"WebsiteDocument","title":"SpeedTracker","url":"https://speedtracker.org/","tags":["webservice","performance","browser"],"content":"個人向けに使うCalibreやSpeedCurveのような継続的なパフォーマンス計測サービス。\nWebPageTestで取った結果をGitHubリポジトリにJekyllで動くようにデータをpushしてくれる。","relatedLinks":[{"title":"Performance Calendar » Introducing SpeedTracker","url":"http://calendar.perfplanet.com/2016/introducing-speedtracker/"}]},{"category":"SoftwareLibrary","title":"Mithril、Vue.jsの仮想DOM用のi18nライブラリ作った - Qiita","url":"http://qiita.com/shibukawa/items/c2298b21b4629941b230","tags":["JavaScript","i18n","library"],"content":"Node.jsでもブラウザでも動作するi18nライブラリ。\nプレースホルダ、複数形、コンテキスト、`data-i18n`属性に対する翻訳する機能を持つ","relatedLinks":[{"title":"i18n for Virtual DOM (i18n4v) — i18n for virtual dom 0.1.5 documentation","url":"https://i18n4v.js.org/"}]},{"category":"SoftwareLibrary","title":"devongovett/regexgen: Generate regular expressions that match a set of strings","url":"https://github.com/devongovett/regexgen","tags":["JavaScript","正規表現"],"content":"複数の文字列を渡して、それにマッチする正規表現を作るライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"javascript-obfuscator/javascript-obfuscator: JavaScript obfuscator for Node.js","url":"https://github.com/javascript-obfuscator/javascript-obfuscator","tags":["JavaScript","library","Tools"],"content":"JavaScriptの難読化ツール/ライブラリ。\nES2015+のコードを扱うことができ、Source Mapにも対応している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"amilajack/eslint-plugin-compat: Browser and ES spec compatibility assertion with ESLint","url":"https://github.com/amilajack/eslint-plugin-compat","tags":["JavaScript","ESLint"],"content":"AutoPrefixerのように想定ブラウザを記述し、そのブラウザで動かないAPIを使ってないかをチェックするESLintルール。\ncaniuseやcompat tableのデータを使う","relatedLinks":[]}]},{"meta":{"title":"2017-01-04のJS: PostCSS概要、Chrome開発者ツール、FuseBox","author":"azu","layout":"post","date":"2017-01-04T08:28:00.000Z","category":"JSer","tags":["bundler","Tools","Chrome","PostCSS"],"url":"https://jser.info/2017/01/04/postcss-chrome-fusebox/"},"items":[{"category":"Headline","title":"StealJS 1.0 Release","url":"https://www.bitovi.com/blog/stealjs-1.0-release","tags":["JavaScript","Tools","library","ReleaseNote"],"content":"開発時は動的なモジュールローダで、本番時はsteal-toolsでのproduction buildでbundleできるStealJS 1.0リリース","relatedLinks":[{"title":"Easy ES6 with StealJS - YouTube","url":"https://www.youtube.com/watch?v=VKydmxRm6w8"}]},{"category":"Article","title":"Optimizing Page Speeds With Lazyloading | Jscrambler Blog","url":"https://blog.jscrambler.com/optimizing-page-speeds-with-lazyloading/","tags":["AngularJS"],"content":"AngularのルーティングとコンポーネントのLazyLoadについて","relatedLinks":[]},{"category":"Article","title":"Lazy Loading - React","url":"https://webpack.js.org/guides/lazy-load-react/","tags":["webpack","React"],"content":"webpack2を使ったReactコンポーネントのLazyLoad方法についてのドキュメント","relatedLinks":[]},{"category":"Article","title":"FlowtypeでFluxアーキテクチャに型付けをするという発表をした - Please Drive Faster","url":"http://joe-re.hatenablog.com/entry/2016/12/29/204917","tags":["flowtype","Flux"],"content":"FlowTypeを使ってFluxアーキテクチャのパターンに型を付ける話","relatedLinks":[{"title":"flowtypeによりFluxにおいて型安全を手に入れる - Qiita","url":"http://qiita.com/joe-re/items/d6fd262a8c6017f41e22"}]},{"category":"Article","title":"Node.js Interview Questions and Answers (2017 Edition) | @RisingStack","url":"http://blog.risingstack.com/node-js-interview-questions-and-answers-2017/","tags":["node.js","security"],"content":"Node.jsにおいて良くある質問とその答えについてをQ&A形式で書かれたもの。\nコーディングスタイル、よくある書き間違い、セキュリティ、タイミング攻撃などについて","relatedLinks":[]},{"category":"Article","title":"React Interview Questions","url":"https://tylermcginnis.com/react-interview-questions/","tags":["React","JavaScript"],"content":"Reactについての疑問をQ&A形式で書かれた記事。\nClassで書くコンポーネントと関数として書くコンポーネントの違い、`refs`とは何か、`key`属性はなぜ大事なのか、コンポーネントパターンなど","relatedLinks":[]},{"category":"Article","title":"Writing HTML with accessibility in mind – Medium","url":"https://medium.com/@matuzo/writing-html-with-accessibility-in-mind-a62026493412","tags":["HTML","accessibility"],"content":"HTMLとアクセシビリティ(スクリーンリーダー)について\n`lang`属性、`alt`属性、`<buton>`要素、landmarksについて","relatedLinks":[]},{"category":"Article","title":"PostCSS まとめ - Qiita","url":"http://qiita.com/morishitter/items/4a04eb144abf49f41d7d","tags":["PostCSS"],"content":"PostCSSの概要と特徴、作られたモチベーションについて","relatedLinks":[]},{"category":"Article","title":"Front-End Performance Checklist 2017 (PDF, Apple Pages) – Smashing Magazine","url":"https://www.smashingmagazine.com/2016/12/front-end-performance-checklist-2017-pdf-pages/","tags":["performance","browser"],"content":"ウェブフロントエンドのパフォーマンスチェックリスト。\nファイルサイズ、配信方法、レンダリング、モニタリング、テスト方法などについて","relatedLinks":[]},{"category":"Article","title":"The Reflect API of ES6 – Zsolt Nagy","url":"http://www.zsoltnagy.eu/the-reflect-api-of-es6/","tags":["JavaScript","ECMAScript"],"content":"Reflect APIについての紹介記事","relatedLinks":[]},{"category":"Article","title":"MozAnime in 2016 | Nothing new","url":"https://birtles.wordpress.com/2016/12/27/mozanime-in-2016/","tags":["firefox","animation"],"content":"2016年におけるFirefoxのWeb Animations対応やデバッグ機能の更新点について","relatedLinks":[]},{"category":"SlideVideo","title":"Optimise your web development workflow 2016","url":"https://umaar.github.io/devtools-optimise-your-web-development-workflow-2016/","tags":["Chrome","CSS","debug","slide","accessibility"],"content":"Chromeの開発者ツールについてのスライド。\n主にCSS、アクセシビリティ、パフォーマンスについて豊富なGIFアニメーションと共に紹介している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Fuse-Box bundler / API Reference","url":"http://fuse-box.org/","tags":["JavaScript","Tools"],"content":"webpack/Browserifyのようなbundler、JSPM/SystemJSのようなloaderを機能を持つツール。\n変換結果の依存関係とキャッシュをすることで高速な変換ができる。\nプラグインで対応する変換を拡張できる","relatedLinks":[{"title":"FuseBox — bundle your project within a fraction of a second","url":"https://medium.com/@ivanorlov/fusebox-bundle-your-project-within-a-fraction-of-a-second-f2360ba95727"}]},{"category":"SoftwareLibrary","title":"Gothdo/range: A JavaScript implementation of the Python&#x27;s range() function.","url":"https://github.com/Gothdo/range","tags":["JavaScript","library"],"content":"Pythonの`range()`のJavaScript実装ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"andywer/leakage: 🐛 Memory leak testing for node.","url":"https://github.com/andywer/leakage","tags":["JavaScript","node.js","test","libn"],"content":"Node.jsでメモリリークのテストを書くことができるライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nolanlawson/marky: High-resolution JavaScript timer based on performance.mark() and measure()","url":"https://github.com/nolanlawson/marky","tags":["JavaScript","performance","libn"],"content":"User Timing API(`performance.mark`と`performance.measure`)ベースの処理時間計測ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"maniart/diffyjs: A dependency-free motion detection library for the browser","url":"https://github.com/maniart/diffyjs","tags":["JavaScript","画像"],"content":"`MediaDevices.getUserMedia()`を使って取得した画像から、フレームごとの動きのdiffを取得できるライブラリ。\nmotion detectionライブラリ","relatedLinks":[]}]},{"meta":{"title":"2017-01-11のJS: Node.js v7.4.0とnpm v4、PhantomJS 2.5.0 Beta、クリーンコード","author":"azu","layout":"post","date":"2017-01-11T00:36:00.000Z","category":"JSer","tags":["Node.js","npm","webkit","PhantomJS"],"url":"https://jser.info/2017/01/11/Node.js-v7.4.0-npm-v4-PhantomJS-2.5.0-Beta-clean-code/"},"items":[{"category":"Headline","title":"Introducing Inferno 1.0 – inferno_js – Medium","url":"https://medium.com/inferno-js/introducing-inferno-1-0-f3da5c4e773b","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"Inferno 1.0リリース。\nInfernoがなぜ作られたのか、今後のロードマップについて","relatedLinks":[]},{"category":"Headline","title":"Node v7.4.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v7.4.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 7.4.0リリース。\nBuffer、`EventEmitter.once`のパフォーマンス改善など","relatedLinks":[]},{"category":"Headline","title":"[Release] PhantomJS 2.5.0 Beta - Google グループ","url":"https://groups.google.com/d/topic/phantomjs/AefOuwkgBh0","tags":["browser","ReleaseNote","webkit"],"content":"PhantomJS 2.5.0βリリース。\nQtWebKitがアップデートされES2015のサポート、WebPのサポートなど","relatedLinks":[{"title":"Comparison with QtWebKit 5.6 · annulen/webkit Wiki","url":"https://github.com/annulen/webkit/wiki/Comparison-with-QtWebKit-5.6"}]},{"category":"Headline","title":"Microsoft Edge build 15002 changelog - Microsoft Edge Development","url":"https://developer.microsoft.com/en-us/microsoft-edge/platform/changelog/desktop/15002/","tags":["MSEdge","ReleaseNote"],"content":"Windows 10 build 15002リリース。\nMSEdgeでFlashがClick to playに、Web Paymentsの試験的サポート、CSP 2.0、WebVR APIのサポートなど\nまた別オリジンにおけるsetTimeout/requestAnimationFrameの呼び出し頻度を抑制するなど","relatedLinks":[]},{"category":"Article","title":"ES6 arrow functions in depth","url":"https://codesi.nz/es6-arrow-functions-in-depth/","tags":["JavaScript","ECMAScript"],"content":"Arrow Functionについて細かいところも含めて、解説してる記事。\nよくある`this`の動き、暗黙的な`return`について\nまた、`new`できない点、`new.target`や`arguements`を扱えない点についてなど","relatedLinks":[]},{"category":"Article","title":"From Sass to PostCSS by Tyler Gaw","url":"https://tylergaw.com/articles/sass-to-postcss","tags":["Sass","CSS","PostCSS"],"content":"SassだったものをPostCSSに置き換えるまでの話。\nSassの構文とPostCSS拡張(cssnext)の比較","relatedLinks":[]},{"category":"Article","title":"ES proposal: import()","url":"http://www.2ality.com/2017/01/import-operator.html","tags":["ECMAScript","proposal"],"content":"現在Stage 3のProposalである、`import()`について。\ndynamic module importsに関する仕様","relatedLinks":[]},{"category":"Article","title":"Yarn vs npm - The State of Node.js Package Managers | @RisingStack","url":"http://blog.risingstack.com/yarn-vs-npm-node-js-package-managers/","tags":["npm","yarn"],"content":"npm v4とYarnについて。\nnpm v4で追加された機能の解説、Yarnの機能やロックファイルについて","relatedLinks":[]},{"category":"Article","title":"Web animation in 2017 | Nothing new","url":"https://birtles.wordpress.com/2017/01/10/web-animation-in-2017/","tags":["CSS","animation","firefox"],"content":"Web Animation関連の仕様ステータスについてのまとめ","relatedLinks":[]},{"category":"Article","title":"Building a custom tag input with Skate.js","url":"https://hackernoon.com/building-a-custom-tag-input-with-skate-js-fbd4cdf744f","tags":["WebComponents","library"],"content":"Web ComponentsフレームワークであるSkate.jsを使ってタグ入力コンポーネントを作る話。\n値、スタイルの定義の仕方などについて","relatedLinks":[]},{"category":"Article","title":"Flux を使わずに React コンポーネント間のコミュニケーションを行う8つの方法 - Qiita","url":"http://qiita.com/kyoshidajp/items/0ddb156d96bb6337f623","tags":["React","翻訳"],"content":"Reactコンポーネント同士で値の受け渡しなどのパターンについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"ryanmcdermott/clean-code-javascript: Clean Code concepts adapted for JavaScript","url":"https://github.com/ryanmcdermott/clean-code-javascript","tags":["JavaScript","OOP"],"content":"クリーンコードをJavaScriptで行うガイドライン。\n読みやすいコードの書き方やオブジェクト指向プログラミング、SOLID、ES2015以降の機能使って分かりやすく書く話など","relatedLinks":[]},{"category":"WebsiteDocument","title":"縦書きWeb普及委員会","url":"http://tategaki.github.io/","tags":["CSS","browser"],"content":"縦書きCSSについての解説サイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Flow Runtime","url":"https://codemix.github.io/flow-runtime/","tags":["flowtype","JavaScript","library","babel"],"content":"Flow互換の型チェックを実装したランタイムとBabelプラグイン。\nFlowで書いたコードをランタイムチェックすることができる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"talyssonoc/structure: A simple schema/attributes library built on top of modern JavaScript","url":"https://github.com/talyssonoc/structure","tags":["JavaScript","library"],"content":"ES2015 classesのモデルに対してスキーマを定義できるライブラリ。\nスキーマを元にバリデーションやシリアライズを行える","relatedLinks":[]},{"category":"SoftwareLibrary","title":"wheresrhys/fetch-mock: Mock http requests made using fetch (or isomorphic-fetch)","url":"https://github.com/wheresrhys/fetch-mock","tags":["Fetch","test","HTTP"],"content":"Fetch APIのモックライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"danculley/real-dom: A ~1K non-virtual DOM non-framework framework for simple apps","url":"https://github.com/danculley/real-dom","tags":["JavaScript","library","React","jsx"],"content":"JSXで書くこともでき、ReduxライクなStateマシンを扱えるDOMコンポーネントライブラリ。\n50行ほどのコードで実装されていてとても小さい。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"xvg","url":"https://xvg.now.sh/","tags":["SVG","Chrome","debug"],"content":"SVG pathをアウトライン化、アンカーを表示することでSVGをデバッグすることができるChrome拡張","relatedLinks":[]},{"category":"SoftwareLibrary","title":"NodeKit","url":"https://nodekit.io/","tags":["node.js","webkit","Electron"],"content":"Node.jsをiOS/Android/Windowsなどのアプリで組み込んで使うようのフレームワーク。\nJavaScriptのバインディングにJavaScriptCoreやChackraCoreを使う","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jlongster/prettier: Prettier is an opinionated JavaScript formatter.","url":"https://github.com/jlongster/prettier","tags":["JavaScript","Tools"],"content":"折り返し桁数ベースのJavaScript整形ツール","relatedLinks":[{"title":"A Prettier JavaScript Formatter","url":"http://jlongster.com/A-Prettier-Formatter"}]},{"category":"Book","title":"O&#x27;Reilly Japan - 初めてのJavaScript 第3版","url":"http://www.oreilly.co.jp/books/9784873117836/","tags":["JavaScript","book"],"content":"2017年1月20日発売\nLearning JavaScriptの翻訳本。\nES2015+に対応した内容","relatedLinks":[{"title":"初めてのJavaScript 第3版 サポートページ — マーリンアームズ","url":"http://www.marlin-arms.com/support/ljs3/"}]},{"category":"Book","title":"Front-end Handbook 2017 · GitBook","url":"https://www.gitbook.com/book/frontendmasters/front-end-handbook-2017/details","tags":["JavaScript","CSS","book"],"content":"フロントエンドに関する電子書籍の2017年版","relatedLinks":[{"title":"Front-end Handbook 2016 · GitBook","url":"https://www.gitbook.com/book/frontendmasters/front-end-handbook/details"}]}]},{"meta":{"title":"JSer.info 6周年記念イベントを開催しました","author":"azu","layout":"post","date":"2017-01-15T11:36:00.000Z","category":"Article","tags":["イベント"],"url":"https://jser.info/2017/01/15/jser-info-6years/"},"items":[]},{"meta":{"title":"2017-01-17のJS: Safari Technology Preview Release 21、Protractor 5.0.0","author":"azu","layout":"post","date":"2017-01-17T00:49:00.000Z","category":"JSer","tags":["Safari","testing","E2E"],"url":"https://jser.info/2017/01/17/safari-technology-preview-release-21-protractor-5.0.0/"},"items":[{"category":"Headline","title":"Release v1.4.0 · karma-runner/karma","url":"https://github.com/karma-runner/karma/releases/tag/v1.4.0","tags":["testing","ReleaseNote"],"content":"Karma v1.4.0リリース。\nHTTP moduleを設定することで`node-http2`などを利用できるように、定数を`karma.constants`としてexportするようになるなど","relatedLinks":[]},{"category":"Headline","title":"mobx/CHANGELOG.md at 3.0.0 · mobxjs/mobx","url":"https://github.com/mobxjs/mobx/blob/3.0.0/CHANGELOG.md","tags":["JavaScript","library","ReleaseNote"],"content":"MobX 3リリース。\n`observable`が各type毎にファクトリメソッドを追加、受け取ったオブジェクトをcloneするように、エラーハンドリングの改善など","relatedLinks":[{"title":"MobX 3.0.0 の変更点について - console.lealog();","url":"http://lealog.hateblo.jp/entry/2017/01/11/140607"},{"title":"MobX 3 released: Unpeeling the onion – Medium","url":"https://medium.com/@mweststrate/mobx-3-released-unpeeling-the-onion-ca877382f443"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 21 | WebKit","url":"https://webkit.org/blog/7265/release-notes-for-safari-technology-preview-21/","tags":["ReleaseNote","webkit","safari"],"content":"Safari Technology Preview Release 21リリース。\nConcurrent GCの有効化、`<script type=\"module\">`の有効化、`global`がサポートされたがbreak the webのためbackoutなど","relatedLinks":[{"title":"チェンジセット 210570 – WebKit","url":"https://trac.webkit.org/changeset/210570"},{"title":"global breaks flickr.com · Issue #20 · tc39/proposal-global","url":"https://github.com/tc39/proposal-global/issues/20"},{"title":"Native ECMAScript modules - the first overview","url":"https://blog.hospodarets.com/native-ecmascript-modules-the-first-overview"}]},{"category":"Headline","title":"protractor/CHANGELOG.md at 5.0.0 · angular/protractor","url":"https://github.com/angular/protractor/blob/5.0.0/CHANGELOG.md","tags":["test","ReleaseNote"],"content":"Protractor 5.0.0リリース。\n`selenium-webdriver` 3.0.xへのアップデートに伴う破壊的変更、未知のフラグはエラーを投げるようになるなど","relatedLinks":[]},{"category":"Article","title":"TypeScript: the missing introduction","url":"https://toddmotto.com/typescript-the-missing-introduction","tags":["JavaScript","TypeScript"],"content":"TypeScriptという言語がどのような仕組みで動いているのか、JavaScriptに対してどのような役割をもっているのかという言語入門以前の話を丁寧にかかれている。","relatedLinks":[]},{"category":"Article","title":"Practical Redux · Mark&#x27;s Dev Blog","url":"http://blog.isquaredsoftware.com/series/practical-redux/","tags":["redux","tutorial"],"content":"ゲームの管理ツールを題材にしたReduxについての連載。\n`Redux-ORM`を使ったモデルの作成、Semantic-UIでのUI作成、ディレクトリ構造、デバッグ方法、コンポーネントのリファクタリングなどについて扱っている","relatedLinks":[]},{"category":"Article","title":"Side Effects in JS Promise chains – Medium","url":"https://medium.com/@gabrielcatalin/side-effects-in-js-promise-chains-7db50b6302f3","tags":["JavaScript","Promises"],"content":"Promise chainに副作用がある処理を含める際に処理が途切れてしまう問題について。\n`passThrough()`のような高階関数を用意し副作用を扱うことで、明示しつつバグを減らす方法について","relatedLinks":[]},{"category":"Article","title":"TypedArray or DataView: Understanding byte order ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2017/01/typedarray-or-dataview-understanding-byte-order/","tags":["JavaScript"],"content":"`ArrayBuffer`、`TypedArray`、`DataView`についての解説。\n`ArrayBuffer`がバイナリのデータ構造であり、*view*として`TypedArray`と`DataView`があるという話","relatedLinks":[]},{"category":"WebsiteDocument","title":"Web Components v1 - the next generation  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/01/webcomponents-org","tags":["WebComponents"],"content":"Web Components v1に伴い、\nwebcomponents.org がアップデートされた","relatedLinks":[]},{"category":"SoftwareLibrary","title":"arqex/freezer: A tree data structure that emits events on updates, even if the modification is triggered by one of the leaves, making it easier to think in a reactive way.","url":"https://github.com/arqex/freezer","tags":["JavaScript","library"],"content":"Immutable.jsのようなImmutableなデータ構造を扱うライブラリ。\n変更を通知するイベントやImmutable.jsよりもファイルサイズが小さい。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Siema - Lightweight and simple carousel with no dependencies","url":"https://pawelgrzybek.com/siema/","tags":["JavaScript","library"],"content":"依存がないカヌーセルライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"angus-c/just: A library of dependency-free utilities that do just do one thing.","url":"https://github.com/angus-c/just","tags":["JavaScript","library"],"content":"依存がない小さなユーティリティライブラリ集。\nそれぞれの機能を個別のモジュールとしてインストールして利用できる。\nそれぞれの`just-*`モジュール間でも依存関係がない作りとなっている。","relatedLinks":[{"title":"Why I wrote Just. – Medium","url":"https://medium.com/@angustweets/just-a12d54221f65"},{"title":"Just vs lodash · Issue #4 · angus-c/just","url":"https://github.com/angus-c/just/issues/4"}]},{"category":"SoftwareLibrary","title":"yamafaktory/shrimpit: Shrimpit is a small CLI analysis tool for checking unused JavaScript, JSX &amp; Vue templates ES6 exports in your project.","url":"https://github.com/yamafaktory/shrimpit","tags":["JavaScript","library","Tools"],"content":"各モジュールのimport/exportを一覧し、未使用なモジュールを表示出来るCLI","relatedLinks":[]},{"category":"SoftwareLibrary","title":"katat/vbot: JSON based visual regression testing tool, particularly useful for SPA or complicated web app","url":"https://github.com/katat/vbot","tags":["browser","testing"],"content":"JSONベースのリグレッションテストツール。\nJSONでシナリオを作成して、スクリーンショットの画像比較ができる","relatedLinks":[{"title":"vbot - JSON based visual regression tester - Kata Tech Life","url":"http://katat.github.io/2017/01/09/vbot/"}]},{"category":"SoftwareLibrary","title":"Landmarks browser extension","url":"http://matatk.agrip.org.uk/landmarks/","tags":["firefox","Chrome","WAI-ARIA","Extension"],"content":"WAI-ARIAのlandmarkナビゲーションを有効化するブラウザ拡張","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tsayen/dom-to-image: Generates an image from a DOM node using HTML5 canvas","url":"https://github.com/tsayen/dom-to-image","tags":["HTML","canvas","SVG","library"],"content":"SVGの`<foreignObject>`を使いHTMLを描画したものをCanvas経由で画像として取得するライブラリ","relatedLinks":[{"title":"DOM オブジェクトを Canvas に描画する - HTML | MDN","url":"https://developer.mozilla.org/ja/docs/Web/HTML/Canvas/Drawing_DOM_objects_into_a_canvas"}]},{"category":"SoftwareLibrary","title":"ModClean/modclean: Remove unwanted files and directories from your node_modules folder","url":"https://github.com/ModClean/modclean","tags":["node.js","Tools"],"content":"node_modulesから不要なファイルを削除することができるツール","relatedLinks":[]}]},{"meta":{"title":"2017-01-24のJS: webpack 2正式リリース、JavaScriptの開発環境設定、2016 JS Stars","author":"azu","layout":"post","date":"2017-01-24T01:33:00.000Z","category":"JSer","tags":["webpack","JavaScript"],"url":"https://jser.info/2017/01/24/webpack-2-javascript-2016-js-star/"},"items":[{"category":"Headline","title":"Release v2.2.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v2.2.0","tags":["webpack","ReleaseNote"],"content":"webpack 2.2.0正式版リリース。","relatedLinks":[{"title":"Migrating from v1 to v2","url":"https://webpack.js.org/guides/migrating/"},{"title":"🎉 webpack 2.2: The Final Release 🎉 – webpack – Medium","url":"https://medium.com/webpack/webpack-2-2-the-final-release-76c3d43bf144#.ibgliase6"}]},{"category":"Headline","title":"TestCafe v0.12.0 Released | TestCafe","url":"http://devexpress.github.io/testcafe/blog/testcafe-v0-12-0-released.html","tags":["testing","E2E","ReleaseNote"],"content":"TestCafe v0.12.0リリース。\nベーシック認証/NTLM認証のサポート、CIでの動作改善、テストのスキップ、`test.before`と`test.after`の追加、ESLintプラグインの追加など","relatedLinks":[]},{"category":"Article","title":"Modern JavaScript概観、そしてElectronへ","url":"http://blog.satotaichi.info/modern-javascript_201701/","tags":["JavaScript","TypeScript","Electron","babel"],"content":"JavaScriptの環境設定をめぐる試行について。\nTypeScriptやFlowなどの型システム、Babelのエコシステム、Lint、テストフレームワーク、UIフレームワーク、CSS、アーキテクチャ、ビルドなど。\n幅広いツール/ライブラリの中で、どのような考えで何を選んだかについて書かれている。","relatedLinks":[]},{"category":"Article","title":"アメブロ2016 ~ Isomorphic JavaScriptの詳しい話 | CyberAgent Developers Blog | サイバーエージェント デベロッパーズブログ","url":"https://developers.cyberagent.co.jp/blog/archives/3513/","tags":["JavaScript","isomorphic"],"content":"クライアントサイドとサーバサイドのどちらでも動くIsomorphicなJavaScriptを書くために気をつける点について。\nReactコンポーネント、Fetch、スタイルシート、環境変数、ルーティング、表示領域の扱い，パフォーマンス計測についてなど","relatedLinks":[]},{"category":"Article","title":"Making transpiled ES modules more spec-compliant","url":"http://www.2ality.com/2017/01/babel-esm-spec-mode.html","tags":["ECMAScript","node.js"],"content":"ES Modulesの仕様と現在のTranspilerの挙動について。\nECMAScriptとNode.jsのモジュールのInteroperabilityについて","relatedLinks":[]},{"category":"Article","title":"Module Bundling and Webpack in Simple Terms","url":"http://arianv.com/post/Module-Bundling-and-Webpack-in-Simple-Terms/","tags":["webpack","tutorial"],"content":"webpackがどのようにモジュールをbundleしているかを丁寧に解説した記事","relatedLinks":[]},{"category":"Article","title":"TypeScript 2.1: Mapped Types | Marius Schulz","url":"https://blog.mariusschulz.com/2017/01/20/typescript-2-1-mapped-types","tags":["TypeScript"],"content":"TypeScript 2.1で入ったMapped Typesについて。\n`Object.freeze`などを例にMapped Typesの使い方を解説している","relatedLinks":[]},{"category":"Article","title":"Dragons when upgrading from Angular 2.1.x to 2.4.x – Medium","url":"https://medium.com/@abookone/dragons-when-upgrading-from-angular-2-1-x-to-2-4-x-530de5a763cb","tags":["AngularJS"],"content":"Angular 2.1から2.4へのアップデートにおけるハマりどころについて","relatedLinks":[]},{"category":"Article","title":"Vue + Vuex — Getting started – Medium","url":"https://medium.com/@bradfmd/vue-vuex-getting-started-f78c03d9f65","tags":["Vue","tutorial"],"content":"Vuexについての導入チュートリアル","relatedLinks":[]},{"category":"Article","title":"Server-side Rendering Shootout with Marko, Preact, Rax, React and Vue","url":"https://hackernoon.com/server-side-rendering-shootout-with-marko-preact-rax-react-and-vue-25e1ae17800f","tags":["JavaScript","DOM","template"],"content":"UIライブラリ/テンプレートエンジンであるMarkoのサーバサイドレンダリングの高速化手法について。\nMarko v4ではブラウザとサーバで出力方式を変えている。\nクライアントサイドではVirtual DOMを使い、サーバサイドでは文字列結合をベースとした出力を使い分けている。","relatedLinks":[{"title":"Marko v4 Multiple Compilation Targets","url":"https://gist.github.com/mlrawlings/8b67bee58df45709e232f689b873e1d1"},{"title":"feat: add marko by mlrawlings · Pull Request #11 · taobaofed/server-side-rendering-comparison","url":"https://github.com/taobaofed/server-side-rendering-comparison/pull/11"},{"title":"marko/ROADMAP.md at master · marko-js/marko","url":"https://github.com/marko-js/marko/blob/master/ROADMAP.md"}]},{"category":"Article","title":"3 New CSS Features to Learn in 2017","url":"https://bitsofco.de/3-new-css-features-to-learn-in-2017/","tags":["CSS"],"content":"最近のブラウザで利用できる新しいCSSの機能について。\nFeature Queries、Grid Layout、CSS Variables","relatedLinks":[]},{"category":"Article","title":"ES2016 / ES2017の最新動向を追ってみた - Qiita","url":"http://qiita.com/yuyake0084/items/3c901f37ed7333d4da16","tags":["JavaScript","ECMAScript"],"content":"ES2016、2017で追加された構文や機能について","relatedLinks":[]},{"category":"Article","title":"Introduction to WebAssembly — Rasmus Andersson","url":"https://rsms.me/wasm-intro","tags":["WebAssembly"],"content":"WebAssemblyの中身を見ていく話。\nセマンティクス、type section、メモリアドレス、JavaScriptのAPIについて","relatedLinks":[]},{"category":"Article","title":"Functional Programing in Javascript | Lifelong Learning","url":"https://vmayakumar.wordpress.com/2017/01/17/functional-programing-in-javascript/","tags":["JavaScript","関数型プログラミング"],"content":"JavaScriptでの関数型プログラミングについて。\nAdequate/mostly-adequate-guideを元にしている","relatedLinks":[{"title":"MostlyAdequate/mostly-adequate-guide: Mostly adequate guide to FP (in javascript)","url":"https://github.com/MostlyAdequate/mostly-adequate-guide"}]},{"category":"WebsiteDocument","title":"2016 JavaScript Rising Stars","url":"https://risingstars2016.js.org/","tags":["JavaScript","github"],"content":"2016年にGitHubのstarの増加率でランキングをつけた結果について。\nそれぞれのライブラリやツールについても簡単に解説されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Voca: The JavaScript string library","url":"https://vocajs.com/","tags":["JavaScript","library"],"content":"文字列操作系のUtils集ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lorenzofox3/zora: A less than 200 lines of code javascript test harness for nodejs and the browser","url":"https://github.com/lorenzofox3/zora","tags":["testing","JavaScript","library"],"content":"Generatorを使った小さなテストフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"alibaba/rax: A universal React-compatible render engine.","url":"https://github.com/alibaba/rax","tags":["React","library","JavaScript"],"content":"ReactライクなAPIを持つUniversalなViewライブラリ。\nブラウザだけではなく、アプリ(Weex)やサーバでも動作させることが目的。","relatedLinks":[{"title":"rax/difference-with-react.md at master · alibaba/rax","url":"https://github.com/alibaba/rax/blob/master/docs/difference-with-react.md"},{"title":"Weex","url":"https://weex-project.io/"},{"title":"(question) Inferno/Preact comparison · Issue #81 · alibaba/rax","url":"https://github.com/alibaba/rax/issues/81"}]}]},{"meta":{"title":"2017-01-30のJS: Safari 10.1 pre、Firefox51.0、徐々に型を付けてのリファクタリング","author":"azu","layout":"post","date":"2017-01-30T14:30:24.488Z","category":"JSer","tags":["Firefox","Safari","TypeScript","Flow"],"url":"https://jser.info/2017/01/30/safari-10.1-firefox51.0-type-refactoring/"},"items":[{"category":"Headline","title":"Safari 10.1","url":"https://developer.apple.com/library/prerelease/content/releasenotes/General/WhatsNewInSafari/Articles/Safari_10_1.html","tags":["safari","ReleaseNote"],"content":"afari 10.1 プレリリース。\nFetch API、IndexedDB 2.0、Custom Elements、Pointer Lock/Gamepad API、ES2016,2017のサポートなど。\nまた`<a>`要素の`download`属性,\nCSS Gridなどのサポート\n","relatedLinks":[]},{"category":"Headline","title":"# Firefox — Notes (51.0) — Mozilla\n","url":"https://www.mozilla.org/en-US/firefox/51.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"refox 51.0リリース。\nWebGL 2、IndexedDB 2、XHRの仕様追従、FLAC形式のサポート、` DOMImplementation.hasFeature()`は常に`true`を返すように、非標準なAPIを削除など\n\n","relatedLinks":[{"title":"Firefox 51 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/Firefox/Releases/51"},{"title":"Firefox 51 Site Compatibility | Firefox Site Compatibility","url":"https://www.fxsitecompat.com/en-CA/versions/51/"}]},{"category":"Headline","title":" node-browserify/changelog.markdown at master · substack/node-browserify\n[","url":"https://github.com/substack/node-browserify/blob/master/changelog.markdown","tags":["browserify","ReleaseNote"],"content":"wserify 14.0.0リリース。\nbufferのpolyfillがアップグレードされ、IE10以下のサポートが終了。\nbufferパッケージがTypedArrayを利用しているため。\n\n-","relatedLinks":[{"title":"Update ","url":"https://github.com/substack/node-browserify/pull/1678"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 22 | WebKit\n[w","url":"https://webkit.org/blog/7354/release-notes-for-safari-technology-preview-22/","tags":["safari","ReleaseNote"],"content":"ri Technology Preview Release 22リリース。\n`scroll-snap-type:proximity`のサポート、`innerText`の仕様追従、`URLSearchParams`がiterableとなるなど\n\n--","relatedLinks":[]},{"category":"Headline","title":"ideo.js 6.0.0-RC.0: The first Release Candidate | Video.js Blog\n[bl","url":"http://blog.videojs.com/Video-js-6-0-0-RC-0-The-first-RC/","tags":["JavaScript","video","library","ReleaseNote"],"content":".js v6.0 RCリリース。\nFlashをCoreから取り除き、Reactインスパイアなプラグインアーキテクチャの追加、accessiblityの改善など\n- [T","relatedLinks":[{"title":"The End of ","url":"http://blog.videojs.com/the-end-of-html-first/"}]},{"category":"Article","title":"factoring 30000 lines of JS with types - Reaktor.com\n[www","url":"https://www.reaktor.com/blog/refactoring-30000-lines-js-types/","tags":["JavaScript","リファクタリング"],"content":"vaScriptをリファクタリングしたアプローチについて。\n逐次的な型付のアプローチについて。\nFlowのweek modeとコメントでの型付けを使った方法と問題点。\nTypeScriptを使った名前空間オブジェクトへのアプローチとメリット/デメリット。\n最終的にTypeScriptを使ったがそのときに遭遇した問題について\n\n----","relatedLinks":[]},{"category":"Article","title":"ing touch scrolling fast by default  |  Web  |  Google Developers\n[deve","url":"https://developers.google.com/web/updates/2017/01/scrolling-intervention","tags":["Chrome","JavaScript","event"],"content":"56からtouch eventをlistenすると\n`{passive: true}`がデフォルトとなる。\nデフォルトでは`touchstart`の中で`event.preventDefault()`を呼ぶと無視され警告がコンソールに表示される。\n- [Eve","relatedLinks":[{"title":"Event.defaultPrevented - Web APIs | MDN","url":"https://developer.mozilla.org/en-US/docs/Web/API/Event/defaultPrevented"},{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features/5093566007214080"}]},{"category":"Article","title":"ing React Applications with Jest\n[auth0","url":"https://auth0.com/blog/testing-react-applications-with-jest/","tags":["React","testing","tutorial"],"content":"Reactのテストについての解説。\nインストールからテストの書き方、モックなどについて書かれている。\n\n----\n\n","relatedLinks":[]},{"category":"Article","title":"oposal: Shared memory and atomics\n[www.2a","url":"http://www.2ality.com/2017/01/shared-array-buffer.html","tags":["ECMAScript","proposal","spec"],"content":"ことが決まったShared memory and atomicsについての解説。\nShared Array BuffersでWorker(agent)とデータを共有することができる。\n\n----\n\n#","relatedLinks":[]},{"category":"Article","title":"ent a JavaScript reactive programming library — part 1 – Medium\n[medium.","url":"https://medium.com/@bohou/implement-a-javascript-reactive-programming-library-part-1-f564ac6ad789","tags":["JavaScript","library"],"content":"avaScriptライブラリを実装する連載記事。\n- [bhou/b","relatedLinks":[{"title":"bhou/bouton.js: A framework to build your asynchronous reactive library.","url":"https://github.com/bhou/bouton.js"}]},{"category":"Article","title":"ut for Undefined State\n[davecedd","url":"https://daveceddia.com/watch-out-for-undefined-state/","tags":["React"],"content":"トでコンポーネント内のstateに依存しているものを、propsへ移動するリファクタリングの例。\nコンポーネントのデフォルトstateはundefinedであるという話\n\n----\n\n## ","relatedLinks":[]},{"category":"Article","title":"ise of a Burger Party - Mariko Kosaka\n[kosamari.","url":"http://kosamari.com/notes/the-promise-of-a-burger-party","tags":["JavaScript","Promises","図"],"content":"ショップを例にして解説している記事。\n図解をしながらPromiseのresolveとrejectの動きについて書かれている\n\n\n----\n\n## ","relatedLinks":[]},{"category":"Article","title":" text in an image on the web in real-time - Tales of a Developer Advocate by Paul Kinlan\n[paul.kinla","url":"https://paul.kinlan.me/detecting-text-in-an-image/","tags":["Chrome","WebPlatformAPI"],"content":"ド認識、画像からテキスト認識するブラウザAPIについて\n- [Accelerat","relatedLinks":[{"title":"Accelerated Shape Detection in Images","url":"https://wicg.github.io/shape-detection-api/"}]},{"category":"Article","title":"ing the Critical Rendering Path\n[bitsofco.de","url":"https://bitsofco.de/understanding-the-critical-rendering-path/","tags":["browser","CSS","JavaScript"],"content":"とは何かという解説。\nブラウザがどのようなフローでレンダリングまでを行うか。\nまた、開発者ツールを使ってレンダリングフローで起きているイベントを見ていく話。\n\n----\n\n## ECM","relatedLinks":[]},{"category":"Article","title":"proposal updates @ 2017-01 | ECMAScript Daily\n[ecmascript-d","url":"https://ecmascript-daily.github.io/ecmascript/2017/01/30/ecmascript-proposals-status","tags":["ECMAScript","proposal"],"content":"ScriptのProposalのStageまとめ。 2017年1月のミーティングで5つのProposalが追加され、Shared memory and atomicsはES2017に入った。\n\n---\n\n## Optim","relatedLinks":[]},{"category":"Article","title":"he Performance of Your React Application\n[auth0.com/blo","url":"https://auth0.com/blog/optimizing-react/","tags":["React","performance"],"content":"rf`を使いReactコンポーネントのパフォーマンス計測を行う話。\nまた`React.PureComponent`を使い`shouldComponentUpdate`の判定がきちんと行われるようにしてパフォーマンス改善するという話。\n\n----\n\n\n----\n<h","relatedLinks":[]},{"category":"WebsiteDocument","title":" Package chromedp is a faster, simpler way to drive browsers (Chrome, Edge, Safari, Android, etc) without external dependencies (ie, Selenium, PhantomJS, etc).\n[github.com/knq","url":"https://github.com/knq/chromedp","tags":["Chrome","debug","golang"],"content":"rotocolを使ったブラウザ操作ツール\n\n----\n<h1 class=","relatedLinks":[]},{"category":"Book","title":"orphic Development with JavaScript\n[www.manning.com","url":"https://www.manning.com/books/isomorphic-development-with-javascript","tags":["JavaScript","isomorphic","book"],"content":"iptについての書籍。\nブラウザとNode.jsで共有しながら、ウェブアプリケーションを作る話。\nReact + Redux、Angular 2やEmberを題材にしている。\n\n----\n","relatedLinks":[]}]},{"meta":{"title":"JSerレポート #1 Bundlerの未来、テスティングフレームワークの現状","author":"azu","layout":"report","date":"2017-01-31T01:12:00.000Z","category":"report","tags":["webpack","bundler","testing","report"],"toc":true,"url":"https://jser.info/2017/01/31/bundler-testing-framework-report/"},"items":[]},{"meta":{"title":"2017-02-05のJS: AVA 0.18.0、Mithril 1.0、ES modulesとwebpackのモジュール","author":"azu","layout":"post","date":"2017-02-05T09:37:59.308Z","category":"JSer","tags":["AVA","Testing","modules"],"url":"https://jser.info/2017/02/05/ava-0.18.0-mithril-1.0-es-moduleswebpack/"},"items":[{"category":"Headline","title":"Node v7.5.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v7.5.0/","tags":["node.js","ReleaseNote"],"content":"ode v7.5.0リリース。\nnpmのアップデート、`NODE_NO_WARNINGS`の環境変数(`--no-warnings`と同等)を追加など\n","relatedLinks":[]},{"category":"Headline","title":"# Release 0.18.0 · avajs/ava\n","url":"https://github.com/avajs/ava/releases/tag/v0.18.0","tags":["JavaScript","testing"],"content":"A 0.18.0リリース。\nNode.js 0.10と0.12のサポート終了、Snapshot testing(JSX)、Magic assertの追加など\n\n","relatedLinks":[]},{"category":"Headline","title":" Announcing TypeScript 2.2 RC | TypeScript\n[","url":"https://blogs.msdn.microsoft.com/typescript/2017/02/02/announcing-typescript-2-2-rc/","tags":["TypeScript","ReleaseNote"],"content":"eScript 2.2 RCリリース。\nプリミティブ型以外を表現する`object` typeの追加、class expressionを使ったmixinの表現をサポート、JSXのreact-nativeのサポートなど\n\n-","relatedLinks":[{"title":"Roadmap · Microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/Roadmap#22-february-2017"}]},{"category":"Headline","title":"Chromium Blog: Chrome 57 Beta: CSS Grid Layout, Improved Add to Home screen, Media Session API\n[b","url":"https://blog.chromium.org/2017/02/chrome-57-beta-css-grid-layout-improved.html","tags":["Chrome","ReleaseNote"],"content":"me 57 Betaリリース。\nCSS Grid、_Media Session API_、`String#padStart`のサポート。\n`setTimeout()`が条件によりthrottleされるように、XSS Auditor(フィルター)がデフォルトでmode blockとなるように\n\n- ","relatedLinks":[{"title":"\"","url":"https://github.com/WICG/interventions/issues/9"}]},{"category":"Headline","title":"ithril.js/change-log.md at rewrite · lhorie/mithril.js\n[gi","url":"https://github.com/lhorie/mithril.js/blob/rewrite/docs/change-log.md","tags":["JavaScript","DOM","ReleaseNote","library"],"content":"il 1.0リリース。\nライフサイクルメソッドの追加、コンポーネントは渡す際に`m()`でwrapが必須に、`m.sync`の削除、同期的なredrawの削除など多くの変更がされている。\n\n- [","relatedLinks":[{"title":"Rewrite Status · Issue #1090 · lhorie/mithril.js","url":"https://github.com/lhorie/mithril.js/issues/1090"},{"title":"Introduction - Mithril.js","url":"http://mithril.js.org/"}]},{"category":"Article","title":"tive ECMAScript modules: the new features and differences from Webpack modules\n[blo","url":"https://blog.hospodarets.com/native-ecmascript-modules-new-features","tags":["ECMAScript","module","webpack"],"content":"kなどのモジュールとネイティブのES moduleの違いについてまとめられた記事。 モジュールパス、CORS、`script`要素の属性、エラー判定、ES moduleの挙動、feature detectionの方法、fallback、`script`要素の`type`の取得についてなど\n\n\n---","relatedLinks":[]},{"category":"Article","title":"eginners Guide to Webpack 2 and Module Bundling\n[www.","url":"https://www.sitepoint.com/beginners-guide-to-webpack-2-and-module-bundling/","tags":["webpack","tutorial"],"content":"の基本的な使い方についての解説。\nmoduleの扱い方、loader、plugin、コード分割、dev server、Hot reloadingについて\n\n\n----","relatedLinks":[]},{"category":"Article","title":" on Next.js\n[jsman","url":"https://jsmantra.com/next-on-next-js-1a134505f346","tags":["JavaScript","React","サーバー"],"content":"たフレームワークであるNext.js 2βについて。\nルーティング、コード分割、webpack 2のサポート、webpackやbabelの設定のカスタマイズなどの変更点について\n\n\n----\n","relatedLinks":[]},{"category":"Article","title":"rid – Table layout is back. Be there and be square.  |  Web  |  Google Developers\n[develo","url":"https://developers.google.com/web/updates/2017/01/css-grid","tags":["CSS"],"content":"概要解説記事\n\n\n----\n\n","relatedLinks":[]},{"category":"Article","title":" set up E2E browser testing for your GitHub project\n[hackern","url":"https://hackernoon.com/how-to-set-up-e2e-browser-testing-for-your-github-project-89c24e15a84","tags":["E2E","testing","tutorial","article"],"content":"ってのE2Eテストの設定方法について。 PageObjectパターン、Travis CIやSauce Labsとの連携について\n\n\n----\n\n#","relatedLinks":[]},{"category":"Article","title":"recations and Removals in Chrome 57  |  Web  |  Google Developers\n[develope","url":"https://developers.google.com/web/updates/2017/02/chrome-57-deprecations","tags":["Chrome","article"],"content":"非推奨/削除されるAPIについて。 Vendor-prefix付きの`cancelAnimationFrame`、`IndexedDB`、`AudioContext`の削除。 `BluetoothDevice.uuids`、`<keygen>`、`OfflineAudioContext`の削除など\n\n\n----\n\n##","relatedLinks":[]},{"category":"Article","title":"ure-detection.js\n[gist.gith","url":"https://gist.github.com/DaBs/89ccc2ffd1d435efdacff05248514f38","tags":["JavaScript","ECMAScript","library"],"content":"大体サポートしているかを判定する数行のスニペットコード。\n\n\n----\n<h1 ","relatedLinks":[]},{"category":"SlideVideo","title":" Information - Google ドキュメント\n[docs.googl","url":"https://docs.google.com/document/d/1jlpsfv0kXCveOEX5l75aATgRXbcAvwyse4Tn6jVprWs/edit#","tags":["イベント","V8","Chrome","google"],"content":"n7のイベントまとめ。\nスライドがまとめられている\n\n\n----\n\n## H","relatedLinks":[]},{"category":"SlideVideo","title":" npm Scripts as Your Build Tool - Course by @elijahmanor @eggheadio\n[egghead.io/","url":"https://egghead.io/courses/how-to-use-npm-scripts-as-your-build-tool","tags":["npm","video","tutorial"],"content":"ビルドを行う話についてのスクリーンキャスト\n\n\n----\n\n## JS","relatedLinks":[]},{"category":"SlideVideo","title":"code it like it's 1999\n[jsmpeg.com/]","url":"http://jsmpeg.com/","tags":["JavaScript","video","library"],"content":"criptでデコードするライブラリ。\nWebSocketsを使った動画のストリーム配信をする目的で作られている。\n\n\n----\n<h1 cla","relatedLinks":[]},{"category":"WebsiteDocument","title":" · GitBook\n[vuex.vuejs.or","url":"https://vuex.vuejs.org/ja/","tags":["Vue","library","document","翻訳"],"content":"----\n\n## Web ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Tests Dashboard\n[wptdashboard.a","url":"https://wptdashboard.appspot.com/","tags":["browser","testing","DOM","WebPlatformAPI"],"content":"-tests: Test Suites for Web Platform specifications—including WHATWG, W3C and others](https://github.com/w3c/web-platform-tests \"w3c/web-platform-tests: Test Suites for Web Platform specifications—including WHATWG, W3C and others\")をブラウザ別で実行した結果がまとめられているページ\n\n- [Web Platform","relatedLinks":[{"title":"Web Platform Tests in Blink and Beyond - Google スライド","url":"https://docs.google.com/presentation/d/1s2Dick89wvJsuNJb4ia3pPt84NtMv8rZr0E_GFXJLrk/edit#slide=id.p"}]},{"category":"WebsiteDocument","title":"Your guide to Virtual Reality in the browser.\n[webvr.rocks/](h","url":"https://webvr.rocks/","tags":["web ","VR"],"content":"ト状況をまとめたサイト\n\n\n----\n<h1 class=","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mp: An image processing library written entirely in JavaScript for Node, with zero external or native dependencies.\n[github.com/olive","url":"https://github.com/oliver-moran/jimp","tags":["JavaScript","library"],"content":"リサイズや加工などができる。\n\n\n----\n\n## egoist/","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ristic scaffolding tool.\n[github.com/egoist","url":"https://github.com/egoist/sao","tags":["github","Tools","console"],"content":"元にしてプロジェクトを生成出来るscaffoldingツール\n\n\n----\n\n## ide/mux:","relatedLinks":[]},{"category":"SoftwareLibrary","title":"a promise that waits for the promises in nested data structures and resolves to data structures of the same form. It recursively traverses the input data structure and multiplexes its promises.\n[github.com/ide/mux","url":"https://github.com/ide/mux","tags":["JavaScript","library","Promises"],"content":"ティのPromiseを解決し、その結果を同じ構造で返せるライブラリ\n\n\n----\n<h1 class=\"si","relatedLinks":[]},{"category":"Book","title":"ng Aurelia\" from Packt Publishing\n[blog.aurelia.io/201","url":"http://blog.aurelia.io/2017/02/01/announcing-learning-aurelia-from-packt-publishing/","tags":["JavaScript","library","book"],"content":"rning Aurelia ","relatedLinks":[{"title":"Learning Aurelia | PACKT Books","url":"https://www.packtpub.com/web-development/learning-aurelia"}]},{"category":"Book","title":"d ES2017\n[exploringjs.com/es20","url":"http://exploringjs.com/es2016-es2017.html","tags":["ECMAScript","JavaScript","book"],"content":"ての書籍。\nExploringJSの続編\n\n- [Exploring ES2016 a","relatedLinks":[{"title":"Exploring ES2016 and… by Axel Rauschmayer ","url":"https://leanpub.com/exploring-es2016-es2017"}]}]},{"meta":{"title":"2017-02-14のJS: V8 5.7とES2015+のパフォーマンス、npm入門、TypeScriptガイドライン","author":"azu","layout":"post","date":"2017-02-14T02:02:33.760Z","category":"JSer","tags":["V8","ES2015","npm","TypeScript"],"url":"https://jser.info/2017/02/14/v8-5.7es2015-npm-typescript/"},"items":[{"category":"Headline","title":"V8 JavaScript Engine: V8 Release 5.7","url":"http://v8project.blogspot.com/2017/02/v8-release-57.html","tags":["V8","ReleaseNote","WebAssembly"],"content":"8 5.7リリース。\nasync/awaitやES2015のパフォーマンス改善、`String#padStart`、`Intl.DateTimeFormat#formatToParts`のサポート。\nwasmがデフォルトで有効化など\n","relatedLinks":[]},{"category":"Headline","title":"# Release v4.3.0 · npm/npm\n","url":"https://github.com/npm/npm/releases/tag/v4.3.0","tags":["npm","ReleaseNote"],"content":"m 4.3.0プレリリース。\n`--auth-type`の追加、起動速度の改善など\n\n","relatedLinks":[]},{"category":"Headline","title":" JS1k 2017 - A magical JavaScript golfing competition\n[","url":"http://js1k.com/2017-magic/","tags":["JavaScript","イベント"],"content":"4bytesでJavaScriptのデモを作るコンテンストであるJS1kの2017年の募集が開始された\n\n-","relatedLinks":[]},{"category":"Article","title":"npm for Beginners: A Guide for Front-end Developers\n[w","url":"https://www.impressivewebs.com/npm-for-beginners-a-guide-for-front-end-developers/","tags":["npm","tutorial","article"],"content":"は何か、npmの使い方のチュートリアル。\nよく見るプロジェクトのディレクトリ構造、`node_modules`ディレクトリ、npmコマンドとオプションについて\n\n\n-","relatedLinks":[]},{"category":"Article","title":"napshot testing the hard way | Better world by better software\n[gl","url":"https://glebbahmutov.com/blog/snapshot-testing/","tags":["JavaScript","testing"],"content":"はSnapshotテストがあるが、テストフレームワークに依存しないでSnapshotテストを行う方法について\n\n- [","relatedLinks":[{"title":"bahmutov/snap-shot: Jest-like snapshot feature for the rest of us, works magically by finding the right caller function","url":"https://github.com/bahmutov/snap-shot"}]},{"category":"Article","title":"TypeScriptとの関わり方ガイドライン - 角待ちは対空\n[blo","url":"http://blog.yux3.net/entry/2017/02/05/000805","tags":["TypeScript","tutorial"],"content":"Scriptを使って書いてる人向けのTypeScriptの考え方について。\n典型的なエラーの意味や、コンパイラオプション、`_` prefixや`this`へ型付けなど特殊な部分について。\nまた、TypeScript特有のキーワードや参考となるドキュメントについて\n\n\n---","relatedLinks":[]},{"category":"Article","title":"aScript Start-up Performance – Dev Channel – Medium\n[medi","url":"https://medium.com/@addyosmani/javascript-start-up-performance-69200f43b201","tags":["JavaScript","performance"],"content":"iptの起動速度について。\nモバイル等CPU処理速度が遅いとパースとコンパイルに時間がかかる。\nそのため、ファイルサイズやパース、コンパイル時間は重要となる。\n開発者ツールを使っての計測方法、User Timing API、V8のCode Caching、scriptのロード方法の最適化などについて\n\n- [V8","relatedLinks":[{"title":"V8 Stats in Chrome - Google スライド","url":"https://docs.google.com/presentation/d/1Lq2DD28CGa7bxawVH_2OcmyiTiBn74dvC6vn2essroY/edit#slide=id.g1a504e63c9_2_84"}]},{"category":"Article","title":"駆動型サービス実行基盤としての Service Worker - Qiita\n[qiita","url":"http://qiita.com/nhiroki/items/65efc9e41ec1d928afcd","tags":["JavaScript","ServiceWorker","歴史","opinion"],"content":"ppCacheから始まったService Workerが、ページに依存しない生存期間へ変化していき、fetch以外のイベントもハンドリングできる基盤となっていった変遷について。\n\n\n----\n","relatedLinks":[]},{"category":"Article","title":"up: Vue.js State Management Libraries ← Alligator.io\n[alliga","url":"https://alligator.io/vuejs/roundup-state-management-libraries/","tags":["JavaScript","Vue","library","article"],"content":"るステート管理ライブラリの比較。 特徴やメリット・デメリットについてそれぞれ書かれている\n\n\n----\n\n","relatedLinks":[]},{"category":"Article","title":"ed JavaScript ES2015 Template Strings with Tagged Templates | appendTo\n[appendt","url":"https://appendto.com/2017/02/advanced-javascript-es2015-template-strings-with-tagged-templates/","tags":["JavaScript","template","article"],"content":"plate Literalについての解説。 サンプルを用いながら、タグ関数の引数について解説してる\n\n\n----\n<h","relatedLinks":[]},{"category":"SlideVideo","title":"sive Transpilation at Netflix and the road to running native ES2015 in production // Speaker Deck\n[speakerd","url":"https://speakerdeck.com/betaorbust/progressive-transpilation-at-netflix-and-the-road-to-running-native-es2015-in-production","tags":["JavaScript","slide","ECMAScript","browser"],"content":"ザ別にTranspileしたJavaScriptを配信するためにやっていることについて。\nモダンなブラウザはES2015に対応しているため、変換やpolyfillなどの分として20-40％程度payloadが小さくできる。\n一方、圧縮ツールやES2015対応してるかの判定方法などの問題について\n\n\n----\n\n##","relatedLinks":[]},{"category":"SlideVideo","title":"s\n[avacasts.","url":"http://avacasts.com/","tags":["JavaScript","testing","video"],"content":"ンキャスト\n\n\n----\n<h1 ","relatedLinks":[]},{"category":"WebsiteDocument","title":"snap-shot: Jest-like snapshot feature for the rest of us, works magically by finding the right caller function\n[github.com","url":"https://github.com/bahmutov/snap-shot","tags":["JavaScript","React","library","testing"],"content":"hotテストを行うテストライブラリ\n\n\n----\n\n## M","relatedLinks":[]},{"category":"WebsiteDocument","title":"[yomguithere","url":"https://yomguithereal.github.io/mnemonist/","tags":["JavaScript","library"],"content":"avaScriptライブラリ。\nQueue、Trie、Linked List、Bloom Filterなど\n\n\n----\n<h1 cl","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vet: A simple CLI tool for vetting npm package versions\n[github.com/h","url":"https://github.com/harksys/npmvet","tags":["JavaScript","node.js","Tools","console","npm"],"content":"`node_modules`にインストールされているパッケージのバージョンを比較/ロックされているかをチェック出来るツール。\n手元と毎回新規インストールされるCIにおけるバージョンを揃えるのが目的\n\n- [NPM Vet, a","relatedLinks":[{"title":"NPM Vet, a simple CLI tool for checking npm package versions - Hark.","url":"https://harksys.com/labs/npm-vet-a-simple-cli-tool-for-checking-npm-package-versions/"},{"title":"mgol/check-dependencies: Checks if currently installed npm dependencies are installed in the exact same versions that are specified in package.json","url":"https://github.com/mgol/check-dependencies"}]},{"category":"SoftwareLibrary","title":"stics\n[simplestatist","url":"http://simplestatistics.org/","tags":["JavaScript","統計","library"],"content":"JavaScriptライブラリ\n\n\n----\n\n## abra","relatedLinks":[]},{"category":"SoftwareLibrary","title":"esh/npm-module-stats: Get recursive file size and dependencies of any NPM module without installing the module\n[github.com/abr","url":"https://github.com/abrahamjagadeesh/npm-module-stats","tags":["npm","Tools","library"],"content":"pmモジュールのファイルサイズを一覧できるツール\n\n\n----\n\n## david","relatedLinks":[]}]},{"meta":{"title":"2017-02-20のJS: Babel 6.23.0、React Context、HTMLリファレンス","author":"azu","layout":"post","date":"2017-02-20T00:31:04.561Z","category":"JSer","tags":["Babel","React","HTML"],"url":"https://jser.info/2017/02/20/babel-6.23.0-react-context-html/"},"items":[{"category":"Headline","title":"6.23.0 Released · Babel","url":"https://babeljs.io/blog/2017/02/13/6.23.0","tags":["babel","ReleaseNote"],"content":"abel 6.23.0リリース。\n`transform-es2015-block-scoping`に`throwIfClosureRequired`オプションの追加、`babel-preset-flow`の追加。\nReactの最適化プラグインのバグ修正、`babel-traverse`に隣接Nodeを取得するAPIの追加など\n","relatedLinks":[]},{"category":"Headline","title":"# Release v0.39.0 · facebook/flow\n","url":"https://github.com/facebook/flow/releases/tag/v0.39.0","tags":["flowtype","ReleaseNote"],"content":"ow v0.39.0リリース。\n`--no-suppressions`のサポート、typeをJSON printできる`$Flow$DebugPrint` typeの追加など\n\n","relatedLinks":[]},{"category":"Headline","title":" Release Safari IndexedDB support! · localForage/localForage\n[","url":"https://github.com/localForage/localForage/releases/tag/1.5.0","tags":["JavaScript","library","ReleaseNote"],"content":"alForage 1.5.0リリース。\nSafari 10.1からはIndexedDBを使うように変更された。\n\n\n","relatedLinks":[]},{"category":"Article","title":"node の security checkをするなら nsp が便利 - from scratch\n[y","url":"http://yosuke-furukawa.hatenablog.com/entry/2017/02/14/113910","tags":["node.js","security","Tools"],"content":"クトに依存しているモジュールに脆弱性がないかをチェックするツール\nNode Security Platformに公開されている脆弱性を元にチェックする\n\n\n-","relatedLinks":[]},{"category":"Article","title":"ative ECMAScript modules: dynamic import()\n[bl","url":"https://blog.hospodarets.com/native-ecmascript-modules-dynamic-import","tags":["ECMAScript","JavaScript","browser"],"content":"ic `import()` Proposalについての解説。\n`import()`はPromiseベースのAPIである点について、`import()`のfeature detectとpolyfill、Babelやwebpack 2での利用方法など\n\n---","relatedLinks":[]},{"category":"Article","title":"eed up Service Worker with Navigation Preloads  |  Web  |  Google Developers\n[dev","url":"https://developers.google.com/web/updates/2017/02/navigation-preload","tags":["ServiceWorker","Chrome"],"content":" 57からOrigin-Trialで試験的に使える ServiceWorkerのnavigation preloadについて。\n今まではServiceWorkerが起動してからリクエストが開始されていたため、起動時間がボトルネックとなるケースがあった。\nServiceWorkerをパラレルに扱うことができ、preloadされているリクエストを取得できるAPIについて\n\n- [O","relatedLinks":[{"title":"OriginTrials/developer-guide.md at gh-pages · jpchase/OriginTrials","url":"https://github.com/jpchase/OriginTrials/blob/gh-pages/developer-guide.md"}]},{"category":"Article","title":"text in ReactJS Applications\n[java","url":"http://javascriptplayground.com/blog/2017/02/context-in-reactjs-applications/","tags":["React","tutorial"],"content":"ontextがどのように動いているかの解説。Contextのメリットとデメリットについて。\nContextの値の流れ、テストの難しさ、ライブラリでの利用について\n\n\n----","relatedLinks":[]},{"category":"Article","title":"fill のあり方と Web の進化と協調するためのガイドライン | blog.jxck.io\n[blog.","url":"https://blog.jxck.io/entries/2017-02-17/polyfill-implementation-guideline.html","tags":["polyfill","JavaScript","WebPlatformAPI"],"content":"の役割と、早すぎたpolyfillの実装は仕様変更を難しくするSpeculative Polyfillの問題について。\n間違ったpolyfillの実装、別名での回避事例、\npolyfillを実装するタイミングなどついて書かれてたW3C TAGのドキュメントについて。\n\n- [Pol","relatedLinks":[{"title":"Polyfills and the evolution of the Web","url":"https://w3ctag.github.io/polyfills/"}]},{"category":"Article","title":"書き方 from JavaScript - Qiita\n[qiita.","url":"http://qiita.com/mrasu/items/92971c09b6190fdfd45e","tags":["i18n","JavaScript","library","article"],"content":"リがどのような事をしているのかや、言語による違いにはどのようなものがあるかについて。\nいくつかのi18nライブラリを例に多言語化のやり方について解説されている記事\n\n\n----\n\n","relatedLinks":[]},{"category":"Article","title":"aScript Engine: High-performance ES2015 and beyond\n[v8proje","url":"https://v8project.blogspot.com/2017/02/high-performance-es2015-and-beyond.html","tags":["ECMAScript","JavaScript","V8","article"],"content":"のパフォーマンス改善の取り組みについて。 Babelで変換されたコードサイズの問題やES5で同等の事を行う時の速度の違いについてなど\n\n\n----\n<h","relatedLinks":[]},{"category":"WebsiteDocument","title":" Tutorial | HTML & CSS Is Hard\n[internet","url":"https://internetingishard.com/html-and-css/flexbox/","tags":["CSS"],"content":"の解説。\nFlexboxのそれぞれのプロパティについてどのようなレイアウトを実現できるかについて書かれてる。\n\n\n----\n\n##","relatedLinks":[]},{"category":"WebsiteDocument","title":"pt 日本語ハンドブック | js STUDIO\n[js.studio","url":"http://js.studio-kingdom.com/typescript/","tags":["TypeScript","翻訳","document"],"content":"ドブックの翻訳\n\n\n----\n\n## ","relatedLinks":[]},{"category":"WebsiteDocument","title":"rence - A free guide to all HTML elements and attributes.\n[htmlrefere","url":"http://htmlreference.io/","tags":["HTML","リファレンス"],"content":"サイト。\nそれぞれのタグごとに動作するサンプルがあり、block/inline/self-closing/metaで大きく分類されている。\n\n\n----\n\n## O","relatedLinks":[]},{"category":"WebsiteDocument","title":" the front end for the browser\n[hackernoon.","url":"https://hackernoon.com/optimising-the-front-end-for-the-browser-f2f51a29c572","tags":["browser","performance"],"content":"についての記事。\nHTMLの取得、ネットワーク、DOM、CSSOM、JavaScriptの処理。\nまたこれらの処理の最適化やそのメリットについて\n\n\n----\n<h1 cl","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Born to build better enterprise frameworks and apps with Node.js & koa\n[github.com/e","url":"https://github.com/eggjs/egg","tags":["node.js","JavaScript","library"],"content":"レームワーク。\nconvention over configurationを重視したフレームワーク\n\n\n----\n\n## Rou","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ughjs.com/]","url":"https://roughjs.com/","tags":["JavaScript","canvas","SVG","library"],"content":"vasライブラリ。\nSVG pathも手描き風に描画することができる。\n\n\n----\n\n## tunn","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ibon: :1st\\_place\\_medal: Functional client-side router in ~570 bytes, built on HTML5 History API.\n[github.com/tun","url":"https://github.com/tunnckoCore/gibon","tags":["JavaScript","library"],"content":"--\n\n## Jianru","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bda-view: A New Tool for Reading JavaScript Code\n[github.com/Jian","url":"https://github.com/Jianru-Lin/lambda-view","tags":["JavaScript","Tools"],"content":"に読むことを支援するビューアツール。\nスコープ単位でコードを展開して見ていくことができる\n\n----\n<h1 class=\"","relatedLinks":[]},{"category":"Book","title":"iven Development, 2nd Edition - O'Reilly Media\n[shop.oreilly.com","url":"http://shop.oreilly.com/product/9781786465474.do","tags":["AngularJS","book","testing"],"content":"-\n","relatedLinks":[]}]},{"meta":{"title":"2017-02-25のJS: Node v7.6.0、CoffeeScript 2.0α、Vue v2.2.0","author":"azu","layout":"post","date":"2017-02-27T12:16:03.956Z","category":"JSer","tags":["Node.js","CoffeeScript","Vue"],"url":"https://jser.info/2017/02/27/node-v7.6.0-coffeescript-2.0a-vue-v2.2.0/"},"items":[{"category":"Headline","title":"🃏 Jest 19: Immersive Watch Mode & Test Platform Improvements · Jest","url":"https://facebook.github.io/jest/blog/2017/02/21/jest-19-immersive-watch-mode-test-platform-improvements.html","tags":["JavaScript","testing","ReleaseNote"],"content":"est 19プレリリース。\nWatchモードの改善、Snapshotテストで`test`prefixが不要に。\n`expect.stringContaining()`と` expect.toMatchObject()`のサポート。\n`eslint-plugin-jest`は公式プラグイン、設定をチェックできる`jest-validate`の公開\n","relatedLinks":[]},{"category":"Headline","title":"# Release v1.5.0 · karma-runner/karma\n","url":"https://github.com/karma-runner/karma/releases/tag/v1.5.0","tags":["JavaScript","testing","ReleaseNote"],"content":"rma v1.5.0リリース。\nテストをクライアントと同じ`window`で実行する`runInParent`オプションとクライアントページのHTMLを指定できる`customClientContextFile`オプションの追加など\n\n","relatedLinks":[]},{"category":"Headline","title":" Node v7.6.0 (Current) | Node.js\n[","url":"https://nodejs.org/en/blog/release/v7.6.0/","tags":["node.js","ReleaseNote"],"content":"e v7.6.0リリース。\nV8 5.5にアップデートされasync/awaitのサポート、`url.format`がWHATWG URLをサポートするようになるなど\n\n-","relatedLinks":[{"title":"V8 JavaScript Engine: V8 Release 5.5","url":"https://v8project.blogspot.jp/2016/10/v8-release-55.html"},{"title":"node/CHANGELOG","url":"https://github.com/nodejs/node/blob/v7.6.0/doc/changelogs/CHANGELOG_V7.md#7.6.0"}]},{"category":"Headline","title":"Progress as of February 2017: 2.0.0-alpha1! · Issue #71 · coffeescript6/discuss\n[g","url":"https://github.com/coffeescript6/discuss/issues/71","tags":["CoffeeScript","ReleaseNote","issue"],"content":"eeScript 2.0.0-alpha1リリース。\nES2015+に準拠した変更を取り入れていっているバージョンであるため、既存のものとは非互換な部分がある。\n`class`や`=>`がES2015と同等に、\nsplatsはspreadへコンパイルされるように、Tagged Template literal、async/await、`for...of`のサポートなど\n\n- ","relatedLinks":[{"title":"CoffeeScript","url":"https://rawgit.com/jashkenas/coffeescript/2/docs/v2/index.html#breaking-changes"}]},{"category":"Headline","title":"nnouncing TypeScript 2.2 | TypeScript\n[bl","url":"https://blogs.msdn.microsoft.com/typescript/2017/02/22/announcing-typescript-2-2/","tags":["TypeScript","ReleaseNote"],"content":"cript 2.2リリース。\nlanguage serviceの改善、`object` typeの追加、string index、mixin class、`new.target`のサポートなど\n\n- [","relatedLinks":[{"title":"Roadmap · Microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/Roadmap#22-february-2017"},{"title":"Breaking Changes · Microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/Breaking-Changes#typescript-22"},{"title":"TypeScript 2.2.1 変更点 - Qiita","url":"http://qiita.com/vvakame/items/eb6c054360868b88f9b1"},{"title":"TypeScript 2.2: The object Type | Marius Schulz","url":"https://blog.mariusschulz.com/2017/02/24/typescript-2-2-the-object-type"}]},{"category":"Headline","title":"lease Notes for Safari Technology Preview 24 | WebKit\n[web","url":"https://webkit.org/blog/7423/release-notes-for-safari-technology-preview-24/","tags":["safari","ReleaseNote"],"content":" Technology Preview Release 24リリース。\n`PerformanceObserver`、`<link preload>`の試験的サポート、`URL`オブジェクトに`toJSON()`の実装、dynamic `import()`のサポートなど\n\n\n---","relatedLinks":[]},{"category":"Headline","title":"AScript 2016+ in Firefox | JavaScript\n[blog","url":"https://blog.mozilla.org/javascript/2017/02/22/ecmascript-2016plus-in-firefox/","tags":["firefox","ECMAScript","JavaScript"],"content":" Nightly 54 でES2016+ Compat tableが100％実装されたとのこと。\nES2016の`**`や`Array#include`などの追加やGenerator Constructorの仕様変更の追従、ES2017の実装について\n\n\n----","relatedLinks":[]},{"category":"Headline","title":"ase v4.4.0 · npm/npm\n[githu","url":"https://github.com/npm/npm/releases/tag/v4.4.0","tags":["npm","ReleaseNote"],"content":"0公開。\n起動時に最新のnpmがあるかを通知するように、`npm run-script`のエラーメッセージが短くなるようになるなど\n\n\n----\n","relatedLinks":[]},{"category":"Headline","title":"se v6.16.0 · babel/babylon\n[github","url":"https://github.com/babel/babylon/releases/tag/v6.16.0","tags":["JavaScript","babel","AST","ReleaseNote"],"content":".16.0リリース。\nESTree互換モードを提供するプラグインの追加、Flowでpritimitive typeを上書する問題を修正するなど\n\n\n----\n\n","relatedLinks":[]},{"category":"Headline","title":"e v0.40.0 · facebook/flow\n[github.","url":"https://github.com/facebook/flow/releases/tag/v0.40.0","tags":["flowtype","ReleaseNote"],"content":".0リリース。\n`this`や`super`をデフォルト引数に利用できるように、built-in libraryの更新、union type周りの最適化など\n\n\n----\n\n#","relatedLinks":[]},{"category":"Headline","title":"/CHANGELOG.md at 4.0.0-rc.1 · angular/angular\n[github.c","url":"https://github.com/angular/angular/blob/4.0.0-rc.1/CHANGELOG.md","tags":["AngularJS","ReleaseNote"],"content":".0 RC1リリース。\nAOTコンパイルしたViewのコード量を削減、コードベースがTypeScript 2.1ベースでStrictNullChecksが有効化された。\nあわせてAngularをサーバサイドでも動かせるUniversalも更新されるなど\n\n- [angula","relatedLinks":[{"title":"angular/RELEASE","url":"https://github.com/angular/angular/blob/master/docs/RELEASE_SCHEDULE.md"}]},{"category":"Headline","title":"v2.2.0 · vuejs/vue\n[github.co","url":"https://github.com/vuejs/vue/releases/tag/v2.2.0","tags":["JavaScript","library","ReleaseNote"],"content":"0リリース。\nテンプレートで閉じタグがない場合にエラーを投げるように、PropsやComputedプロパティはインスタンスではなくprototypeへ定義されるように。\nサーバサイドレンダリング向けに`template`オプションの追加、`errorHandler`や`renderError`でエラーがキャッチできるように。\nReact Context的な値を差し込める`provide`と`inject`のDI機構の追加など\n\n\n----\n<h1 ","relatedLinks":[]},{"category":"Article","title":"set-env: a preset that configures Babel for you\n[www.2ality","url":"http://www.2ality.com/2017/02/babel-preset-env.html","tags":["JavaScript","babel","browser"],"content":"文でサポートブラウザやNode.jsのバージョンなどのターゲットを指定して、その設定を元にBabelの変換やpolyfillを展開してくれるbabel-preset-envについて\n\n\n----\n\n## R","relatedLinks":[]},{"category":"Article","title":"ybook: Develop Beautiful User Interfaces with Ease\n[www.sitepoi","url":"https://www.sitepoint.com/react-storybook-develop-beautiful-user-interfaces-with-ease/","tags":["React","testing"],"content":"助ツールであるReact StoryBookについて。\n`getstorybook`を使ってのセットアップや使い方、Storyの書き方、カスタマイズ方法、デバッグ、自動テストについて\n\n- [mthuret/s","relatedLinks":[{"title":"mthuret/storybook-addon-specifications: Write tests next to your stories and display their results inside storybook interface","url":"https://github.com/mthuret/storybook-addon-specifications"}]},{"category":"Article","title":"Errors and Stack Traces in Depth\n[lucasfcosta.","url":"http://lucasfcosta.com/2017/02/17/JavaScript-Errors-and-Stack-Traces.html","tags":["JavaScript","article","testing"],"content":"トレースをどうやって操作するかという話。\nChaiにおける`Error.captureStackTrace`を使ったスタックトレース操作を例にしている。\nスタックトレースはどのようにできているか、`Error.captureStackTrace`の使い方について\n\n\n----\n\n## Rea","relatedLinks":[]},{"category":"Article","title":"Real World Examples 〜先人から学ぶReact Reduxの知恵〜\n[blog.tai2.net","url":"http://blog.tai2.net/real-world-redux.html","tags":["redux","React","article"],"content":"例を元に、そのアプリのStoreやComponentがどのような構成になっているかを紐解いていった記事\n\n\n----\n\n## Vend","relatedLinks":[]},{"category":"Article","title":"de splitting in webpack 2 – Medium\n[medium.com/@ad","url":"https://medium.com/@adamrackis/vendor-and-code-splitting-in-webpack-2-6376358f1923","tags":["webpack","article"],"content":"ついて。\n`import()`での動的ロードと分割、BundleAnalyzerPluginでの分析、CommonsChunkでの分割\n\n\n----\n\n## 逆引き！フ","relatedLinks":[]},{"category":"Article","title":"ドキパフォーマンス改善 - 青空コメントアウト\n[www.aocomme.com","url":"http://www.aocomme.com/entry/2017/01/18/185753","tags":["browser","performance","article","WebPlatformAPI"],"content":"を考慮したAPIや先読みについて。\n`will-change`、CSS Containment、`requestIdleCallback`、Passive EventListener、`<link rel=preload>`についての紹介\n\n\n----\n<h1 class=","relatedLinks":[]},{"category":"SoftwareLibrary","title":" Node.js test framework\n[github.com/light","url":"https://github.com/lighterio/exam","tags":["JavaScript","node.js","testing","library"],"content":"escribe`や`it`とベンチマーク向けの`bench`、assertionとして`is`、モックを行う`mock`など持つJavaScriptのテストフレームワーク。\nマルチプロセスでテストを実行できるオプションを持っている\n\n\n----\n\n## niieani","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pt-vs-flowtype: Differences between Flowtype and TypeScript 2.1 -- syntax and usability\n[github.com/niiean","url":"https://github.com/niieani/typescript-vs-flowtype","tags":["TypeScript","flowtype"],"content":"比較。\nシンタックスや型定義、それぞれ異なる部分についてなどをまとめたもの\n\n\n----\n\n## developi","relatedLinks":[]},{"category":"SoftwareLibrary","title":": Bare minimum fetch polyfill in 500 bytes.\n[github.com/develop","url":"https://github.com/developit/unfetch","tags":["JavaScript","Fetch","library"],"content":"ブラリ。\n\n\n----\n\n## debitoor/","relatedLinks":[]},{"category":"SoftwareLibrary","title":"immutable: Immutable version of dot-prop with some extensions\n[github.com/debitoor","url":"https://github.com/debitoor/dot-prop-immutable","tags":["JavaScript","library"],"content":"te操作を行うシンプルなライブラリ\n\n\n----\n<h1 class=\"sit","relatedLinks":[]},{"category":"Book","title":"ript for Web Developers: Matt Frisbie: 9781119366447: Amazon.com: Books\n[www.amazon.com/Profe","url":"https://www.amazon.com/Professional-JavaScript-Developers-Matt-Frisbie/dp/1119366445","tags":["JavaScript","book"],"content":"al JavaScript for Web Developersの4版\n\n\n----\n\n## Security an","relatedLinks":[]},{"category":"Book","title":"d Performance - O'Reilly Media\n[www.oreilly.com/webop","url":"http://www.oreilly.com/webops-perf/free/security-and-frontend-performance.csp","tags":["browser","security","performance","book"],"content":"スとセキュリティについての無料の書籍。\nHSTS、CSP/script要素/iframe、リファラポリシー、link要素、難読化、ServiceWorker、メトリクスなど\n\n\n----\n\n## O'Reilly Jap","relatedLinks":[]},{"category":"Book","title":"tビギナーズガイド\n[www.oreilly.co.jp/book","url":"http://www.oreilly.co.jp/books/9784873117881/","tags":["React","book"],"content":" Runningの翻訳本\n\n\n----\n\n## はじめてのCSS設計 フロ","relatedLinks":[]},{"category":"Book","title":"アが教えるメンテナブルなCSS設計手法 | 田辺 丈士, 大江 遼, 藤岡 龍太, 安 光太郎, 株式会社アイ・エム・ジェイ |本 | 通販 | Amazon\n[www.amazon.co.jp/%E3%81","url":"https://www.amazon.co.jp/%E3%81%AF%E3%81%98%E3%82%81%E3%81%A6%E3%81%AECSS%E8%A8%AD%E8%A8%88-%E3%83%95%E3%83%AD%E3%83%B3%E3%83%88%E3%82%A8%E3%83%B3%E3%83%89%E3%82%A8%E3%83%B3%E3%82%B8%E3%83%8B%E3%82%A2%E3%81%8C%E6%95%99%E3%81%88%E3%82%8B%E3%83%A1%E3%83%B3%E3%83%86%E3%83%8A%E3%83%96%E3%83%AB%E3%81%AACSS%E8%A8%AD%E8%A8%88%E6%89%8B%E6%B3%95-%E7%94%B0%E8%BE%BA-%E4%B8%88%E5%A3%AB/dp/4798143154","tags":["CSS","book"],"content":"\n\n\n----\n","relatedLinks":[]}]},{"meta":{"title":"2017-03-07のJS: Marko 4.0、CoffeeScript+ReactからJavaScriptへ","author":"azu","layout":"post","date":"2017-03-07T01:11:32.227Z","category":"JSer","tags":["template","CoffeeScript","React"],"url":"https://jser.info/2017/03/07/marko-4.0-coffeescript-react-javascript/"},"items":[{"category":"Headline","title":"Release v3.5.0 · petkaantonov/bluebird","url":"https://github.com/petkaantonov/bluebird/releases/tag/v3.5.0","tags":["JavaScript","Promises","library","ReleaseNote"],"content":"luebird v3.5.0リリース。\ncatch時に処理を行いエラー自体はそのまま次のcatchへ渡す`.tapCatch`の追加など\n","relatedLinks":[{"title":"add tapError by benjamingr · Pull Request #1220 · petkaantonov/bluebird","url":"https://github.com/petkaantonov/bluebird/pull/1220"},{"title":".tapCatch | bluebird","url":"http://bluebirdjs.com/docs/api/tapcatch.html"}]},{"category":"Headline","title":"# Marko 4.0 is here 🚀 🎉 – Medium\n","url":"https://medium.com/@mlrawlings/marko-4-0-is-here-837884c5f60d","tags":["JavaScript","template","library","ReleaseNote","VirtualDOM"],"content":"rko 4.0リリース。\nコンポーネントベースのUIライブラリ(テンプレート)で、クライアントとサーバのそれぞれのモードを持っているため、サーバサイドレンダリングが高速。\n\n","relatedLinks":[{"title":"Server-side Rendering Shootout with Marko, Preact, Rax, React and Vue","url":"https://hackernoon.com/server-side-rendering-shootout-with-marko-preact-rax-react-and-vue-25e1ae17800f#.6r2g5rwgk"}]},{"category":"Headline","title":" Node.js - Quality with Speed | Node.js\n[","url":"https://nodejs.org/en/blog/community/quality-with-speed/","tags":["node.js","opinion"],"content":"e.jsの開発プロセスやリリースサイクル、またそれらを支えるテスト基盤について。\n\n\n","relatedLinks":[]},{"category":"Headline","title":"ESLint v3.17.0 released - ESLint - Pluggable JavaScript linter\n[e","url":"http://eslint.org/blog/2017/03/eslint-v3.17.0-released","tags":["ESLint","ReleaseNote"],"content":"nt 3.17.0リリース。\nルール開発者向けの機能追加、`no-compare-neg-zero`と`nonblock-statement-body-position`のルールを追加など\n\n- ","relatedLinks":[{"title":"ESLint v3.17.0 - Qiita","url":"http://qiita.com/mysticatea/items/a2d72c76671c2197c712"}]},{"category":"Headline","title":"elease v0.22.0 · yarnpkg/yarn\n[gi","url":"https://github.com/yarnpkg/yarn/releases/tag/v0.22.0","tags":["npm","node.js","Tools","ReleaseNote"],"content":"0.22.0 プレリリース。\n`--non-interactive`のオプションを追加、`v8-compile-cache`を利用し起動速度を改善、Docker image(`yarnpkg/node-yarn`)の追加など\n\n- [","relatedLinks":[{"title":"zertosh/v8-compile-cache: Require hook for automatic V8 compile cache persistence","url":"https://github.com/zertosh/v8-compile-cache"}]},{"category":"Headline","title":"rtosh/v8-compile-cache: Require hook for automatic V8 compile cache persistence\n[git","url":"https://github.com/zertosh/v8-compile-cache","tags":["V8","node.js","library"],"content":"5.7.0から導入されたV8のcode cacheを保持するrequire hookを提供するライブラリ。\nyarnやnuclideなどの起動速度改善に使われてる\n\n\n---","relatedLinks":[]},{"category":"Article","title":"ら始めるJavaScript入門 ： DESIGNMAP\n[desi","url":"http://designmap.info/category/lecture/javascript-introduction/","tags":["ECMAScript","tutorial","JavaScript"],"content":"ースにしたJavaScript入門チュートリアル\n\n\n----","relatedLinks":[]},{"category":"Article","title":"ep-By-Step Guide for Building Master-Detail User Interfaces with AngularTelerik Developer Network\n[devel","url":"http://developer.telerik.com/content-types/tutorials/step-step-guide-building-master-detail-user-interfaces-angular/","tags":["AngularJS","JavaScript","tutorial"],"content":"よくあるリストビューと詳細ビューからなるアプリを作るチュートリアル\n\n\n----\n","relatedLinks":[]},{"category":"Article","title":"rogressive Web Apps）の現状とその開発方法 | フロントエンドBlog | ミツエーリンクス\n[www.mi","url":"https://www.mitsue.co.jp/knowledge/blog/frontend/201702/23_2217.html","tags":["ProgressiveWebApp","article"],"content":"てまとめられた記事。\nGoogleによるケーススタディや開発方法について\n\n\n----\n\n","relatedLinks":[]},{"category":"Article","title":"ript void Keyword\n[cmichel","url":"http://cmichel.io/javascript-void-keyword/","tags":["JavaScript","article"],"content":"の`void`キーワードについて。\n`if(condition) { return void console.log(\"\"); }`のようなケースで利用できるという話。\n\n\n----\n\n#","relatedLinks":[]},{"category":"Article","title":" Blog - Converting a large React Codebase from Coffeescript to ES6\n[blog.bug","url":"http://blog.bugsnag.com/converting-a-large-react-codebase-from-coffeescript-to-es6/","tags":["CoffeeScript","JavaScript","React","article"],"content":"t(cjsx)からJavaScriptへのマイグレーションについての記事。\ndecaffeinateはcjsxをサポートしていないため、`React.createElement`ベースのJSに変換し、react codemod toolでJSXに再変換する。\n変換したコードベースを`prettier`で整形し、`eslint`で細かいところを直す。\nそれらをまとめた`Depercolator`というツールを作った話\n\n- [jsdf/c","relatedLinks":[{"title":"jsdf/coffee-react-transform: DEPRECATED – Provides React JSX support for Coffeescript","url":"https://github.com/jsdf/coffee-react-transform"},{"title":"reactjs/react-codemod: React codemod scripts","url":"https://github.com/reactjs/react-codemod#create-element-to-jsx"},{"title":"bugsnag/depercolator: Tool for converting coffeescript to idiomatic javascript and JSX","url":"https://github.com/bugsnag/depercolator"}]},{"category":"Article","title":"nd the Scenes (February Edition feat. A tale of TurboFan) | Benedikt Meurer\n[benediktm","url":"http://benediktmeurer.de/2017/03/01/v8-behind-the-scenes-february-edition/","tags":["V8","JavaScript","article"],"content":"Fanプロジェクトの歴史について。\n2013年から開始したプロジェクトで、Crankshaftはfast pathにフォーカスしていたが、TurboFanはslow pathにもフォーカスしているという話。\nV8において予測できないパフォーマンス問題を作っていたFunction#bindやPromiseの話。\nTurboFanのアーキテクチャについての解説など\n\n\n----\n\n## ","relatedLinks":[]},{"category":"Article","title":"pentype.js: Read and write OpenType fonts using JavaScript.\n[github.com","url":"https://github.com/nodebox/opentype.js","tags":["JavaScript","fonts","library"],"content":"読み書きを行うライブラリ\n\n\n----\n\n## H","relatedLinks":[]},{"category":"Article","title":"imize CPU-Intensive Work in Node.js – Medium\n[medium.com/","url":"https://medium.com/@graeme_boy/how-to-optimize-cpu-intensive-work-in-node-js-cdc09099ed41","tags":["node.js","tutorial","article"],"content":"ドなプログラムを別プロセスで処理する方法について。\n`child_process`の扱い方について書かれた記事\n\n\n----\n\n## A ","relatedLinks":[]},{"category":"Article","title":"=preload Analysis From the Chrome Data Saver Team – reloading – Medium\n[medium.com/r","url":"https://medium.com/reloading/a-link-rel-preload-analysis-from-the-chrome-data-saver-team-5edf54b08715","tags":["browser","Chrome","HTTP2","article"],"content":"reload`がどのように動いているのかの解説記事。\nクリティカルリソースを宣言的に先読みするもので、優先度については仕様では未定義。\nChromeにおけるpreloadの優先度やpreloadとasync属性の違いなどについて\n\n\n----\n\n## A D","relatedLinks":[]},{"category":"Article","title":"ntroduction To Webpack – Smashing Magazine\n[www.smashingm","url":"https://www.smashingmagazine.com/2017/02/a-detailed-introduction-to-webpack/","tags":["webpack","tutorial"],"content":"リアル。\nloader、動的ロード、コード分割について\n\n\n----\n<h1 clas","relatedLinks":[]},{"category":"WebsiteDocument","title":"Snyk's public vulnerability database\n[github.com/sny","url":"https://github.com/snyk/vulndb","tags":["security","npm","webservice"],"content":"mの脆弱性についてを集めたデータベース。\n\n- [VulnDB | Sny","relatedLinks":[{"title":"VulnDB | Snyk","url":"https://snyk.io/vuln"}]},{"category":"SoftwareLibrary","title":"modern load testing toolkit\n[artillery.io/](","url":"https://artillery.io/","tags":["testing","performance","HTTP"],"content":"テストを行うことができるツール。\nシナリオを元にしたテストもできる。\n\n\n----\n\n## typico","relatedLinks":[]},{"category":"SoftwareLibrary","title":": Prevents publishing a module with bad paths\n[github.com/typic","url":"https://github.com/typicode/pkg-ok","tags":["npm","Tools","console"],"content":"`と`bin`が正しいかをチェックするツール。\n\n- [maxogden/depen","relatedLinks":[{"title":"maxogden/dependency-check: checks which modules you have used in your code and then makes sure they are listed as dependencies in your package.json","url":"https://github.com/maxogden/dependency-check"}]},{"category":"SoftwareLibrary","title":"c: Use JSDoc to represent Flow annotations\n[github.com/Kegsay","url":"https://github.com/Kegsay/flow-jsdoc","tags":["JSDoc","flowtype","Tools"],"content":"テーションへ変換するツール\n\n\n----\n","relatedLinks":[]}]},{"meta":{"title":"2017-03-14のJS: Firefox 52.0、Polymer 2.0 RC、コンポーネントのリファクタリング戦略","author":"azu","layout":"post","date":"2017-03-14T00:40:19.564Z","category":"JSer","tags":["Firefox","Polymer","React","Component","refactoring"],"url":"https://jser.info/2017/03/14/firefox-52.0-polymer-2.0-rc-component-refactoring/"},"items":[{"category":"Headline","title":"Release Notes for Safari Technology Preview 25 | WebKit","url":"https://webkit.org/blog/7432/release-notes-for-safari-technology-preview-25/","tags":["safari","ReleaseNote"],"content":"afari Technology Preview Release 25リリース。\n","relatedLinks":[]},{"category":"Headline","title":"# Apollo Client 1.0 is coming\n","url":"https://dev-blog.apollodata.com/apollo-client-1-0-is-coming-23b74b13fbbb","tags":["GraphQL","library","ReleaseNote"],"content":"aphQLクライアントのApollo Client 1.0リリース\n\n","relatedLinks":[]},{"category":"Headline","title":" Firefox 52.0 リリースノート\n[","url":"https://www.mozilla.jp/firefox/52.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"efox 52.0リリース。\nwasmのデフォルト有効化、CSS Gridのサポート、`rel=\"noopener\"`のサポート、async/await、Unicode code pointを識別子として利用できるようになるなど\n\n-","relatedLinks":[{"title":"Firefox 52 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/52"},{"title":"Firefox 52 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/versions/52/"},{"title":"Firefox 52 が正式リリース、WebAssembly、CSS Grid Layout の実装、レスポンシブデザインモードの拡充など盛りだくさん | WWW WATCH","url":"https://hyper-text.org/archives/2017/03/firefox_52_release.shtml"}]},{"category":"Headline","title":"qunit/History.md at 2.2.0 · qunitjs/qunit\n[g","url":"https://github.com/qunitjs/qunit/blob/2.2.0/History.md","tags":["JavaScript","testing","library","ReleaseNote"],"content":"t 2.2.0リリース。\n1つ以上のテストがFailのときはPassし、Todoのみが残った時はFaillする`QUnit.todo`の追加、通った順序を記録し検証する`assert.step()`と`assert.verifySteps`を追加など\n\n\n-","relatedLinks":[]},{"category":"Headline","title":"elease Inferno 1.4.0 · infernojs/inferno\n[gi","url":"https://github.com/infernojs/inferno/releases/tag/1.4.0","tags":["JavaScript","library","ReleaseNote"],"content":"no v1.4.0リリース。\nSVGのサポートを修正、optimize-jsの対応など\n\n\n--","relatedLinks":[]},{"category":"Headline","title":"lcome 2.0 Release Candidate! - Polymer Project\n[www","url":"https://www.polymer-project.org/blog/2017-03-08-2-0-rc","tags":["JavaScript","WebComponents","library","ReleaseNote"],"content":"r 2.0.0 RCリリース。\nCustom Elements v1、Shadow DOM v1の仕様に追従した変更が含まれてる。\nES2015 classesの対応、ライフサイクルの変更、`is`属性サポートの廃止、データ変更検知の仕組みの変更など\n\n- [A","relatedLinks":[{"title":"About Polymer 2.0 - Polymer Project","url":"https://www.polymer-project.org/2.0/docs/about_20"},{"title":"Polymer 2.0 upgrade guide - Polymer Project","url":"https://www.polymer-project.org/2.0/docs/upgrade"}]},{"category":"Article","title":"oducing Almin 0.10.0: TypeScript, FlowType, Logger | Web Scratch\n[efcl","url":"http://efcl.info/2017/03/08/almim0.10/","tags":["JavaScript","library","ReleaseNote","TypeScript","flowtype"],"content":"ラリのAlmin 0.10.0リリース。\nコードベースをTypeScript化、FlowTypeのサポート改善、開発用のロガーの改善など\n\n- [Re","relatedLinks":[{"title":"Release 0.10.0 · almin/almin","url":"https://github.com/almin/almin/releases/tag/0.10.0"}]},{"category":"Article","title":"を使ったアーキテクチャについて - console.lealog();\n[lealo","url":"http://lealog.hateblo.jp/entry/2017/03/08/114017","tags":["JavaScript","library"],"content":"イブラリであるMobXについて。\n\n- [mob","relatedLinks":[{"title":"mobxjs/mobx: Simple, scalable state management.","url":"https://github.com/mobxjs/mobx"}]},{"category":"Article","title":"e ECMAScript modules: nomodule attribute for the migration\n[blog.h","url":"https://blog.hospodarets.com/native-ecmascript-modules-nomodule","tags":["JavaScript","ECMAScript","module","article"],"content":"`nomodule`属性について\nモジュールをサポートしてない環境でのみ実行されるscript要素で、fallbackを行う方法について\n\n\n----\n\n","relatedLinks":[]},{"category":"Article","title":"lete Guide to CSS Grid | Codrops CSS Reference\n[tympanu","url":"https://tympanus.net/codrops/css_reference/grid/","tags":["CSS","article"],"content":"いての詳しい解説\n\n\n----\n\n#","relatedLinks":[]},{"category":"Article","title":"Airbnb Search to React – Airbnb Engineering & Data Science – Medium\n[medium.c","url":"https://medium.com/airbnb-engineering/moving-airbnb-search-to-react-b85b815e166c","tags":["JavaScript","opinion","article"],"content":"chがTwitter’s FlightからReactに移行した話。\n何を指標にしてリファクタリングを行うかについて。\n内製のパフォーマンス計測し検証しながら移行するアプローチについて\n\n- [Experi","relatedLinks":[{"title":"Experiment Reporting Framework - Airbnb Engineering","url":"http://nerds.airbnb.com/experiment-reporting-framework/"}]},{"category":"Article","title":"ク指向の Web クライアントサイドプログラミング - Hatena Developer Blog\n[developer","url":"http://developer.hatenastaff.com/entry/2017/03/10/190229","tags":["JavaScript","DOM","設計","TypeScript"],"content":"ーンを使ったフレームワークを使わないアプリケーション設計について。\nView/Presenter/Modelに役割を分担したクラスを扱う方法について\n\n\n----\n\n## ","relatedLinks":[]},{"category":"Article","title":"ion to Web Audio API | CSS-Tricks\n[css-tricks","url":"https://css-tricks.com/introduction-web-audio-api/","tags":["audio","tutorial","web","article"],"content":"についてのチュートリアル。 どのようなAPI体系であるか、OscillatorNodeを使っての解説、Web Audio APIにおける時間の扱いなどについて\n\n\n----\n<h1 c","relatedLinks":[]},{"category":"SlideVideo","title":"ow Chrome Dev Tools Tricks - YouTube\n[www.youtube","url":"https://www.youtube.com/watch?v=xkzDaKwinA8","tags":["JavaScript","Chrome","debug","video"],"content":"てのスクリーンキャスト\n\n\n----\n\n## WA","relatedLinks":[]},{"category":"SlideVideo","title":"方と使い方を整理しよう\n[www.slidesha","url":"https://www.slideshare.net/nozomisawada969/waiaria-72900338","tags":["WAI-ARIA","accessibility","slide"],"content":"イド。\n`aria-*`属性、role属性の使い分けや意味合いについて。\nランドマーク、文書構造、ウィジェット、ライブ領域、tabindex属性などについて\n\n\n----\n\n## Ang","relatedLinks":[]},{"category":"SlideVideo","title":"ってくる！？ 新機能ダイジェスト\n[www.slideshar","url":"https://www.slideshare.net/masahikoasai/20160306-angular-4","tags":["AngularJS","slide"],"content":"フサイクルについてのスライド。\nAngular 2.xからsemverに準拠したアップデートとなり、4.xへのメジャーアップデートどのような点が変わるのかについて。\n機能追加やアップデート方法について\n\n\n----\n<h1 clas","relatedLinks":[]},{"category":"WebsiteDocument","title":"xible CSS Framework for building modern responsive web apps\n[www.getpoint.i","url":"http://www.getpoint.io/","tags":["CSS","library"],"content":"ーストなCSSフレームワーク\n\n\n----\n<h1 class","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ild browsers and browser like applications with HTML, CSS, and JavaScript\n[github.com/brav","url":"https://github.com/brave/muon","tags":["Electron","security"],"content":"k。\nChromiumのソースを直接使うように、Chrome extensionsのサポート、renderer processからNode.jsを完全に除去するのが目的\n\n\n----\n\n## hypera","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pp: 1kb JavaScript library for building frontend applications.\n[github.com/hyper","url":"https://github.com/hyperapp/hyperapp","tags":["JavaScript","DOM","library"],"content":"、Router、State管理をまとめて扱えるライブラリ\n\n\n----\n\n## staltz/","relatedLinks":[]},{"category":"SoftwareLibrary","title":"s-like: Assert that an HTML string looks approximately the same as another HTML\n[github.com/staltz","url":"https://github.com/staltz/html-looks-like","tags":["HTML","testing","library"],"content":"ストライブラリ。\n\n\n----\n\n## BafS/Gut","relatedLinks":[]},{"category":"SoftwareLibrary","title":"odern framework to print the web correctly.\n[github.com/BafS/Gu","url":"https://github.com/BafS/Gutenberg","tags":["CSS"],"content":"\n## Sazerac\n[","relatedLinks":[]},{"category":"SoftwareLibrary","title":".com/](htt","url":"http://sazeracjs.com/","tags":["JavaScript","testing","library"],"content":"ストライブラリ。\nJasmine、Jest、Mochaと一緒に動作する。\nデータごとのテストケースを作るような_パラメタライズドテスト_を行える。\n\n\n----\n<h1 class=\"sit","relatedLinks":[]},{"category":"Book","title":"～JavaScript/HTML/CSSでデスクトップアプリを作ろう：書籍案内｜技術評論社\n[gihyo.jp/book/2017/9","url":"http://gihyo.jp/book/2017/978-4-7741-8819-5","tags":["Electron","book"],"content":"いての書籍\n\n\n----\n","relatedLinks":[]}]},{"meta":{"title":"2017-03-19のJS: jQuery 3.2.0、Sinon.JS 2.0、testdouble.js 2.0、React/Redux/CRUD","author":"azu","layout":"post","date":"2017-03-19T11:36:53.197Z","category":"JSer","tags":["jQuery","testing","library","react","redux","CRUD"],"url":"https://jser.info/2017/03/19/jquery-3.2.0-sinon.js-2.0-testdouble.js-2.0-reactreduxcrud/"},"items":[{"category":"Headline","title":"Migrating to v2.0","url":"http://sinonjs.org/releases/v2.0.0/migrating-to-2.0/","tags":["JavaScript","testing","library","ReleaseNote"],"content":"inon.js 2.0リリース。\n`sinon.log`や`sinon.logError`は削除、`sinon.test`と`sinon.testCase`がコアから削除され別モジュールへ分離。\nInternalなメソッドが非推奨になるなど\n","relatedLinks":[{"title":"sinon/Changelog.txt at v2.0.0 · sinonjs/sinon","url":"https://github.com/sinonjs/sinon/blob/v2.0.0/Changelog.txt"}]},{"category":"Headline","title":"# jQuery 3.2.0 Is Out! | Official jQuery Blog\n","url":"https://blog.jquery.com/2017/03/16/jquery-3-2-0-is-out/","tags":["jQuery","ReleaseNote"],"content":"uery 3.2.0リリース。\n`$.css`がCSS Custom Propertyをサポート、transformされた要素の`.width()`、`.height()`の値がおかしい問題を修正、`<template>`要素をサポートなど\n\n","relatedLinks":[]},{"category":"Headline","title":" Release react-router@4.0.0: Publish · ReactTraining/react-router\n[","url":"https://github.com/ReactTraining/react-router/releases/tag/react-router%404.0.0","tags":["React","ReleaseNote","library"],"content":"ct Router 4.0.0リリース。\n書き直されたバージョンであり、既存のものとは互換性がないためマイグレーションガイドは用意されていない。\n\n-","relatedLinks":[{"title":"https://github.com/ReactTraining/react-router/tree/v4.0.0-beta.8#why-a-major-version-bump","url":"https://github.com/ReactTraining/react-router/tree/v4.0.0-beta.8#why-a-major-version-bump"},{"title":"Migration guide v3 -","url":"https://github.com/ReactTraining/react-router/issues/4738"},{"title":"v4 FAQ","url":"https://github.com/ReactTraining/react-router/tree/v4.0.0-beta.8#why-a-major-version-bump"},{"title":"react-router@v4対応したので雑に晒す - Qiita","url":"http://qiita.com/Jey/items/dae2074427547e63569b"}]},{"category":"Headline","title":"Release v0.42.0 · facebook/flow\n[g","url":"https://github.com/facebook/flow/releases/tag/v0.42.0","tags":["flowtype","ReleaseNote"],"content":" 0.42.0リリース。\nObject type spread `type TypeB = { ...TypeA }` の追加。`flow ide`コマンドの追加など\n\n\n-","relatedLinks":[]},{"category":"Headline","title":"SLint v3.18.0 released - ESLint - Pluggable JavaScript linter\n[es","url":"http://eslint.org/blog/2017/03/eslint-v3.18.0-released","tags":["ESLint","ReleaseNote"],"content":"t 3.18.0リリース。\nesqueryベースのASTセレクタに対応しルール内でセレクタを指定できるようになるなど\n\n- [","relatedLinks":[{"title":"estools/esquery: ECMAScript AST query library.","url":"https://github.com/estools/esquery"},{"title":"Selectors - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/docs/developer-guide/selectors"},{"title":"ESLint v3.18.0 - Qiita","url":"http://qiita.com/mysticatea/items/264e59b3d28e13b633df"}]},{"category":"Article","title":"sting Service Workers – Dev Channel – Medium\n[med","url":"https://medium.com/dev-channel/testing-service-workers-318d7b016b19","tags":["ServiceWorker","testing"],"content":"eWorkerのスクリプトに対するユニットテストについて。\nTests in SW、イベントのエミュレート、Push Eventのテストについてなど\n\n\n---","relatedLinks":[]},{"category":"Article","title":" Proxy をつかって堅牢なオブジェクトをつくるTips\n[aloe","url":"https://aloerina01.github.io/javascript/2017/03/14/1.html","tags":["JavaScript"],"content":"Proxyを使ったImmutableやSingletonなどを例にした、オブジェクトの拡張方法について。\nProxyのtrapやReflect APIについて\n\n\n----","relatedLinks":[]},{"category":"Article","title":"meでReactコンポーネントのテストを書こう - DMM.comラボエンジニアブログ\n[labot","url":"http://labotech.dmm.com/entry/2017/03/07/180449","tags":["React","testing","tutorial","article"],"content":"ったReactコンポーネントのテスト方法について\n\n\n----\n","relatedLinks":[]},{"category":"Article","title":"round Tabs in Chrome 57  |  Web  |  Google Developers\n[develo","url":"https://developers.google.com/web/updates/2017/03/background_tabs","tags":["Chrome"],"content":"クグラウンドタブにおける制限について。 \nChrome 57からは、timerやrequestAnimationFrameに加えて、budget-basedの制限が加わる。\nバックグラウンドにいるかはPage visibility APIで判定できる。 テスト時などは`--disable-background-timer-throttling`のフラグで無効化できる。\n\n\n----\n\n","relatedLinks":[]},{"category":"Article","title":"Fluxアーキテクチャをやってみる | Web Scratch\n[efcl.in","url":"http://efcl.info/2017/03/17/almin-introduction/","tags":["JavaScript","redux","Flux","library","tutorial"],"content":"ウンターアプリを書きながら、どのようにFlux的な一方通行のデータフローを行うかについての記事。\n開発用のロガーやブラウザ拡張との連携について\n\n\n----\n\n#","relatedLinks":[]},{"category":"Article","title":"internals #1: the easy parts – Medium\n[medium.c","url":"https://medium.com/@asolove/preact-internals-1-the-easy-parts-3a081fa36205","tags":["JavaScript","React","article"],"content":"についての連載記事\n\n\n----\n\n##","relatedLinks":[]},{"category":"Article","title":"ive Web App Libraries in Production – Dev Channel – Medium\n[medium.co","url":"https://medium.com/dev-channel/progressive-web-app-libraries-in-production-b52cad37d34","tags":["ProgressiveWebApp","article","ServiceWorker"],"content":"rを使ったキャッシュ周りなどを導入するツールであるsw-precache、 sw-toolbox、offline-analyticsの紹介記事\n\n\n----\n\n## ","relatedLinks":[]},{"category":"Article","title":"ux+Express+MongoDBでものすごくシンプルなCRUDアプリをつくる - Qiita\n[qiita.com/","url":"http://qiita.com/m_yama6/items/573247b12ff0bc4e5d3c","tags":["React","article","node.js","redux","tutorial"],"content":"-app`を使いReact+Reduxのセットアップを行いフロントを書き、Express+MongoDB+mongooseでバックエンドを書いていくチュートリアル記事。 フロントエンドとバックエンドの接続部分も丁寧にかかれている。\n\n\n----\n\n## T","relatedLinks":[]},{"category":"Article","title":"e | Our Thinking | testdouble.js 2.0\n[blog.testdo","url":"http://blog.testdouble.com/posts/2017-03-13-testdouble-2.0.html","tags":["JavaScript","library","testing"],"content":"stdouble.js 2.0リリース。 `td.object`ではES2015 Proxyを使い存在しないプロパティなどのアクセスもキャッチ出来るようになるなど、非同期stubのサポート、`td.verify`の改善など\n\n- [Test Doub","relatedLinks":[{"title":"Test Double | Our Thinking | testdouble.js vs. sinon.js","url":"http://blog.testdouble.com/posts/2016-03-13-testdouble-vs-sinon.html"}]},{"category":"SlideVideo","title":"ue.js - 算出プロパティはどうやって動いているか\n[kitak.github","url":"https://kitak.github.io/slides/170316-vue-meetup/#","tags":["slide","Vue"],"content":" propertyの変更検知の仕組みについてのスライド\n\n\n----\n\n## Rea","relatedLinks":[]},{"category":"SlideVideo","title":"017 - YouTube\n[www.youtube.c","url":"http://www.youtube.com/playlist?list=PLb0IAmt7-GS3fZ46IGFirdqKTIxlws7e0","tags":["React","video","まとめ"],"content":"動画が公開された\n\n- [React Conf ","relatedLinks":[{"title":"React Conf 2017","url":"http://conf.reactjs.org/"}]},{"category":"WebsiteDocument","title":" full-stack React+GraphQL framework\n[vulcanjs.org/]","url":"http://vulcanjs.org/","tags":["React","GraphQL","library"],"content":"タックフレームワーク。\n元々React+MeteorのTelscopeだったもの。\n\n- [Vulcan: A Ne","relatedLinks":[{"title":"Vulcan: A New Direction For Telescope – VulcanJS – Medium","url":"https://medium.com/vulcanjs/vulcan-a-new-direction-for-telescope-93df1f8712f3#.w9qocegs0"}]},{"category":"WebsiteDocument","title":"ck-tricks: Tips and tricks in using Webpack\n[github.com/rsta","url":"https://github.com/rstacruz/webpack-tricks","tags":["webpack","Tips","document"],"content":"の削減やビルドの設定、開発向け/本番向けの設定などのTipsをまとめたドキュメント\n\n\n----\n<h1 class=","relatedLinks":[]},{"category":"SoftwareLibrary","title":"act-loadable: A higher order component for loading components with promises.\n[github.com/theja","url":"https://github.com/thejameskyle/react-loadable","tags":["React","library"],"content":"数のReactコンポーネント。 Promiseが解決されるまでのローディングやエラー表示を行う\n\n- [Introducing Re","relatedLinks":[{"title":"Introducing React Loadable – Medium","url":"https://medium.com/@thejameskyle/react-loadable-2674c59de178"}]},{"category":"SoftwareLibrary","title":"-runtime-analyzer: Webpack 1.x/2.x plugin for analyzing internal processes, state and structure of bundles.\n[github.com/smeluk","url":"https://github.com/smelukov/webpack-runtime-analyzer","tags":["webpack","Tools"],"content":"ateや構造をビジュアライズするwebpack plugin。\nモジュール、依存関係グラフ、ファイルサイズなど\n\n\n----\n\n## FranckFr","relatedLinks":[]},{"category":"SoftwareLibrary","title":"module-invalidate: Invalidate node.js modules loaded through require()\n[github.com/FranckF","url":"https://github.com/FranckFreiburger/module-invalidate","tags":["node.js","library"],"content":"んだキャッシュを無効化したり、モジュール側で無効化することを宣言できるモジュール\n\n\n----\n<h1 class=\"si","relatedLinks":[]},{"category":"Book","title":"'Reilly Media\n[shop.oreilly.com/pr","url":"http://shop.oreilly.com/product/0636920045335.do","tags":["SVG","animation"],"content":"--\n\n## 徹底マスター Jav","relatedLinks":[]},{"category":"Book","title":"科書　プログラミングの教養から、言語仕様、開発技法までが正しく身につく | 磯 博 | インターネット・Web開発 | Kindleストア | Amazon\n[www.amazon.co.jp/dp/","url":"https://www.amazon.co.jp/dp/B06XNQCW7B","tags":["JavaScript","book"],"content":"ての書籍。\nES2015に対応している内容\n\n- [SBクリエイティブ:徹底マスター J","relatedLinks":[{"title":"SBクリエイティブ:徹底マスター JavaScriptの教科書","url":"http://www.sbcr.jp/products/4797388640.html"}]}]},{"meta":{"title":"2017-03-27のJS: Angular v4.0.0、CSS Custom Properties、npm Organization","author":"azu","layout":"post","date":"2017-03-27T10:41:11.129Z","category":"JSer","tags":["Angular","CSS","npm"],"url":"https://jser.info/2017/03/27/angular-v4.0.0-css-custom-properties-npm-organization/"},"items":[{"category":"Headline","title":"moment/CHANGELOG.md at 2.18.0 · moment/moment","url":"https://github.com/moment/moment/blob/2.18.0/CHANGELOG.md","tags":["JavaScript","library","ReleaseNote"],"content":"moment 2.18.0リリース・\nRFC 2822のパースをサポート、1-24時表示を行う`k`と`kk`フォーマットのサポート、CJK time formatの改善など","relatedLinks":[{"title":"moment 2.18.0 changelog","url":"https://gist.github.com/ichernev/78920c5a1e419fb28c6e4546d1b7235c"},{"title":"RFC 2822の日付形式","url":"https://wiki.suikawiki.org/n/RFC%202822%E3%81%AE%E6%97%A5%E4%BB%98%E5%BD%A2%E5%BC%8F"},{"title":"[","url":"https://github.com/moment/moment/pull/3608"}]},{"category":"Headline","title":"Ember.js - Ember 2.12 and 2.13 Beta Released","url":"http://emberjs.com/blog/2017/03/19/ember-2-12-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember 2.12と2.13βリリース。\n`factoryFor` APIの追加、`Ember.K`が非推奨へになるなど","relatedLinks":[]},{"category":"Headline","title":"Release 5.25.0 - Announce - discuss.CodeMirror","url":"http://discuss.codemirror.net/t/release-5-25-0/1175","tags":["JavaScript","editor","library","ReleaseNote"],"content":"CodeMirror 5.25.0リリース。\n最初のコミットから10周年のリリース。\n`contentEditable`周りの修正、`lint` addonがPromiseをサポートするなど","relatedLinks":[]},{"category":"Headline","title":"Announcing Scala.js 0.6.15 - Scala.js","url":"https://www.scala-js.org/news/2017/03/21/announcing-scalajs-0.6.15/","tags":["scala","JavaScript","ReleaseNote"],"content":"Scala.js 0.6.15リリース。\n`@JSExportStatic`の追加、`@JSExportTopLevel`をfieldに対しても利用できるように、Symbolを表現する`js.Symbol`などの追加、\nマイグレーションツールとしてscalafixも公開されている。","relatedLinks":[{"title":"scalafix - a Scala rewrite tool","url":"https://scalacenter.github.io/scalafix/"}]},{"category":"Headline","title":"Chromium Blog: Chrome 58 Beta: IndexedDB 2.0, an improvement to iframe navigation, and immersive full screen for PWAs","url":"https://blog.chromium.org/2017/03/chrome-58-beta-indexeddb-20_21.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 58 Betaリリース。\nIndexedDB 2.0、iframe sandboxで`allow-top-navigation-by-user-activation`をサポート、`display: flow-root`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 26 | WebKit","url":"https://webkit.org/blog/7474/release-notes-for-safari-technology-preview-26/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 26リリース。\nWebGPUの試験的サポート、`history.scrollRestoration`のサポート、CSS `stroke-width`プロパティのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Angular: Angular 4.0.0 Now Available","url":"http://angularjs.blogspot.com/2017/03/angular-400-now-available.html","tags":["AngularJS","ReleaseNote"],"content":"Angular 4リリース。\nバージョンを合わせるためにv3を飛ばしてv4へ。\nAOTコンパイルによるViewのコード量の削減、TypeScript 2.1/2.2対応、テンプレートのSource Map対応など。\nAngular CLIも合わせて1.0.0を公開。","relatedLinks":[{"title":"angular/CHANGELOG.md at 4.0.0 · angular/angular","url":"https://github.com/angular/angular/blob/4.0.0/CHANGELOG.md"},{"title":"stories 1.0 update · angular/angular-cli Wiki","url":"https://github.com/angular/angular-cli/wiki/stories-1.0-update"}]},{"category":"Headline","title":"Cyclow","url":"http://cyclow.js.org/","tags":["JavaScript","library","DOM"],"content":"Cycle.jsライクなコンポーネントフレームワーク","relatedLinks":[]},{"category":"Article","title":"mnot’s blog: The State of Browser Caching, Revisited","url":"https://www.mnot.net/blog/2017/03/16/browser-caching","tags":["browser","HTTP","article"],"content":"各ブラウザのHTTPリクエスト/レスポンスとキャッシュの実装についての調査。\nStatus Code別のキャッシュ、`Cache-Control` header、`Vary` headerについて","relatedLinks":[]},{"category":"Article","title":"Learn Redux by coding a Mini-Redux – Jakob Lind","url":"http://blog.jakoblind.no/2017/03/13/learn-redux-by-coding-a-mini-redux/","tags":["JavaScript","redux","tutorial","article"],"content":"小さなReduxを作ってReduxについて学ぶ記事。","relatedLinks":[{"title":"Redux · JavaScript Plugin Architecture","url":"https://azu.gitbooks.io/javascript-plugin-architecture/content/ja/Redux/"}]},{"category":"Article","title":"ES6 Features - 10 Use Cases for Proxy","url":"http://dealwithjs.io/es6-features-10-use-cases-for-proxy/","tags":["JavaScript","proxy","article"],"content":"ES Proxyのユースケース紹介。\nデフォルト値、private、enum、observer、cache、`in`演算子、シングルトン、バリデーションとrevocable proxy、Python likeなSubscriptionなど。\nまたProxyをした際のパフォーマンスについて","relatedLinks":[]},{"category":"Article","title":"CSS Custom Properties in Microsoft Edge - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2017/03/24/css-custom-properties/","tags":["MSEdge","CSS"],"content":"MSEdgeがCSS Custom Propertyをサポート。\nCSS Custom Propertyの使い方、`@support`を使ったfeature detect、JavaScriptからの操作方法について","relatedLinks":[]},{"category":"Article","title":"Common Async/Await Design Patterns in Node.js | www.thecodebarbarian.com","url":"http://thecodebarbarian.com/common-async-await-design-patterns-in-node.js.html","tags":["JavaScript","ECMAScript","article"],"content":"Async/Awaitのパターンについて","relatedLinks":[]},{"category":"SlideVideo","title":"Angular DIスキ // Speaker Deck","url":"https://speakerdeck.com/kozake/angular-disuki","tags":["AngularJS","slide"],"content":"Angular 2.xのDIの仕組みについてのスライド","relatedLinks":[]},{"category":"WebsiteDocument","title":"The npm Blog — announcing free Orgs","url":"http://blog.npmjs.org/post/158718200065/announcing-free-orgs","tags":["npm","webservice"],"content":"npm orgでfree organizationが作成できるように。\n既存ユーザーをorganizationを変換することもできる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"myshov/history-of-javascript: Project \"History of JavaScript\"","url":"https://github.com/myshov/history-of-javascript","tags":["JavaScript","歴史","article"],"content":"JavaScriptの歴史を振り返る連載","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pubkey/rxdb: Client-Side Database for Browsers, NodeJS, electron, cordova, react-native and every other javascript-runtime","url":"https://github.com/pubkey/rxdb","tags":["JavaScript","library"],"content":"ブラウザ、Node.js、Electron、cordova、react-nativeで動作するクライアントサイドデータベースライブラリ。\nJSON Schemaベースで、mongo likeなクエリを利用でき、rxjsと連携することができる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"minireset.css: a tiny modern CSS reset","url":"http://jgthms.com/minireset.css/","tags":["CSS","library"],"content":"小さなreset.cssライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Simple counter: different implementations...","url":"https://gist.github.com/srdjan/1d10cbd42a2d695f696dee6b47fdc5e0","tags":["JavaScript","library"],"content":"いろんな言語、フレームワークでのカウンターの実装のコレクション","relatedLinks":[]},{"category":"SoftwareLibrary","title":"GoogleChrome/ui-element-samples: A collection of prototyped UI elements","url":"https://github.com/GoogleChrome/ui-element-samples","tags":["UI","JavaScript","example"],"content":"いろんなWebPlatform APIを使ったUIのサンプル集","relatedLinks":[{"title":"Building performant expand ","url":"https://developers.google.com/web/updates/2017/03/performant-expand-and-collapse"}]},{"category":"Book","title":"A journey to functional JavaScript: Part 1 – fundamentals – Grzegorz Ziółkowski","url":"https://gziolo.pl/2017/03/24/refactoring-to-functional-javascript-part-1-fundamentals/","tags":["JavaScript","関数型プログラミング","article"],"content":"JavaScriptでの関数型プログラミングについての記事シリーズ。\n関数型プログラミングに出てくる用語について","relatedLinks":[]}]},{"meta":{"title":"2017-04-04のJS: Safari 10.1、ECMAScript 2017-2018、Reactのパフォーマンス計測/改善","author":"azu","layout":"post","date":"2017-04-04T00:17:15.589Z","category":"JSer","tags":["Safari","ECMAScript","ES2017","ES2018","React"],"url":"https://jser.info/2017/04/04/safari-10.1-ecmascript-2017-2018-react/"},"items":[{"category":"Headline","title":"normalize.css/CHANGELOG.md at master · necolas/normalize.css","url":"https://github.com/necolas/normalize.css/blob/master/CHANGELOG.md","tags":["CSS","ReleaseNote","library"],"content":"normalize.css 6.0.0リリース。\nHTML要素やform要素への`font-family`、`line-height`などのopinionated rulesを削除","relatedLinks":[]},{"category":"Headline","title":"TC39: Ecma-402 updates | Rafael Xavier","url":"http://rafael.xavier.blog.br/2017/03/23/tc39-ecma-402-updates/","tags":["ECMAScript","i18n","proposal"],"content":"Ecma-402(ECMAScript i18n API)のProposalやステータスについて","relatedLinks":[]},{"category":"Headline","title":"Release 2.3.0 · qunitjs/qunit","url":"https://github.com/qunitjs/qunit/releases/tag/2.3.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"QUnit 2.3.0リリース。\nQUnit CLIの追加、CLIからQUnitを実行でき、reporterなどを指定できる。","relatedLinks":[{"title":"CLI: Introduce QUnit CLI by trentmwillis · Pull Request #1115 · qunitjs/qunit","url":"https://github.com/qunitjs/qunit/pull/1115"},{"title":"Introduce CLI tool · Issue #1024 · qunitjs/qunit","url":"https://github.com/qunitjs/qunit/issues/1024"}]},{"category":"Headline","title":"New Web Features in Safari 10.1 | WebKit","url":"https://webkit.org/blog/7477/new-web-features-in-safari-10-1/","tags":["safari","ReleaseNote"],"content":"Safari 10.1リリース。\nFetch API、CSS Grid、ES2016+、IndexedDB 2.0、Custom Elements、Gamepad、Pointer Lock、Input Events、`download`属性、HTML Media Captureなど","relatedLinks":[]},{"category":"Headline","title":"Node v7.8.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v7.8.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 7.8.0リリース。\nnpm 4.2.0へアップデート、async functionの修正のバックポートなど","relatedLinks":[]},{"category":"Headline","title":"TestCafe v0.14.0 Released | TestCafe","url":"http://devexpress.github.io/testcafe/blog/testcafe-v0-14-0-released.html","tags":["JavaScript","testing","E2E","ReleaseNote"],"content":"TestCafe v0.14.0リリース。\n`Role`でログイン情報を決めることができるように、BrowserStackサポート、`t.debug()`で`debugger;`的なデバッグができるように、`file://`に対してもテストできるように、`Selector`にカスタムメソッドを定義できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Flow: A Static Type Checker for JavaScript","url":"https://flow.org/en/","tags":["flowtype"],"content":"Flowの公式サイトがリニューアル公開された","relatedLinks":[]},{"category":"Headline","title":"Release Almin.js 0.11 · almin/almin","url":"https://github.com/almin/almin/releases/tag/0.11.0","tags":["JavaScript","Flux","library","ReleaseNote"],"content":"Almin 0.11リリース。\nFunctional UseCaseのサポート、APIドキュメントの更新、Reactバインディングの追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing free Microsoft Edge testing in partnership with BrowserStack - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2017/03/30/free-edge-testing-browserstack/","tags":["MSEdge","webservice"],"content":"BrowserStackでテスト目的のMSEdgeが無料で利用できるように","relatedLinks":[{"title":"Free Edge Testing on Windows 10","url":"https://www.browserstack.com/test-on-microsoft-edge-browser#live-cloud"}]},{"category":"Article","title":"ZEIT – Next.js 2.0","url":"https://zeit.co/blog/next2","tags":["JavaScript","React","library","サーバー","ReleaseNote"],"content":"Reactを使ったフレームワークであるNext.js 2.0リリース。\n動的なルーティングができるように、`next/css`は非推奨となり代わりに`styled-jsx`を導入、`<Link>`の`prefetch`サポート、サンプルの追加、`babel`の設定などを行えるようになるなど","relatedLinks":[{"title":"zeit/styled-jsx: Full CSS support for JSX without compromises","url":"https://github.com/zeit/styled-jsx"},{"title":"Migrating from next css · zeit/next.js Wiki","url":"https://github.com/zeit/next.js/wiki/Migrating-from-next-css"}]},{"category":"Article","title":"V8 JavaScript Engine: Help us test the future of V8!","url":"https://v8project.blogspot.com/2017/02/help-us-test-future-of-v8.html","tags":["Chrome","V8","article"],"content":"V8の新しいコンパイラーパイプラインであるIgnition interpreterとTurbofan compilerを有効化する方法について。\nまたバグを見つけた時の報告先について","relatedLinks":[]},{"category":"Article","title":"Writing Better JavaScript with Flow — SitePoint","url":"https://www.sitepoint.com/writing-better-javascript-with-flow/","tags":["flowtype","tutorial","article"],"content":"Flowの基本的な使い方についての解説記事。\n型の付け方、ライブラリの型、型アノテーションの取り除き方について","relatedLinks":[]},{"category":"Article","title":"React is Slow, React is Fast: Optimizing React Apps in Practice","url":"http://marmelab.com/blog/2017/02/06/react-is-slow-react-is-fast.html","tags":["React","performance"],"content":"Reactのパフォーマンス計測と改善について。\n`?react_perf`を使いコンポーネントプロファイル、`why-did-you-update`でのコンポーネントの更新時間の計測。\nshouldComponentUpdateでの無駄な更新を排除することでの改善、RecomposeやReselect、React/JSXの使い方での改善について","relatedLinks":[{"title":"garbles/why-did-you-update: Puts your console on blast when React is making unnecessary updates.","url":"https://github.com/garbles/why-did-you-update"}]},{"category":"Article","title":"Svelte ナメてたけど結構スゴい - Qiita","url":"http://qiita.com/jgs/items/2d985894ea07f48b74fb","tags":["JavaScript","UI","library"],"content":"HTML/CSS/JSをセットで書いたコンポーネントをJavaScript+小さなランタイムに変換するUIフレームワークであるSvelteについて","relatedLinks":[]},{"category":"Article","title":"Regular Expressions in a post-ES6 world","url":"https://ponyfoo.com/articles/regular-expressions-post-es6","tags":["ECMAScript","JavaScript","proposal"],"content":"ES2015以降の正規表現の追加された仕様とProposalの仕様について","relatedLinks":[]},{"category":"Article","title":"Vue.js Tutorial: A Prerendered, SEO-Friendly Example \\[Live Demo\\] - Snipcart","url":"https://snipcart.com/blog/vuejs-tutorial-seo-example","tags":["JavaScript","Vue","tutorial","article"],"content":"Vue.jsのチュートリアル。 PrerenderSpaPluginを使うことで、静的なHTMLを吐けるようにするところまでを行う話","relatedLinks":[]},{"category":"Article","title":"ECMAScript proposal updates @ 2017-03 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2017/04/04/ecmascript-proposals-status","tags":["ECMAScript","proposal"],"content":"ECMAScript Proposalの最新の変更まとめ。\n正規表現系のProposalがStage 3になった。","relatedLinks":[]},{"category":"SlideVideo","title":"君はyarn.lockをコミットしているか？","url":"https://www.slideshare.net/teppeis/do-you-commit-yarnlock","tags":["yarn","slide"],"content":"ライブラリでyarn.lockをコミットすることによるdevDepsの固定のメリットについて。\ndevDepsの方がBreaking Changeは起きやすいため固定することによるメリットがあるという話","relatedLinks":[]},{"category":"WebsiteDocument","title":"Vue.js Tutorial: A Prerendered, SEO-Friendly Example \\[Live Demo\\] - Snipcart","url":"https://snipcart.com/blog/vuejs-tutorial-seo-example","tags":["JavaScript","Vue","tutorial"],"content":"Vue.jsのチュートリアル。\nPrerenderSpaPluginを使うことで、静的なHTMLを吐けるようにするところまでを行う話","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sdgluck/mewt: Immutability in under one kilobyte","url":"https://github.com/sdgluck/mewt","tags":["JavaScript","library"],"content":"Proxyを使ったシンプルなImmutableラッパーライブラリ","relatedLinks":[]},{"category":"Book","title":"はじめに | Reset CSSフレンズ","url":"http://friends.o2p.jp/","tags":["CSS","ebook"],"content":"ユーザーエージェントによるCSSの特徴を上書きしていくReset CSSやnormalize.cssなどがどのようなスタイルを当てているかについての解説","relatedLinks":[]}]},{"meta":{"title":"2017-04-10のJS: React 15.5.0、ESLint 4.0.0α、Glimmer","author":"azu","layout":"post","date":"2017-04-10T12:54:13.922Z","category":"JSer","tags":["React","ESLint","Ember","Glimmer"],"url":"https://jser.info/2017/04/10/react-15.5.0-eslint-4.0.0a-glimmer/"},"items":[{"category":"Headline","title":"Video.js 6.0 Release! | Video.js Blog","url":"http://blog.videojs.com/Video-js-6-0-Release/","tags":["JavaScript","video","ReleaseNote"],"content":"Video.js 6.0リリース。\nFlashがコアから取り除かれた。\nmiddleware周りの変更、DOMメソッドを`videojs.dom`へ移動の予定など","relatedLinks":[{"title":"Video.js 6 Migration Guide · videojs/video.js Wiki","url":"https://github.com/videojs/video.js/wiki/Video.js-6-Migration-Guide"}]},{"category":"Headline","title":"release: npm@5.0.0 by zkat · Pull Request #16244 · npm/npm","url":"https://github.com/npm/npm/pull/16244","tags":["npm","issue","ReleaseNote"],"content":"今後リリース予定のnpm 5.0.0βについて。\n相対パスを`npm install`がsymlinkを作るように(`file:`ではなく`link:`へ)、キャッシュシステムの改善、`--prefer-offline`と`--offline`の追加。\n`git://`でもsemverを指定できるように、`npm install`の結果がサマリで出るように","relatedLinks":[]},{"category":"Headline","title":"Release 0.19.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v0.19.0","tags":["JavaScript","testing","ReleaseNote"],"content":"AVA 0.19.0リリース。\n一つもassertionが実行されないテストはデフォルトで落ちるように、`t.throws()`での非同期対応の改善、非同期テストでハングしているものを検知するようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0-rc.0 · lerna/lerna","url":"https://github.com/lerna/lerna/releases/tag/v2.0.0-rc.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"monorepo管理ツールのlerna 2.0.0RCリリース。\n`--conventional-commits`でconventional-commitsベースのCHANGELOGを作れるようになるなど","relatedLinks":[{"title":"v2.0.0 Milestone","url":"https://github.com/lerna/lerna/milestone/1"}]},{"category":"Headline","title":"ESLint v4.0.0-alpha.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2017/04/eslint-v4.0.0-alpha.0-released","tags":["JavaScript","ESLint","ReleaseNote"],"content":"ESLint 4.0.0 αリリース。\n`eslint:recommended`の更新、`indent`ルールの変更、ASTのコメント周りの扱いの変更、公開APIの変更など","relatedLinks":[{"title":"Migrating to v4.0.0 - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/docs/4.0.0/user-guide/migrating-to-4.0.0"},{"title":"ESLint v4.0.0 の変更点まとめ - Qiita","url":"http://qiita.com/mysticatea/items/3d01452d76ea6c943793"}]},{"category":"Headline","title":"Release v1.6.0 · karma-runner/karma","url":"https://github.com/karma-runner/karma/releases/tag/v1.6.0","tags":["JavaScript","browser","testing","ReleaseNote"],"content":"Karma v1.6.0リリース。\n`browser_info`イベントの追加、`proxyRes`と`proxyReq`イベントをhookできるようになるなど","relatedLinks":[]},{"category":"Headline","title":"React v15.5.0 - React Blog","url":"https://facebook.github.io/react/blog/2017/04/07/react-v15.5.0.html","tags":["React","ReleaseNote"],"content":"React 15.5.0リリース。\n同梱されていた`React.PropTypes`と`React.createClass`が非推奨となり、それぞれ別パッケージに別れた。\n`react-codemod`を使うことでマイグレーションできる。","relatedLinks":[{"title":"React 15.5へのアップデート手順(prop-typesとReact.createClass) - Qiita","url":"http://qiita.com/azu/items/9d1985bf0140576894aa"},{"title":"All doc updates forv15.5 by flarnie · Pull Request #9359 · facebook/react","url":"https://github.com/facebook/react/pull/9359"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 27 | WebKit","url":"https://webkit.org/blog/7497/release-notes-for-safari-technology-preview-27/","tags":["safari","ReleaseNote","JavaScript"],"content":"Safari Technology Preview Release 27リリース。\nObject spread/rest propertyの実装、`window.open`に`noopener`を実装、Web Inspectorの改善、Web Cryptography APIでSPKI/PKCS8に対応など","relatedLinks":[{"title":"ES proposal: Rest/Spread Properties","url":"http://2ality.com/2016/10/rest-spread-properties.html"}]},{"category":"Headline","title":"Ember.js - EmberConf 2017: State of the Union","url":"https://emberjs.com/blog/2017/04/05/emberconf-2017-state-of-the-union.html","tags":["JavaScript","歴史","library"],"content":"Ember.jsの歴史とこれからについて。\nスタンドアローンで利用できるようになったコンポーネントレイヤーのGlimmerについてなど","relatedLinks":[]},{"category":"Headline","title":"Glimmer","url":"https://glimmerjs.com/","tags":["JavaScript","DOM","library","WebComponents"],"content":"Emberとは独立したコンポーネントとして利用できるようになったGlimmerのサイト","relatedLinks":[{"title":"Why I’m excited about GlimmerJS – Hacker Noon","url":"https://hackernoon.com/why-im-excited-about-glimmerjs-3631bd0c95c4"}]},{"category":"Headline","title":"Release 8.0.0 · developit/preact","url":"https://github.com/developit/preact/releases/tag/8.0.0","tags":["React","JavaScript","ReleaseNote"],"content":"Preact 8.0.0(8.1.0)リリース\nPure Functional Componentsの書き直し、`linkState`、`className`のオブジェクトオプションはそれぞれ外部モジュールへと機能を移譲など","relatedLinks":[{"title":"Important changes coming in Preact 8","url":"https://gist.github.com/developit/89e0e6decb8fb5eb00def024b6fb7bd7"}]},{"category":"Headline","title":"Release Version 3.0.0 · sweet-js/sweet.js","url":"https://github.com/sweet-js/sweet.js/releases/tag/v3.0.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"Hygienic Macrosを提供するsweet.js 3.0.0リリース。","relatedLinks":[]},{"category":"Article","title":"How we built Twitter Lite | Twitter Blogs","url":"https://blog.twitter.com/2017/how-we-built-twitter-lite","tags":["twitter","mobile","React"],"content":"Twitter Liteの技術スタックについて。\nReact, Redux, Normalizr, Globalize, Babel, Webpack, Jest, WebdriverIOなどを使っている。\nパフォーマンスのためにPRPLパターンを使い、`requestAnimationFrame`や`requestIdleCallback`を使ってのレンダリングの調整などについて","relatedLinks":[]},{"category":"Article","title":"Introducing ReactXP - ReactXP Blog","url":"https://microsoft.github.io/reactxp/blog/2017/04/06/introducing-reactxp.html","tags":["React","ReleaseNote","windows","ios","Android"],"content":"React/React NativeベースのクロスプラットフォームなUIフレームワーク。\nクロスプラットフォームで共通したコンポーネントを利用できるようにするのが目的でMSのSkypeチームが作成している。","relatedLinks":[{"title":"Microsoft/reactxp: Library for cross-platform app development.","url":"https://github.com/microsoft/reactxp"}]},{"category":"Article","title":"GraphQL & React tutorial (part 1/6) – Chroma","url":"https://blog.hichroma.com/graphql-react-tutorial-part-1-6-d0691af25858","tags":["GraphQL","React","tutorial"],"content":"GraphQLについての連載。\nコンポーネント駆動とスキーマファーストについて","relatedLinks":[]},{"category":"Article","title":"How to Create a Reddit Client Using Angular 4.0 - Progur!","url":"http://progur.com/2017/03/how-to-create-reddit-client-with-angular-4.html","tags":["AngularJS","tutorial"],"content":"Angular v4を使ってRedditのAPIを叩いて、リスト表示するチュートリアル","relatedLinks":[]},{"category":"SlideVideo","title":"The Quest For Immer Mutable State Management","url":"https://immer-mutable-state.surge.sh/","tags":["JavaScript","slide"],"content":"MobXでのSnapshot + mutable state treeについてのスライド。\nPull/Push-basedなcomputed property、Mutable StateでActionリプレイするために、どのような方法を取るのかについて","relatedLinks":[{"title":"Michel Weststrate: MobX: The Quest For Immer Mutable State Management - YouTube","url":"https://www.youtube.com/watch?v=ta8QKmNRXZM"},{"title":"mobxjs/serializr: Serialize and deserialize complex object graphs to JSON","url":"https://github.com/mobxjs/serializr"}]},{"category":"SlideVideo","title":"ng-conf 2017 - YouTube","url":"https://www.youtube.com/watch?v=Nj9_p4qvm5U","tags":["AngularJS","イベント","video"],"content":"ng-conf 2017の動画まとめ","relatedLinks":[{"title":"ng-conf 2017 Summary - Day 1","url":"https://auth0.com/blog/ngconf2017-summary-day1/"},{"title":"ng-conf 2017 1日目 Keynoteメモ | ","url":"https://blog.lacolaco.net/post/ng-conf-2017-day-1-note/"},{"title":"Long Term Support for Angular Announced at ng-conf 2017","url":"https://www.infoq.com/news/2017/04/ng-conf-2017-keynote"}]},{"category":"SlideVideo","title":"Publish JavaScript packages on npm - Course by @trevordmiller @eggheadio","url":"https://egghead.io/courses/publish-javascript-packages-on-npm","tags":["npm","video","tutorial"],"content":"npmのパッケージやscriptについてのスクリーンキャスト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Stylelint generator","url":"https://maximgatilin.github.io/stylelint-config/","tags":["CSS","設定","Tools"],"content":"Stylelintの設定ファイルを選択式で作れるジェネレーター","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mobxjs/serializr: Serialize and deserialize complex object graphs to JSON","url":"https://github.com/mobxjs/serializr","tags":["JavaScript","library"],"content":"クラスのオブジェクトシリアライズ/デシリアライズライブラリ","relatedLinks":[]},{"category":"Book","title":"MathJax CDN shutting down on April 30, 2017","url":"http://www.mathjax.org/cdn-shutting-down/","tags":["JavaScript","library","news"],"content":"MathJax CDNがシャットダウンされるため、ローカルにコピーするかcloudflareのものを利用するようにする必要がある","relatedLinks":[]},{"category":"Book","title":"ukyo/wasm-usui-book: webassemblyの薄い本","url":"https://github.com/ukyo/wasm-usui-book","tags":["WebAssembly","ebook"],"content":"wasmについての電子書籍。\nwasmの概要、WABTを使っての開発、バイナリフォーマットやテキストフォーマットなどについて","relatedLinks":[]}]},{"meta":{"title":"2017-04-17のJS: prettier 1.0、MSEdge 15、Twitter Liteのパフォーマンスチューニング","author":"azu","layout":"post","date":"2017-04-17T14:32:02.853Z","category":"JSer","tags":["JavaScript","MSEdge","performance"],"url":"https://jser.info/2017/04/17/prettier-1.0-msedge-15-twitter-lite/"},"items":[{"category":"Headline","title":"Announcing TypeScript 2.3 RC | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2017/04/10/announcing-typescript-2-3-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.3RCリリース。\n`noImplicitAny`, `strictNullChecks`,`noImplicitThis`などをまとめた`strict`オプションの追加.\n\nGenerator/IteratorをES3/ES5互換のコードへ変換できるように、Async Generator/Iteratorの対応、 Generic defaultsの対応など","relatedLinks":[{"title":"TypeScript 2.3 RC 変更点 - Qiita","url":"http://qiita.com/vvakame/items/d926f0e1b02397dbd5df"}]},{"category":"Headline","title":"What’s new in Microsoft Edge in the Windows 10 Creators Update - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2017/04/11/introducing-edgehtml-15/","tags":["MSEdge","ReleaseNote"],"content":"EdgeHTML 15(Windows 10 Creators Update)のリリースノート。\nBrotli、CSS Custom Properties、Intersection Observer、Payment Request API、Web VR、CSP Lv2のサポートなど。","relatedLinks":[{"title":"Dev guide - Microsoft Edge Development | Microsoft Docs","url":"https://docs.microsoft.com/en-us/microsoft-edge/dev-guide"},{"title":"Microsoft Edge build 14986 changelog - Microsoft Edge Development","url":"https://developer.microsoft.com/en-us/microsoft-edge/platform/changelog/desktop/14986/"}]},{"category":"Headline","title":"Releasing Prettier 1.0","url":"http://jlongster.com/prettier-1.0","tags":["JavaScript","Tools","ReleaseNote","opinion"],"content":"JavaScriptやFlowに対応した整形ツールのPrettier 1.0リリース。\nPrettierはできるだけオプションを持たないopinionatedな整形ツールだが、相反する人が多いセミコロンやタブ/スペースなどについてはオプションが用意されている。","relatedLinks":[]},{"category":"Headline","title":"Release v0.44.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.44.0","tags":["flowtype","ReleaseNote"],"content":"Flow v0.44.0リリース。\nパフォーマンスの改善など","relatedLinks":[]},{"category":"Headline","title":"React v15.5(6) and v16 - blog.koba04.com","url":"http://blog.koba04.com/post/2017/04/14/react-dot-js-v155-and-v16/","tags":["React"],"content":"React 15.5と16での変更点について。\nv15.5で非推奨となった機能やパッケージ、\nv16でv15の互換モードで導入されるFiberについて","relatedLinks":[{"title":"koba04/react-fiber-resources: resources for ReactFiber","url":"https://github.com/koba04/react-fiber-resources"}]},{"category":"Headline","title":"Release v2.4.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v2.4.0","tags":["webpack","ReleaseNote"],"content":"webpack v2.4.0リリース。\n`import()`にコメントでchunk nameを指定できるように、`require.ensure`にエラーコールバックを指定できるようになるなど","relatedLinks":[{"title":"Feature: Add named chunk for ","url":"https://github.com/webpack/webpack/pull/4573"}]},{"category":"Article","title":"Introducing Moon – Hacker Noon","url":"https://hackernoon.com/introducing-moon-1d44a99635f0","tags":["JavaScript","Vue","library"],"content":"Vue版Preact的なライブラリであるMoonについて。\nVueのようなAPIを持ち、Vueよりファイルサイズが小さい。","relatedLinks":[{"title":"Moon","url":"http://moonjs.ga/"}]},{"category":"Article","title":"What's New In DevTools (Chrome 59)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/04/devtools-release-notes","tags":["Chrome","debug"],"content":"Chrome 59で入る開発者ツール周りの機能について。\nカバレッジ、フルページスクリーンショット、Block Request、Workspaceの改善など","relatedLinks":[]},{"category":"Article","title":"Debugging Tips and Tricks | CSS-Tricks","url":"https://css-tricks.com/debugging-tips-tricks/","tags":["JavaScript","CSS","debug"],"content":"ウェブサイト、JavaScript、CSSなど色々なデバッグTipsについて。\nCSS animation、CSS Gridのデバッグ、回線速度のデバッグ、timed debugger、シミュレーターなど","relatedLinks":[]},{"category":"SlideVideo","title":"React London 2017 - YouTube","url":"https://www.youtube.com/channel/UCV4LIEkC0S9KUAPDm2g4mNQ","tags":["React","video","イベント"],"content":"React London 2017の動画一覧","relatedLinks":[{"title":"React London","url":"https://react.london/"}]},{"category":"SlideVideo","title":"An Introduction to Flow - Sessions by Pusher","url":"https://pusher.com/sessions/meetup/js-monthly-london/flow","tags":["JavaScript","flowtype","video","slide"],"content":"Flowについての発表動画。\nFlowの基本的な使い方について","relatedLinks":[]},{"category":"SlideVideo","title":"React + FLUX + Redux + Redux Saga のお話","url":"https://www.slideshare.net/yossy222/react-flux-redux-redux-saga","tags":["redux","JavaScript","Flux"],"content":"redux-sagaについてのスライド。\nFlux、Redux、redux-sagaのフローについて。\nまたredux-sagaを導入した際に、Actionが必ずsagaを通るようにする設計について","relatedLinks":[{"title":"Using React (-Native) with Redux and Redux-Saga. A new proposal?","url":"https://medium.com/@marcelschulze/using-react-native-with-redux-and-redux-saga-a-new-proposal-ba71f151546f"}]},{"category":"WebsiteDocument","title":"Twitter Lite and High Performance React Progressive Web Apps at Scale","url":"https://medium.com/@paularmstrong/twitter-lite-and-high-performance-react-progressive-web-apps-at-scale-d28a00e780a3","tags":["webpack","React","performance","redux"],"content":"webpackのCommonsChunkPluginを使った分割、jankのない無限スクロールの実装。\nReactにおいては`shouldComponentUpdate`での最適化、`componentWillMount`から`componentDidMount`への処理の移動。\n`dangerouslySetInnerHTML`を避ける、遅延描画など。\nReduxにおいては、テキスト入力毎のStoreの更新を避ける、Batch Actionでの最適化など。\nSWでのロードキャッシュについてなど実践的な最適化手法について書かれている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Intercepting new Image().src requests / Stoyan's phpied.com","url":"http://www.phpied.com/intercepting-new-image-src-requests/","tags":["JavaScript"],"content":"ES Proxyを使って`Image`のFake版を作成する話。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Eruda: Console for Mobile browsers","url":"http://eruda.liriliri.io/","tags":["mobile","debug","JavaScript","browser","ブックマークレット"],"content":"モバイルサイト向けのデバッグコンソールツール/ブックマークレット。\nコンソール、FPS表示、要素選択、ネットワーク、リソースなど色々な情報を扱うページ内開発者ツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"E2E Testing React applications with TestCafe – Hacker Noon","url":"https://hackernoon.com/e2e-testing-react-applications-with-testcafe-8edb605ec66c","tags":["React","E2E","testing"],"content":"TestCafe + ReactでのE2Eテストについて。\nhttps://github.com/DevExpress/testcafe-react-selectors を使うことでReactコンポーネントに対する検索ができる。","relatedLinks":[{"title":"DevExpress/testcafe-react-selectors: TesCafe selector extensions for React apps.","url":"https://github.com/DevExpress/testcafe-react-selectors"}]},{"category":"SoftwareLibrary","title":"DmitrySoshnikov/regexp-tree: Regular expressions processor in JavaScript","url":"https://github.com/dmitrysoshnikov/regexp-tree","tags":["正規表現","AST","JavaScript","library"],"content":"正規表現をパースしてASTにしたり、traversaや変換、正規表現の最適化などを行うことができるライブラリ。","relatedLinks":[{"title":"RegExp Tree: a regular expressions processor – Dmitry Soshnikov – Medium","url":"https://medium.com/@DmitrySoshnikov/regexp-tree-a-regular-expressions-parser-with-a-simple-ast-format-bcd4d5580df6"}]},{"category":"SoftwareLibrary","title":"somesocks/vet: A Javascript library for data validation.","url":"https://github.com/somesocks/vet","tags":["JavaScript","library"],"content":"色々な判定をまとめたライブラリ。\n`is*`な関数の集まり","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nickpisacane/maybe-you-meant: Catch deceptive prop typos in your react apps","url":"https://github.com/nickpisacane/maybe-you-meant","tags":["React","debug","JavaScript","library"],"content":"Reactコンポーネントのpropsのtypoなどを検知して、\"もしかして\"を出してくれるデバッグ補助ライブラリ","relatedLinks":[]},{"category":"Book","title":"Introduction · react-indepth","url":"https://developmentarc.gitbooks.io/react-indepth/content/","tags":["React","ebook","book"],"content":"Reactのコンポーネントやライフサイクルイベントについて詳しく書かれた電子書籍","relatedLinks":[]}]},{"meta":{"title":"2017-04-25のJS: Firefox 53、jsdom 10.0.0","author":"azu","layout":"post","date":"2017-04-25T01:55:35.397Z","category":"JSer","tags":["Firefox","Node.js","DOM"],"url":"https://jser.info/2017/04/25/firefox-53-jsdom-10.0.0/"},"items":[{"category":"Headline","title":"Release Notes for Safari Technology Preview 28 | WebKit","url":"https://webkit.org/blog/7516/release-notes-for-safari-technology-preview-28/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 28リリース。\nバックグラウンドタブの処理を抑制、クロスオリジン iframeの`requestAnimationFrame`を30fpsに制限するなど。\nWebCryptoでAES-CTRをサポート","relatedLinks":[]},{"category":"Headline","title":"Firefox — Notes (53.0) — Mozilla","url":"https://www.mozilla.org/en-US/firefox/53.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 53.0リリース。\nES2015のFunction.nameの仕様追従\n`var f = function() {};f.name; // \"f\"`、`auxclick`イベントの対応、`display: flow-root`の対応など","relatedLinks":[{"title":"Firefox 53 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/53"},{"title":"MozillaZine.jp » Blog Archive » Firefox 53 がリリースされた","url":"http://mozillazine.jp/?p=5422"},{"title":"Firefox 53: Quantum Compositor, Compact Themes, CSS Masks, and More ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2017/04/firefox-53-quantum-compositor-compact-themes-css-masks-and-more/"},{"title":"Firefox 53 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/versions/53/"}]},{"category":"Headline","title":"New in Chrome 58  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/04/nic58","tags":["Chrome","ReleaseNote"],"content":"Chrome 58リリース。\nIndexedDB 2.0、`display: flow-root`のサポートなど","relatedLinks":[{"title":"Chromium Blog: Chrome 58 Beta: IndexedDB 2.0, an improvement to iframe navigation, and immersive full screen for PWAs","url":"https://blog.chromium.org/2017/03/chrome-58-beta-indexeddb-20_21.html"}]},{"category":"Headline","title":"jsdom/Changelog.md at 10.0.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/10.0.0/Changelog.md","tags":["JavaScript","node.js","DOM","library","ReleaseNote"],"content":"jsdom 10.0.0リリース。\nNode.js <=5のサポートを終了、基本的な使い方を変更(`new JSDOM(html)`など)、`Script`の追加。\n`omitJsdomErrors`を`omitJSDOMErrors`へリネーム、`dir`の対応改善、`window.postMessage()`のoriginチェックを修正など","relatedLinks":[{"title":"New API draft by domenic · Pull Request #1741 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/pull/1741"}]},{"category":"Article","title":"Async iterators and generators - JakeArchibald.com","url":"https://jakearchibald.com/2017/async-iterators-and-generators/","tags":["ECMAScript","JavaScript"],"content":"Async iteratorについての解説","relatedLinks":[]},{"category":"Article","title":"A Vue.js introduction for people who know just enough jQuery to get by","url":"https://medium.freecodecamp.com/vue-js-introduction-for-people-who-know-just-enough-jquery-to-get-by-eab5aa193d77","tags":["Vue","tutorial"],"content":"Vue.jsを使ってTwitterの投稿画面のようなダイアログ表示を作成するチュートリアル。\n機能毎に実装を進めていて、データバインディングやメソッドの呼び出し、アニメーションなどについて解説してる。","relatedLinks":[]},{"category":"Article","title":"FRESH! Web パフォーマンス改善 〜クライアントサイド編〜 | CyberAgent Developers Blog | サイバーエージェント デベロッパーズブログ","url":"https://developers.cyberagent.co.jp/blog/archives/6057/","tags":["browser","performance"],"content":"パフォーマンス改善についての解説記事。\nService Workerを使ったキャッシュ、Intersection Observerを使ったlazy load、SVGスプライトをやめて個別にSVGを読み込むなど。","relatedLinks":[]},{"category":"Article","title":"脱jQueryのためにしたこと - Qiita","url":"http://qiita.com/clockmaker/items/50c3a9772e36a95ae500","tags":["jQuery","Vue","リファクタリング","opinion"],"content":"jQueryで書かれたサイトを標準のAPIやVue.jsを使って書き換えていく話","relatedLinks":[]},{"category":"Article","title":"Visual Testing — the pragmatic way to test UIs – Chroma","url":"https://blog.hichroma.com/visual-testing-the-pragmatic-way-to-test-uis-18c8da617ecf","tags":["UI","testing","React"],"content":"コンポーネントのビジュアルテストについて。\nスナップショットテスト、ReactStoryBookなどを使ったUI component explorersのアプローチなどについて","relatedLinks":[{"title":"UI component explorers — your new favorite tool – Chroma","url":"https://blog.hichroma.com/the-crucial-tool-for-modern-frontend-engineers-fb849b06187a"}]},{"category":"Article","title":"How to build a math expression tokenizer using JavaScript (or any other language)","url":"https://medium.freecodecamp.com/how-to-build-a-math-expression-tokenizer-using-javascript-3638d4e5fbe9","tags":["JavaScript","tutorial"],"content":"JavaScriptでトークナイザーを書いていくチュートリアル","relatedLinks":[]},{"category":"Article","title":"JavaScript Testing Tool Showdown: Sinon.js vs testdouble.js — SitePoint","url":"https://www.sitepoint.com/javascript-testing-tool-showdown-sinon-js-vs-testdouble-js/","tags":["JavaScript","testing"],"content":"Sinon.jsとtestdouble.jsの比較記事","relatedLinks":[]},{"category":"Article","title":"React Fiber現状確認 - blog.koba04.com","url":"http://blog.koba04.com/post/2017/04/25/a-state-of-react-fiber/","tags":["React","article"],"content":"React v16から入る予定のFiberアーキテクチャについて。\nReactコアのReconciliationを置き換えるもので、今までは作業単位が1つのツリーだったものを、Filberという作業単位で行うようにする仕組みの解説。\nまた、v16以降に入るError Boundaryなどの変更について。","relatedLinks":[{"title":"React Fiberアーキテクチャについて | プログラミング | POSTD","url":"http://postd.cc/react-fiber-architecture/"}]},{"category":"SlideVideo","title":"Browser animation in 2017 by birtles","url":"http://slides.com/birtles/browser-animation-2017","tags":["JavaScript","CSS","animation","slide"],"content":"CSS Animations/Web Animationsについてのスライド。\nWeb Animations APIやフレームアニメーションについて、またその実装状況にについて","relatedLinks":[]},{"category":"SlideVideo","title":"abouthiroppy/node8","url":"https://abouthiroppy.github.io/slides/node8/","tags":["node.js","V8","slide"],"content":"5月30日にリリース予定のNode.js 8.0.0についてのスライド。\nNode.js 8.0.0ではV8の新しいコンパイラパイプラインが入る予定。\nまたNode.js 7.x ~ 8.0.0で入る予定の変更点について。","relatedLinks":[{"title":"V8 JavaScript Engine: Help us test the future of V8!","url":"https://v8project.blogspot.jp/2017/02/help-us-test-future-of-v8.html"},{"title":"Ignition Design Doc - Google ドキュメント","url":"https://docs.google.com/document/d/11T2CRex9hXxoJwbYqVQ32yIPMh0uouUZLdyrtmMoL44/edit?pli=1"}]},{"category":"WebsiteDocument","title":"ericvicenti/intro-to-react: A Hands-On Walkthrough of your first React Web App","url":"https://github.com/ericvicenti/intro-to-react","tags":["React","tutorial"],"content":"Reactについて学ぶワークショップの資料と動画","relatedLinks":[]},{"category":"WebsiteDocument","title":"Get Started With Analyzing Runtime Performance  |  Web  |  Google Developers","url":"https://developers.google.com/web/tools/chrome-devtools/evaluate-performance/","tags":["performance","tutorial","Chrome"],"content":"Chromeの開発者ツールを使ったパフォーマンス解析のチュートリアル","relatedLinks":[]},{"category":"WebsiteDocument","title":"WCAG 2.0 達成方法集","url":"http://waic.jp/docs/WCAG-TECHS/Overview.html","tags":["accessibility","W3C","翻訳"],"content":"Techniques for WCAG 2.0の翻訳","relatedLinks":[{"title":"2016年版のWCAG 2.0達成方法集がWAICサイトで公開されました - 水底の血","url":"http://momdo.hatenablog.jp/entry/20170420/1492684716"}]},{"category":"WebsiteDocument","title":"State Architecture Patterns in React: A Review – Skyler Nelson – Medium","url":"https://medium.com/@skylernelson_64801/state-architecture-patterns-in-react-a-review-df02c1e193c6","tags":["React","設計","opinion"],"content":"Reactでよく見るステート管理パターンについて。\nナイーブな階層構造、上から下へStateを渡すTop-Heavy Architecture(Central State)、Pub/Subなどについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Introducing a faster BBC News front page | Wildly Inaccurate","url":"https://wildlyinaccurate.com/introducing-a-faster-bbc-news-front-page","tags":["browser","performance","React","opinion"],"content":"BBC Newsのパフォーマンス改善について。\nSpeedCurveを使って計測を行い、画像遅延ロード、Reactをサーバサイドレンダリングのみに利用してる。\nまだ改善の1段階で、Reactをブラウザ側で動かしたときにモバイルだと重たい問題などが課題となってる(そのためサーバサイドレンダリングのみになっている)","relatedLinks":[]},{"category":"SoftwareLibrary","title":"chadhietala/babel-plugin-debug-macros","url":"https://github.com/chadhietala/babel-plugin-debug-macros/","tags":["JavaScript","babel","plugin"],"content":"Babelを使ったHygenic Macroのプラグイン。\nassertやdeprecate、warning、feature flagなどのマクロ化したもの","relatedLinks":[]},{"category":"SoftwareLibrary","title":"aweary/tinytime: A straightforward time and time formatter in <1kb","url":"https://github.com/aweary/tinytime","tags":["JavaScript","library"],"content":"小さなstrtime的なライブラリ。 時間フォーマット","relatedLinks":[]}]},{"meta":{"title":"2017-05-03のJS: Headless Chrome/FirefoxとPhantomJS/SlimerJS、ES modules","author":"azu","layout":"post","date":"2017-05-03T02:03:59.837Z","category":"JSer","tags":["Firefox","Chrome","Headless","PhantomJS","SlimerJS","modules","ECMAScript"],"url":"https://jser.info/2017/05/03/headless-chromefirefoxphantomjsslimerjs-es-modules/"},"items":[{"category":"Headline","title":"Headless SlimerJS with Firefox – Coding","url":"https://adriftwith.me/coding/2017/04/21/headless-slimerjs-with-firefox/","tags":["firefox","E2E","webdriver"],"content":"Firefox Nightlyでheadlessサポートが行われたため、SlimerJSでヘッドレスなテストをおこなえるようになったという話","relatedLinks":[]},{"category":"Headline","title":"TestCafe v0.15.0 Released | TestCafe","url":"http://devexpress.github.io/testcafe/blog/testcafe-v0-15-0-released.html","tags":["testing","E2E","JavaScript","React","library"],"content":"TestCafe 0.15.0リリース。\n`Selector()#withText`の仕様を変更、ReactとVue向けのSelector拡張のサポート、セットアップ済みのDocker imageの提供。\n`--proxy`と`--debug-mode`の追加、`Role`に`preserveUrl`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Angular: Angular 4.1.0 Now Available","url":"http://angularjs.blogspot.com/2017/04/angular-410-now-available.html","tags":["TypeScript","AngularJS","ReleaseNote"],"content":"Angular 4.1.0リリース。\nStrictNullChecksを有効化したTypeScript 2.2/2.3のサポート。","relatedLinks":[]},{"category":"Headline","title":"Release v2.3.0 JoJo's Bizarre Adventure · vuejs/vue","url":"https://github.com/vuejs/vue/releases/tag/v2.3.0","tags":["Vue","ReleaseNote"],"content":"Vue.js 2.3.0リリース。\nサーバサイドレンダリングの改善、コンポーネントの非同期ローディングの改善、passive event listenerのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v0.45.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.45.0","tags":["flowtype","ReleaseNote"],"content":"Flow 0.45.0リリース。\nUnicodeサポートの改善、Dynamic Importのサポート、`export type * from ...`に対応など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 2.3 | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2017/04/27/announcing-typescript-2-3/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.3リリース。\n`--checkJs`で`// @ts-check`と書かれたJavaScriptのJSDocをtype checkできるように。\nDefault type argumentsのサポート、`--downlevelIteration`の追加、`tsc  --init`で生成される`tsconfig.json`の整理など","relatedLinks":[{"title":"JSDoc support in JavaScript · Microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/JSDoc-support-in-JavaScript"}]},{"category":"Headline","title":"Ember.js - Ember 2.13 and 2.14 Beta Released","url":"https://emberjs.com/blog/2017/04/29/ember-2-13-released.html","tags":["Ember","ReleaseNote"],"content":"Ember 2.14リリース。\nEmber CLIでyarnのサポート、BabelやAutoprefixerで利用できる`targets`を指定する`config/target.js`が生成されるようになるなど","relatedLinks":[{"title":"Ember CLI Targets 🎯","url":"http://rwjblue.com/2017/04/21/ember-cli-targets/"}]},{"category":"Headline","title":"Netflix/unleash: Professionally publish your JavaScript modules in one keystroke","url":"https://github.com/Netflix/unleash","tags":["JavaScript","Tools","node.js","npm"],"content":"npm publishバージョン管理ツール。\nsemverでのバージョン付け、テストの実行、CHANGELOGの生成、publish時のpreview、gh-pagesへのドキュメントのデプロイなどpublish周りの処理をまとめたツール","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 59 Beta: Headless Chromium, native notifications on macOS, and service worker navigation preload","url":"https://blog.chromium.org/2017/05/chrome-59-beta-headless-chromium-native.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 59 Betaリリース。\nHeadless Chrome、SWのnavigation preloadsのサポート、`MediaError.message`のサポート、Image Capture APIの試験的サポートなど","relatedLinks":[{"title":"mediacapture-image/implementation-status.md at gh-pages · w3c/mediacapture-image","url":"https://github.com/w3c/mediacapture-image/blob/gh-pages/implementation-status.md"}]},{"category":"Article","title":"Introducing a faster BBC News front page | Wildly Inaccurate","url":"https://wildlyinaccurate.com/introducing-a-faster-bbc-news-front-page","tags":["React","browser","performance","opinion","article"],"content":"BBC Newsのパフォーマンス改善について。 SpeedCurveを使って計測を行い、画像遅延ロード、Reactをサーバサイドレンダリングのみに利用してる。 まだ改善の1段階で、Reactをブラウザ側で動かしたときにモバイルだと重たい問題","relatedLinks":[]},{"category":"Article","title":"Internationalize your keyboard controls ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2017/03/internationalize-your-keyboard-controls/","tags":["JavaScript","キーボード","browser","WebPlatformAPI"],"content":"キーボードイベントについて。\n`keyCode`/`charCode`/`which`を置き換える`key`と`code`プロパティについて。\nまた、その他のKeyboardEvent周りのTipsについて。","relatedLinks":[{"title":"KeyboardEvent.key mapping of each browser - Google スプレッドシート","url":"https://docs.google.com/spreadsheets/d/1YB4M5Y5BWSn-7FX7pXFNbLtDDGzQ0noUTIo-YSqyRzc/edit#gid=0"},{"title":"cvan/keyboardevent-key-polyfill: polyfill for ","url":"https://github.com/cvan/keyboardevent-key-polyfill"},{"title":"UI Events","url":"https://w3c.github.io/uievents/#code-examples"}]},{"category":"Article","title":"Everything you need to know about BabelJS","url":"http://kleopetrov.me/2016/03/18/everything-about-babel/","tags":["babel","article"],"content":"Babelの設定やCLIについての概要解説","relatedLinks":[]},{"category":"Article","title":"Functional pattern: flatMap","url":"http://2ality.com/2017/04/flatmap.html","tags":["JavaScript","ECMAScript"],"content":"`flatMap`と呼ばれるものはどのようなものを言っているのかについて。\nまたそれに関連するECMAScriptのStage 1のProposalについて","relatedLinks":[{"title":"bterlson/proposal-flatMap: Proposal for flatten and flatMap","url":"https://github.com/bterlson/proposal-flatMap"}]},{"category":"Article","title":"Getting Started with Headless Chrome  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/04/headless-chrome","tags":["Chrome","article"],"content":"Headless Chromeの使い方について。\nコマンドラインからDOMのダンプ、PDFの作成、スクリーンショット、remote debuggingの方法などについて","relatedLinks":[]},{"category":"Article","title":"ECMAScript modules in browsers - JakeArchibald.com","url":"https://jakearchibald.com/2017/es-modules-in-browsers/","tags":["ECMAScript","JavaScript","module"],"content":"ES modulesのブラウザサポートとNode.jsのモジュールと異なる点などについて。\nまた、モジュールが未サポート環境へのfallbackとしての`nonmodule`、デフォルトが`defer`である点や実行順、CORSやMIME typeなどについて","relatedLinks":[]},{"category":"Article","title":"Node.js 8.0.0 has been delayed and will ship on or around May 30th","url":"https://medium.com/the-node-js-collection/node-js-8-0-0-has-been-delayed-and-will-ship-on-or-around-may-30th-cd38ba96980d","tags":["nodev","V8","article"],"content":"Node.js 8.0.0のリリース日が5月30日になった件について。\nV8のTurboFan + Ignition pipelineのデフォルト化リリースを待ってからにする点について","relatedLinks":[]},{"category":"WebsiteDocument","title":"bevacqua/prop-tc39: Scraping microservice for TC39 proposals 😸","url":"https://github.com/bevacqua/prop-tc39","tags":["ECMAScript","proposal","API"],"content":"ECMAScriptのProposalsの一覧とそれをJSONとして取得できるAPIとパッケージ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Performance best practices for Firefox front-end engineers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Performance_best_practices_for_Firefox_fe_engineers","tags":["firefox","debug","performance","JavaScript"],"content":"Firefoxのフロントエンド向けに書かれたパフォーマンスガイド。\nrequestIdleCallback、reflow、repaint、パフォーマンス計測などについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Introduction · react-sketchapp","url":"http://airbnb.io/react-sketchapp/","tags":["React","Sketch","library"],"content":"React ComponentをSketchへレンダリングするrenderer","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Create Next App","url":"https://open.segment.com/create-next-app","tags":["Tools","node.js","React"],"content":"Next.js版create react app","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ktsn/houl: Gulp compatible build tool for huge static sites","url":"https://github.com/ktsn/houl","tags":["Tools","node.js","gulp","debug"],"content":"gulp pluginを利用できるビルド/dev serverツール","relatedLinks":[{"title":"大規模静的サイトのためのビルドツール // Speaker Deck","url":"https://speakerdeck.com/ktsn/da-gui-mo-jing-de-saitofalsetamefalsebirudoturu"}]},{"category":"Book","title":"わか(った気にな)るWebRTC 紙＋電子版セット - Route 312 - BOOTH（同人誌通販・ダウンロード）","url":"https://booth.pm/ja/items/504677","tags":["WebRTC","book"],"content":"WebRTCの入門書","relatedLinks":[]},{"category":"Book","title":"Webフロントエンド ハイパフォーマンス チューニング | 久保田 光則 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/Web%E3%83%95%E3%83%AD%E3%83%B3%E3%83%88%E3%82%A8%E3%83%B3%E3%83%89-%E3%83%8F%E3%82%A4%E3%83%91%E3%83%95%E3%82%A9%E3%83%BC%E3%83%9E%E3%83%B3%E3%82%B9-%E3%83%81%E3%83%A5%E3%83%BC%E3%83%8B%E3%83%B3%E3%82%B0-%E4%B9%85%E4%BF%9D%E7%94%B0-%E5%85%89%E5%89%87/dp/4774189677","tags":["browser","performance","book"],"content":"2017年5月26日発売\nウェブサイトのフロントエンドのパフォーマンスについての書籍","relatedLinks":[]}]},{"meta":{"title":"2017-05-11のJS: UglifyJS 3、butternut、webpack-cli","author":"azu","layout":"post","date":"2017-05-10T14:19:19.703Z","category":"JSer","tags":["UglifyJS","webpack-cli","webpack"],"url":"https://jser.info/2017/05/10/uglifyjs-3-butternut-webpack-cli/"},"items":[{"category":"Headline","title":"Release Notes for Safari Technology Preview 29 | WebKit","url":"https://webkit.org/blog/7532/release-notes-for-safari-technology-preview-29/","tags":["safari","ReleaseNote","i18n"],"content":"Safari Technology Preview Release 29リリース。\n`Intl.DateTimeFormat.prototype.formatToParts`の実装、Web InspectorのBreak Pointの改善、読み込める画像リソースのホワイトリスト化(psdファイルは不可)など","relatedLinks":[]},{"category":"Headline","title":"Prepack · Partial evaluator for JavaScript","url":"https://prepack.io/","tags":["JavaScript","ECMAScript","Tools"],"content":"JavaScriptのAOTコンパイラ。\nBabylonでパースしたASTを元に実行できるinterpreterを持ち、その結果を用いてコードの最適化を行う目的のツール。","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.1 · mishoo/UglifyJS2","url":"https://github.com/mishoo/UglifyJS2/releases/tag/v3.0.1","tags":["JavaScript","library","ReleaseNote"],"content":"UglifyJS 3.0リリース。\n`--prefix`や`angular`オプションなどの削除、`screw_ie8`が`ie8`にリネームなど様々な破壊的変更が含まれている。\n`minify()`から`fs`依存が取り除かれ、結果をASTとして吐き出せるようになるなど","relatedLinks":[{"title":"unify CLI ","url":"https://github.com/mishoo/UglifyJS2/pull/1811"},{"title":"drop ","url":"https://github.com/mishoo/UglifyJS2/pull/1812"},{"title":"maybe https://github.com/mishoo/UglifyJS2/releases","url":"https://gist.github.com/azu/80d9b2e5f6ee42b2e78b73610c9c6967"}]},{"category":"Headline","title":"Jest 20: 💖 Delightful Testing & 🏃🏽 Multi-Project-Runner · Jest","url":"https://facebook.github.io/jest/blog/2017/05/06/jest-20-delightful-testing-multi-project-runner.html","tags":["JavaScript","testing","ReleaseNote"],"content":"Jest 20リリース。\nプロジェクトをまたいでテストを実行できるように、`expect`でPromiseのサポートを改善、`expect.assertions(n)`の追加、Jasmineをforkして使うように、CIではSnapshotを自動的に保存しないようになるなど","relatedLinks":[]},{"category":"Headline","title":"Announcing the new webpack CLI – webpack – Medium","url":"https://medium.com/webpack/announcing-the-new-webpack-cli-75ce1d9b8663","tags":["webpack","console","Tools"],"content":"webpack-cliがリリースされた。\n`init`と`migrate`サブコマンドがあり、v1からv2へのマイグレーションやscaffolding toolとして利用できる","relatedLinks":[{"title":"webpack/webpack-cli: webpack CLI","url":"https://github.com/webpack/webpack-cli"}]},{"category":"Headline","title":"| TypeScript 2.3: The Sexy Default Type Argument | Blog | SitePen","url":"https://www.sitepen.com/blog/2017/05/09/typescript-2-3-the-sexy-default-type-argument/","tags":["TypeScript"],"content":"TypeScript 2.3で入ったDefault type argumentsとcheckJSについて","relatedLinks":[]},{"category":"Headline","title":"Release 2.0.0 · socketio/socket.io","url":"https://github.com/socketio/socket.io/releases/tag/2.0.0","tags":["WebSocket","node.js","library","ReleaseNote"],"content":"Socket.IO 2.0.0リリース。\nuWebSocketsがデフォルトのwebsocketエンジンに、カスタムパーサを指定できるように、Engine.IOとSocket.IOのhandshakeをマージしてroundtripの削減など","relatedLinks":[{"title":"uWebSockets/uWebSockets: Tiny WebSockets","url":"https://github.com/uWebSockets/uWebSockets"},{"title":"Try to load uws by default, fall back to ws by kapouer · Pull Request #459 · socketio/engine.io","url":"https://github.com/socketio/engine.io/pull/459"}]},{"category":"Headline","title":"Release Almin 0.12 · almin/almin","url":"https://github.com/almin/almin/releases/tag/almin%400.12.3","tags":["JavaScript","library","ReleaseNote"],"content":"Almin 0.12リリース。\nデフォルトの`StoreGroup`を変更しType Safeとなるように、`Store#receivePayload`のライフサイクルの追加など。\nマイグレーションツールで0.11から移行できる。","relatedLinks":[{"title":"almin/migration-tools: Migration scripts for Almin.","url":"https://github.com/almin/migration-tools"}]},{"category":"Headline","title":"Nest FINAL release is here! Node.js framework built on top of TypeScript | Kamil Mysliwiec","url":"https://kamilmysliwiec.com/nest-final-release-is-here-node-js-framework-built-top-of-typescript/","tags":["TypeScript","node.js","library"],"content":"Node.jsのサーバフレームワークであるNest.jsについて","relatedLinks":[]},{"category":"Headline","title":"Release v0.46.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.46.0","tags":["flowtype","ReleaseNote"],"content":"Flow v0.46.0リリース。\nstrict arity checkの試験的実装など\n`experimental.strict_call_arity=true`","relatedLinks":[{"title":"Flow: A Static Type Checker for JavaScript","url":"https://flow.org/blog/2017/05/07/Strict-Function-Call-Arity/"}]},{"category":"Article","title":"CSS Variables — No, really! – Dev Channel – Medium","url":"https://medium.com/dev-channel/css-variables-no-really-76f8c91bd34e","tags":["CSS","tutorial","article"],"content":"CSS Variableについての解説記事。\n基本的な使い方やよくある質問について。\nまた、色や複数値の例、スコープやcalcとの組み合わせ、JavaScriptとの連携などについて書かれている。","relatedLinks":[]},{"category":"Article","title":"Build Yourself a Redux - The Zapier Engineering Blog - Zapier","url":"https://zapier.com/engineering/how-to-build-redux/","tags":["React","redux","tutorial","article"],"content":"Reduxを実装しながらReduxについて学ぶ記事。\nRedux/middleware/React Reduxを実装している","relatedLinks":[]},{"category":"Article","title":"util.promisify が追加された - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2017/05/10/101752","tags":["node.js","Promises"],"content":"Node.jsの`util.promisify`について。\nコールバック関数を受け取るNode.jsのコアメソッドをPromiseを返すように変換するUtilメソッド。","relatedLinks":[]},{"category":"Article","title":"Refer to the spec: What is all that stuff at the top of the spec?","url":"https://rachelandrew.co.uk/archives/2017/04/24/refer-to-the-spec-what-is-all-that-stuff-at-the-top-of-the-spec/","tags":["CSS","spec","article"],"content":"CSSの仕様の読み方についての連載","relatedLinks":[{"title":"Refer to the spec","url":"https://rachelandrew.co.uk/archives/2017/04/11/refer-to-the-spec/"}]},{"category":"Article","title":"ES6 Modules in Chrome Canary (M60+) – Dev Channel – Medium","url":"https://medium.com/dev-channel/es6-modules-in-chrome-canary-m60-ba588dfb8ab7","tags":["JavaScript","browser","ECMAScript","module"],"content":"ES modulesについて。 nonmodule属性とrollupを使って、未対応のブラウザと対応ブラウザでの配布方法の分岐について","relatedLinks":[]},{"category":"Article","title":"The :focus-within pseudo class | Ian Devlin","url":"https://www.iandevlin.com/blog/2017/04/css/the-focus-within-pseudo-class","tags":["CSS","article"],"content":"`:focus-within`擬似クラスについて。","relatedLinks":[]},{"category":"Article","title":"FuseBox 2.0 — The beast reborn – fusebox – Medium","url":"https://medium.com/fusebox/fusebox-2-0-the-beast-reborn-e4ec0443b782","tags":["JavaScript","Tools","serverless"],"content":"FuseBox 2.0リリース。\nConfiguration APIの変更、メソッドチェインでAPIを書けるように、Code Splitting  APIを追加、プラグインの追加、ドキュメントの更新など","relatedLinks":[]},{"category":"Article","title":"Idiomatic Redux · Mark's Dev Blog","url":"http://blog.isquaredsoftware.com/series/idiomatic-redux/","tags":["redux","article"],"content":"Reduxのパターンについての連載","relatedLinks":[]},{"category":"SlideVideo","title":"An Introduction to Glimmer - Sessions by Pusher","url":"https://pusher.com/sessions/meetup/ember-london/an-introduction-to-glimmer","tags":["JavaScript","slide","video"],"content":"Glimmerの基本的な使い方について発表","relatedLinks":[]},{"category":"SlideVideo","title":"Asynchronous JavaScript with async/await - Course by @mariusschulz @eggheadio","url":"https://egghead.io/courses/asynchronous-javascript-with-async-await","tags":["JavaScript","ECMAScript","Promises","video","tutorial"],"content":"async/awaitについてのスクリーンキャスト。\n基本的な使い方、Sequntially/Concurrently、エラーハンドリング/Proposalのasync iteratorについて","relatedLinks":[]},{"category":"SlideVideo","title":"Parsing JavaScript - better lazy than eager? - Google スライド","url":"https://docs.google.com/presentation/d/1b-ALt6W01nIxutFVFmXMOyd_6ou_6qqP6S0Prmb1iDs/present#slide=id.p","tags":["JavaScript","V8","slide"],"content":"JavaScriptのパースについてのスライド。\nパースとは何か、V8はどうやってパースしてるのか。\nまたウェブページのJavaScriptパースは全体の15-20％を占めるため、パース速度を改善するために開発者はどうするべきかについて。\n開発者ツールや`chrome://tracing`でのパース時間の読み方について","relatedLinks":[]},{"category":"SlideVideo","title":"Testing Made Easy: Better, Faster, Stronger Unit Tests and Integration Tests - Sessions by Pusher","url":"https://pusher.com/sessions/meetup/js-monthly-london/testing-made-easy-better-faster-stronger-unit-tests-and-integration-tests","tags":["JavaScript","browser","testing","video"],"content":"JavaScriptのテストについて。\nJestやCypress、StoryBookなどのユニットテスト/E2Eテストについての動画","relatedLinks":[]},{"category":"WebsiteDocument","title":"SpectorJS - Explore and Troubleshoot your WebGL scenes with ease","url":"http://spector.babylonjs.com/","tags":["WebGL","debug","browser","Chrome","Extension"],"content":"WebGLのデバッグツール。","relatedLinks":[]},{"category":"WebsiteDocument","title":"ESBench","url":"https://esbench.com/","tags":["babel","benchmark","webservice"],"content":"Babelで変換した結果を元にbenchmark.jsでマイクロベンチを取るサービス","relatedLinks":[]},{"category":"WebsiteDocument","title":"Web Hypertext Application Technology Working Group Working Mode","url":"https://whatwg.org/working-mode","tags":["WHATWG","document","spec"],"content":"WHATWG仕様の用語や仕様の追加/変更/削除のProcessについて書かれたドキュメント","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pmq20/node-compiler: Compiling your Node.js application into a single executable with dynamic require and all fs.\\* API support.","url":"https://github.com/pmq20/node-compiler","tags":["node.js","Tools"],"content":"Node.jsのアプリを1つの実行バイナリにするツール。","relatedLinks":[{"title":"Node.js Compiler: compiling your Node.js application into a single executable // Speaker Deck","url":"https://speakerdeck.com/pmq20/node-dot-js-compiler-compiling-your-node-dot-js-application-into-a-single-executable"}]},{"category":"SoftwareLibrary","title":"Rich-Harris/butternut: The fast, future-friendly minifier","url":"https://github.com/Rich-Harris/butternut","tags":["JavaScript","Tools"],"content":"高速である程度良い圧縮を目的にしたminifyツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"hshoff/vx: react + d3 = vx | visualization components","url":"https://github.com/hshoff/vx","tags":["React","d3.js","library"],"content":"React + D3.jsのビジュアライズコンポーネントライブラリ","relatedLinks":[]},{"category":"Book","title":"01alchemist/TurboScript: Super charged JavaScript / TypeScript for parallel programming which compiles to asm.js and WebAssembly","url":"https://github.com/01alchemist/TurboScript","tags":["JavaScript","TypeScript","asm.js","WebAssembly"],"content":"asm.js、wasmへの変換を目的にしたプログラミング言語。\nTypeScriptに似たSyntaxで型情報を扱う。","relatedLinks":[]},{"category":"Book","title":"O'Reilly Japan - SVGエッセンシャルズ 第2版","url":"https://www.oreilly.co.jp/books/9784873117973/","tags":["SVG","book"],"content":"2017年5月17日発売\nSVG Essentials, 2nd Editionの翻訳本","relatedLinks":[]}]},{"meta":{"title":"2017-05-15のJS: PostCSS 6.0、FuseBox 2.0、テストツールまとめ","author":"azu","layout":"post","date":"2017-05-15T10:34:23.405Z","category":"JSer","tags":["PostCSS","FuseBox","Testing"],"url":"https://jser.info/2017/05/15/postcss-6.0-fusebox-2.0/"},"items":[{"category":"Headline","title":"Nest FINAL release is here! Node.js framework built on top of TypeScript | Kamil Mysliwiec","url":"https://kamilmysliwiec.com/nest-final-release-is-here-node-js-framework-built-top-of-typescript/","tags":["TypeScript","node.js","library"],"content":"Node.jsのサーバフレームワークであるNest.jsについて","relatedLinks":[]},{"category":"Headline","title":"Release v0.46.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.46.0","tags":["flowtype","ReleaseNote"],"content":"Flow v0.46.0リリース。\nstrict arity checkの試験的実装など\n`experimental.strict_call_arity=true`","relatedLinks":[{"title":"Flow: A Static Type Checker for JavaScript","url":"https://flow.org/blog/2017/05/07/Strict-Function-Call-Arity/"}]},{"category":"Headline","title":"Release 6.0 “Marquis Orias” · postcss/postcss","url":"https://github.com/postcss/postcss/releases/tag/6.0.0","tags":["PostCSS","ReleaseNote"],"content":"PostCSS 6.0リリース。\nNode.js 0.12のサポート終了、`@apply`のサポート、APIの修正と改善、パーサの書き直しでメモリ消費量の改善など","relatedLinks":[]},{"category":"Headline","title":"JQuery Mobile 1.5.0-alpha.1 Released | jQuery Mobile","url":"http://blog.jquerymobile.com/2017/05/11/jquery-mobile-1-5-0-alpha-1-released/","tags":["jQuery","mobile","ReleaseNote"],"content":"JQuery Mobile 1.5.0-alpha.1リリース。\n`controlgroup`と`checkboxradio`のwidgetsを追加、既存widgetsのパフォーマンス改善、npmの正式サポート、jQuery 3.xのサポート、IE10以下/Android 4.0未満のサポート終了など","relatedLinks":[]},{"category":"Article","title":"Refer to the spec: What is all that stuff at the top of the spec?","url":"https://rachelandrew.co.uk/archives/2017/04/24/refer-to-the-spec-what-is-all-that-stuff-at-the-top-of-the-spec/","tags":["CSS","spec","article"],"content":"CSSの仕様の読み方についての連載","relatedLinks":[{"title":"Refer to the spec","url":"https://rachelandrew.co.uk/archives/2017/04/11/refer-to-the-spec/"}]},{"category":"Article","title":"ES6 Modules in Chrome Canary (M60+) – Dev Channel – Medium","url":"https://medium.com/dev-channel/es6-modules-in-chrome-canary-m60-ba588dfb8ab7","tags":["JavaScript","browser","ECMAScript","module"],"content":"ES modulesについて。 nonmodule属性とrollupを使って、未対応のブラウザと対応ブラウザでの配布方法の分岐について","relatedLinks":[]},{"category":"Article","title":"The :focus-within pseudo class | Ian Devlin","url":"https://www.iandevlin.com/blog/2017/04/css/the-focus-within-pseudo-class","tags":["CSS","article"],"content":"`:focus-within`擬似クラスについて。","relatedLinks":[]},{"category":"Article","title":"FuseBox 2.0 — The beast reborn – fusebox – Medium","url":"https://medium.com/fusebox/fusebox-2-0-the-beast-reborn-e4ec0443b782","tags":["JavaScript","Tools","serverless"],"content":"FuseBox 2.0リリース。\nConfiguration APIの変更、メソッドチェインでAPIを書けるように、Code Splitting  APIを追加、プラグインの追加、ドキュメントの更新など","relatedLinks":[]},{"category":"Article","title":"Idiomatic Redux · Mark's Dev Blog","url":"http://blog.isquaredsoftware.com/series/idiomatic-redux/","tags":["redux","article"],"content":"Reduxのパターンについての連載","relatedLinks":[]},{"category":"Article","title":"An Overview of JavaScript Testing in 2017 – powtoon-engineering – Medium","url":"https://medium.com/powtoon-engineering/a-complete-guide-to-testing-javascript-in-2017-a217b4cd5a2a","tags":["JavaScript","testing","library"],"content":"JavaScriptのテストツールについてのまとめ記事。\nUnit Tests/Integration Tests/Functional Testsといったテスト分類やテストツールの種類ごとにテストツールを紹介してる","relatedLinks":[]},{"category":"Article","title":"仕事で WebRTC","url":"https://gist.github.com/voluntas/379e48807635ed18ebdbcedd5f3beefa","tags":["WebRTC","opinion","article","JavaScript"],"content":"WebRTCのクライアントとサーバの選択についてのガイドライン","relatedLinks":[]},{"category":"Article","title":"ジャスト・イン・タイム (JIT) コンパイラの短期集中コース | Mozilla Developer Street (modest)","url":"https://dev.mozilla.jp/2017/05/%e3%82%b8%e3%83%a3%e3%82%b9%e3%83%88%e3%83%bb%e3%82%a4%e3%83%b3%e3%83%bb%e3%82%bf%e3%82%a4%e3%83%a0-jit-%e3%82%b3%e3%83%b3%e3%83%91%e3%82%a4%e3%83%a9%e3%81%ae%e3%82%af%e3%83%a9%e3%83%83%e3%82%b7/","tags":["JIT","JavaScript","翻訳","article"],"content":"JavaScriptのJITコンパイラの仕組みについて簡単に解説している記事。 何をどのようにどのようなタイミングで最適化するのかについて","relatedLinks":[]},{"category":"SlideVideo","title":"Testing Made Easy: Better, Faster, Stronger Unit Tests and Integration Tests - Sessions by Pusher","url":"https://pusher.com/sessions/meetup/js-monthly-london/testing-made-easy-better-faster-stronger-unit-tests-and-integration-tests","tags":["JavaScript","browser","testing","video"],"content":"JavaScriptのテストについて。\nJestやCypress、StoryBookなどのユニットテスト/E2Eテストについての動画","relatedLinks":[]},{"category":"SlideVideo","title":"Profiling Paint Perf 🔎 🎨 - YouTube","url":"https://www.youtube.com/watch?v=Wfxm56ttAmE","tags":["performance","video","browser"],"content":"`element.left`によってスタイルを変更した時に、1Frame内に余計なレンダリングの処理が発生しているのを改善していくスクリーンキャスト。\nCSS Triggersを参照し、`transform`にすること改善できることを見ていき修正する流れについて","relatedLinks":[{"title":"CSS Triggers","url":"https://csstriggers.com/"}]},{"category":"SlideVideo","title":"JSConf EU 2017 \\[More videos added daily\\] - YouTube","url":"https://www.youtube.com/watch?v=NpKLt_YO3o8&list=PL37ZVnwpeshFmAPr65sU2O5WMs7_CGjs_","tags":["JavaScript","イベント","video"],"content":"JSConf EU 2017の動画","relatedLinks":[]},{"category":"SlideVideo","title":"What's new in ChakraCore | Build 2017 | Channel 9","url":"https://channel9.msdn.com/Events/Build/2017/P4103","tags":["ChakraCore","video"],"content":"ChakraCoreの最近の変更点について発表動画","relatedLinks":[]},{"category":"SoftwareLibrary","title":"hshoff/vx: react + d3 = vx | visualization components","url":"https://github.com/hshoff/vx","tags":["React","d3.js","library"],"content":"React + D3.jsのビジュアライズコンポーネントライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"WebReflection/introspected: Introspection for serializable arrays and JSON friendly objects.","url":"https://github.com/WebReflection/introspected","tags":["JavaScript","library"],"content":"Proxyや`Symbol.toPrimitive`を使って、オブジェクトに変更検知、Null Propagation的な機能を持たせるラッパーライブラリ","relatedLinks":[]},{"category":"Book","title":"きちんとわかる! JavaScript とことん入門 | 大津 真 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/%E3%81%8D%E3%81%A1%E3%82%93%E3%81%A8%E3%82%8F%E3%81%8B%E3%82%8B-JavaScript-%E3%81%A8%E3%81%93%E3%81%A8%E3%82%93%E5%85%A5%E9%96%80-%E5%A4%A7%E6%B4%A5-%E7%9C%9F/dp/4774190004","tags":["JavaScript","book"],"content":"2017年6月7日発売\nJavaScriptの入門書","relatedLinks":[]}]},{"meta":{"title":"2017-05-22のJS: Safari TP 30、Polymer 2.0とBower、Create React App 1.0.0","author":"azu","layout":"post","date":"2017-05-22T10:59:03.315Z","category":"JSer","tags":["Safari","Polymer","Bower","React"],"url":"https://jser.info/2017/05/22/safari-tp-30-polymer-2.0bower-create-react-app-1.0.0/"},"items":[{"category":"Headline","title":"Release Notes for Safari Technology Preview 30 | WebKit","url":"https://webkit.org/blog/7614/release-notes-for-safari-technology-preview-30/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 30リリース。\nSubresource Integrity(SRI)、`X-Content-Type-Options:nosniff`に対応、PromiseのUnhandled rejectionのイベントをサポート。\n`document.cookie`のアクセスを厳密化、WAI-ARIA周りの修正など","relatedLinks":[]},{"category":"Headline","title":"Time for 2.0 - Polymer Project","url":"https://www.polymer-project.org/blog/2017-05-15-time-for-two","tags":["WebComponents","JavaScript","library","ReleaseNote"],"content":"Polymer 2.0リリース。\nクラスベースで書けるように、Polymer CLIも併せてメジャーアップデートされた","relatedLinks":[{"title":"Release Stable Release 2.0.0 · Polymer/polymer","url":"https://github.com/Polymer/polymer/releases/tag/v2.0.0"},{"title":"What","url":"https://www.polymer-project.org/2.0/docs/about_20"}]},{"category":"Headline","title":"Release 7.0 “Coelestem adspicit lucem” · postcss/autoprefixer","url":"https://github.com/postcss/autoprefixer/releases/tag/7.0.0","tags":["CSS","ReleaseNote"],"content":"Autoprefixer 7.0リリース。\nPostCSS 6.0、Browserslist 2.0、caniuse-liteを利用するように。\nNode.js 0.12のサポート終了、Grid Layoutのサポートをデフォルトではオフに、コードベースがCoffeeScriptからBabelへ移行など","relatedLinks":[{"title":"Autoprefixer 7.0 and Browserslist 2.0 — Martian Chronicles, Evil Martians’ team blog","url":"https://evilmartians.com/chronicles/autoprefixer-7-browserslist-2-released"}]},{"category":"Headline","title":"ESLint v4.0.0-beta.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2017/05/eslint-v4.0.0-beta.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 4.0.0βリリース。","relatedLinks":[{"title":"ESLint v4.0.0 の変更点まとめ - Qiita","url":"http://qiita.com/mysticatea/items/3d01452d76ea6c943793"}]},{"category":"Headline","title":"Add yarn and webpack recommendation from bower.io to readme Fixes #2298 by graingert · Pull Request #2458 · bower/bower","url":"https://github.com/bower/bower/pull/2458","tags":["JavaScript","Tools","news"],"content":"Bowerが`npm deprecate`となり正式に非推奨となった。\nメンテナンスは続けられるが、Bowerの将来に興味がある人はメールで連絡をくださいとのこと。","relatedLinks":[{"title":"Consider deprecating Bower. · Issue #2298 · bower/bower","url":"https://github.com/bower/bower/issues/2298#issuecomment-302792690"}]},{"category":"Headline","title":"Release v1.0.0 · facebookincubator/create-react-app","url":"https://github.com/facebookincubator/create-react-app/releases/tag/v1.0.0","tags":["React","Tools","ReleaseNote"],"content":"create-react-app v1.0.0リリース。\nwebpack 2、ランタイムエラーの表示、Service Workerの対応、Jest 20、Dynamic importを使ったコード分割など","relatedLinks":[{"title":"What","url":"https://facebook.github.io/react/blog/2017/05/18/whats-new-in-create-react-app.html"}]},{"category":"Article","title":"ZEIT – Next 3.0 Preview","url":"https://zeit.co/blog/next3-preview","tags":["JavaScript","React","サーバー","ReleaseNote"],"content":"Next 3.0 プレビューリリース。\n`next export`で静的なHTMLとして出力できるように、コンポーネントのdynamic importをサポートなど","relatedLinks":[]},{"category":"Article","title":"Developer Edition 54: New inspector and debugger features, MDN help in the netmonitor, and more ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2017/03/developer-edition-54-new-inspector-and-debugger-features/","tags":["firefox","debug","article"],"content":"Firefox 54の開発者ツールの変更点紹介。\nCSS Inspectの改善、Debuggerパネルで整形版が別タブで開けたり、ツールチップで変数の表示、Network PanelでMore Infoからヘルプへの移動、JSON Viewなど","relatedLinks":[]},{"category":"Article","title":"JavaScript のもう一つの「関数名」 —— name プロパティ - Qiita","url":"http://qiita.com/8x9/items/34272b59b5aa68e33256","tags":["JavaScript","article"],"content":"JavaScriptのFunctionの`name`プロパティについて。\nES2015から無名関数やArrow Functionなど関数自体が名前を持ってなくても、変数宣言側の名前が`name`プロパティで参照できることや、`writable`属性の仕様についてなど","relatedLinks":[]},{"category":"Article","title":"The Many Faces of Functions in JavaScript - Bocoup","url":"https://bocoup.com/blog/the-many-faces-of-functions-in-javascript","tags":["JavaScript","ECMAScript","article"],"content":"JavaScriptの色々な\"関数\"についての解説","relatedLinks":[]},{"category":"SlideVideo","title":"A Modern Front-End Workflow – Umar Hansa | Render 2017 - YouTube","url":"https://www.youtube.com/watch?v=v5r_n6Tq0uk","tags":["Chrome","debug","video"],"content":"Chrome開発者ツールのTipsやデバッグワークフローについての発表動画","relatedLinks":[]},{"category":"SlideVideo","title":"The Future of Audio and Video on the Web (Google I/O '17) - YouTube","url":"https://www.youtube.com/watch?v=z9unKFzAj1w","tags":["google","video","JavaScript","ProgressiveWebApp"],"content":"ウェブサイトにおける動画や音楽のPWA対応についての発表動画。\nServiceWorkerを使ったオフライン対応、回転とフルスクリーン、 Media Capabilitiesを使った再生判定、MediaSession APIでのカバー表示など","relatedLinks":[{"title":"GoogleChrome/sample-media-pwa: A sample video-on-demand media Progressive Web App","url":"https://github.com/GoogleChrome/sample-media-pwa"},{"title":"Customize Media Notifications and Handle Playlists  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/02/media-session"},{"title":"google/shaka-player: JavaScript player library / DASH client / MSE-EME player","url":"https://github.com/google/shaka-player"}]},{"category":"SlideVideo","title":"Web Performance: Leveraging the Metrics that Most Affect User Experience (Google I/O '17) - YouTube","url":"https://www.youtube.com/watch?v=6Ljq-Jn-EgU&index=71&list=PLOU2XLYxmsIKC8eODk_RNCWv3fBcLvMMy","tags":["browser","performance","video"],"content":"パフォーマンスとメトリクスについての発表動画。\nロード完了ではなくインタラクティブになった時間(TTI)を計測、Hero Elements。UXとメトリクス\nLong Tasks(50ms)をPerformanceObserverで検出、操作の遅延の計測、改善のパターンについて","relatedLinks":[{"title":"GoogleChrome/tti-polyfill: TTI polyfill","url":"https://github.com/GoogleChrome/tti-polyfill"}]},{"category":"SlideVideo","title":"CSS Houdini- the bridge between CSS, JavaScript and the browser by Serg Hospodarets","url":"http://slides.com/malyw/houdini-codemotion#/","tags":["CSS","slide"],"content":"CSS Houdiniについてのスライド。\nCSS/JavaScript/ブラウザの連携、Workletについて","relatedLinks":[]},{"category":"SlideVideo","title":" Google I/O 2017 - All Sessions - YouTube","url":"http://www.youtube.com/playlist?list=PLOU2XLYxmsIKC8eODk_RNCWv3fBcLvMMy","tags":["google","video","イベント"],"content":"Google I/O 2017の動画まとめ","relatedLinks":[]},{"category":"SlideVideo","title":" JSConf EU 2017 - YouTube","url":"https://www.youtube.com/playlist?list=PL37ZVnwpeshFmAPr65sU2O5WMs7_CGjs_","tags":["JavaScript","イベント","video"],"content":"JSConf EU 2017の動画一覧","relatedLinks":[]},{"category":"WebsiteDocument","title":"Don't Overcomplicate Javascript – Bits from Nikola Ristic ∞ ƒront-end ∆eveloper","url":"https://bits.ristic.io/dont-overcomplicate-javascript-0","tags":["redux","opinion"],"content":"JavaScriptにおけるカーゴカルトについての連載。よく理解しないでコードの習慣を持ち込むことは技術的負債や複雑性を持ち込む可能性があることについて。\nReduxにおけるActionの定数のパターンについて。`import * as Constants from \"./constants\"`の問題点についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"HN PWA - Hacker News readers as Progressive Web Apps","url":"https://hnpwa.com/","tags":["JavaScript","ProgressiveWebApp","example"],"content":"Hacker Newsを色々なViewフレームワークで実装したまとめ。","relatedLinks":[{"title":"Hacker News APIがTodoMVC的な場所になってる | Web Scratch","url":"http://efcl.info/2014/10/11/hackernews-api/"}]},{"category":"SoftwareLibrary","title":"diegomura/react-pdf: Create PDF files using React","url":"https://github.com/diegomura/react-pdf","tags":["React","PDF","library"],"content":"Reactコンポーネントとしてレイアウトなどを書きPDFを生成するライブラリ","relatedLinks":[]},{"category":"Book","title":"Complete Redux Book by Ilya Gelman et al. \\[PDF/iPad/Kindle\\]","url":"https://leanpub.com/redux-book","tags":["redux","book"],"content":"Reduxについての電子書籍","relatedLinks":[]}]},{"meta":{"title":"2017-05-30のJS: npm 5.0.0プレリリースとNode.js 8.0.0、Chrome 60の開発者ツール","author":"azu","layout":"post","date":"2017-05-30T00:11:15.307Z","category":"JSer","tags":["npm","Node.js","yarn","Chrome"],"url":"https://jser.info/2017/05/30/npm-5.0.0node.js-8.0.0-yarn-chrome-60/"},"items":[{"category":"Headline","title":"\\[WIP\\] 8.0.0 Release Proposal by jasnell · Pull Request #12220 · nodejs/node","url":"https://github.com/nodejs/node/pull/12220#issuecomment-303699926","tags":["node.js","ReleaseNote"],"content":"Node.js 8.0.0 RC1リリース","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · npm/npm","url":"https://github.com/npm/npm/releases/tag/v5.0.0","tags":["ReleaseNote","npm"],"content":"npm v5.0.0プレリリース。 ローカルパスのnpm installはsymlinkとなるように、`--save`がデフォルト化、Gitで依存してるモジュールも`prepare`が呼ばれるように、`package-lock.json`の導入、インストール速度の改善、`--offline`、`sha512`のサポートなど","relatedLinks":[{"title":"npm v5 がリリースされた - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2017/05/30/090602"}]},{"category":"Article","title":"All About Recursion, PTC, TCO and STC in JavaScript","url":"http://lucasfcosta.com/2017/05/08/All-About-Recursion-PTC-TCO-and-STC-in-JavaScript.html","tags":["JavaScript","ECMAScript","article"],"content":"JavaScriptの末尾呼び出し最適化についての解説記事。\nProper Tail Calls (PTC)、Syntactic Tail Calls (STC)について","relatedLinks":[]},{"category":"Article","title":"Altering the DOM with JavaScript | Zell Liew","url":"https://zellwk.com/blog/js-in-dom/","tags":["DOM","JavaScript","tutorial"],"content":"DOM APIの基本的な使い方のついての記事。\n`querySelector`での要素選択、`addEventListener`でのイベント登録、`classList`でのクラス処理、要素の追加/更新などについて","relatedLinks":[]},{"category":"Article","title":"TypeScriptのInterfaceとType aliasの比較 - Qiita","url":"http://qiita.com/tkrkt/items/d01b96363e58a7df830e","tags":["TypeScript"],"content":"TypeScriptの`interface`と`type` aliasについての比較まとめ","relatedLinks":[]},{"category":"Article","title":"Node.js Streams: Everything you need to know – freeCodeCamp","url":"https://medium.freecodecamp.com/node-js-streams-everything-you-need-to-know-c9141306be93","tags":["node.js","stream","article"],"content":"Node.jsのStreamについての解説記事","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 60)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/05/devtools-release-notes","tags":["Chrome","debug","article"],"content":"Chrome 60の開発者ツールについて。\nAuditがLighthouseを使ったものに変更。\nthird party badgesの表示、ブレークポイントでContinue to hereの追加、コードカバレッジ表示の改善、Asyncスタックトレースがデフォルト化など","relatedLinks":[{"title":"GoogleChrome/lighthouse: Auditing, performance metrics, and best practices for Progressive Web Apps","url":"https://github.com/GoogleChrome/lighthouse"}]},{"category":"Article","title":"Using Fetch | CSS-Tricks","url":"https://css-tricks.com/using-fetch/","tags":["JavaScript","tutorial","article"],"content":"Fetch APIの使い方についての解説。\nデータの取得、エラーハンドリング、レスポンスの処理、FetchのラッパーであるzlFetchについて","relatedLinks":[]},{"category":"Article","title":"Event Bubbling in JavaScript? Event Propagation Explained","url":"https://www.sitepoint.com/event-bubbling-javascript/","tags":["DOM","event","article"],"content":"DOMのイベントバブリングとキャプチャフェーズについての解説。\n`target`、`currentTarget`、`eventPhasee`を使ってイベントの動きを可視化してる","relatedLinks":[]},{"category":"SlideVideo","title":"ReactEurope 2017 - Day 1 - YouTube","url":"http://www.youtube.com/playlist?list=PLCC436JpVnK3ruJeDWd-xWIMb0l47VcxD","tags":["React","イベント","video"],"content":"ReactEurope 2017の動画一覧","relatedLinks":[{"title":"ReactEurope 2017 - Day 2 - YouTube","url":"https://www.youtube.com/playlist?list=PLCC436JpVnK3KpieWtxYN6aC2-exR_IxH"},{"title":"Lightning Talks 2017 - YouTube","url":"https://www.youtube.com/playlist?list=PLCC436JpVnK25dtw5NX7yNhzBa2lPwN05"}]},{"category":"SlideVideo","title":"What I Learned Benchmarking React - Dominic Gannaway aka @trueadm at @ReactEurope 2017 - YouTube","url":"https://www.youtube.com/watch?v=djOc1EK07Tk","tags":["JavaScript","library","performance","video"],"content":"JavaScriptライブラリのベンチマーク結果を改善する方法について。\nRollupを使ってflat bundleすることでサイズとロード時間の削減、使わないモジュールの削除、ベンチマークツールについて。\nlighthouseを使ったモジュールのベンチマークについて","relatedLinks":[{"title":"react/benchmark.js at f0df495f9a97c0f24a3c20761244dab7da99bd77 · facebook/react","url":"https://github.com/facebook/react/blob/f0df495f9a97c0f24a3c20761244dab7da99bd77/scripts/bench/benchmark.js"}]},{"category":"SlideVideo","title":"Keynote - Andrew Clark aka @acdlite at @ReactEurope 2017 - YouTube","url":"https://www.youtube.com/watch?v=QW5TE4vrklU","tags":["React","video"],"content":"Reactの今後のロードマップについての発表。\nReact v16ではFragmentsサポート、Portal、Fiber(opt-in)、エラーハンドリングの強化が行われる。\nそれ以降は可視領域の優先度スケジューラ、Code Spilittingの改善など","relatedLinks":[]},{"category":"SlideVideo","title":"How Streaming Can Supercharge React - Sasha Aickin aka @xander76 at ReactEurope 2017 - YouTube","url":"https://www.youtube.com/watch?v=UhdGiVy3_Nk","tags":["React","サーバー","video","performance"],"content":"Reactとサーバサイドレンダリングについての発表動画。\nSSRには表示を早くするメリットがあるがTTIは長くなる問題がある。\nこれを解決するために、一定のブロックでコンポーネントをプログレッシブにレンダリングすることでTTIを改善する案について。\nまた、Reactに`ReactDOMServerStream`が追加されたことについて。","relatedLinks":[{"title":"deepanjanroy/tti-polyfill: Polyfill for Time to Interactive","url":"https://github.com/deepanjanroy/tti-polyfill"},{"title":"HTTP2 を前提とした HTML+CSS コンポーネントのレンダリングパス最適化について | blog.jxck.io","url":"https://blog.jxck.io/entries/2016-02-15/loading-css-over-http2.html"},{"title":"Add package builds for new server renderer and enable tests by sebmarkbage · Pull Request #9710 · facebook/react","url":"https://github.com/facebook/react/pull/9710"}]},{"category":"SlideVideo","title":"ECMAScript 2017: what’s new for JavaScript? // Speaker Deck","url":"https://speakerdeck.com/rauschma/ecmascript-2017-whats-new-for-javascript","tags":["ECMAScript","slide"],"content":"ECMAScriptのProposalのプロセスとES2017についてのスライド。\nES2017で追加されるAsync Function、Shared Array Buffer、Object/Stringの追加メソッド、関数の引数における末尾カンマの許容について。\nまた現在Proposal段階の仕様の紹介","relatedLinks":[{"title":"tc39/proposals: Tracking ECMAScript Proposals","url":"https://github.com/tc39/proposals"}]},{"category":"SlideVideo","title":"CSS and the First Meaningful Paint - Sessions by Pusher","url":"https://pusher.com/sessions/meetup/london-css/css-and-the-first-meaningful-paint","tags":["CSS","performance","video","browser","HTTP2"],"content":"CSSとFirst meaningful paintについての発表動画。\nInline CSSのメリット/デメリット、RTTとレイテンシー、クリティカルパスなリソースについて。\nリソースのpreload、Server Pushについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"ngryman/speedracer: Collect performance metrics for your library/application.","url":"https://github.com/ngryman/speedracer","tags":["browser","Chrome","performance","Tools"],"content":"Chrome DevTools protocolを使いCLIでページの表示にかかる時間などのパフォーマンステストを行えるツール","relatedLinks":[]},{"category":"WebsiteDocument","title":"What does my npm module cost?","url":"https://cost-of-modules.herokuapp.com/","tags":["webservice","npm","Tools"],"content":"npmパッケージのサイズ/gzip、ダウンロードにかかる時間や依存などを表示してくれるサービス","relatedLinks":[]},{"category":"SoftwareLibrary","title":"photopea/UPNG.js: Fast and advanced PNG encoder (lossy / lossless) and decoder","url":"https://github.com/photopea/UPNG.js","tags":["JavaScript","library"],"content":"小さなPNGエンコード/デコードライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"scssfmt - Standard SCSS code formatter","url":"http://scssfmt.com/","tags":["Sass","Tools","CSS","console"],"content":"sass(SCSS)のコード整形ツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"developit/preact-cli: 😺 Your next Preact PWA starts in 30 seconds.","url":"https://github.com/developit/preact-cli","tags":["JavaScript","Tools","library"],"content":"preactのCLIツール。\npreactを使ったScaffoldingツールで、create/build/watch/serveなどの開発用のサブコマンドを持っている","relatedLinks":[]}]},{"meta":{"title":"2017-06-05のJS: Node.js 8.0.0、npm canary、Mocha to Jest","author":"azu","layout":"post","date":"2017-06-05T08:45:58.982Z","category":"JSer","tags":["Node.js","npm","Mocha","Jest","testing"],"url":"https://jser.info/2017/06/05/node.js-8.0.0-npm-canary-mocha-to-jest/"},"items":[{"category":"Headline","title":"Node v8.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v8.0.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 8.0.0リリース。\nnpm 5.0.0、V8 5.8、N-API(Node.js API)、`async_hooks`、WHATWG URLを正式サポート、`Buffer`コンストラクタのzero-filledをデフォルト化、`util.promisify`の追加、Node.jsが生成するErrorに`code`がつくように。\nまた`--debug`が廃止され`--inspect`でデバッガーと連携できるようになるなど","relatedLinks":[{"title":"Node8の注目的変更まとめ - 技術探し","url":"http://abouthiroppy.hatenablog.jp/entry/2017/05/30/090015"}]},{"category":"Headline","title":"npm/CHANGELOG.md at v5.0.1 · npm/npm","url":"https://github.com/npm/npm/blob/v5.0.1/CHANGELOG.md","tags":["npm","ReleaseNote"],"content":"npm 5.0.1リリース。\n5.0.0のバグ修正が中心。余計なassertionを削除してインストール速度の改善など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 31 | WebKit","url":"https://webkit.org/blog/7622/release-notes-for-safari-technology-preview-31/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 31リリース。\n`preload`で`as`や`type`属性のサポート、Access-Control-Allow-Originのエラーメッセージを改善など","relatedLinks":[{"title":"162819 – Improve error message for Access-Control-Allow-Origin violation due to misconfigured server","url":"https://bugs.webkit.org/show_bug.cgi?id=162819"},{"title":"321517 - Developer tools misleading error description on CORS XHR with multiple Access-Control-Allow-Origin response headers - chromium - Monorail","url":"https://bugs.chromium.org/p/chromium/issues/detail?id=321517"}]},{"category":"Headline","title":"N-API: Next generation Node.js APIs for native modules","url":"https://medium.com/@nodejs/n-api-next-generation-node-js-apis-for-native-modules-169af5235b06","tags":["C++","ChakraCore","V8","node.js"],"content":"Node.js 8.0.0で導入されたN-APIについて。 いままでネイティブモジュールを書く際にNANなどもあったが、それはV8に依存していたためAPI/ABI stabilityに問題があった。 N-APIではABI-stableな中間レイヤーを入れる。これによりNode-ChacraCoreなどでも互換APIが整備されている","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.2 · npm/npm","url":"https://github.com/npm/npm/releases/tag/v5.0.2","tags":["ReleaseNote","npm"],"content":"npm 5.0.2リリース。 `npm i -g npmc`でnpmのcanary版がインストールできるように。 インストールの出力結果の改善など","relatedLinks":[]},{"category":"Headline","title":"Announcing Meteor 1.5 – Meteor Blog","url":"https://blog.meteor.com/announcing-meteor-1-5-b82be66571bb","tags":["JavaScript","library","ree"],"content":"Meteor 1.5リリース。\nCode splitting、Dynamic import、bundle解析ツールの追加など","relatedLinks":[{"title":"meteor/History.md at master · meteor/meteor","url":"https://github.com/meteor/meteor/blob/master/History.md#v15-2017-05-30"}]},{"category":"Article","title":"Introduction to State Management in Angular v2+ – OlricDigital – Medium","url":"https://medium.com/olricdigital/introduction-to-state-management-in-angular-v2-ef6f5144bade","tags":["AngularJS"],"content":"Angularでのステート管理について。\n`@ngrx/store`を使ったステート管理の解説","relatedLinks":[]},{"category":"Article","title":"HTTP/2 push is tougher than I thought - JakeArchibald.com","url":"https://jakearchibald.com/2017/h2-push-tougher-than-i-thought/","tags":["HTTP2","browser"],"content":"HTTP/2 Server Pushに関するブラウザごとの挙動についてのまとめ","relatedLinks":[]},{"category":"Article","title":"Whats new for streams in Node 8 – Calvin Metcalf – Medium","url":"https://medium.com/@CWMma/whats-new-for-streams-in-node-8-736d431083df","tags":["node.js"],"content":"Node.js 8.0.0でStreamに追加された`destroy`について","relatedLinks":[]},{"category":"Article","title":"Redux vs MobX: Which Is Best for Your Project? — SitePoint","url":"https://www.sitepoint.com/redux-vs-mobx-which-is-best/","tags":["JavaScript","library","opinion","redux"],"content":"ReduxとMobXの比較。 それぞれの特徴や書き方の違いなどについて雑感が書かれている","relatedLinks":[]},{"category":"Article","title":"Into the Great Unknown — Migrating from Mocha to Jest","url":"https://ebaytech.berlin/into-the-great-unknown-migrating-from-mocha-to-jest-3baced083c7e","tags":["JavaScript","testing","article"],"content":"MochaからJestへテストを移行した話。\ncodemodを使ったマイグレーション、js以外を読み込んでいた時のhook処理、ESLintの設定など。\nまた複雑なテストやchaiの拡張を使っている場合に自動で移行できないケースについて","relatedLinks":[]},{"category":"Article","title":"Announcing Storybook 3.0 – Storybook – Medium","url":"https://medium.com/storybookjs/announcing-storybook-3-0-329748b8f4cd","tags":["React","library","document","testing","ReleaseNote"],"content":"Reactのコンポーネント開発環境ツールであるStorybook 3.0リリース。\n開発の主体がKadiraからコミュニティへ、webpack 2の対応、スナップショットテストを行う`storyshots`のサポートなど","relatedLinks":[{"title":"Releases · storybooks/storybook","url":"https://github.com/storybooks/storybook/releases"}]},{"category":"SlideVideo","title":"RailsエンジニアがReactを始めてSSRとReduxとTypeScriptを導入するまで | bitjourney Kibela","url":"https://bitjourney.kibe.la/shared/entries/5c77844d-9856-4f1c-b689-44b1ee3d450a","tags":["React","TypeScript","rails","slide"],"content":"Railsの環境にReact+Reduxとサーバサイドレンダリングを導入するまでの話。\n後からTypeScriptを導入した流れについて。","relatedLinks":[]},{"category":"WebsiteDocument","title":"WebAssembly and Friends Roadmap","url":"https://wasmdash.appspot.com/","tags":["Chrome","WebAssembly"],"content":"Chromeのwasm関係のロードマップ","relatedLinks":[]},{"category":"WebsiteDocument","title":"MIL WebDNN","url":"https://mil-tokyo.github.io/webdnn/","tags":["WebAssembly","機械学習"],"content":"WebGPU、WebAssembly、JavaScriptのFallbackを持ったディープニューラルネットワーク(DNN)の実行環境の実装。\nブラウザ上で高速に処理することが目的。","relatedLinks":[{"title":"MIL WebDNN(日本語)","url":"https://mil-tokyo.github.io/webdnn/ja/"}]},{"category":"SoftwareLibrary","title":"picodom/picodom: 1kb Virtual DOM builder and patch algorithm.","url":"https://github.com/picodom/picodom","tags":["VirtualDOM","JavaScript","library"],"content":"小さなVirtual DOM実装ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Birdview","url":"http://achrafkassioui.com/birdview/","tags":["JavaScript","library"],"content":"サイト全体を俯瞰する表示に切り替えることができるライブラリ","relatedLinks":[]},{"category":"Book","title":"O'Reilly Japan - サーバーレスシングルページアプリケーション","url":"https://www.oreilly.co.jp/books/9784873118062/","tags":["serverless","JavaScript","book"],"content":"2017年06月23日発売\naws lambdaなど使ったサーバレスのSPAについての書籍","relatedLinks":[]},{"category":"Book","title":"基礎からわかる Elm | 鳥居 陽介 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/%E5%9F%BA%E7%A4%8E%E3%81%8B%E3%82%89%E3%82%8F%E3%81%8B%E3%82%8B-Elm-%E9%B3%A5%E5%B1%85-%E9%99%BD%E4%BB%8B/dp/4863542224","tags":["program","book"],"content":"2017年7月14日発売\nElmについての書籍","relatedLinks":[]},{"category":"Book","title":"Get Programming with JavaScript Next: New features of ECMAScript 2015, 2016, and beyond: J. D. Isaacks: 9781617294204: Amazon.com: Books","url":"https://www.amazon.com/Get-Programming-JavaScript-Next-ECMAScript/dp/1617294209","tags":["JavaScript","book"],"content":"2017年12月30日発売\nES2015以降について扱う書籍","relatedLinks":[]}]},{"meta":{"title":"2017-06-12のJS: Safari 11.0、prettier 1.4.0、ESLint 4.0.0","author":"azu","layout":"post","date":"2017-06-12T13:01:39.872Z","category":"JSer","tags":["Safari","TypeScript","PostCSS","ESLint"],"url":"https://jser.info/2017/06/12/safari-11.0-prettier-1.4.0-eslint-4.0.0/"},"items":[{"category":"Headline","title":"Release v3.0.0-rc.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v3.0.0-rc.0","tags":["webpack","ReleaseNote"],"content":"webpack 3.0.0 RC0リリース。\nRollupのようなScope Hoisting(inlining)を行うプラグインの追加、`output.libraryExport`のサポート、`node: false`でnode関係はまとめて無効化できるようになるなど","relatedLinks":[{"title":"The cost of small modules | Read the Tea Leaves","url":"https://nolanlawson.com/2016/08/15/the-cost-of-small-modules/"}]},{"category":"Headline","title":"Safari 11.0","url":"https://developer.apple.com/library/content/releasenotes/General/WhatsNewInSafari/Safari_11_0/Safari_11_0.html","tags":["safari","ReleaseNote"],"content":"Safari 11.0 (プレ)リリース。\nWebRTC、WebAssermbly、Media Capture API、WebCrypto APIのアルゴリズム追加、Resource timing APIのサポート。\nCSSではVariable fonts、CSS strokeのサポート。\nホームスクリーンアプリでWebKitの機能をサポート、追跡Cookieの削除/隔離など","relatedLinks":[]},{"category":"Headline","title":"Release 1.4.0: TypeScript and CSS support · prettier/prettier","url":"https://github.com/prettier/prettier/releases/tag/1.4.0","tags":["JavaScript","TypeScript","CSS","Tools","ReleaseNote"],"content":"prettier 1.4.0リリース。\nTypeScript(`.ts`と`.tsx`)、CSS、Less、SCSSをサポート。\nエディタ向けに`cursorOffset`を追加、整形周りの細かい修正など","relatedLinks":[]},{"category":"Headline","title":"Release Release v1.0.0 · yahoo/pure","url":"https://github.com/yahoo/pure/releases/tag/v1.0.0","tags":["CSS","ReleaseNote"],"content":"PureCSS 1.0.0リリース。\n互換性はあるので1.0.0へバージョンを上げただけの変更","relatedLinks":[]},{"category":"Headline","title":"Microsoft Edge build 16215 changelog - Microsoft Edge Development","url":"https://developer.microsoft.com/en-us/microsoft-edge/platform/changelog/desktop/16215/","tags":["MSEdge","ReleaseNote"],"content":"Windows 10 build 16215/MSEdgeリリース。\nShared Memory、Passive Event、`object-fit`、`position: sticky`、`object-position`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"V8 JavaScript Engine: V8 Release 6.0","url":"https://v8project.blogspot.com/2017/06/v8-release-60.html","tags":["V8","ReleaseNote"],"content":"V8 6.0リリース。\nSharedArrayBuffer、Object rest/spread properties、パフォーマンス改善など","relatedLinks":[]},{"category":"Headline","title":"ESLint v4.0.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2017/06/eslint-v4.0.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 4.0.0リリース。\n`eslint:recommended`の更新、設定ファイルの厳密化、`indent`ルールなどの挙動変更、ルール向けのAPI変更など","relatedLinks":[{"title":"ESLint v4.0.0 の変更点まとめ - Qiita","url":"http://qiita.com/mysticatea/items/3d01452d76ea6c943793"},{"title":"Migrating to v4.0.0 - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/docs/user-guide/migrating-to-4.0.0"}]},{"category":"Headline","title":"Safari Technology Preview 32, with WebRTC, is Now Available | WebKit","url":"https://webkit.org/blog/7627/safari-technology-preview-32/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 32リリース。\nSafari 11相当でWebRTC、WebAssemblyなどのサポート","relatedLinks":[]},{"category":"Headline","title":"esprima/ChangeLog at 4.0.0 · jquery/esprima","url":"https://github.com/jquery/esprima/blob/4.0.0/ChangeLog","tags":["JavaScript","AST","library","ReleaseNote"],"content":"Esprima 4.0.0リリース。\nES2017 async/await、関数引数の末尾カンマのサポート、仕様の追従など","relatedLinks":[]},{"category":"Article","title":"Node.js 8: \\`util.promisify()\\`","url":"http://2ality.com/2017/05/util-promisify.html","tags":["node.js","Promises"],"content":"Node.js 8.0.0で追加された`util.promisify`についての解説。\n基本的なPromiseへの変換方法、`symbol util.promisify`のsymbolを使った`util.promisify`対応の関数定義についてなど","relatedLinks":[{"title":"util.promisify が追加された - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2017/05/10/101752"}]},{"category":"Article","title":"WebAssembly 101: a developer's first steps","url":"http://blog.openbloc.fr/webassembly-first-steps/","tags":["WebAssembly","tutorial"],"content":"WebAssembly入門。\nJavaScriptとの連携方法やベンチマークについてを簡潔に解説","relatedLinks":[]},{"category":"Article","title":"React/Redux/Node.jsのSSR/SPAを速くする6つのチューニングポイント (1/3) - ＠IT","url":"http://www.atmarkit.co.jp/ait/articles/1706/08/news011.html","tags":["React","サーバー","performance","article"],"content":"Reactのサーバサイドレンダリングのパフォーマンス・チューニングについて","relatedLinks":[]},{"category":"Article","title":"Deprecations and Removals in Chrome 60  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/06/chrome-60-deprecations","tags":["Chrome"],"content":"Chrome 60で非推奨、削除されるAPIについて。","relatedLinks":[]},{"category":"Article","title":"piotrwitek/react-redux-typescript-guide: A comprehensive guide to static typing \"React & Redux\" apps using TypeScript","url":"https://github.com/piotrwitek/react-redux-typescript-guide","tags":["React","redux","TypeScript"],"content":"React、ReduxをTypeScriptで書く際のガイド","relatedLinks":[]},{"category":"Article","title":"Javascript unit testing tools","url":"http://mo.github.io/2017/06/05/javascript-unit-testing.html","tags":["JavaScript","testing","opinion"],"content":"JavaScriptのテストツールの比較。\nそれぞれのツールの簡単な比較とアクティビティについて。\n利用者はMocha > Karma > Jasmineだが、Jestがアクティブに開発されてる様子がでている","relatedLinks":[]},{"category":"Article","title":"Introduction to Storybook – Chroma","url":"https://blog.hichroma.com/introduction-to-storybook-5aca8cc643f7","tags":["React","Tools","article"],"content":"Reactコンポーネントの開発環境であるStorybookの入門記事","relatedLinks":[]},{"category":"Article","title":"Auto-Play Policy Changes for macOS | WebKit","url":"https://webkit.org/blog/7734/auto-play-policy-changes-for-macos/","tags":["article","audio","safari","video"],"content":"Mac Safariもmobile safariなどと同様にMediaElementの自動再生がユーザー起因でないといけなくする変更。\nplay()がPromiseを返し、失敗の場合はrejectされる。 Video/Audio/サイト毎に許可が決まるので、複数の要素を作るのではなく一つのsrcを変更して使うことを推奨してる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Upgrading from Node 6 to Node 8: a real-world performance comparison","url":"https://hackernoon.com/upgrading-from-node-6-to-node-8-a-real-world-performance-comparison-3dfe1fbc92a3","tags":["node.js","performance"],"content":"Node.js v6とv8のパフォーマンスを比較した記事。\nReactの`renderToString`、Jestの実行時間、webpackのビルド時間、npmのインストール時間などで比較している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kt3k/kocha: Modern, simpler Mocha clone, no globals, lint friendly","url":"https://github.com/kt3k/kocha","tags":["JavaScript","testing","library"],"content":"Mochaと互換APIを持つテストフレームワーク。\nMochaではグローバルに定義されている`describe`などがモジュールから`require`して利用できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"florinn/typemoq: A simple mocking library for TypeScript","url":"https://github.com/florinn/typemoq","tags":["TypeScript","C# ","testing","library"],"content":"C#のmoqのTypeScript/JavaScript版。\nモックライブラリ","relatedLinks":[]}]},{"meta":{"title":"2017-06-19のJS: webpack v3.0.0、redux 3.7.0、JavaScript最適化ハンドブック","author":"azu","layout":"post","date":"2017-06-19T23:24:17.253Z","category":"JSer","tags":["webpack","redux","JavaScript","performance"],"url":"https://jser.info/2017/06/20/webpack-v3.0.0-redux-3.7.0-javascript/"},"items":[{"category":"Headline","title":"Announcing TypeScript 2.4 RC | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2017/06/12/announcing-typescript-2-4-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.4 RCリリース。\nDynamic import、Promiseなどのgeneric type同士の扱いが厳密に、すべてがオプショナルなI/F(weak types)のチェックを厳密化。\nString Enumのサポートなど","relatedLinks":[{"title":"なぜ TypeScript の型システムが健全性を諦めているか - Qiita","url":"http://qiita.com/na-o-ys/items/aa56d678cdf0de2bdd79"},{"title":"Breaking Changes · Microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/Breaking-Changes#typescript-24"},{"title":"What","url":"https://github.com/Microsoft/TypeScript/wiki/What's-new-in-TypeScript"}]},{"category":"Headline","title":"Node v8.1.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v8.1.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 8.1.0リリース。\nnpm 5.0.3へアップデート、`--inspect=0`でランダムポートができるように。","relatedLinks":[]},{"category":"Headline","title":"Firefox — Notes (54.0) — Mozilla","url":"https://www.mozilla.org/en-US/firefox/54.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 54.0リリース。\nマルチプロセス化(e10s)、`URL.toJSON`の実装、`URLSearchParams`が`USVString`を受け入れるように、`event.timeStamp`が高精度に、ホスト名のないURL(`http://`のみなど)は不正な値として扱われるように","relatedLinks":[{"title":"Firefox 54 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/54"},{"title":"Firefox 54 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/versions/54/"},{"title":"ホスト名が付かない URL は不正なものとして扱われるようになりました (影響あり) | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/docs/2017/urls-with-no-host-name-are-now-treated-as-invalid/"}]},{"category":"Headline","title":"Chromium Blog: Chrome 60 Beta: Paint Timing API, CSS font-display, and Credential Management API improvements","url":"https://blog.chromium.org/2017/06/chrome-60-beta-paint-timing-api-css.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 60βリリース。\nPaint Timing API、CSS font-display、Object rest/spread propertiesのサポート。\nまた、Payment Request APIをデスクトップ版もサポートするなど","relatedLinks":[{"title":"Leveraging the Performance Metrics that Most Affect User Experience  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/06/user-centric-performance-metrics#first_paint_and_fist_contentful_paint"},{"title":"WICG/paint-timing: A proposal for a Time To First Paint specification.","url":"https://github.com/wicg/paint-timing"}]},{"category":"Headline","title":"Release 4.0.0 / 2017-05-26 · chaijs/chai","url":"https://github.com/chaijs/chai/releases/tag/4.0.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Chai 4.0.0リリース。\nNode.js 0.12のサポート終了、`Map`、`Set`の対応、`deep`の挙動を変更、ES6 Proxyを使ったundefined safeなチェインの実装など","relatedLinks":[]},{"category":"Headline","title":"Release v3.7.0 · reactjs/redux","url":"https://github.com/reactjs/redux/releases/tag/v3.7.0","tags":["JavaScript","ReleaseNote","library","redux"],"content":"Redux 3.7.0リリース。 RollupでbundleしたUMDバンドルを配布するように。 余計な関数コールが減るためファイルサイズなどが改善される。","relatedLinks":[]},{"category":"Headline","title":"rxjs/CHANGELOG.md at 6.0.0-alpha.0 · ReactiveX/rxjs","url":"https://github.com/ReactiveX/rxjs/blob/6.0.0-alpha.0/CHANGELOG.md","tags":["Rx","JavaScript","ReleaseNote"],"content":"RxJS 6.0.0-alpha.0リリース。\n`find`、`buffer`、`first`などの変更が含まれる","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v3.0.0","tags":["webpack","ReleaseNote"],"content":"webpack 3.0.0リリース。\nScope Hoisting (`webpack.optimize.ModuleConcatenationPlugin`)の追加、`node: false`でnode関係の機能をまとめて無効化できるように、Source Map周りの変更など","relatedLinks":[{"title":"🍾🚀 webpack 3: Official Release!! 🚀🍾 – webpack – Medium","url":"https://medium.com/webpack/webpack-3-official-release-15fd2dd8f07b"}]},{"category":"Headline","title":"Angular: Angular 4.2 Now Available","url":"http://angularjs.blogspot.com/2017/06/angular-42-now-available.html","tags":["AngularJS","ReleaseNote"],"content":"Angular 4.2リリース。\nangular.ioのサイトが刷新された。","relatedLinks":[]},{"category":"Article","title":"Auto-Play Policy Changes for macOS | WebKit","url":"https://webkit.org/blog/7734/auto-play-policy-changes-for-macos/","tags":["article","audio","safari","video"],"content":"Mac Safariもmobile safariなどと同様にMediaElementの自動再生がユーザー起因でないといけなくする変更。\nplay()がPromiseを返し、失敗の場合はrejectされる。 Video/Audio/サイト毎に許可が決まるので、複数の要素を作るのではなく一つのsrcを変更して使うことを推奨してる。","relatedLinks":[]},{"category":"Article","title":"Choo, architecture & performance – Yoshua Wuyts – Medium","url":"https://medium.com/@yoshuawuyts/choo-architecture-performance-f6f0c44e8a6a","tags":["JavaScript","library","opinion","architecture","article"],"content":"ウェブフロントを作成する小さなフレームワークであるChooのアーキテクチャについての解説。\nChooを構成する小さなライブラリやなぜそれを選択しているかやパフォーマンスについての記事","relatedLinks":[{"title":"yoshuawuyts/choo: - sturdy 4kb frontend framework","url":"https://github.com/yoshuawuyts/choo"}]},{"category":"Article","title":"TypeScript 2.3: Type-Checking JavaScript Files with --checkJs | Marius Schulz","url":"https://blog.mariusschulz.com/2017/06/16/typescript-2-3-type-checking-javascript-files-with-checkjs","tags":["JavaScript","TypeScript","article"],"content":"TypeScriptの`--checkJs`でのJavaScriptからTypeScriptへのマイグレーション手法について。 ホワイトリスト、ブラックリストそれぞれのアプローチ方法について","relatedLinks":[]},{"category":"SlideVideo","title":"Handling Long and Unexpected Content in CSS | CSS-Tricks","url":"https://css-tricks.com/handling-long-unexpected-content-css/","tags":["CSS"],"content":"長いコンテンツ(文章)などによる意図しないはみ出しやレイアウト崩れ、表示被りをどう対処するかについてのパターン","relatedLinks":[]},{"category":"SlideVideo","title":"ng-japan 2017 セッション資料の一覧 - Qiita","url":"http://qiita.com/goto63/items/362cef58e16198e20f56","tags":["AngularJS","イベント","slide","video"],"content":"ng-japan 2017の発表動画、スライドまとめ","relatedLinks":[{"title":"ng-japan - The Angular conference in Tokyo, Japan (2017/6/17)","url":"http://ngjapan.org/"}]},{"category":"SlideVideo","title":"Up and running with Preact - Course by @shaneosbourne @eggheadio","url":"https://egghead.io/courses/up-and-running-with-preact","tags":["React","video","tutorial"],"content":"Preactについてのスクリーンキャスト","relatedLinks":[]},{"category":"WebsiteDocument","title":"JS MythBusters, A JavaScript optimization handbook from a high level point of view.","url":"https://mythbusters.js.org/","tags":["JavaScript","performance","ebook"],"content":"JavaScriptの最適化ハンドブック。\nV8の最適化手法についてやアルゴリズム的な最適化、よくある最適化についての解説などがまとまっている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"AmplitudeJS: The HTML Audio Player For The Modern Era","url":"https://521dimensions.com/open-source/amplitudejs","tags":["JavaScript","music","library"],"content":"Web Audio APIを使った依存のない音楽プレイヤーライブラリ。\n音楽、プレイリストのデータを設定することで再生プレイヤーを作れる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Angelmmiguel/svgi: 🔎 The SVG inspection tool","url":"https://github.com/Angelmmiguel/svgi","tags":["SVG","debug"],"content":"SVG inspectionツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"25th-floor/spected: Validation library","url":"https://github.com/25th-floor/spected","tags":["JavaScript","library"],"content":"オブジェクトに対するバリデーションルールを作成して、バリデーションを行うライブラリ","relatedLinks":[]}]},{"meta":{"title":"2017-06-26のJS: React入門、sonar - linting for web、Angularパフォーマンス改善","author":"azu","layout":"post","date":"2017-06-26T08:55:22.360Z","category":"JSer","tags":["React","Lint","ESLint","Angular"],"url":"https://jser.info/2017/06/26/react-sonar-angular-perf/"},"items":[{"category":"Headline","title":"Dev.Opera — What’s new in Chromium 59 and Opera 46","url":"https://dev.opera.com/blog/opera-46/","tags":["Opera","ReleaseNote"],"content":"Opera 46 (based on Chromium 59)リリース。\nAnimation PNG、SVGファビコン、バックグラウンドタブのスロットリング、`MediaError.message`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"New Release: 2.9.5","url":"http://jshint.com/blog/2017-06-22/release-2-9-5/","tags":["JavaScript","Tools","ReleaseNote"],"content":"JSHint 2.9.5リリース。\n`trailingcomma`オプションの追加、バグ修正など","relatedLinks":[]},{"category":"Headline","title":"ESLint v4.1.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2017/06/eslint-v4.1.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 4.1.0リリース。 globベースの`overrides`設定の追加、無視ファイルを`package.json`に定義できるように","relatedLinks":[{"title":"ESLint v4.1.0 - Qiita","url":"http://qiita.com/mysticatea/items/e758c9a9a7dfb8b9cdb1"}]},{"category":"Article","title":"JS scope: static, dynamic, and runtime-augmented – Dmitry Soshnikov – Medium","url":"https://medium.com/@DmitrySoshnikov/js-scope-static-dynamic-and-runtime-augmented-5abfee6223fe","tags":["JavaScript"],"content":"JavaScriptのスコープについて。\n作ったときに参照が解決できるStatic scope、呼び出し元によって参照が決まるDynamic scope、`witH`や`eval`によるRuntime-augmented scopeについて","relatedLinks":[]},{"category":"Article","title":"React Express","url":"http://www.react.express/","tags":["React","tutorial","document"],"content":"Reactのチュートリアルサイト。\n実行できるサンプルと共にReactの使い方や、npm/webpack/ES2015など関連するツールや知識について解説してる。","relatedLinks":[]},{"category":"Article","title":"Redux Architecture Guidelines | joeellis.la","url":"http://joeellis.la/redux-architecture/","tags":["redux","opinion","article"],"content":"ケースバイケースではあるけど、Reduxを使ったアーキテクチャのガイドライン。\nstateのネストを避けるためにnormalizeする、stateにはsourceとなるデータを入れる、ReactのstateよりReduxのState。\nStandard Action、Container componentについてなど","relatedLinks":[]},{"category":"Article","title":"Aligned Input Events  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/06/aligning-input-events","tags":["JavaScript","event","article","Android"],"content":"Pointer Eventsの`getCoalescedEvents`について。\n入力デバイスは60-120Hzに対して、モニタが60Hzである場合にポインタのイベントをすべて処理するのは無駄となる。\nその無駄を回避するためにイベントをまとめてくれる`getCoalescedEvents()`について","relatedLinks":[]},{"category":"Article","title":"Codemods: A Quick and Easy Way to Automate Code Refactoring — SitePoint","url":"https://www.sitepoint.com/getting-started-with-codemods/","tags":["JavaScript","Tools","article","AST"],"content":"codemodを使ったリファクタリングツールの作り方についての記事","relatedLinks":[]},{"category":"Article","title":"✨Locally Scoped CSS Variables: What, How, and Why | Una Kravets Online✨","url":"https://una.im/local-css-vars/","tags":["CSS","JavaScript","article"],"content":"CSS Custom Propertiesについて。\n利用方法、ローカルスコープ、サポート状況についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"High Performance JS in V8 - Google スライド","url":"https://docs.google.com/presentation/d/1KCcA-WAyhGs0SEOrfU21fjaTWTxvNxYLwmNlGIbuZFw/edit#slide=id.p","tags":["V8","performance","slide"],"content":"V8のES2015+のパフォーマンスについてのスライド。\nCrankshaftはES2015を最適化しないため遅かった。またtry-catchなどがあると最適化できなかった。\n新しいpipelineのIgnition + Turbofanではその部分が改善されているという話。","relatedLinks":[]},{"category":"SlideVideo","title":"Improve SPA Performance with Angular App // Speaker Deck","url":"https://speakerdeck.com/manakuro/improve-spa-performance-with-angular-app","tags":["JavaScript","DOM","performance","Angular","slide"],"content":"メモリリークのパターン、Chromeの開発者ツールを使っての計測方法について。\nAngularにおける意図しないメモリリークを避ける方法やChange Detectionのコストを削減する方法についてなど","relatedLinks":[{"title":"mgechev/angular-performance-checklist: Cheatsheet for developing ⚡lightning⚡ fast progressive Angular applications.","url":"https://github.com/mgechev/angular-performance-checklist"}]},{"category":"WebsiteDocument","title":"mgechev/angular-performance-checklist: Cheatsheet for developing ⚡lightning⚡ fast progressive Angular applications.","url":"https://github.com/mgechev/angular-performance-checklist","tags":["Angular","performance","document"],"content":"Angularのパフォーマンスチェックリスト","relatedLinks":[]},{"category":"WebsiteDocument","title":"faceyspacey/redux-first-router: 🎖 seamless redux-first routing -- just dispatch actions","url":"https://github.com/faceyspacey/redux-first-router","tags":["redux","JavaScript","library"],"content":"Redux向けのルーターライブラリ。\nURLパターンにマッチしたActionを発行することをベースにしてルーティングできるようにしている","relatedLinks":[{"title":"Pre Release: Redux-First Router — A Step Beyond Redux-Little-Router","url":"https://medium.com/faceyspacey/pre-release-redux-first-router-a-step-beyond-redux-little-router-cd2716576aea"}]},{"category":"SoftwareLibrary","title":"sonar, a linting tool for the web","url":"https://sonarwhal.com/","tags":["JavaScript","ESLint","Tools"],"content":"ウェブサイト(URL)に対するESLintのようなLintツール。\nカスタムルールを自分で定義することができ、axeやSSL Server Testなど既存のツールを簡単に統合して利用できるようにする目的。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"await-to-js - NMOTW","url":"http://nmotw.in//github/await-to-js/","tags":["JavaScript","library"],"content":"awaitと組み合わせて使うことで、go言語のように`[error, value]`の値を返すようにするライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"medikoo/date-from-timezone: Construct dates with timezone context","url":"https://github.com/medikoo/date-from-timezone","tags":["JavaScript","i18n","library"],"content":"`Intl.DateTimeFormat`を使うことで、JavaScriptでタイムゾーン情報を付与して`new Date`を行うライブラリ","relatedLinks":[{"title":"Add timezone data to Date","url":"https://esdiscuss.org/topic/add-timezone-data-to-date#content-6"}]},{"category":"SoftwareLibrary","title":"OptimalBits/redbird: A modern reverse proxy for node","url":"https://github.com/OptimalBits/redbird","tags":["node.js","proxy"],"content":"HTTPSやHTTP/2に対応したNode.jsでのリバースプロキシライブラリ","relatedLinks":[]},{"category":"Book","title":"O'Reilly Japan - アイソモーフィックJavaScript","url":"https://www.oreilly.co.jp/books/9784873118079/","tags":["JavaScript","book","React","Angular"],"content":"2017年7月4日発売\nIsomorphic JavaScriptについての書籍。\n実現する方法や各種フレームワークReact/Angular/Brisketを使った方法、ケーススタディなど","relatedLinks":[]}]},{"meta":{"title":"2017-07-03のJS: ECMAScript 2017、Prettier 1.5.0、UXのパフォーマンスメトリクス","author":"azu","layout":"post","date":"2017-07-03T05:14:08.123Z","category":"JSer","tags":["ECMAScript","Prettier","performance","browser"],"url":"https://jser.info/2017/07/03/ecmascript-2017-prettier-1.5.0-ux/"},"items":[{"category":"Headline","title":"Release 1.5.0: GraphQL, CSS-in-JS & JSON · prettier/prettier","url":"https://github.com/prettier/prettier/releases/tag/1.5.0","tags":["JavaScript","Tools"],"content":"prettier 1.5.0リリース。\nGraphQL、CSS in JS、JSONの対応、CSSやTypeScript、JSX周りバグ修正など","relatedLinks":[{"title":"Adding a new layout strategy to Prettier – Geckoboard: Under-the-Hood – Medium","url":"https://medium.com/geckoboard-under-the-hood/adding-a-new-layout-strategy-to-prettier-8d33084c0f99"}]},{"category":"Headline","title":"Release v7.0.0-beta.16 · babel/babylon","url":"https://github.com/babel/babylon/releases/tag/v7.0.0-beta.16","tags":["babel","AST","TypeScript","ReleaseNote"],"content":"Babylon 7.0.0 beta16リリース。\nTypeScriptパーサの追加、BigInt(Stage 2)のサポートなど","relatedLinks":[{"title":"TypeScript parser by andy-ms · Pull Request #523 · babel/babylon","url":"https://github.com/babel/babylon/pull/523"}]},{"category":"Headline","title":"Ecma latest news","url":"http://ecma-international.org/news/index.html","tags":["ECMAScript","news"],"content":"\"ECMA-262 8th edition - ECMAScript® 2017 Language Specification\" ES2017がGAで承認されて正式リリースされた。","relatedLinks":[{"title":"Standard ECMA-262","url":"http://ecma-international.org/publications/standards/Ecma-262.htm"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 34 | WebKit","url":"https://webkit.org/blog/7760/release-notes-for-safari-technology-preview-34/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 34リリース。\n`RTCRtpTransceiver#addTransceiver`をサポートしトラック単位での片方向通信を使えるように、W3C Secure Contextsの実装、SRIを試験的にサポートなど","relatedLinks":[{"title":"Safari TP 34では新しい片方向WebRTCの手順が使えるようになったので、試してみた - Qiita","url":"http://qiita.com/tomoyukilabs/items/59267f25c9dbd43d5ecb"}]},{"category":"Article","title":"Leveraging the Performance Metrics that Most Affect User Experience  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/06/user-centric-performance-metrics","tags":["Chrome","performance","browser","article"],"content":"ユーザー体験への影響を見るパフォーマンスのメトリクスについて。\nロード時間だけでは体験を計測できないため。\nそのため、First Paint/First Meaningful Paing/Time to Interactive/Longtasksを指標にそれぞれ何を意味するかや計測方法について","relatedLinks":[{"title":"You Need to know SSR // Speaker Deck","url":"https://speakerdeck.com/yosuke_furukawa/you-need-to-know-ssr"}]},{"category":"Article","title":"Chrome 60 DevTools の新機能/変更点 - Qiita","url":"http://qiita.com/kyoshidajp/items/e3f9be02a7ccd00aa7d7","tags":["Chrome","debug"],"content":"Chrome 60の開発者ツールの変更点について","relatedLinks":[]},{"category":"Article","title":"NYTimes/kyt: Starting a new JS app? Build, test and run advanced apps with kyt 🔥","url":"https://github.com/nytimes/kyt","tags":["JavaScript","Tools"],"content":"JavaScriptアプリのツールキット。\nBabel/webpack/Jest/Stylelint/ESlint/protoなどのセットアップをまとめて行うツール","relatedLinks":[]},{"category":"Article","title":"Supercharged Live Stream Blog: Code Splitting  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/06/supercharged-codesplit","tags":["babel","article","plugin","video"],"content":"Code Splittingを行うBabelプラグインを作成するスクリーンキャスト","relatedLinks":[]},{"category":"WebsiteDocument","title":"Building m.uber: Engineering a High-Performance Web App for the Global Market - Uber Engineering Blog","url":"https://eng.uber.com/m-uber/","tags":["browser","mobile","JavaScript","performance"],"content":"Uberのモバイル向けの最適化について。\nReactを使っているが、mobileではPreactに置き換えて利用している。\nまた、サーバサイドレンダリングや、初期bundleサイズを小さくするためのcode split、依存が小さなJustの利用、SWやIndexedDBを使ったキャッシュなどについて。\n問題を見つけるためのエラーハンドリングについて。","relatedLinks":[{"title":"angus-c/just: A library of dependency-free utilities that do just do one thing.","url":"https://github.com/angus-c/just"}]},{"category":"WebsiteDocument","title":"GraphQL Network Communication Framework","url":"http://graphql-io.com/","tags":["GraphQL","library","JavaScript"],"content":"クライアント <-> サーバのコミュニケーションを行うGraphQLフレームワーク。\nApollo/WebSocketベース","relatedLinks":[]},{"category":"WebsiteDocument","title":"HTML Standard","url":"https://html.spec.whatwg.org/dev/","tags":["HTML","WHATWG","spec"],"content":"WHATWG HTML仕様のDeveloper's Edition。\nブラウザベンダー向けの情報は削除し、ウェブ開発者向けの情報に絞ったHTML仕様。","relatedLinks":[{"title":"HTML Standard 日本語訳","url":"https://momdo.github.io/html/dev/"},{"title":"Review on utilization of ","url":"https://github.com/whatwg/html/issues/1488#issuecomment-310450737"},{"title":"WHATWG HTML Standard Developer Editionの話 - 水底の血","url":"http://momdo.hatenablog.jp/entry/20170702/1498999477"},{"title":"HTML5 for Web Developers | HTML5 Doctor","url":"http://html5doctor.com/html5-for-web-developers/"}]},{"category":"WebsiteDocument","title":"babel/proposals: (WIP) Tracking the status of Babel's implementation of TC39 proposals","url":"https://github.com/babel/proposals","tags":["ECMAScript","babel","plugin"],"content":"ECMAScript proposalとBabelの実装の対応をまとめたもの","relatedLinks":[]},{"category":"SoftwareLibrary","title":"roman01la/js-memory-usage: Data Structures Memory Usage in JavaScript","url":"https://github.com/roman01la/js-memory-usage","tags":["JavaScript","library","まとめ","performance"],"content":"JavaScriptのデータ構造別/ライブラリごとのメモリ消費量をまとめたもの。List/Array/Map/SetをJavaScript/ImmutableJS/ClojureScript/GopherJS/Reasonなど色々な実装ごと比較","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pinterest/esprint: Fast eslint runner","url":"https://github.com/pinterest/esprint","tags":["ESLint","Tools"],"content":"ESLintをparallelで実行できるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"anvilresearch/webcrypto: W3C Web Cryptography API for Node.js","url":"https://github.com/anvilresearch/webcrypto","tags":["node.js","security","library"],"content":"Node.jsでWeb Cryptography APIに対応するpolyfill(ponyfill)ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"coast-team/netflux: JavaScript client and server side transport API based on WebRTC & WebSocket","url":"https://github.com/coast-team/netflux","tags":["WebRTC","WebSocket","node.js","browser"],"content":"WebRTC、WebSocketを使ったP2Pライブラリ。\nブラウザ、Node.jsでデータのやり取りを行える","relatedLinks":[]},{"category":"SoftwareLibrary","title":"OnetapInc/chromy: Chromy is a library for operating headless chrome. 🍺🍺🍺","url":"https://github.com/OnetapInc/chromy","tags":["Chrome","node.js","library"],"content":"Headless ChromeをNightmare.jsのように操作するAPIを提供するライブラリ。\nChrome DevTools Protocolを使って処理をやり取りしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dollarshaveclub/study: A Simple, progressive, client/server AB testing library ⚡️","url":"https://github.com/dollarshaveclub/study","tags":["JavaScript","library"],"content":"A/Bテストティングライブラリ。\nuniversalで動き、storage driverでデータの保存先を指定できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"egoist/dom-dom: JSX to actual DOM.","url":"https://github.com/egoist/dom-dom","tags":["JavaScript","jsx","DOM","library"],"content":"JSXを`document` APIを使ってDOMオブジェクトにするライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"yahoo/mendel: Build toolchain for experimentation on isomorphic web applications with tree-inheritance and multivariate support.","url":"https://github.com/yahoo/mendel","tags":["設計","JavaScript","Tools"],"content":"コードのフラグではなくルールファイルベースでプロジェクト構造を管理できるツール。\n試験的な機能を取り入れたA/Bテストを管理しやすくするためのフレームワーク。\nフラグ管理は技術的負債となりやすく、持続可能性をYahooで調査した結果作成されたデザイン。","relatedLinks":[{"title":"mendel/Design.md at master · yahoo/mendel","url":"https://github.com/yahoo/mendel/blob/master/docs/Design.md"}]},{"category":"SoftwareLibrary","title":"jaredpalmer/formik: Forms in React, without tears","url":"https://github.com/jaredpalmer/formik","tags":["React","library"],"content":"React向けのフォームライブラリ","relatedLinks":[]}]},{"meta":{"title":"2017-07-11のJS: npm 5.2.0(npx)、lerna 2.0.0、WebRTC","author":"azu","layout":"post","date":"2017-07-11T01:52:00.000Z","category":"JSer","tags":["npm","monorepo","safari","WebRTC"],"url":"https://jser.info/2017/07/11/npm-5.2.0npx-lerna-2.0.0-webrtc/"},"items":[{"category":"Headline","title":"Release v5.2.0 (2017-07-05) · npm/npm","url":"https://github.com/npm/npm/releases/tag/v5.2.0","tags":["npm","Tools","ReleaseNote"],"content":"npm 5.2.0リリース\n`npx`コマンドが同梱されるようになった。`npx`はnpm registryやgistに登録されているCLIツールのパッケージをコマンド一つでダウンロードから実行までを行えるツール。\nまた`-p`オプションで特定バージョンのNode.jsでnpm scriptsなども実行できる。","relatedLinks":[]},{"category":"Headline","title":"Release v5.1.0 · npm/npm","url":"https://github.com/npm/npm/releases/tag/v5.1.0","tags":["npm","ReleaseNote"],"content":"npm v5.1.0リリース。\n`package-lock.json`に`requires`フィールドを追加、`preferGlobal`オプションを非推奨にし警告は出さないように、`npm build`を間違えて呼び出した場合に警告するように、バグ修正など","relatedLinks":[]},{"category":"Headline","title":"ESLint v4.2.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2017/07/eslint-v4.2.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v4.2.0リリース。\n`linter.verifyAndFix`が関数を受け付けるように、`getter-return`ルールの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · lerna/lerna","url":"https://github.com/lerna/lerna/releases/tag/v2.0.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"monorepo管理ツールのlerna v2.0.0リリース。\n`yarn workspace`のサポート、`--canary`オプションの改善など。","relatedLinks":[]},{"category":"Headline","title":"Release v3.1.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v3.1.0","tags":["ReleaseNote","webpack"],"content":"webpack 3.1.0リリース。 `cacheWithContext`オプションが追加され(デフォルトオフ)パフォーマンスの改善、設定を関数の配列として書けるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.6.0 · babel/babel-preset-env","url":"https://github.com/babel/babel-preset-env/releases/tag/v1.6.0","tags":["babel","plugin","ReleaseNote"],"content":"babel-preset-env v1.6.0リリース。\nNode.js 8に対応したcompat-tableへ更新、`targets`の`chromeandroid`に対応など","relatedLinks":[]},{"category":"Headline","title":"Release JSDoc 3.5.0 · jsdoc3/jsdoc","url":"https://github.com/jsdoc3/jsdoc/releases/tag/3.5.0","tags":["JSDoc","ReleaseNote"],"content":"JSDoc 3.5.0 リリース。\nsemverではないので破壊的変更も含まれる。\nJSDocのパースにBabylonを利用するようになり、JSXなどもサポート。\nNode.js 4.2.0未満のサポート終了など","relatedLinks":[]},{"category":"Article","title":"これからのレイアウトはGrid Layoutで決まり？特徴で使い分けたいCSSレイアウト手法 - ICS MEDIA","url":"https://ics.media/entry/15921","tags":["CSS"],"content":"float、flexbox、grid layoutの使い分けについて","relatedLinks":[]},{"category":"Article","title":"The WHATWG Blog — Progressing Streams","url":"https://blog.whatwg.org/progressing-streams","tags":["WHATWG","stream"],"content":"WHATWG Streamについて。","relatedLinks":[]},{"category":"Article","title":"A Closer Look Into WebRTC | WebKit","url":"https://webkit.org/blog/7763/a-closer-look-into-webrtc/","tags":["safari","WebRTC"],"content":"Safari 11でサポートされる予定のWebRTCについての解説。\n開発者向けの設定、後方互換性とadapter.js、audio-videoの送信例、Media Captureについてなど","relatedLinks":[{"title":"webrtc/adapter: Shim to insulate apps from spec changes and prefix differences. Latest adapter.js release:","url":"https://github.com/webrtc/adapter"}]},{"category":"Article","title":"Experimenting with the background fetch API | Phil Nash","url":"https://philna.sh/blog/2017/07/04/experimenting-with-the-background-fetch-api/","tags":["ServiceWorker","JavaScript","WebPlatformAPI"],"content":"ServiceWorkerのbackground-fetching APIについて。\nバックグラウンドでダウンロードやファイルのアップロードを行うことを目的としたAPI","relatedLinks":[]},{"category":"Article","title":"Getting started with PreactJS — A Step By Step Guide","url":"https://blog.codeinfuse.com/getting-started-with-preactjs-a-step-by-step-guide-f3197f871753","tags":["React","tutorial","JavaScript","article"],"content":"preact-cliを使ったpreact入門記事。\nReactとの違いや互換性についてや、preact-cliを使ったビルドやそのファイルサイズなどについて","relatedLinks":[]},{"category":"Article","title":"Node.js FoundationとNode.jsについて - 技術探し","url":"http://abouthiroppy.hatenablog.jp/entry/2017/07/05/090952","tags":["node.js","組織"],"content":"Node.js Foundationを構成するワーキンググループや技術委員会についての解説。\nどのようなワーキンググループがあり、どのように議論が行われているかについて","relatedLinks":[]},{"category":"Article","title":"Upcoming Regular Expression Features  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/07/upcoming-regexp-features","tags":["ECMAScript","JavaScript","V8","正規表現"],"content":"現在Stage 3である正規表現の拡張Proposalの紹介記事。\nNamed Captures、`/./s` dotAll、Unicode Property Escapes、Lookbehind Assertionsについて","relatedLinks":[]},{"category":"SlideVideo","title":"VueConf EU - YouTube","url":"https://www.youtube.com/watch?v=lG0Ys-2d4MA","tags":["Vue","イベント","video"],"content":"VueConf EUの動画","relatedLinks":[{"title":"VueConf 2017 – 21–23 June, 2017 in Wrocław, Poland","url":"https://conf.vuejs.org/"}]},{"category":"SlideVideo","title":"Capability of React Fiber // Speaker Deck","url":"https://speakerdeck.com/koba04/capability-of-react-fiber","tags":["React","slide"],"content":"React Fiberについてのスライド。\nFilberにおけるスタック、スケジューリング、カスタムレンダラーについてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Faao - ドメイン駆動設計で作るGitHub Issue Client -","url":"http://azu.github.io/slide/2017/teppeis-sushi/client-side-ddd-on-github.html","tags":["DDD","JavaScript","TypeScript","slide","testing","document"],"content":"クライアントサイドDDDとLiving Documentationについてのスライド。\n遠回りのモデリング、妥協あり/なしのRepositoryでの永続化、ユースケース図、ドキュメントのコード化、デバッグについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"siddharthkp/bundlesize: Keep your bundle size in check","url":"https://github.com/siddharthkp/bundlesize","tags":["webservice","CI","node.js","github"],"content":"CIからGitHubのステータスにbundleしたファイルサイズを通知、一定サイズを超えたらエラーとすることができるツール/GitHub App","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sverweij/dependency-cruiser: Validate and visualize dependencies. With your rules. JavaScript, TypeScript, CoffeeScript. ES6, CommonJS, AMD.","url":"https://github.com/sverweij/dependency-cruiser","tags":["JavaScript","testing","Tools"],"content":"JavaScriptコード間の依存関係グラフを元に、指定したパスから指定したパスへの参照を禁止するルールなどを設定することができる。\nまた循環参照や存在しないモジュールの参照などもチェックできる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kentcdodds/babel-plugin-preval: Pre-evaluate code at build-time","url":"https://github.com/kentcdodds/babel-plugin-preval","tags":["babel","plugin"],"content":"Babelでコンパイル時に評価して評価結果を埋め込むことができるプラグイン","relatedLinks":[]},{"category":"Book","title":"Amazon.com: Mastering Immutable.js eBook: Adam Boduch: Kindle Store","url":"https://www.amazon.com/Mastering-Immutable-js-Adam-Boduch-ebook/dp/B073RMMCL9","tags":["JavaScript","book","library"],"content":"2018年2月6日発売\nimmutable.jsについての書籍","relatedLinks":[]}]},{"meta":{"title":"2017-07-18のJS: Babylon.js 3.0、Yarnの作り方、Code splittingの重複モジュール検査","author":"azu","layout":"post","date":"2017-07-18T01:03:49.809Z","category":"JSer","tags":["WebGL","Yarn","webpack"],"url":"https://jser.info/2017/07/18/340draft/"},"items":[{"category":"Headline","title":"Announcing Babylon.js 3.0 - Building Apps for WindowsBuilding Apps for Windows","url":"https://blogs.windows.com/buildingapps/2017/07/12/announcing-babylon-js-3-0/","tags":["WebGL","ReleaseNote","JavaScript","library","3D"],"content":"WebGLフレームワークのBabylon.js 3.0リリース。\nWebGL 2、WebVR 1.1のサポート、Babylon.GUIの追加、morph targetのサポート、WebCamを使ったライブテクスチャに対応など","relatedLinks":[]},{"category":"Headline","title":"Release v2.4.0 Kill la Kill · vuejs/vue","url":"https://github.com/vuejs/vue/releases/tag/v2.4.0","tags":["Vue","ReleaseNote"],"content":"Vue 2.4.0リリース。\nSSRでasync componentのサポート、コンポーネントオプションに`inheritAttrs`、インスタンスのプロパティに`$attrs`、`$listeners`を追加。\n`comments`オプションでテンプレート中のHTMLコメントを維持できるようになるなど","relatedLinks":[{"title":"Vue.js 2.4.0","url":"http://vuejsdevelopers.com/2017/07/17/vue-js-2-4-important-features/?jsdojo_id=ech_v24"}]},{"category":"Headline","title":"Release 0.21.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v0.21.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"AVA 0.21.0リリース。\n`Buffer`を使っていてため、Node.js 4.5未満で動かない問題を修正、flowの型周りを修正","relatedLinks":[]},{"category":"Headline","title":"Security updates for all active release lines, July 2017 | Node.js","url":"https://nodejs.org/en/blog/vulnerability/july-2017-security-releases/","tags":["ReleaseNote","node.js","security"],"content":"Node.jsのv4,6,7,8のセキュリティアップデート。 V8 snapshotsを有効化してる場合に問題があるため、デフォルトでsnapshotsが無効化された。 この問題が解決されるまで`vm.runInNewContext`のパフォーマンスが低下した状態となる。","relatedLinks":[{"title":"Node.js で発生した Hash flooding DoS とその内容について - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2017/07/15/104616"}]},{"category":"Headline","title":"Sass 3.5 is Released « Sass Blog","url":"http://sass.logdown.com/posts/2026639-sass-35-is-released","tags":["Sass","ReleaseNote"],"content":"Sass 3.5リリース。\n`::slotted()`のサポート、`var()`をcolor functionへ渡せるように、Dart Sassの互換性向上など","relatedLinks":[]},{"category":"Headline","title":"Release 8.0.0 · stylelint/stylelint","url":"https://github.com/stylelint/stylelint/releases/tag/8.0.0","tags":["CSS","Tools","ReleaseNote"],"content":"stylelint 8.0.0リリース。\nSemver policyの追加、新しいconfigとして`stylelint-config-recommended`を追加、ルールの削除やdeprecatedなど","relatedLinks":[{"title":"Semantic Versioning Policy","url":"https://github.com/stylelint/stylelint/blob/8.0.0/README.md#semantic-versioning-policy"}]},{"category":"Article","title":"JavaScript Test-Runners Benchmark – DailyJS – Medium","url":"https://medium.com/dailyjs/javascript-test-runners-benchmark-3a78d4117b4","tags":["JavaScript","testing","benchmark"],"content":"JavaScriptのテストフレームワークのベンチマーク比較。\n同期的なテスト、非同期的なテストでそれぞれjasmine、mocha、AVA、Jestなど著名なテストフレームワークの実行速度を比較したもの","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 61)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/07/devtools-release-notes","tags":["Chrome","debug","article"],"content":"Chrome 61の開発者ツールの変更点について。\nモバイルデバイスシミュレートにThrottlingの設定を追加、Storageの利用率の表示、Flamechartのマウスホイールの動作を設定可能に、ES Modulesのデバッグ対応など","relatedLinks":[]},{"category":"Article","title":"Let's Dev: A Package Manager | Yarn Blog","url":"https://yarnpkg.com/blog/2017/07/11/lets-dev-a-package-manager/","tags":["yarn","JavaScript","tutorial","article"],"content":"Yarnのようなパッケージ管理ツールを作りながらそのデザインを見ていくチュートリアル。\nどのようにパッケージをダウンロードし、依存関係を解決し、リンクをしているかについて。\n依存関係をどのように最適化するかについて","relatedLinks":[{"title":"yarnpkg/lets-dev-demo","url":"https://github.com/yarnpkg/lets-dev-demo"}]},{"category":"WebsiteDocument","title":"samccone/bundle-buddy: A tool to identify bundle duplication across splits.","url":"https://github.com/samccone/bundle-buddy","tags":["webpack","JavaScript","Tools"],"content":"webpackなどでCode Splittingした際に、各bundleファイル間で重複して含まれているモジュールを見つけることができるツール","relatedLinks":[]},{"category":"WebsiteDocument","title":"Learn Apollo | Hands-on GraphQL Tutorial","url":"https://www.learnapollo.com/","tags":["GraphQL","tutorial","JavaScript"],"content":"Apolloを使ったGraphQLクライアントのチュートリアル","relatedLinks":[]},{"category":"WebsiteDocument","title":"Web クライアントサイドのパフォーマンスメトリクス — Speed Index、Paint Timing、TTI etc... ::ハブろぐ","url":"https://havelog.ayumusato.com/develop/performance/e744-performance_metrics.html","tags":["browser","performance"],"content":"ウェブクライアントサイドにおけるパフォーマンスの指標となる値やPerformance Budgetなどの用語についての解説","relatedLinks":[]},{"category":"WebsiteDocument","title":"Redux isn't slow, you're just doing it wrong - An optimization guide | React Rocket","url":"http://reactrocket.com/post/react-redux-optimization/","tags":["redux","performance"],"content":"Reduxを使ったアプリケーションのパフォーマンス・チューニングについての記事。`connect`オプションの利用、コンポートに必要最小限のデータを渡す、Reselectなどを使ってデータをフラットにすることについてなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vadimdemedes/ink: 🌈 React for CLIs","url":"https://github.com/vadimdemedes/ink","tags":["React","console","library"],"content":"コンソール向けのReactライクなライブラリ。\nコンソールの表示をコンポーネントで描画できるようにするライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"azu/immutable-array-prototype: A collection of Immutable Array prototype methods(Per method packages).","url":"https://github.com/azu/immutable-array-prototype","tags":["JavaScript","library","npm"],"content":"`Array#push`などの破壊的なメソッドの非破壊的なバージョンを集めたライブラリ。\nメソッド毎に個別のパッケージとしてインストールすることもできる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"indutny/webpack-common-shake: CommonJS Tree Shaker plugin for WebPack","url":"https://github.com/indutny/webpack-common-shake","tags":["webpack","node.js","JavaScript"],"content":"CommonJSのモジュールに対するTree Shakingを行うwebpackプラグイン","relatedLinks":[{"title":"indutny/common-shake: CommonJS Tree Shaker API","url":"https://github.com/indutny/common-shake"}]},{"category":"SoftwareLibrary","title":"Atomic Lab - component guide generator based on partial templates","url":"https://steelydylan.github.io/atomic-lab/","tags":["HTML","CSS","debug","Tools"],"content":"Custom ElementなどのHTMLフラグメントを実際に描画して確認できる開発環境ツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"glayzzle/php-parser: NodeJS PHP Parser - extract AST or tokens (PHP5 and PHP7)","url":"https://github.com/glayzzle/php-parser","tags":["AST","JavaScript","php","library","Tools"],"content":"JavaScriptで書かれたPHP 5/7のパーサ。","relatedLinks":[{"title":"Kornel / babel-preset-php · GitLab","url":"https://gitlab.com/kornelski/babel-preset-php"}]},{"category":"SoftwareLibrary","title":"Kornel / babel-preset-php · GitLab","url":"https://gitlab.com/kornelski/babel-preset-php","tags":["babel","php","library"],"content":"PHPの構文で書かれたコードをJavaScriptの構文に変換するBabel presets","relatedLinks":[]},{"category":"Book","title":"Practical Node.js: Building Real-World Scalable Web Apps: Azat Mardan: 9781484230381: Amazon.com: Books","url":"https://www.amazon.com/dp/1484230388","tags":["node.js","book"],"content":"2018年3月22日発売。\nPractical Node.jsの第二版","relatedLinks":[{"title":"Practical Node.js - Building Real-World Scalable Web Apps | Azat Mardan | Apress","url":"http://www.apress.com/us/book/9781430265955"}]}]},{"meta":{"title":"2017-07-25のJS: Node.js 8.2.0、TypeScriptへの漸進的移行、リファクタリングJavaScript","author":"azu","layout":"post","date":"2017-07-25T00:15:42.123Z","category":"JSer","tags":["Node.js","TypeScript","JavaScript"],"url":"https://jser.info/2017/07/25/node.js-8.2.0-typescript-javascript/"},"items":[{"category":"Headline","title":"Node v8.2.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v8.2.0/","tags":["node.js","ReleaseNote"],"content":"Node v8.2.0リリース。\n`async_hooks`のPromise対応改善、`npm`が5.3.0へアップデート(npxが同梱される)など。","relatedLinks":[]},{"category":"Headline","title":"Roadmap · Microsoft/ChakraCore Wiki","url":"https://github.com/Microsoft/ChakraCore/wiki/Roadmap#v160","tags":["ChakraCore","ReleaseNote","WebAssembly"],"content":"ChakraCore 1.6.0リリース。\nWebAssembly/SharedArrayBuffer/Dynamic module importがデフォルトで有効に。\nSIMDサポートを削除など。","relatedLinks":[]},{"category":"Headline","title":"Release Quantum Time · fuse-box/fuse-box","url":"https://github.com/fuse-box/fuse-box/releases/tag/v2.2.1","tags":["JavaScript","Tools","ReleaseNote"],"content":"FuseBox 2.2.1リリース。\n`fuse.js`を変更した際にキャッシュを削除するように、`writeBundles`オプションでin-memoryビルドができるようになるなど。","relatedLinks":[]},{"category":"Headline","title":"Angular: Angular 4.3 Now Available","url":"http://angularjs.blogspot.com/2017/07/angular-43-now-available.html","tags":["Angular","ReleaseNote"],"content":"Angular 4.3リリース。\n`HttpClient`の追加、routerのライフサイクルイベントの追加。\nまた、Shadow-Piercing descendant combinatorは非推奨であるため、 Angularの中の`/deep/`、`>>>`、`::ng-deep`も非推奨となった。\n`::ng-deep`はツール側で優先して扱うように。","relatedLinks":[{"title":"feat(compiler): add support ","url":"https://github.com/angular/angular/commit/b754e60"},{"title":"angular/CHANGELOG.md at master · angular/angular","url":"https://github.com/angular/angular/blob/master/CHANGELOG.md#430-2017-07-14"}]},{"category":"Headline","title":"ESLint v4.3.0 released - ESLint - Pluggable JavaScript linter","url":"http://eslint.org/blog/2017/07/eslint-v4.3.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v4.3.0リリース。\n`eslint --init`した際にeslintのバージョンを利用してる場合に対話的にバージョン変更できるように。\n`prefer-destructuring`にオプションの追加、ルールの修正など。","relatedLinks":[]},{"category":"Headline","title":"Say hello to HTTP/2 for Node.js Core – Node.js Collection – Medium","url":"https://medium.com/the-node-js-collection/say-hello-to-http-2-for-node-js-core-261ba493846e","tags":["node.js","HTTP2","library"],"content":"Nodeの`http2`対応について。\n初期実装のPull Requestが出された。","relatedLinks":[{"title":"http2: Introducing http/2 by jasnell · Pull Request #14239 · nodejs/node","url":"https://github.com/nodejs/node/pull/14239"}]},{"category":"Headline","title":"Release Almin 0.13.10 - transaction on application layer · almin/almin","url":"https://github.com/almin/almin/releases/tag/almin%400.13.10","tags":["JavaScript","CQRS","library","ReleaseNote"],"content":"Almin 0.13.10リリース。\nIE9/10のサポート終了、`Store#onDispatch`が受け取れるpayloadを制限、Strict mode、トランザクションのサポート、`executor`の追加など。","relatedLinks":[{"title":"Almin 0.13リリース - アプリケーションレイヤーのトランザクション | Web Scratch","url":"http://efcl.info/2017/07/24/almin-0.13/"}]},{"category":"Article","title":"JavaScriptのライブラリを徐々にTypeScriptに移行する | Web Scratch","url":"http://efcl.info/2017/07/17/JavaScript-to-TypeScript/","tags":["JavaScript","TypeScript"],"content":"JavaScriptで書かれた既存のコードをTypeScriptへ移行する際の方法について。\nJavaScriptとTypeScriptを混在した状態で移行について。","relatedLinks":[]},{"category":"Article","title":"Automated testing with Headless Chrome  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/06/headless-karma-mocha-chai","tags":["Chrome","testing"],"content":"Headless Chromeを使った自動テストについて。","relatedLinks":[]},{"category":"Article","title":"Extracting Logic from React Components","url":"https://javascriptplayground.com/blog/2017/07/react-extracting-logic/","tags":["React","リファクタリング","JavaScript"],"content":"Reactコンポーネントに内蔵されてしまったロジックをコンポーネントから分離するリファクタリングについて。","relatedLinks":[]},{"category":"Article","title":"がんばらないTypeScriptのはじめ方 - 角待ちは対空","url":"http://blog.yux3.net/entry/2017/07/18/110000","tags":["JavaScript","TypeScript","article"],"content":"TypeSriptを緩く使う/JavaScriptからTypeScriptへの移行について。\nゆるく使う場合でも`noImplicitAny`と`strictNullChecks`を有効化することで防げるエラーがあることについて。","relatedLinks":[]},{"category":"Article","title":"NgRx: Patterns and Techniques – nrwl","url":"https://blog.nrwl.io/ngrx-patterns-and-techniques-f46126e2b1e5","tags":["Angular","Rx","article"],"content":"NgRxを使ったパターンやTipsについての記事。","relatedLinks":[]},{"category":"Article","title":"Rekit 2.0: new way of React development – Nate Wang – Medium","url":"https://medium.com/@nate_wang/rekit-2-0-next-generation-react-development-ce8bbba51e94","tags":["React","redux","Tools","article"],"content":"React/Redux/React Routerをベースにしたウェブアプリ開発環境のRekit 2.0について。\nRekit PortalというComponent/Router/Actionの関係を可視化できるダッシュボードを持っている。","relatedLinks":[{"title":"supnate/rekit-portal: Web UI for managing a Rekit project.","url":"https://github.com/supnate/rekit-portal"}]},{"category":"WebsiteDocument","title":"Learn Next.js - Create SSR Enabled React Apps Easily","url":"https://learnnextjs.com/","tags":["React","tutorial"],"content":"Next.jsについてのチュートリアルサイト。","relatedLinks":[]},{"category":"WebsiteDocument","title":"create-react-app/README.md at master · facebookincubator/create-react-app","url":"https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md","tags":["React","document"],"content":"`create-react-app`のユーザーガイド。\n典型的なウェブアプリケーションのクライアントにおける開発についてよくまとまっている。\nパッケージ管理方法、VCS、テスト、環境変数、エディタ、静的サーバ、デプロイ、SSR、パフォーマンス改善、分析など。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Enclose.IO: Compiling your application into a single executable","url":"http://enclose.io/","tags":["node.js","ruby","Tools"],"content":"Node.jsやRubyのコードを実行可能なバイナリにパッケージング、自動更新できるようにするするウェブサービス。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tsuyoshiwada/react-drip-form: HoC based React forms state manager, Support for validation and normalization.","url":"https://github.com/tsuyoshiwada/react-drip-form","tags":["React","JavaScript","library"],"content":"High Order ComponentベースのReact Form/バリデーションライブラリ。","relatedLinks":[{"title":"もうReactのフォームで消耗したくないので、HoCベースのフォームライブラリを作った - wadackel.me","url":"https://blog.wadackel.me/2017/react-drip-form/"}]},{"category":"Book","title":"Results of the Ultimate CSS Survey 2017 — SitePoint","url":"https://www.sitepoint.com/results-ultimate-css-survey-2017/","tags":["CSS","アンケート"],"content":"CSSについての開発者アンケート結果が公開された。 AltCSS、フレームワークの利用率、minify、reset/normalize、期待する機能、サポートしてるブラウザ、バグを見つけたことがあるかなど。","relatedLinks":[]},{"category":"Book","title":"Refactoring JavaScript","url":"http://refactoringjs.com/","tags":["JavaScript","book","リファクタリング"],"content":"JavaScriptのリファクタリングについての書籍。PDF版が無料で公開されている。\nES2015+な文法を使ったリファクタリング、テストの仕方、OOPやFPのアプローチを使ったリファクタリングなどについて解説されている。","relatedLinks":[{"title":"Refactoring JavaScript ","url":"https://www.safaribooksonline.com/library/view/refactoring-javascript/9781491964910/"}]},{"category":"Book","title":"azat-co/practicalnode: Practical Node.js, 1st and 2nd Editions \\[Apress\\]","url":"https://github.com/azat-co/practicalnode","tags":["node.js","book"],"content":"Practical Node.jsの原稿(ドラフト)が公開された。\nKickstarterでキャンペーンをやっている。","relatedLinks":[]},{"category":"Book","title":"Practical Modern JavaScript: Dive into ES6 and the Future of JavaScript: Nicolas Bevacqua: 9781491943533: Amazon.com: Books","url":"https://www.amazon.com/Practical-Modern-JavaScript-Dive-Future/dp/149194353X","tags":["JavaScript","book"],"content":"ES2015+についての書籍。","relatedLinks":[]}]},{"meta":{"title":"2017-07-31のJS: React 16.0β、WebCrypto API、The JavaScript Way book","author":"azu","layout":"post","date":"2017-07-31T10:57:09.365Z","category":"JSer","tags":["React","Safari","WebCrypto","book"],"url":"https://jser.info/2017/07/31/react-16.0b-webcrypto-api-the-javascript-way-book/"},"items":[{"category":"Headline","title":"Release Notes for Safari Technology Preview 36 | WebKit","url":"https://webkit.org/blog/7833/release-notes-for-safari-technology-preview-36/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 36リリース。\nObject spreadのサポートなど","relatedLinks":[]},{"category":"Headline","title":"jasmine/2.7.0.md at master · jasmine/jasmine","url":"https://github.com/jasmine/jasmine/blob/master/release_notes/2.7.0.md","tags":["JavaScript","testing","library","ReleaseNote"],"content":"jasmine 2.7.0リリース","relatedLinks":[]},{"category":"Headline","title":"esdoc/CHANGELOG.md at master · esdoc/esdoc","url":"https://github.com/esdoc/esdoc/blob/master/CHANGELOG.md#101-2017-07-30","tags":["JavaScript","document","ReleaseNote"],"content":"JavaScript向けのドキュメントツールのESDoc 1.0.1リリース。\nコア部分もプラグイン化され、`esdoc-standard-plugin`にまとめられた。","relatedLinks":[{"title":"ESDocという(多分)モダンなドキュメンテーションツールの紹介 - maru source","url":"http://blog.h13i32maru.jp/entry/2017/07/31/081614"},{"title":"ESDoc - A Good Documentation Generator for JavaScript | esdoc-site","url":"https://esdoc.org/manual/migration.html"},{"title":"esdoc/esdoc-plugins","url":"https://github.com/esdoc/esdoc-plugins"}]},{"category":"Headline","title":"React 16 beta · Issue #10294 · facebook/react","url":"https://github.com/facebook/react/issues/10294","tags":["React","ReleaseNote","issue"],"content":"React 16βリリース。\n`Map`/`Set`に依存してるのでpolyfillが必要、Fiberを試験的にサポート。\nStream SSRのサポート、`componentDidCatch`で子コンポーネントのエラーをキャッチできるように、bundleを提供するようになり`react/lib/*`は参照できなくなるなど","relatedLinks":[{"title":"React 16 β版 – 公式ドキュメント日本語訳 | maesblog","url":"https://mae.chab.in/archives/59852"}]},{"category":"Article","title":"This is what Node.js is used for in 2017 - Survey Results","url":"http://blog.risingstack.com/what-is-node-js-used-for-2017-survey/","tags":["node.js","アンケート"],"content":"Node.js利用者アンケートの結果が公開された。1,405の回答があり、Node.jsの利用用途、デプロイ先、利用バージョン、満足度などについて","relatedLinks":[]},{"category":"Article","title":"Unit testing Angular applications with Jest","url":"http://izifortune.com/unit-testing-angular-applications-with-jest/","tags":["Angular","testing"],"content":"Jestを使ってAngularのテストを行う方法について","relatedLinks":[]},{"category":"Article","title":"Media Updates in Chrome 61  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/07/chrome-61-media-updates","tags":["Chrome","video","article"],"content":"Chrome 61のMedia要素周りの変更点について。\nMSEを使った動画はバックグラウンド時にVideo Trackが無効化されるように、デバイスがrotateした場合に一定の条件で自動的に動画がフルスクリーンとなるように","relatedLinks":[{"title":"モバイル Web における動画再生  |  Web  |  Google Developers","url":"https://developers.google.com/web/fundamentals/media/mobile-web-video-playback#fullscreen"}]},{"category":"Article","title":"ECMAScript proposal updates @ 2017-07 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2017/07/28/ecmascript-proposals-status","tags":["ECMAScript","proposal"],"content":"2017年5月時点のECMAScript仕様Proposalの変更点まとめ","relatedLinks":[]},{"category":"Article","title":"PWAの実装をしてみた - 技術探し","url":"http://abouthiroppy.hatenablog.jp/entry/2017/07/28/101318","tags":["ProgressiveWebApp","React","article"],"content":"React + React Router + webpackでPWAのApp Shellパターンの実装をする話。\nルーティングでCode Splitting、Service Workerでのキャッシュについて","relatedLinks":[]},{"category":"Article","title":"お気楽 ECMAScritp2015 超入門","url":"http://www.geocities.jp/m_hiroi/light/js2015.html","tags":["ECMAScript","JavaScript","tutorial"],"content":"ES2015で追加された機能や構文についての入門サイト。\nそれぞれの機能や使い方について解説されている","relatedLinks":[]},{"category":"Article","title":"\\[es6\\]research on ES6 \\`Proxy\\`","url":"https://gist.github.com/bellbind/8f33d81458dd454b430d4cd949076b30","tags":["ECMAScript","JavaScript"],"content":"ES Proxyについての解説。\ntargetとtraoの不整合はTypeErrorを投げる。Proxy周りの仕様の読み方やtrapの種類や役割について。\n`Proxy.revocable`やユースケースについて","relatedLinks":[]},{"category":"Article","title":"Writing a Node.js module in TypeScript","url":"https://www.twilio.com/blog/2017/06/writing-a-node-module-in-typescript.html","tags":["TypeScript","npm","JavaScript"],"content":"TypeScriptで書いたモジュールをnpmに公開するチュートリアル。","relatedLinks":[]},{"category":"Article","title":"Error Handling in React 16 - React Blog","url":"https://facebook.github.io/react/blog/2017/07/26/error-handling-in-react-16.html","tags":["React","article"],"content":"React 16で入るError Boundariesについて。 子コンポーネントで起きたエラーを親がキャッチできる`componentDidCatch`のライフサイクルメソッドが追加された","relatedLinks":[]},{"category":"Article","title":"Update on Web Cryptography | WebKit","url":"https://webkit.org/blog/7790/update-on-web-cryptography/","tags":["JavaScript","security","article"],"content":"WebCrypto APIについて。 ネイティブ実装とライブラリの比較、基本的な使い方、非同期処理、利用できるアルゴリズム、prefix付きの`WebKitSubtleCrypto`から`SubtleCrypto`への移行について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Chrome Platform Status","url":"https://www.chromestatus.com/features/schedule","tags":["Chrome","browser"],"content":"Chromeのリリーススケジュールと変更機能がまとまったページ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bpesquet/thejsway: The JavaScript Way book","url":"https://github.com/bpesquet/thejsway","tags":["JavaScript","book","DOM"],"content":"JavaScriptについて学べる入門本。\nJavaScript/ES2015+の基本的な文法の解説、DOM/DOM APIの解説、Node.jsなどを使って実際のウェブアプリを作るという内容","relatedLinks":[{"title":"The JavaScript Way by Baptiste Pesquet ","url":"https://leanpub.com/thejsway"}]},{"category":"Book","title":"Amazon | TypeScript High Performance \\[Kindle edition\\] by Ajinkya Kher | Languages & Tools | Kindleストア","url":"https://www.amazon.co.jp/TypeScript-High-Performance-Ajinkya-Kher-ebook/dp/B071VVFD4D","tags":["TypeScript","book"],"content":"2017年9月6日発売\nTypeScriptでのプロジェクト開発についての書籍","relatedLinks":[]},{"category":"Book","title":"Learning React - O'Reilly Media","url":"http://shop.oreilly.com/product/0636920049579.do","tags":["React","book","redux"],"content":"FunctionalなアプローチでReact/Reduxについて学ぶ書籍","relatedLinks":[]}]},{"meta":{"title":"2017-08-08のJS: Storybook 3.2、core-js 2.5.0、Flow Lint","author":"azu","layout":"post","date":"2017-08-08T00:18:58.352Z","category":"JSer","tags":["Storybook","polyfill","ECMAScript","Flow"],"url":"https://jser.info/2017/08/08/storybook-3.2-core-js-2.5.0-flow-lint/"},"items":[{"category":"Headline","title":"Release v3.2.0 · storybooks/storybook","url":"https://github.com/storybooks/storybook/releases/tag/v3.2.0","tags":["JavaScript","UI","debug","Tools","ReleaseNote"],"content":"Storybook 3.2.0リリース。\nVueのサポート、メニューの階層表示をサポート、`onDeviceUI`のオプションをサポートなど","relatedLinks":[{"title":"Introducing: Storybook for Vue 🎉 – Storybook – Medium","url":"https://medium.com/storybookjs/introducing-storybook-for-vue-940f222541c5"}]},{"category":"Headline","title":"TestCafe v0.17.0 Released | TestCafe","url":"http://devexpress.github.io/testcafe/blog/testcafe-v0-17-0-released.html","tags":["JavaScript","ReleaseNote","browser","testing"],"content":"TestCafe v0.17.0リリース\n`testcafe-browser-provider-electron`の追加、`-c`オプションでConcurrentなテストを実行できるように、Automatic waitの仕組みを改善など","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · sinonjs/sinon","url":"https://github.com/sinonjs/sinon/releases/tag/v3.0.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Sinon.js 3.0.0リリース。\nDeprecatedとなっていたメソッドを削除、Fake XHR/Fake Serverはniseモジュールへ移動された。\n`format.setFormatter`の追加など","relatedLinks":[{"title":"Migrating to v3.0 - Sinon.JS","url":"http://sinonjs.org/releases/v3.0.0/migrating-to-3.0/"},{"title":"sinonjs/nise: Fake XHR and fake server","url":"https://github.com/sinonjs/nise"}]},{"category":"Headline","title":"V8 JavaScript Engine: V8 Release 6.1","url":"https://v8project.blogspot.com/2017/08/v8-release-61.html","tags":["V8","ReleaseNote"],"content":"V8 6.1リリース。\n`Map`/`Set`/`Object#isPrototypeOf()`/`Reflect.construct`のパフォーマンス改善。\nasm.jsのコードを検証してからwasmへコンパイルするようになるなど","relatedLinks":[{"title":"Deprecations and Removals in Chrome 61  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/08/chrome-61-deprecations"}]},{"category":"Headline","title":"Workspaces in Yarn | Yarn Blog","url":"https://yarnpkg.com/blog/2017/08/02/introducing-workspaces/","tags":["yarn","npm"],"content":"lernaのようなmonorepo管理の仕組みであるyarn workspaceについての紹介。\nオプションで有効化できる実験的な機能。リポジトリ内の複数のパッケージを管理して、それぞれのパッケージが依存するモジュールはsymlinkで解決できる。","relatedLinks":[]},{"category":"Headline","title":"Glamorous v4 is here 💄 🎉 🎊 – Kent C. Dodds – Medium","url":"https://medium.com/@kentcdodds/glamorous-v4-is-here-c678fe02a39a","tags":["CSS","React","library","ReleaseNote"],"content":"CSS in JSなライブラリのglamorous v4リリース。\n`theme`引数の削除、`useDisplayNameInClassName`の削除。\n`withProps`、`propsAreCssOverrides`、`shouldClassNameUpdate`のサポートなど","relatedLinks":[{"title":"Release v4.0.0 · paypal/glamorous","url":"https://github.com/paypal/glamorous/releases/tag/v4.0.0"},{"title":"glamorous/README.md at master · paypal/glamorous","url":"https://github.com/paypal/glamorous/blob/master/other/codemods/README.md"}]},{"category":"Headline","title":"Release 2.5.0 - 2017.08.05 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v2.5.0","tags":["JavaScript","library","ReleaseNote"],"content":"core-js 2.5.0リリース。\n`Promise#finally`、`Promise.try`、`Array#flatten`、`Array#flatMap`の追加。\nCollectionの`of`/`from`静的メソッドの追加、`Math`のProposalの追加、DOM collectionのiterable対応の更新、ProposalのStage対応など","relatedLinks":[]},{"category":"Article","title":"JavaScriptフレームワーク選定の議論 - Qiita","url":"http://qiita.com/azu/items/2921f62127b8d3a1aa03","tags":["JavaScript","library","opinion"],"content":"JavaScriptのフレームワーク選定やTypeScript/Flowといった言語の選択について。 それぞれのカテゴリにどのような選択肢があり、どのように選択していくのかについて","relatedLinks":[]},{"category":"Article","title":"This in JavaScript | Zell Liew","url":"https://zellwk.com/blog/this/","tags":["JavaScript","article"],"content":"JavaScriptの`this`についての解説。\nグローバル、オブジェクト、メソッド、関数、Arrow Function、イベントハンドラなどにおける`this`について。\nまた`this`をバインドする`bind`について","relatedLinks":[]},{"category":"Article","title":"babel-preset-env@2.0 を試した -トランスパイル環境をスケールさせていく- | mediba Creator × Engineer Blog","url":"http://ceblog.mediba.jp/post/163780014387/babel-preset-env-v2","tags":["babel","plugin","article","JavaScript"],"content":"現在αリリースされているbabel-preset-env 2.0αについて。 静的解析した結果のpolyfillだけを読み込む`\"useBuiltIns\": \"usage\"`の解説と挙動について。","relatedLinks":[]},{"category":"Article","title":"Linting in Flow – Flow – Medium","url":"https://medium.com/flow-type/linting-in-flow-7709d7a7e969","tags":["flowtype","article"],"content":"Flow 0.52.0で追加されたFlow linterについての解説。\nESLintのように`.flowconfig`やコメントでルール毎に有効/無効/エラーレベルの制御できる。","relatedLinks":[{"title":"flow/Changelog.md at v0.52.0 · facebook/flow","url":"https://github.com/facebook/flow/blob/v0.52.0/Changelog.md"},{"title":"Linting Overview | Flow","url":"https://flow.org/en/docs/linting/"}]},{"category":"SlideVideo","title":"component test // Speaker Deck","url":"https://speakerdeck.com/bokuweb/component-test","tags":["JavaScript","testing","UI","slide"],"content":"ビジュアルリグレッションツールのreg-suitについてのスライド。\nスナップショットとして保存した画像同士を比較しリグレッションを検知する。\nプラグインでスナップショットの保存先や通知先を変更できる。","relatedLinks":[{"title":"reg-suit","url":"https://reg-viz.github.io/reg-suit/"}]},{"category":"SlideVideo","title":"Get ready: A new V8 is coming, Node.js performance is changing. | nearForm","url":"https://www.nearform.com/blog/node-js-is-getting-a-new-v8-with-turbofan/","tags":["V8","JavaScript","performance"],"content":"V8のバージョンごとの典型的なケースにおけるパフォーマンスについて。TurboFunによる最適化の違い。\ntry-catch、`delete`と`undefined`の代入、`argumetns`の渡し方の違い、bind、forループ、オブジェクトの生成などのケースいおける比較","relatedLinks":[]},{"category":"SlideVideo","title":"真のコンポーネント粒度を求めて // Speaker Deck","url":"https://speakerdeck.com/takazudo/zhen-falsekonponentoli-du-woqiu-mete","tags":["CSS","slide"],"content":"CSSとコンポーネントについてのスライド。\nOOCSSやBEMにおけるコンポーネント、Atomic Designにおけるコンポーネントの粒度と抽象化、抽象化を避けたECSSコンポーネントなどについて","relatedLinks":[]},{"category":"SlideVideo","title":"複雑なJavaScriptアプリケーションに立ち向かうためのアーキテクチャ // Speaker Deck","url":"https://speakerdeck.com/shinpeim/fu-za-najavascriptapurikesiyonnili-tixiang-kautamefalseakitekutiya","tags":["JavaScript","slide","設計"],"content":"見通しが悪いものを分割統治する話。\nプレゼンテーションとドメインの分離(MV*)、モデルをレイヤー分けについて。\nレイヤードアーキテクチャのコンセプトとしてのクリーンアーキテクチャやCQRSについて。\nまた具体的な実装についてなど","relatedLinks":[{"title":"複雑なJavaScriptアプリケーションを考えながら作る話","url":"http://azu.github.io/slide/2016/react-meetup/large-scale-javascript.html"}]},{"category":"WebsiteDocument","title":"The Critical Request | CSS-Tricks","url":"https://css-tricks.com/the-critical-request/","tags":["JavaScript","browser","performance"],"content":"クリティカルリクエストについて。\n開発者ツールでリクエストのPriorityを見る方法、またPriorityはどのように付けられているか。\nFirst meaningful paintを妨害するリクエストの見つけ方、Priorityを`rel=preload`を使っての管理について","relatedLinks":[]},{"category":"WebsiteDocument","title":"StackBlitz","url":"https://stackblitz.com/","tags":["webservice","editor"],"content":"VSCodeを使ったオンラインIDE、コードシェアサービス。\nHot reloading、npmモジュールの管理、書いたコードの公開などができる","relatedLinks":[{"title":"StackBlitz — Online VS Code IDE for Angular ","url":"https://medium.com/@ericsimons/stackblitz-online-vs-code-ide-for-angular-react-7d09348497f4"}]},{"category":"SoftwareLibrary","title":"deepsweet/hocs: A collection of Higher-Order Components for React","url":"https://github.com/deepsweet/hocs","tags":["React","library"],"content":"React用のHigh Order Componentを集めたライブラリ。\nPropsの除外、LifeCycleのhook、debounce、throttleなど","relatedLinks":[]},{"category":"Book","title":"Node.js 8 the Right Way - O'Reilly Media","url":"http://shop.oreilly.com/product/9781680501957.do","tags":["node.js","book"],"content":"2017年10月発売\nNode.js v8についての書籍","relatedLinks":[]},{"category":"Book","title":"インクルーシブHTML+CSS & JavaScript 多様なユーザーニーズに応えるフロントエンドデザインパターン | Heydon Pickering, 太田良典, 伊原力也, 株式会社Bスプラウト |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4862463878","tags":["HTML","CSS","JavaScript","accessibility","book"],"content":"2017年9月29日発売\nInclusive Design Patternsについての翻訳本","relatedLinks":[{"title":"Meet “Inclusive Front-End Design Patterns”, A New Smashing Book – Smashing Magazine","url":"https://www.smashingmagazine.com/inclusive-design-patterns/"}]},{"category":"Book","title":"最新JavaScript開発～ES2017対応モダンプログラミング | 電子書籍とプリントオンデマンド（POD） | NextPublishing（ネクストパブリッシング）","url":"http://nextpublishing.jp/book/8958.html","tags":["JavaScript","book"],"content":"ES2017についてチュートリアルガイド","relatedLinks":[]}]},{"meta":{"title":"2017-08-14のJS: Firefox 55、BootStrap 4β、Node.js 8.3.0","author":"azu","layout":"post","date":"2017-08-14T23:21:14.903Z","category":"JSer","tags":["Firefox","BootStrap","Node.js"],"url":"https://jser.info/2017/08/15/firefox-55-bootstrap-4b-node.js-8.3.0/"},"items":[{"category":"Headline","title":"Release v3.1.0 · sinonjs/sinon","url":"https://github.com/sinonjs/sinon/releases/tag/v3.1.0","tags":["JavaScript","library","ReleaseNote"],"content":"Sinon.js 3.1.0リリース\nsandboxにファクトリメソッドの追加、\n`sandbox.stub`のリグレッションの修正など","relatedLinks":[]},{"category":"Headline","title":"Release v3.5.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v3.5.0","tags":["webpack","ReleaseNote"],"content":"webpack v3.5.0リリース。\nDynamic Importに`webpackMode`のオプションを追加、`require.context`にcontext modeの第4引数を追加など","relatedLinks":[{"title":"Module API - Methods","url":"https://webpack.js.org/api/module-methods/"}]},{"category":"Headline","title":"Microsoft/napajs: Napa.js: Multi-threaded JavaScript runtime","url":"https://github.com/Microsoft/napajs","tags":["JavaScript","node.js"],"content":"Node.jsで動くマルチスレッドライブラリ。元々BingでCPU-boundな処理を扱うために作られたもの。\nスレッド(Worker)をまとめたZoneがあり、Zoneに対して値を渡してそれぞれのスレッドで処理が行える","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview Release 37 | WebKit","url":"https://webkit.org/blog/7862/release-notes-for-safari-technology-preview-release-37/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 37リリース。\n`navigator.sendBeacon`、`document.elementsFromPoint`のサポート。\n`Promise#finally`、optional `catch` bindingのサポートなど","relatedLinks":[{"title":"tc39/proposal-optional-catch-binding: proposal for ECMAScript to allow omission of the catch binding","url":"https://github.com/tc39/proposal-optional-catch-binding"}]},{"category":"Headline","title":"Node v8.3.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v8.3.0/","tags":["node.js","ReleaseNote"],"content":"Node v8.3.0リリース。\nTurbofanが有効化されたV8 6.0へのアップグレード、WHATWG Encodingのサポートなど","relatedLinks":[{"title":"GET READY: A NEW V8 IS COMING, NODE.JS PERFORMANCE IS CHANGING.","url":"https://medium.com/the-node-js-collection/get-ready-a-new-v8-is-coming-node-js-performance-is-changing-46a63d6da4de"}]},{"category":"Headline","title":"Bootstrap 4 Beta · Bootstrap","url":"http://blog.getbootstrap.com/2017/08/10/bootstrap-4-beta/","tags":["CSS","library","ReleaseNote"],"content":"Bootstrap 4βリリース。\nLessからSassへ、FlexboxとGridシステムの改善、IE8/9のサポート終了、JavaScriptプラグインの書き直しなど","relatedLinks":[]},{"category":"Headline","title":"Firefox 55 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/docs/Mozilla/Firefox/Releases/55","tags":["firefox","ReleaseNote"],"content":"Firefox 55リリース。\nObject spread/rest operator、SharedArrayBufferに対応。\nWebVR、requestIdleCallback、Intersection Observer API対応。\nまたSelection APIの仕様追従、Geo APIなどがSecure Contextのみで利用可能になるなど","relatedLinks":[{"title":"Firefox 55.0 リリースノート","url":"https://www.mozilla.jp/firefox/55.0/releasenotes/"},{"title":"Firefox 55: first desktop browser to support WebVR ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2017/08/firefox-55-supports-webvr/"},{"title":"Dummy","url":"http://example.com/"}]},{"category":"Article","title":"ZEIT – Next.js 3.0","url":"https://zeit.co/blog/next3","tags":["React","サーバー","library"],"content":"Next.js 3.0リリース。\nStatic Exportのサポート、Dynamic Importのサポート、HMRの対応改善など","relatedLinks":[]},{"category":"Article","title":"ES Modules in Node Today! – Web Dev @ Microsoft – Medium","url":"https://medium.com/web-on-the-edge/es-modules-in-node-today-32cff914e4b","tags":["ECMAScript","JavaScript","Tools","node.js"],"content":"Node.jsで今後サポートが予定されているES modulesを扱えるようにするrequire extension hookライブラリ。\n`.mjs`対応やCommonJSとの相互運用性に考慮したオプションなどを持つ","relatedLinks":[{"title":"standard-things/esm: ES modules in Node today!","url":"https://github.com/standard-things/esm"},{"title":"node-eps/002-es-modules.md at master · nodejs/node-eps","url":"https://github.com/nodejs/node-eps/blob/master/002-es-modules.md"}]},{"category":"Article","title":"Passing data between Promise callbacks","url":"http://2ality.com/2017/08/promise-callback-data-flow.html","tags":["Promises","JavaScript"],"content":"Promiseチェイン間における値のやり取りのパターンについて","relatedLinks":[]},{"category":"Article","title":"The Modern Javascript Tutorial","url":"https://javascript.info/","tags":["JavaScript","DOM","tutorial"],"content":"JavaScript/DOM APIのチュートリアルサイト。\nそれぞれの項目ごとに解説やサンプル、演習問題がある。","relatedLinks":[]},{"category":"Article","title":"Introduction to Preact — a smaller, faster React alternative","url":"https://blog.logrocket.com/introduction-to-preact-a-smaller-faster-react-alternative-ad5532eb6d79","tags":["React","JavaScript","article"],"content":"Preactについての記事。\nPreactとは何か、Reactとの違いや互換性(preact-compat)について。\nまたPreactの基本的な使い方、preact-cliを使っての開発についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Javascript Performance by mikesherov","url":"http://slides.com/mikesherov/javascript-performance","tags":["JavaScript","performance","slide"],"content":"パフォーマンス最適化についてのスライド。\n`O(n^2)`なアルゴリズムを避ける、キャッシュとメモ化、GCを避ける。\n不必要なImmutableを避ける、必要ないことはしない、パフォーマンス計測の仕方などについて。\nnpmやwebpackなど実際のプロジェクトの例などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Investigating Performance of Object#toString in ES2015","url":"https://ponyfoo.com/articles/investigating-performance-object-prototype-to-string-es2015","tags":["JavaScript","V8","performance","firefox"],"content":"V8の`Object.prototype.toString()`の最適化について。\nES2015で`Symbol.toStringTag`が追加され、toStringはこの実装を考慮する必要がある。(toString自体はオブジェクトの型判定によく使われている)\nオブジェクトが`Symbol.toStringTag`を実装しているかのフラグをMapで持っておき、持ってない場合は余計なlookupを省くようにしたという話。\n元々はSpiderMonkeyでデザインされていた方法をportした内容についての解説。","relatedLinks":[{"title":"1369042 - Optimize the @@toStringTag and @@toPrimitive lookups","url":"https://bugzilla.mozilla.org/show_bug.cgi?id=1369042#c0"},{"title":"Interesting Symbols - Google ドキュメント","url":"https://docs.google.com/document/d/1q_Y2YM8S055RF1R6qvDe65kOEVO99tdviI1vaDcbnmc/edit#"}]},{"category":"WebsiteDocument","title":"zeeshanu/learn-regex: Learn regex the easy way","url":"https://github.com/zeeshanu/learn-regex","tags":["正規表現","tutorial"],"content":"正規表現について簡単にまとめられたドキュメント。\n基本的な使い方やメタ文字、フラグなどについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"masakazu-yanai/char-canvas: Draw Tool for Ascii Art.","url":"https://github.com/masakazu-yanai/char-canvas","tags":["JavaScript","canvas","library"],"content":"CanvasライクなAPIでアスキーアートを扱うライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"darcyclarke/rawkit: 🦊 Immediately Open Chrome DevTools when debugging Node.js apps","url":"https://github.com/darcyclarke/rawkit","tags":["node.js","Chrome","Extension","console","Tools"],"content":"Chromeの立ち上げと`node --inspect`のデバッガーへの接続を自動的に行うことができるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"JSON to TypeScript interfaces and runtime type-checkers – quicktype","url":"https://ts.quicktype.io/","tags":["JavaScript","JSON","TypeScript","webservice"],"content":"JSONからTypeScript/JSON Schema/Go/C#/Elmなどの型定義/interfaceを生成することができるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ream/ream: 🚀 Framework for building universal Vue.js app","url":"https://github.com/ream/ream","tags":["JavaScript","Vue","library"],"content":"UniversalなVueアプリのフレームワーク。\nNext.jsやNuxt.jsのディレクトリ構造などの暗黙的な規約ではなく、明示的な設定/コードによりアプリケーションを作れるようにする目的","relatedLinks":[]}]},{"meta":{"title":"2017-08-22のJS:  Chrome 61β、TypeScript 2.5RC、Flow 0.53.0","author":"azu","layout":"post","date":"2017-08-22T02:00:59.401Z","category":"JSer","tags":["Chrome","TypeScript","Flow"],"url":"https://jser.info/2017/08/22/chrome-61b-typescript-2.5rc-flow-0.53.0/"},"items":[{"category":"Headline","title":"Node v8.4.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v8.4.0/","tags":["node.js","ReleaseNote"],"content":"Node v8.4.0リリース。\nフラグ付きで`http2`をサポート、`util.format`がオブジェクトを扱う`%o`と`%O`をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 0.22.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v0.22.0","tags":["JavaScript","node.js","testing","ReleaseNote"],"content":"AVA 0.22.0リリース。\nデフォルトのconcurrencyをCPUコア数に合わせるように、`t.log`の追加など","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 61 Beta: JavaScript modules, Payment Request API on desktop, Web Share API, and WebUSB","url":"https://blog.chromium.org/2017/08/chrome-61-beta-javascript-modules.html","tags":["Chrome","ReleaseNote"],"content":"Chrom 61βリリース。\n`<script type=module>`のサポート、Payment Request API、Web Share API、WebUSB APIのサポート。\nExpect-CT HTTP headerのサポート、HTTPリクエストURLに`>`や`\\n`が含まれている場合にブロックするように","relatedLinks":[{"title":"Expect-CT Extension for HTTP","url":"http://httpwg.org/http-extensions/expect-ct.html"},{"title":"Prevent requests to HTTP(S) URLs containing raw ","url":"https://github.com/whatwg/fetch/issues/546"}]},{"category":"Headline","title":"flow/Changelog.md at v0.53.0 · facebook/flow","url":"https://github.com/facebook/flow/blob/v0.53.0/Changelog.md","tags":["flowtype","React","ReleaseNote"],"content":"Flow 0.53.0リリース。\nReactのモデルに対する型の改善。互換性のない変更も含まれるため`flow-upgrade`コマンドでマイグレーションできるようになっている","relatedLinks":[{"title":"flow-upgrade | Yarn","url":"https://yarnpkg.com/en/package/flow-upgrade"}]},{"category":"Headline","title":"Announcing TypeScript 2.5 RC | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2017/08/17/announcing-typescript-2-5-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.5 RCリリース。\n現在ProposalのOptional catchのサポート、`npm link`などで定義が重複した場合にコンパイルエラーとなる問題を修正、`--preserveSymlinks`のサポートなど","relatedLinks":[{"title":"Duplicate type declarations with npm link · Issue #6496 · Microsoft/TypeScript","url":"https://github.com/Microsoft/TypeScript/issues/6496"}]},{"category":"Headline","title":"Release v6.0.0 · h5bp/html5-boilerplate","url":"https://github.com/h5bp/html5-boilerplate/releases/tag/6.0.0","tags":["HTML5","ReleaseNote"],"content":"html5-boilerplate 6.0.0リリース","relatedLinks":[]},{"category":"Headline","title":"Release DOMPurify 1.0.0 · cure53/DOMPurify","url":"https://github.com/cure53/DOMPurify/releases/tag/1.0.0","tags":["DOM","ReleaseNote","JavaScript"],"content":"XSSサニタイズライブラリのDMOPurify 1.0.0リリース。\nコードベースをES2015にし、rollupしたものを配布するように。バグ修正など","relatedLinks":[]},{"category":"Article","title":"Accessibility Testing with pa11y","url":"https://bitsofco.de/pa11y/","tags":["accessibility","article","Tools"],"content":"アクセシビリティテストツールのpa11yについての記事。\n基本的な使い方について","relatedLinks":[]},{"category":"Article","title":"Rethinking drag and drop – Alex Reardon – Medium","url":"https://medium.com/@alexandereardon/rethinking-drag-and-drop-d9f5770b4e6b","tags":["React","JavaScript","library","article"],"content":"React向けの縦横リストのD&Dライブラリであるreact-beautiful-dndについて。\nどのようにアクセシビリティやパフォーマンスに気をつけて実装しているかについて書かれている","relatedLinks":[{"title":"atlassian/react-beautiful-dnd: Beautiful, accessible drag and drop for lists with React.js","url":"https://github.com/atlassian/react-beautiful-dnd"}]},{"category":"Article","title":"The State of CSS in Angular – Angular Blog","url":"https://blog.angular.io/the-state-of-css-in-angular-4a52d4bd2700","tags":["CSS","Angular","article"],"content":"AngularのCSSについて。\nコンポーネントのカプセルCSS、Shadow DOMを使ったnativeのカプセル化、非推奨となった`/deep/`や`:ng-deep`について","relatedLinks":[{"title":"The New Angular ::ng-deep and the Shadow-Piercing Combinators Drop","url":"https://hackernoon.com/the-new-angular-ng-deep-and-the-shadow-piercing-combinators-deep-and-drop-4b088dbe459"}]},{"category":"Article","title":"HTTP/2 Server Push with Node.js | @RisingStack","url":"http://blog.risingstack.com/node-js-http-2-push/","tags":["node.js","HTTP2","article"],"content":"`--expose-http2`フラグで有効化できるNode.jsのHTTP/2でサーバプッシュを行う方法についてのサンプル","relatedLinks":[]},{"category":"SlideVideo","title":"Ava Test Runner - A Fresh Take On JavaScript Testing and Growing an Open-Source Project - Sessions by Pusher","url":"https://pusher.com/sessions/meetup/the-js-roundabout/ava-test-runner-a-fresh-take-on-javascript-testing-and-growing-an-open-source-project","tags":["node.js","testing","video"],"content":"Node.jsのテストフレームワークであるAVAについてを紹介する発表動画。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"plouc/nivo: Make dataviz fun again","url":"https://github.com/plouc/nivo","tags":["JavaScript","React","d3.js","library","グラフ"],"content":"D3.jsとReactを使ったデータビジュアライズコンポーネント。 SVGの出力の対応やサーバサイドレンダリングをしてSVGを取得するHTTP APIなども用意されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jiayihu/pretty-algorithms: 🌊 Pretty, common and useful algorithms with modern JS and beautiful tests","url":"https://github.com/jiayihu/pretty-algorithms","tags":["JavaScript","アルゴリズム","library","TypeScript"],"content":"検索、ソート、カウントなどのよくあるアルゴリズムを実装したライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"GoogleChrome/puppeteer: Headless Chrome Node API","url":"https://github.com/GoogleChrome/puppeteer","tags":["Chrome","Tools","library"],"content":"Headless Chromeを扱うライブラリ。\nChromeチームが開発している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"google/songbird: Spatial Audio Encoding on the Web","url":"https://github.com/google/songbird","tags":["audio","JavaScript","library"],"content":"Web Audio APIを使ったSpatial Audio Encodingライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"shellscape/mocha-chrome: Run Mocha tests using headless Google Chrome","url":"https://github.com/shellscape/mocha-chrome","tags":["Chrome","Tools","browser","testing"],"content":"MochaをHeadless chromeで動かすツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"streamich/memfs: In-memory filesystem with Node's API","url":"https://github.com/streamich/memfs","tags":["node.js","JavaScript","library"],"content":"Node.jsの`fs`モジュール互換のメモリファイルシステムライブラリ。\nブラウザでも動作する","relatedLinks":[]}]},{"meta":{"title":"2017-08-29のJS: Prettier 1.6.0の設定ファイルサポート、Polymer 3.0がES Modulesへ移行","author":"azu","layout":"post","date":"2017-08-29T00:52:30.954Z","category":"JSer","tags":["prettier","polymer","webcomponents"],"url":"https://jser.info/2017/08/29/prettier-1.6.0-polymer-3.0es-modules/"},"items":[{"category":"Headline","title":"Release Notes for Safari Technology Preview 38 | WebKit","url":"https://webkit.org/blog/7877/release-notes-for-safari-technology-preview-38/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 38リリース。\nBeacon APIのサポート、Web Paymentsを試験的にサポート、`font-display`/`caret-color`の対応、`input`要素の`accept`属性のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release Inferno 3.8.0 · infernojs/inferno","url":"https://github.com/infernojs/inferno/releases/tag/v3.8.0","tags":["JavaScript","library","ReleaseNote"],"content":"Inferno 3.8.0リリース。\n`inferno-router`が非同期データ取得をサポート、`dangerouslySetInnerHtml`のバグ修正など","relatedLinks":[]},{"category":"Headline","title":"bumped/bumped: Makes easy release software","url":"https://github.com/bumped/bumped","tags":["npm","node.js","Tools"],"content":"npm publishまわりの補助ツール。\nsemverに対するサブコマンドの対応、publishライフサイクルに対するパイプライン処理を書ける、プラグインでの拡張など","relatedLinks":[]},{"category":"Headline","title":"Release v0.4.0 · sonarwhal/sonar","url":"https://github.com/sonarwhal/sonar/releases/tag/0.4.0","tags":["JavaScript","Tools","web "],"content":"sonar v0.4.0リリース。\n`Strict-Transport-Security`/`Set-Cookie`ヘッダーをチェックするルール、`viewport`の値をチェックするルールの追加など","relatedLinks":[]},{"category":"Headline","title":"Release 1.6.0: Config File, JSX · prettier/prettier","url":"https://github.com/prettier/prettier/releases/tag/1.6.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"prettier 1.6.0リリース。\n`.prettierrc`、`.prettierignore`の設定ファイルをサポート。\nJSXのサポート改善、TypeScript 2.5RCのサポート、CLIの引数でignoreパターンをサポートなど","relatedLinks":[]},{"category":"Article","title":"Polymer 3.0 preview: npm and ES6 Modules - Polymer Project","url":"https://www.polymer-project.org/blog/2017-08-22-npm-modules","tags":["WebComponents","library","article"],"content":"Polymer 3.0での変更点の予定について書かれている。\nBowerは止めnpmをサポート、HTML Importsを止めES modulesへと変更する予定","relatedLinks":[{"title":"Polymer Developer Summit 2017 - Live Stream Day 1 - YouTube","url":"https://www.youtube.com/watch?v=yTASiOaXlck"}]},{"category":"Article","title":"Custom Elements Everywhere","url":"https://custom-elements-everywhere.com/","tags":["WebComponents"],"content":"AngularやReact、Vueなど各種Viewを含むフレームワークがCustom Elementsとどの程度協調処理できているかをまとめたテストスイート","relatedLinks":[]},{"category":"Article","title":"Unit testing with Angular and ineeda – Default to Open – Medium","url":"https://medium.com/default-to-open/unit-testing-with-angular-and-ineeda-76746a0c8f58","tags":["JavaScript","Angular","testing","TypeScript"],"content":"ineedaというES Proxyを利用したモックライブラリについて。\nAngularを例にネストモックやTypeScriptの型定義について書かれている。","relatedLinks":[]},{"category":"Article","title":"Using React v16 to create self-destructing components","url":"https://medium.com/@gajus/using-react-v16-to-create-self-destructing-components-de8e4eb61d0f","tags":["React","article"],"content":"React 16から利用できるself-destructing componentsについて","relatedLinks":[]},{"category":"Article","title":"Google Dev Tools are X-Rays Specs For Code – codeburst","url":"https://codeburst.io/google-dev-tools-are-x-rays-specs-for-code-db3e7e17f801","tags":["Chrome","debug","article"],"content":"Chromeの開発者ツールを使ってコールスタックトレースとスコープの読み方について","relatedLinks":[]},{"category":"Article","title":"ReactNativeでの開発を通じて得た知見 - razokulover publog","url":"http://razokulover.hateblo.jp/entry/2017/08/28/173807","tags":["React","JavaScript","ios","Android"],"content":"ReactNativeでのアプリ開発で気をつけたことについて。\nコンポーネント、ステート管理、非同期処理、ルーティング、スタイルなどについて","relatedLinks":[]},{"category":"SlideVideo","title":"SF WebPerf Meetup: Building for Resilience & Performance - Google スライド","url":"https://docs.google.com/presentation/d/11FJdFFWlFOS6QtjjU-YWQ0ltRjmxgRhQqU1CLZTxzeA/present?token=AC4w5ViQ3m5H0R1Zr_C21LlP3f9X1vsTEg%3A1503931823319&includes_info_params=1#slide=id.g1e42364cea_0_119","tags":["Chrome","browser","slide"],"content":"Client HintとRUMについてのスライド。 クライアント/デバイスの状態に合わせてコンテンツを提供するためのHint APIとRUMについて。 Device MemoryやNetInfo Extension、RUMを計測する方法と低スペックなデバイスではLong Taskがロードタイム","relatedLinks":[]},{"category":"WebsiteDocument","title":"🤖 NEW: Selenium IDE for Chrome (Open-Source), plus additional features = Kantu for Chrome","url":"https://a9t9.com/kantu/web-automation/chrome","tags":["Chrome","Selenium","Extension"],"content":"操作を記録して再生できるChrome拡張。\nSelecnium IDEのようなものを目指している。","relatedLinks":[]},{"category":"WebsiteDocument","title":"tsuyoshiwada/storybook-chrome-screenshot: A Storybook addon, Save the screenshot image of your stories via puppeteer.","url":"https://github.com/tsuyoshiwada/storybook-chrome-screenshot","tags":["Chrome","testing","スクリーンショット"],"content":"StorybookのスクリーンショットをHeadless Chromeでキャプチャするツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"phenomnomnominal/ineeda: ineeda - auto-mocking for JavaScript with Proxies!","url":"https://github.com/phenomnomnominal/ineeda","tags":["JavaScript","TypeScript","testing","library"],"content":"ES Proxyを使ったモックライブラリ。\n処理のintercept、処理の追加、TypeScriptとの型定義。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"fmsouza/wcode: Monaco-based code editor which runs inside a browser.","url":"https://github.com/fmsouza/wcode","tags":["editor","library","JavaScript"],"content":"Monacoベースのエディタをブラウザで動かすツール","relatedLinks":[]},{"category":"Book","title":"D3 in Depth","url":"http://d3indepth.com/","tags":["d3.js","book"],"content":"D3.jsについての電子書籍","relatedLinks":[]}]},{"meta":{"title":"2017-09-05のJS: Headless Browserの対応、Browserifyの再開","author":"azu","layout":"post","date":"2017-09-05T01:20:45.284Z","category":"JSer","tags":["browser","firefox","Chrome","headless","browserify"],"url":"https://jser.info/2017/09/05/headless-browser-browserify/"},"items":[{"category":"Headline","title":"Announcing TypeScript 2.5 | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2017/08/31/announcing-typescript-2-5/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.5リリース。\nOptinal-catch-bindingのサポート、エディタ連携の改善、重複/aliasなパッケージの扱いを改善、`--preserveSymlinks`のサポートなど","relatedLinks":[{"title":"Typescript 2.5 リリース - abcdefGets","url":"http://abcdef.gets.b6n.ch/entry/2017/09/01/143601"}]},{"category":"Headline","title":"Ember.js - Ember 2.15 and 2.16 Beta Released","url":"https://emberjs.com/blog/2017/09/01/ember-2-15-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember 2.15リリース。\n`Ember.Router`のスーパーセットである`router` serviceの公開など","relatedLinks":[]},{"category":"Headline","title":"Concurrent JavaScript: It can work! | WebKit","url":"https://webkit.org/blog/7846/concurrent-javascript-it-can-work/","tags":["JavaScript","webkit"],"content":"`SharedArrayBuffer`が追加されるため、JavaScriptでThreadをサポートした場合にどうなるのかという思考実験についての記事。\n現在のJavaScript VMはシングルスレッドであることを利用しているので、マルチスレッドの場合のVMのパフォーマンスなどについて。","relatedLinks":[]},{"category":"Headline","title":"🏁 Release: Iteration 10 – 10th developer preview · Issue #177 · ckeditor/ckeditor5-design","url":"https://github.com/ckeditor/ckeditor5-design/issues/177","tags":["JavaScript","editor","library","ReleaseNote"],"content":"CKEditor 5 v0.10.0リリース。\nMSEdgeのサポート、ツールチップメニューの改善、クリップボードの改善など","relatedLinks":[{"title":"CKEditor 5 Developer Preview (v0.10.0)","url":"https://ckeditor5.github.io/"},{"title":"CKEditor 5 – Roadmap to 1.0.0 and beyond · Issue #172 · ckeditor/ckeditor5-design","url":"https://github.com/ckeditor/ckeditor5-design/issues/172"}]},{"category":"Article","title":"What's New In DevTools (Chrome 62)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/08/devtools-release-notes","tags":["Chrome","article"],"content":"Chrome 62の開発者ツールの更新点について。\nTop-level `await`がコンソールで利用可能に、特定のnodeのスクリーンショットを取れるように、CSS Gridのハイライト、コンソールフィルタの改善。\nまたHARをインポートできるようになり、キャッシュデータの閲覧ができるように","relatedLinks":[]},{"category":"Article","title":"Form Validation with Web Audio | CSS-Tricks","url":"https://css-tricks.com/form-validation-web-audio/","tags":["web ","audio","accessibility","article"],"content":"Web Audio APIとフォームバリデーションを組み合わせる話。","relatedLinks":[]},{"category":"Article","title":"Measuring performance gains — AngularJS to React (with Redux or Mobx)","url":"https://medium.com/@guptagaruda/measuring-performance-gains-angularjs-to-react-with-redux-or-mobx-fb221517455","tags":["React","Angular"],"content":"3つのベンチマークアプリを元にAngular 1.xとReact/Redux/Mobxを比較した記事。\n現在も多くのエンタープライズアプリがAngular 1.xで動いているため、Reactに移ることでどのようなメリットがあるのかを計測する目的","relatedLinks":[]},{"category":"Article","title":"Decaffeinating a Large CoffeeScript Codebase Without Losing Sleep · DataFox Tech Blog","url":"http://eng.datafox.com/javascript/2017/07/18/decaffeinating-large-coffeescript-codebase/","tags":["CoffeeScript","JavaScript"],"content":"bulk-decaffeinateを使ったCoffeeScriptからJavaScriptへの移行手順についての記事。","relatedLinks":[]},{"category":"Article","title":"React + RxJSで始める状態管理 - VOYAGE GROUP techlog","url":"http://techlog.voyagegroup.com/entry/2017/08/31/102915","tags":["JavaScript","TypeScript","almin","設計"],"content":"Write層とRead層を分けることでのメリットとデメリットについて。 \n複雑さに対する責務の分離と依存局所化について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Headless mode - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Headless_mode","tags":["firefox","document"],"content":"Firefoxのheadless modeについてのドキュメント","relatedLinks":[]},{"category":"WebsiteDocument","title":"Rendering on Google Search  |  Search  |  Google Developers","url":"https://developers.google.com/search/docs/guides/rendering","tags":["Chrome","google","SEO","browser"],"content":"Google Search Botのレンダリングサブシステムで利用してるChromeのバージョンやサポートしてない(無効化されている)機能について書かれてる。\n2017年9月4日現在はChrome 41をベースにしている","relatedLinks":[{"title":"来日したGoogleゲイリーに何でも聞いてみた――プロジェクトOWL、検索アナリティクス、PWA etc. #inhouseseo | 海外SEO情報ブログ","url":"https://www.suzukikenichi.com/blog/ama-with-gary/amp/"}]},{"category":"WebsiteDocument","title":"Kea vs setState, Redux, Mobx, Dva, JumpState, Apollo, etc.","url":"https://medium.com/@mariusandra/kea-vs-setstate-redux-mobx-dva-jumpstate-apollo-etc-4aa26ea11d02","tags":["JavaScript","React","redux"],"content":"React向けのステート管理ライブラリのKeaについての記事。","relatedLinks":[{"title":"Kea","url":"https://kea.js.org/"}]},{"category":"WebsiteDocument","title":"help wanted · Issue #5 · browserify/discuss","url":"https://github.com/browserify/discuss/issues/5","tags":["browserify","issue"],"content":"browserifyのissueと今後(ES Moduleやhmrなど)について。\nbrowserify organizationにそれぞれのパッケージが移されまとめて管理されるようになった","relatedLinks":[]},{"category":"WebsiteDocument","title":"phantombuster/nickjs: Web scraping library made by the Phantombuster team. Modern, simple & works on all websites.","url":"https://github.com/phantombuster/nickjs","tags":["JavaScript","browser","library"],"content":"Headless ChromeとPhantomJSをサポートしてるスクレイピングライブラリ","relatedLinks":[{"title":"Phantombuster: API-fy the Web","url":"https://phantombuster.com/"}]},{"category":"SoftwareLibrary","title":"react-tools/react-move: React Move 🌀 Beautiful, data-driven animations for React","url":"https://github.com/react-tools/react-move","tags":["React","animation","library"],"content":"Reactでデータドリブンなアニメーションを行うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lukechilds/keyv: Simple key-value store with support for multiple backends","url":"https://github.com/lukechilds/keyv","tags":["node.js","library"],"content":"Redis、MySQLなどさまざまなバックエンドに対応してるシンプルなKVSライブラリ。\nMap的なAPIを実装したadpterを使うことでバックエンドを変更できる","relatedLinks":[]},{"category":"Book","title":"React for Real - O'Reilly Media","url":"http://shop.oreilly.com/product/9781680502633.do","tags":["React","book"],"content":"Reactについての書籍","relatedLinks":[]},{"category":"Book","title":"New Javascript Books","url":"https://newjavascriptbooks.com/","tags":["JavaScript","book"],"content":"JavaScriptについての新書をまとめてるサイト","relatedLinks":[]}]},{"meta":{"title":"2017-09-11のJS: Yarn 1.0とworkspace、Node.jsウェブフレームワークのfastify","author":"azu","layout":"post","date":"2017-09-11T11:21:47.921Z","category":"JSer","tags":["Yarn","Node.js","framework"],"url":"https://jser.info/2017/09/11/yarn-1.0workspace-node.jsfastify/"},"items":[{"category":"Headline","title":"Node v6.11.3 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v6.11.3/","tags":["node.js","ReleaseNote"],"content":"Node v6.11.3(LTS)リリース\nhash floodingの脆弱性の為無効になっていたV8のSnapshotsが再度有効化された。","relatedLinks":[{"title":"V8 JavaScript Engine: About that hash flooding vulnerability in Node.js…","url":"https://v8project.blogspot.jp/2017/08/about-that-hash-flooding-vulnerability.html"}]},{"category":"Headline","title":"AngularDart 4","url":"http://news.dartlang.org/2017/09/angulardart-4.html","tags":["Angular","dart"],"content":"AngularDart 4リリース","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 61  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/09/nic61","tags":["Chrome","ReleaseNote"],"content":"Chrome 61リリース。\n`<script type=module>`、`navigator.share`、WebUSB APIのサポートなど","relatedLinks":[{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features#browsers.chrome.desktop%3D61"},{"title":"Chromium Blog: Chrome 61 Beta: JavaScript modules, Payment Request API on desktop, Web Share API, and WebUSB","url":"https://blog.chromium.org/2017/08/chrome-61-beta-javascript-modules.html"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 39 | WebKit","url":"https://webkit.org/blog/7913/release-notes-for-safari-technology-preview-39/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 39リリース。\nBeacon APIの改善、`FetchRequest.body`のサポート、Stage 3のRegExp `dotAll`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"AssemblyScript/assemblyscript: A subset of TypeScript that compiles to WebAssembly.","url":"https://github.com/AssemblyScript/assemblyscript","tags":["TypeScript","WebAssembly"],"content":"TypeScriptのサブセットとして定義された言語。\nWebAssemblyへコンパイルすることができる。","relatedLinks":[]},{"category":"Headline","title":"React 16 RC · Issue #10294 · facebook/react","url":"https://github.com/facebook/react/issues/10294","tags":["React","ReleaseNote","issue"],"content":"React 16 RCリリース。 `Map`/`Set`に依存してるのでpolyfillが必要、コアの書き直し(Fiber)。Stream SSRのサポート、`componentDidCatch`で子コンポーネントのエラーをキャッチできるように、bundleとして提供するようになるなど。","relatedLinks":[]},{"category":"Headline","title":"Announcing Yarn 1.0 | Engineering Blog | Facebook Code","url":"https://code.facebook.com/posts/274518539716230","tags":["yarn","ReleaseNote"],"content":"Yarn 1.0リリース。\nYarn Workspaceがデフォルトで有効化、`yarn.lock`のパーサをモジュールに分離、`--cwd`のサポート、`yarn.lock`のコンフリクトを自動的に解消できるように。\n暗黙的な`file:`依存に警告を出すように、`yarn clean`が`yarn autoclean`へリネームなど","relatedLinks":[{"title":"Release v1.0.0 ! 🎉 · yarnpkg/yarn","url":"https://github.com/yarnpkg/yarn/releases/tag/v1.0.0"},{"title":"@yarnpkg/lockfile","url":"https://www.npmjs.com/package/@yarnpkg/lockfile"}]},{"category":"Headline","title":"Release v0.6.0 · sonarwhal/sonar","url":"https://github.com/sonarwhal/sonar/releases/tag/0.6.0","tags":["Tools","ReleaseNote"],"content":"sonar v0.6.0リリース。\n`apple-touch-icon`のチェックツールの追加、`summary`フォーマッターを追加など","relatedLinks":[]},{"category":"Headline","title":"Release Workbox v2.0.0 · GoogleChrome/workbox","url":"https://github.com/GoogleChrome/workbox/releases/tag/v2.0.0","tags":["ServiceWorker","ReleaseNote"],"content":"Workbox v2.0.0リリース。","relatedLinks":[]},{"category":"Article","title":"続・Webブラウザのカラーマネジメント対応まとめ : やんま まのblog（仮）","url":"http://blog.livedoor.jp/yamma_ma/archives/38413741.html","tags":["browser","color"],"content":"ブラウザのカラーマネージメント/プロファイルの対応についてのまとめ","relatedLinks":[]},{"category":"Article","title":"Angular vs. React vs. Vue: A 2017 comparison – unicorn.supplies – Medium","url":"https://medium.com/unicorn-supplies/angular-vs-react-vs-vue-a-2017-comparison-c5c52d620176","tags":["JavaScript","library","opinion","article"],"content":"JavaScriptフレームワークの比較記事。\nAngular、React、Vueについてを色々な面から比較している。","relatedLinks":[]},{"category":"Article","title":"Learn How To Debug JavaScript with Chrome DevTools – codeburst","url":"https://codeburst.io/learn-how-to-debug-javascript-with-chrome-devtools-9514c58479db","tags":["JavaScript","Chrome","debug","article"],"content":"Chromeの開発者ツールを使ったデバッグ方法について。\nデバッガーでのブレークポイントを貼ったデバッグ方法についてをステップバイステップで解説している。","relatedLinks":[]},{"category":"SlideVideo","title":"Polymer Summit 2017 - YouTube","url":"https://www.youtube.com/watch?v=tNulrEbTQf8","tags":["JavaScript","イベント","video"],"content":"Polymer Summit 2017の動画一覧","relatedLinks":[{"title":"Polymer Summit 2017","url":"https://summit.polymer-project.org/"}]},{"category":"SlideVideo","title":"Google Developer Days Europe 2017 - YouTube","url":"http://www.youtube.com/playlist?list=PLOU2XLYxmsIJz-cYWfjQP8SV7n8C-PTVm","tags":["google","ProgressiveWebApp","イベント","video"],"content":"Google Developer Days Europeの動画一覧","relatedLinks":[]},{"category":"SlideVideo","title":"ウェブブラウザ向け深層学習モデル高速実行フレームワーク「WebDNN」 // Speaker Deck","url":"https://speakerdeck.com/kiikurage/uebuburauzaxiang-keshen-ceng-xue-xi-moderugao-su-shi-xing-huremuwaku-webdnn","tags":["slide","JavaScript","browser","機械学習"],"content":"WebDNNについてのスライド。\nWebGPU/WebGL/WebAssemblyなどを使ったウェブブラウザでの計算バックエンドについて。\nKerasやTensorFlowなどの学習モデルが変換可能で、クライアントサイドで高速な計算処理を行うにおいての最適化などについて","relatedLinks":[{"title":"MIL WebDNN","url":"https://mil-tokyo.github.io/webdnn/"}]},{"category":"SlideVideo","title":"JavaScript conferences in 2017 | Confs.tech","url":"https://confs.tech/","tags":["JavaScript","イベント","まとめ"],"content":"JavaScriptのカンファレンスまとめサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pinterest/service-workers: A collection of utilities for creating/testing/experimenting with service workers.","url":"https://github.com/pinterest/service-workers","tags":["ServiceWorker","Tools","library"],"content":"pinterestのService Workerツールチェイン。\nService Workerでキャッシュするファイルの管理、webpackプラグイン、テストなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Transform | All important transforms at one place.","url":"https://transform.now.sh/","tags":["JavaScript","Tools","webservice"],"content":"JSONからReact PropTypesやHTMLからJSX、GraphQLからTypeScriptなど色々な変換を行うツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"fastify/fastify: Fast and low overhead web framework, for Node.js","url":"https://github.com/fastify/fastify","tags":["library","node.js","サーバー"],"content":"Node.jsのウェブフレームワーク。 オーバーヘッドが小さなルーティング、Schemaベースなシリアライズ、express/connect互換のmiddlewareなどを持っている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"antonmedv/jsize: Find out minified and gzipped npm package size","url":"https://github.com/antonmedv/jsize","tags":["JavaScript","npm","node.js","Tools"],"content":"npmモジュールのサイズ(gzip)を見ることができるツール。\n複数のモジュールを`+`で組み合わせると重複したモジュールも考慮した合計サイズを取得できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"allegro/node-worker-nodes: A node.js library to run cpu-intensive tasks in a separate processes and not block the event loop.","url":"https://github.com/allegro/node-worker-nodes","tags":["node.js","library"],"content":"Node.jsで複数のプロセスに分割してcpu-intensiveな処理を扱うライブラリ","relatedLinks":[]},{"category":"Book","title":"O'Reilly Japan - 初めての自動テスト","url":"https://www.oreilly.co.jp/books/9784873118161/","tags":["browser","testing","book"],"content":"2017年9月21日発売\nUIテスト、結合テスト、ユニットテスト、TDDなどウェブブラウザにおけるテストについての書籍","relatedLinks":[]}]},{"meta":{"title":"2017-09-19のJS: Node.js 8.5.0、MSEdge 16の変更点、CoffeeScript 2","author":"azu","layout":"post","date":"2017-09-19T01:38:34.487Z","category":"JSer","tags":["Node.js","MSEdge","CoffeeScript"],"url":"https://jser.info/2017/09/19/node.js-8.5.0-msedge-16-coffeescript-2/"},"items":[{"category":"Headline","title":"Node v8.5.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v8.5.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v8.5.0リリース。\nV8 Snapshotを再有効化、`console.group`の実装、`fs.copyFile`の追加、`--experimental-modules`フラグでES modulesをサポート、Performance Timing APIのサポートなど","relatedLinks":[]},{"category":"Headline","title":"V8 JavaScript Engine: V8 Release 6.2","url":"https://v8project.blogspot.com/2017/09/v8-release-62.html","tags":["V8","ReleaseNote"],"content":"V8 v6.2リリース。\n`Object#toString()`、ES Proxyのパフォーマンス改善、RegExpの`dotAll`モードのサポート、FullCodeGen関連のコードを削除など","relatedLinks":[]},{"category":"Headline","title":"What's Coming in EdgeHTML 16 - Microsoft Edge Development | Microsoft Docs","url":"https://docs.microsoft.com/en-us/microsoft-edge/dev-guide/whats-new/edgehtml-16","tags":["MSEdge","ReleaseNote"],"content":"MSEdge(EdgeHTML) 16の変更点について。\nCSS Gridのサポート、Payment Request APIのサポート、WebVRのサポート、Service Workerの対応など","relatedLinks":[]},{"category":"Headline","title":"Release 1.7.0: JSX tweaks, Pragma, TypeScript and CSS fixes · prettier/prettier","url":"https://github.com/prettier/prettier/releases/tag/1.7.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 1.7.0リリース。\nJSXのフォーマット変更、CSSの大文字小文字の統一、`@prettier`のpragmaをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing CoffeeScript 2","url":"http://coffeescript.org/announcing-coffeescript-2/","tags":["CoffeeScript","ReleaseNote"],"content":"CoffeeScript 2リリース。 \nES2015+に準拠した変更が含まれる。`class`や`=>`がES2015と同等に、 一行コメントが出力されるようになり、Async function、JSX、ES module、for...ofの対応など","relatedLinks":[]},{"category":"Article","title":"Zero-config code transformation with babel-macros · Babel","url":"https://babeljs.io/blog/2017/09/11/zero-config-with-babel-macros","tags":["babel","article","plugin"],"content":"babel-macrosを使ったコンパイル時のマクロ処理について。\nコンパイル時にfsで取得したSVGをインライン化などに利用できる。","relatedLinks":[]},{"category":"Article","title":"Tumblr Engineering — Flow and TypeScript","url":"https://javascript.tumblr.com/post/165082071937/flow-and-typescript","tags":["TypeScript","flowtype"],"content":"TypeScriptとFlowの型エラーメッセージにについての比較","relatedLinks":[]},{"category":"Article","title":"Deploying ES2015+ Code in Production Today — Philip Walton","url":"https://philipwalton.com/articles/deploying-es2015-code-in-production-today/","tags":["ECMAScript","JavaScript","browser","webpack"],"content":"moduleをサポートしてるブラウザ向けとそれ以外でビルドしたファイルを分けて配信する方法について。\nwebpack/babelの設定、ファイルサイズやパース時間の違いなど","relatedLinks":[]},{"category":"Article","title":"A React And Preact Progressive Web App Performance Case Study: Treebo","url":"https://medium.com/dev-channel/treebo-a-react-and-preact-progressive-web-app-performance-case-study-5e4f450d5299","tags":["React","article","performance"],"content":"Reactなアプリの起動速度を改善したケーススタディ。\nサーバーサイドレンダリング、ルーティングとコード分割、HTMLのストリーミング配信、CSSのクリティカルパス、SWの利用、Preactへの移行、プレースホルダ表示などについて","relatedLinks":[]},{"category":"Article","title":"Planning for 7.0 · Babel","url":"https://babeljs.io/blog/2017/09/12/planning-for-7.0","tags":["babel","article","opinion"],"content":"現在βがでているBabel 7.0の予定について。主な変更点やプロジェクトのゴールについて。","relatedLinks":[{"title":"Upgrade to Babel 7 (WIP) · Babel","url":"https://babeljs.io/blog/2017/03/01/upgrade-to-babel-7"},{"title":"Upgrade to Babel 7 for Tool Authors (WIP) · Babel","url":"https://babeljs.io/blog/2017/03/01/upgrade-to-babel-7-for-tool-authors"}]},{"category":"Article","title":"Autoplay Policy Changes  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/09/autoplay-policy-changes","tags":["Chrome","video","article"],"content":"Chromeデスクトップの自動再生ポリシーの変更について。\nSafari 11と同様に音がある動画はユーザーインタラクションや幾つかの条件を満たした場合のみ自動再生が可能になる。\nMedia Engagement Indexやiframeの`gesture=\"media\"`属性についてなど","relatedLinks":[{"title":"Auto-Play Policy Changes for macOS | WebKit","url":"https://webkit.org/blog/7734/auto-play-policy-changes-for-macos/"},{"title":"Chromium Blog: Unified autoplay","url":"https://blog.chromium.org/2017/09/unified-autoplay.html"},{"title":"Autoplay - The Chromium Projects","url":"https://sites.google.com/a/chromium.org/dev/audio-video/autoplay"}]},{"category":"Article","title":"Building the DOM faster: speculative parsing, async, defer and preload ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2017/09/building-the-dom-faster-speculative-parsing-async-defer-and-preload/","tags":["DOM","browser","JavaScript"],"content":"JavaScriptやCSSなどのリソースのロードについて。\n`async`属性、`defer`属性、`rel=preload`でのロードの違いについての解説。\nリソースのロードとレンダリングのブロッキングについてを図解している。","relatedLinks":[]},{"category":"Article","title":"Finally the Promise.prototype.finally() is available","url":"https://hospodarets.com/promise.prototype.finally","tags":["Promises","JavaScript","ECMAScript","proposal"],"content":"現在Stage 3のPromise#finallyについての解説。\nPromise#finallyのユースケースについてデモを交えての解説している。またasync/awaitとtry/catch/finallyの組み合わせとの類似点について。","relatedLinks":[{"title":"tc39/proposal-promise-finally: ECMAScript Proposal, specs, and reference implementation for Promise.prototype.finally","url":"https://github.com/tc39/proposal-promise-finally"}]},{"category":"SlideVideo","title":"Service Worker Lifecycle by Suguru Inatomi","url":"http://slides.com/laco/2017-09-14_sw-lifecycle#/","tags":["ServiceWorker","slide"],"content":"Service Workerのライフサイクルについてのスライド。\nService Workerの登録から削除までのライフサイクルやWorkerの状態について。\nデモアプリで実際に実行して確認することができる。","relatedLinks":[{"title":"Service Worker のライフサイクル  |  Web  |  Google Developers","url":"https://developers.google.com/web/fundamentals/instant-and-offline/service-worker/lifecycle"},{"title":"SwLifecycleSandbox","url":"https://sw-lifecycle-sandbox.firebaseapp.com/"}]},{"category":"WebsiteDocument","title":"Getting up and running with GraphQL - Pusher Blog","url":"https://blog.pusher.com/getting-up-and-running-with-graphql/","tags":["GraphQL","tutorial"],"content":"GraphQLのチュートリアル。\nGraphQLの基本的な機能について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ai/size-limit: Prevent JS libraries bloat. If you accidentally add a massive dependency, Size Limit will throw an error.","url":"https://github.com/ai/size-limit","tags":["JavaScript","library","npm"],"content":"パッケージのサイズが一定以上になると例外を投げるCLIツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"egoist/package-size: Get the bundle size of an npm package.","url":"https://github.com/egoist/package-size","tags":["npm","library","Tools"],"content":"npmパッケージのbundleサイズを取得できるツール。\nbundleしたファイルサイズ、minified(webpack)、gzipのサイズを一覧できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"hiproxy/hiproxy: 🛠 hiproxy is a lightweight proxy tool for Front-End developers based on Node.js that supports an NGINX-like configuration. 🔥","url":"https://github.com/hiproxy/hiproxy","tags":["node.js","proxy","library","Tools"],"content":"フロントエンドの開発向けProxyツール。\nNginxライクな設定ファイル、HTTPSの対応など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Quasar Framework","url":"http://quasar-framework.org/","tags":["Vue","UI","library"],"content":"Vueを使ったUIフレームワーク","relatedLinks":[]},{"category":"Book","title":"Learning React Native: Building Native Mobile Apps with JavaScript: Bonnie Eisenman: 9781491989142: Amazon.com: Books","url":"https://www.amazon.com/Learning-React-Native-Building-JavaScript/dp/1491989149","tags":["React","book","ios","Android"],"content":"2017年11月25日発売\nReact Native本の第二版","relatedLinks":[]},{"category":"Book","title":"Pro TypeScript: Application-Scale JavaScript Development: Steve Fenton: 9781484232484: Amazon.com: Books","url":"https://www.amazon.com/dp/1484232488","tags":["TypeScript","book"],"content":"2018年5月26日発売\nTypeScriptでの開発についての本","relatedLinks":[]},{"category":"Book","title":"作りながら学ぶ React入門 | 吉田裕美 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/479805075X","tags":["React","book"],"content":"Reactについての入門書。\n電子版も発売予定 via <https://github.com/jser/ping/issues/74>","relatedLinks":[]}]},{"meta":{"title":"2017-09-26のJS: Chrome 62 Beta、Safari 11.0、モダンブラウザのレンダリングパイプライン","author":"azu","layout":"post","date":"2017-09-26T00:37:50.814Z","category":"JSer","tags":["Chrome","Safari","browser"],"url":"https://jser.info/2017/09/26/chrome-62-beta-safari-11.0/"},"items":[{"category":"Headline","title":"Chromium Blog: Chrome 62 Beta: Network Quality Estimator API, OpenType variable fonts, and media capture from DOM elements","url":"https://blog.chromium.org/2017/09/chrome-62-beta-network-quality.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 62βリリース。\nNetwork Quality Estimator API、OpenType Variable Fontsのサポート。\nCSS color parserが`#RRGGBBAA`のような形式もサポート、MSEがFLACをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Safari 11.0","url":"https://developer.apple.com/library/content/releasenotes/General/WhatsNewInSafari/Safari_11_0/Safari_11_0.html","tags":["ReleaseNote","safari"],"content":"Safari 11.0リリース。 WebRTC、WebAssermbly、Media Capture API、WebCrypto APIのアルゴリズム追加、Resource timing APIのサポート。 CSSではVariable fonts、CSS strokeのサポート。 ホームスクリーンアプリでWebKitの機能をサポート、追跡クッキーの防止など","relatedLinks":[{"title":"New WebKit Features in Safari 11 | WebKit","url":"https://webkit.org/blog/7956/new-webkit-features-in-safari-11/"}]},{"category":"Headline","title":"Relicensing React, Jest, Flow, and Immutable.js | Engineering Blog | Facebook Code","url":"https://code.facebook.com/posts/300798627056246/relicensing-react-jest-flow-and-immutable-js/","tags":["React","license","news"],"content":"React、Jest、Flow、Immutable.jsはBSD + PatentライセンスからMITライセンスへ変更される。\n技術的要因以外で停滞するのは好ましくないため、エコシステムの基盤となるライブラリ/ツールのライセンス変更を決定した。","relatedLinks":[]},{"category":"Headline","title":"Release Dexie v2.0.0 · dfahlander/Dexie.js","url":"https://github.com/dfahlander/Dexie.js/releases/tag/v2.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"IndexedDBラッパーのDexie v2.0.0リリース。\nIndexedDB 2.0のサポート、Safariのサポートなど","relatedLinks":[]},{"category":"Article","title":"Almin + React/Vue.jsのパフォーマンスプロファイルをタイムライン表示できるように | Web Scratch","url":"http://efcl.info/2017/09/20/almin-performance-profile-0.14.0/","tags":["React","Vue","almin","debug","performance"],"content":"Almin/React/Vueのパフォーマンスオプションについて。\n開発者ツールのタイムラインでそれぞれの処理時間を可視化できる。","relatedLinks":[]},{"category":"Article","title":"asm.js: 仕様と実装の今 - Qiita","url":"http://qiita.com/mod_poppo/items/de5c6f2f4604b84b1bc1","tags":["JavaScript","asm.js"],"content":"asm.jsの仕様と各ブラウザ(Firefox、MSEdge、Chrome)の実装の差異について","relatedLinks":[{"title":"dherman/asm.js: A low-level, extraordinarily optimizable subset of JavaScript.","url":"https://github.com/dherman/asm.js"}]},{"category":"Article","title":"Upcoming TypeScript Changes in Vue 2.5 – The Vue Point – Medium","url":"https://medium.com/the-vue-point/upcoming-typescript-changes-in-vue-2-5-e9bd7e2ecf08","tags":["TypeScript","Vue"],"content":"Vue 2.5でTypeScriptの型定義周りが改善されることについて。\nまた、Vueのlanuguage-serverも併せて更新されているため、JavaScriptを使った場合もエディタでの補完などが改善される。","relatedLinks":[{"title":"vetur/server at master · vuejs/vetur","url":"https://github.com/vuejs/vetur/tree/master/server"}]},{"category":"Article","title":"To type or not to type: quantifying detectable bugs in JavaScript | the morning paper","url":"https://blog.acolyer.org/2017/09/19/to-type-or-not-to-type-quantifying-detectable-bugs-in-javascript/","tags":["JavaScript","TypeScript","flowtype","論文","article"],"content":"JavaScriptに型注釈を加えることでどの程度バグを検出できるかという論文の紹介記事。\nGitHubで実際の修正コミットを元に、TSとFlowで型付けし、修正されたバグが検出できるかをテストした。\n型注釈をつけることで大体15%のバグは発見できた。","relatedLinks":[{"title":"Type or Not to Type:Quantifying Detectable Bugs in JavaScript","url":"http://ttendency.cs.ucl.ac.uk/projects/type_study/documents/type_study.pdf"}]},{"category":"Article","title":"Lifecycle Simulators","url":"https://reactarmory.com/guides/lifecycle-simulators","tags":["React","Tools"],"content":"Reactコンポーネントのライフサイクルをシミュレートできるツール。\n初期化、Stateの更新、Propsの更新をそれぞれ試すことができる","relatedLinks":[]},{"category":"Article","title":"Introduction to WebRender – Part 1 – Browsers today – Mozilla Gfx Team Blog","url":"https://mozillagfx.wordpress.com/2017/09/21/introduction-to-webrender-part-1-browsers-today/","tags":["browser","firefox","servo","article"],"content":"ServoのWebRenderを例にしてメジャーブラウザのレンダリングの仕組みについて解説している。\n`frame tree`と呼ばれる各要素ツリーのレイアウト結果から、`display list`と呼ばれるフラットな描画コマンドを作成する。その描画結果を`layer`に乗せ、最後に`layer`を`compositing`で合成する。\n各ブラウザに差異はあるが描画と合成を分けるという手法は、現在のウェブブラウザでは取り入れられている。","relatedLinks":[]},{"category":"SlideVideo","title":"Debugging in 2017 with Node.js - YouTube","url":"https://www.youtube.com/watch?v=Xb_0awoShR8","tags":["node.js","Chrome","debug","video"],"content":"Node.jsなアプリをChromeの開発者ツールでデバッグする方法についての発表。\n`process._debugProcess(pid)`での既存プロセスのデバッグ、開発者ツールをコードから扱う方法、`chrome://tracing`との連携などについて","relatedLinks":[]},{"category":"SlideVideo","title":"Microsoft Edge Web Summit 2017 | Channel 9","url":"https://channel9.msdn.com/Events/WebPlatformSummit/Microsoft-Edge-Web-Summit-2017","tags":["MSEdge","video","イベント"],"content":"MSEdge Web Summit 2017の動画一覧","relatedLinks":[]},{"category":"SlideVideo","title":"HTML5 Conference 2017 - YouTube","url":"https://www.youtube.com/user/html5j","tags":["HTML5","イベント"],"content":"HTML5 Conference 2017の動画一覧","relatedLinks":[{"title":"HTML5 Conference","url":"http://events.html5j.org/conference/2017/9/"}]},{"category":"SlideVideo","title":"React v16 and beyond React Fiber // Speaker Deck","url":"https://speakerdeck.com/koba04/react-v16-and-beyond-react-fiber","tags":["React","slide"],"content":"React 16の変更点と16以降に導入されるReact Fiberの仕組みについてのスライド","relatedLinks":[]},{"category":"WebsiteDocument","title":"cure53/browser-sec-whitepaper","url":"https://github.com/cure53/browser-sec-whitepaper/","tags":["PDF","browser","security"],"content":"ブラウザセキュリティに関する文章。 各ブラウザ/色々なケースでの攻撃方法や脆弱性について書かれている","relatedLinks":[]},{"category":"WebsiteDocument","title":"mbeaudru/modern-js-cheatsheet: Cheatsheet for the JavaScript knowledge you will frequently encounter in modern projects.","url":"https://github.com/mbeaudru/modern-js-cheatsheet","tags":["JavaScript","チートシート"],"content":"ES2015の構文などを中心に紹介するチートシート","relatedLinks":[]},{"category":"WebsiteDocument","title":"Performance metrics. What’s this all about? – codeburst","url":"https://codeburst.io/performance-metrics-whats-this-all-about-1128461ad6b","tags":["browser","performance"],"content":"ウェブブラウザのパフォーマンスのメトリクスについての解説。\nまたそれらを計測できるツールについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Vue.js 2 Material Component Framework | Vuetify.js","url":"https://vuetifyjs.com/","tags":["Vue","UI","library"],"content":"Vueを使ったMaterialデザインのUIフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"uber/luma.gl: A JavaScript WebGL Framework for Data Visualization","url":"https://github.com/uber/luma.gl","tags":["WebGL","JavaScript"],"content":"WebGLを使ったデータビジュアライゼーションフレームワーク。\nWebGL2にも対応していて、過度な抽象化を避けたAPIを提供する目的","relatedLinks":[]},{"category":"Book","title":"Building Progressive Web Apps: Bringing the Power of Native to the Browser: Tal Ater: 9781491961650: Amazon.com: Books","url":"https://www.amazon.com/Building-Progressive-Web-Apps-Bringing/dp/1491961651","tags":["ProgressiveWebApp","JavaScript","book"],"content":"PWAについての書籍","relatedLinks":[]},{"category":"Book","title":"mjavascript/practical-modern-javascript: 🏊 Dive into ES6 and the future of JavaScript","url":"https://github.com/mjavascript/practical-modern-javascript","tags":["JavaScript","book"],"content":"ES2015以降のJavaScriptについて書かれた電子書籍。CC by-nc-saで公開されている。","relatedLinks":[]}]},{"meta":{"title":"2017-10-02のJS: React 16.0、Firefox 56、画像最適化","author":"azu","layout":"post","date":"2017-10-02T10:54:50.957Z","category":"JSer","tags":["react","firefox","image"],"url":"https://jser.info/2017/10/02/react-16.0-firefox-56-images.guide/"},"items":[{"category":"Headline","title":"React v16.0 - React Blog","url":"https://facebook.github.io/react/blog/2017/09/26/react-v16.0.html","tags":["React","ReleaseNote"],"content":"React 16.0リリース。\n15.6.2と共にMITライセンスへ変更された。\nAPIの基本的な互換は持ちつつコアを書き変え(Fiber)、\n`render`がフラグメントや文字列を返せるように、コンポーネントのエラーハンドリングの改善、`ReactDOM.createPortal`の追加、SSRの改善など。\n`Map`/`Set`/`requestAnimationFrame`に依存する。","relatedLinks":[{"title":"What’s New With Server-Side Rendering in React 16 – Sasha Aickin – Medium","url":"https://medium.com/@aickin/whats-new-with-server-side-rendering-in-react-16-9b0d78585d67"},{"title":"React v15.6.2 - React Blog","url":"https://facebook.github.io/react/blog/2017/09/25/react-v15.6.2.html"},{"title":"React 16: A look inside an API-compatible rewrite of our frontend UI library | Engineering Blog | Facebook Code","url":"https://code.facebook.com/posts/1716776591680069/react-16-a-look-inside-an-api-compatible-rewrite-of-our-frontend-ui-library/"}]},{"category":"Headline","title":"Node v8.6.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v8.6.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v8.6.0リリース\nN-APIがフラグなしで利用できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v0.56.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.56.0","tags":["flowtype","ReleaseNote"],"content":"Flow 0.56.0リリース。\n`$Rest` typeの追加、`Object.create(null)`のような`null`プロトタイプのサポート、`__proto__`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Path validation vulnerability, September 2017 | Node.js","url":"https://nodejs.org/en/blog/vulnerability/september-2017-path-validation/","tags":["node.js","security","ReleaseNote"],"content":"Node.js 8.5.0にはpathの`..`の扱いに脆弱性があるため8.6.0で修正されたリリースがされている。","relatedLinks":[]},{"category":"Headline","title":"Firefox — Notes (56.0) — Mozilla","url":"https://www.mozilla.org/en-US/firefox/56.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 56リリース。\nCSS Grid DevToolsの追加、`<link rel=\"preload\">`のサポート、Intl APIがAndroid版で有効化。\n`setTimeout(fn, 0)`の仕様に合わせて4msに変更など","relatedLinks":[{"title":"Firefox 56 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/56"},{"title":"Master CSS Grid with Firefox DevTools – Mozilla Tech – Medium","url":"https://medium.com/mozilla-tech/master-css-grid-with-firefox-devtools-e3420a8d58fd"},{"title":"WindowOrWorkerGlobalScope.setTimeout() - Web APIs | MDN","url":"https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout#Timeouts_throttled_to_%3E4ms"},{"title":"Firefox 56 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/versions/56/"}]},{"category":"Article","title":"React v16 changes - blog.koba04.com","url":"http://blog.koba04.com/post/2017/09/27/react-v16-changes/","tags":["React","article"],"content":"React 16の変更点について","relatedLinks":[]},{"category":"Article","title":"JavaScript ♥ C++: Modern Ways to Use C++ in JavaScript Projects","url":"https://medium.com/@zandaqo/javascript-c-modern-ways-to-use-c-in-javascript-projects-a19003c5a9ff","tags":["node.js","WebAssembly"],"content":"C++で書かれたコードをNode.jsで扱う方法について。\nN-APIを使ったネイティブモジュールとWebAssemblyを使った方法について。","relatedLinks":[]},{"category":"Article","title":"Abortable fetch  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/09/abortable-fetch","tags":["Fetch","API","Promises","article"],"content":"Fetch APIなどでリクエストのキャンセルを行う`AbortController`と`AbortSignal`について。\n`fetch(url, { signal })`のようにFetch APIに渡す使い方やAPIの歴史的経緯についてなど","relatedLinks":[]},{"category":"Article","title":"Let’s Build a Pokedex with React: Part 1 – CloudBoost","url":"https://blog.cloudboost.io/lets-build-a-pokedex-with-react-part-1-e1ba0b9387a7","tags":["React","tutorial","article"],"content":"Reactを使ってPokedexというサイトをつくっていく連載記事。","relatedLinks":[]},{"category":"Article","title":"Next.js 3.0 Release: What's New?","url":"https://auth0.com/blog/nextjs-3-release-what-is-new/","tags":["React","JavaScript","server","article"],"content":"Next.js 3.0の変更点についての解説。\nDynamic Import/Dynacmic Loading Component、Static Export、エラーメッセージ表示の改善、起動速度の改善など","relatedLinks":[]},{"category":"Article","title":"How to write reliable browser tests using Selenium and Node.js","url":"https://medium.freecodecamp.org/how-to-write-reliable-browser-tests-using-selenium-and-node-js-c3fdafdca2a9","tags":["node.js","Selenium","article"],"content":"Seleniumを扱う時なぜ`sleep`を避けるべきかについて。\nNode.jsのselenium-webdriverを例に紹介してる。","relatedLinks":[]},{"category":"Article","title":"How to drop Bower support? · Bower blog","url":"https://bower.io/blog/2017/how-to-drop-bower-support/","tags":["JavaScript","article"],"content":"ライブラリの開発者はどのようにBowerサポートを終了するべきかについて。\nリポジトリからbower.jsonなど関連ファイルを削除し、majorアップデートを行い、`bower unregister`はしないことについて","relatedLinks":[]},{"category":"Article","title":"webpack-dev-server/middleware security issues – webpack – Medium","url":"https://medium.com/webpack/webpack-dev-server-middleware-security-issues-1489d950874a","tags":["webpack","server","security","ReleaseNote"],"content":"webpack-dev-serverにいくつか脆弱性があるため1.xと2.xそれぞれsecurity fixのリリースが行われた。","relatedLinks":[]},{"category":"Article","title":"ECMAScript proposal updates @ 2017-09 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2017/10/02/ecmascript-proposal-updates-2017-09","tags":["ECMAScript","proposal","babel"],"content":"2017-09に行われたTC39ミーティング結果のProposal変更まとめ","relatedLinks":[]},{"category":"WebsiteDocument","title":"CSS Grid PlayGround | Terminology | Mozilla","url":"https://mozilladevelopers.github.io/playground/","tags":["CSS","tutorial","document","firefox"],"content":"CSS Gridの解説サイト。\nCSS Gridの用語や基本的な使い方、Firefoxの開発者ツールでのデバッグ、`fr`という単位、Template Area、Named Lineなどについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cherow/cherow: A fast, Typescript-based Javascript parser","url":"https://github.com/cherow/cherow","tags":["TypeScript","JavaScript","ECMAScript","library"],"content":"TypeScriptで書かれたJavaScriptパーサ。\nESTree互換のASTを生成し、ES.nextなProposal仕様もサポートしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"roman01la/closure-compiler-handbook: How to use Google's Closure Compiler","url":"https://github.com/roman01la/closure-compiler-handbook","tags":["JavaScript","JSDoc","Tools","book"],"content":"Closure Compilerの使い方について書かれたハンドブック","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Shopify/draggable: The JavaScript Drag & Drop library your grandparents warned you about.","url":"https://github.com/Shopify/draggable","tags":["JavaScript","library"],"content":"D&Dライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Strudel.js | Lightweight component framework","url":"http://strudeljs.org/","tags":["JavaScript","library","UI"],"content":"AngularのようなDecoratorを使ったコンポーネントライブラリ","relatedLinks":[]},{"category":"Book","title":"Essential Image Optimization","url":"https://images.guide/","tags":["book","browser","画像"],"content":"ウェブサイトにおける画像の最適化についての書籍。\nどのようなフォーマットを選び、サイズとパフォーマンスへの影響について。\n各フォーマットやエンコーダーの最適化手法、ブラウザのデコード時間や最適化手法、モニタリングツールなどについて\nJPEG、PNG、WebP、GIF/Videoの比較、SVG","relatedLinks":[]}]},{"meta":{"title":"2017-10-10のJS: Mocha 4.0.0、npm 2要素認証、WHATWG Stream","author":"azu","layout":"post","date":"2017-10-10T04:21:18.437Z","category":"JSer","tags":["Mocha","npm","security","Stream","WHATWG"],"url":"https://jser.info/2017/10/10/mocha-4.0.0-npm-2-whatwg-stream/"},"items":[{"category":"Headline","title":"Release v4.0.0 · mochajs/mocha","url":"https://github.com/mochajs/mocha/releases/tag/v4.0.0","tags":["JavaScript","testing","ReleaseNote"],"content":"Mocha 4.0.0リリース。\nNode.js 0.1xなどのサポート終了、IE8/PhantomJS 1.xのサポート終了、`--no-exit`がデフォルトの動作になるなど","relatedLinks":[{"title":"Mocha v4 Nears Release","url":"https://boneskull.com/mocha-v4-nears-release/"},{"title":"compilers deprecation · mochajs/mocha Wiki","url":"https://github.com/mochajs/mocha/wiki/compilers-deprecation"}]},{"category":"Headline","title":"Ember.js - The Road to Ember 3.0","url":"https://emberjs.com/blog/2017/10/03/the-road-to-ember-3-0.html","tags":["JavaScript","library","news"],"content":"Ember 3.0のロードマップについて。\nLTSのリリーススケジュール、破壊的な変更の予定、削除されるAPIの予定などについて","relatedLinks":[]},{"category":"Headline","title":"Release v5.5.0 · npm/npm","url":"https://github.com/npm/npm/releases/tag/v5.5.0","tags":["npm","ReleaseNote","security"],"content":"npm 5.5.0の変更点について。\n2要素認証のサポートとその有効化手順について","relatedLinks":[]},{"category":"Headline","title":"The npm Blog — Protect your npm account with two-factor...","url":"http://blog.npmjs.org/post/166039777883/protect-your-npm-account-with-two-factor","tags":["npm","news"],"content":"npm 5.5.0で2要素認証のサポート。\nまたRead-only tokenを発行できるようになった。","relatedLinks":[{"title":"Keeping JavaScript safe // Speaker Deck","url":"https://speakerdeck.com/ceejbot/keeping-javascript-safe"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 41 | WebKit","url":"https://webkit.org/blog/7989/release-notes-for-safari-technology-preview-41/","tags":["safari","webkit","ReleaseNote"],"content":"Safari Technology Preview Release 41リリース。\nCSSの`calc()`内で`min()`と`max()`をサポート、`env()`を`constant()`のaliasとして追加、`DataTransfer.prototype.items`をデフォルトで有効化など","relatedLinks":[]},{"category":"Headline","title":"Node-ChakraCore update from Node.js Interactive 2017 - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2017/10/04/node-chakracore-update-node-js-interactive-2017/","tags":["node.js","ChakraCore"],"content":"Node-ChakraCoreについての記事。\nMS以外でのproduction事例、Time-Travel debugging、N-APIの状況、iOS/Androidの対応についてなど。\nまた、今後の予定についてなど","relatedLinks":[{"title":"Node.js for Mobile Apps: full-fledged Node.js for Android and iOS","url":"http://www.janeasystems.com/blog/announcing-node-js-mobile-apps-true-node-js-runtime-android-ios/"}]},{"category":"Headline","title":"falcor/CHANGELOG.md at master · Netflix/falcor","url":"https://github.com/Netflix/falcor/blob/master/CHANGELOG.md#100","tags":["JavaScript","library","ReleaseNote"],"content":"NetflixのデータFetchライブラリであるFalcor 1.0.0リリース。","relatedLinks":[{"title":"Falcor: One Model Everywhere","url":"http://netflix.github.io/falcor/"}]},{"category":"Article","title":"The Intl.PluralRules API  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/10/intl-pluralrules","tags":["i18n","JavaScript","API"],"content":"複数形を扱うECMAScript i18n APIである`Intl.PluralRules`についての解説。","relatedLinks":[]},{"category":"Article","title":"TypeScript at Lyft – Lyft Engineering","url":"https://eng.lyft.com/typescript-at-lyft-64f0702346ea","tags":["TypeScript","article"],"content":"LyftにおいてJavaScriptで書かれたものをTypeScriptにマイグレーションするまでの話。\nFlowとTypeScriptどちらもJavaScriptとは異なる言語という認識での比較やJavaScriptで書かれたReactコンポーネントのマイグレーションなどについて","relatedLinks":[]},{"category":"Article","title":"Await and Async Explained with Diagrams and Examples – Nikolay Grozev","url":"http://nikgrozev.com/2017/10/01/async-await/","tags":["JavaScript","Promises"],"content":"Async/Awaitの動きについてをダイアグラムとサンプルコードで解説した記事。\nエラーハンドリング、concurrencyとparallelの違いについて","relatedLinks":[]},{"category":"Article","title":"A Guide to Faster Web App I/O and Data Operations with Streams - Blog | SitePen","url":"https://www.sitepen.com/blog/2017/10/02/a-guide-to-faster-web-app-io-and-data-operations-with-streams/","tags":["WHATWG","stream","article"],"content":"WHATWG Streamについての記事。\nStream処理の利点や基本的なWHATWG Streamのread/write/pipeのやり方やbackpressureについて。\nFetch APIとの組み合わせ、Dojoによる互換実装、ブラウザの実装状況についてなど","relatedLinks":[{"title":"Streams Standard","url":"https://streams.spec.whatwg.org/"},{"title":"dojo/streams: Dojo 2 - WHATWG compliant streams.","url":"https://github.com/dojo/streams"}]},{"category":"WebsiteDocument","title":"mdn/browser-compat-data: This repository contains compatibility data for Web technologies","url":"https://github.com/mdn/browser-compat-data","tags":["Mozilla","WebPlatformAPI"],"content":"MDNで使われるブラウザの実装状況/Compatibility dataをまとめたリポジトリ。\nWeb API/CSS/HTML/HTTP/JavaScript/WebExtensionsについてのデータがまとまっている","relatedLinks":[]},{"category":"WebsiteDocument","title":"scrollTop on scrollingElement - JSFiddle","url":"https://jsfiddle.net/xvrdaacf/3/","tags":["Chrome","DOM","example"],"content":"Chrome 61+からは\"ScrollTopLeftInterop\"がデフォルトで有効化されたため、`scrollingElement`を使って`scrollTop`を取る必要がある。\n`scrollingElement`のサンプルコード","relatedLinks":[{"title":"Dev.Opera — Fixing the scrollTop bug","url":"https://dev.opera.com/articles/fixing-the-scrolltop-bug/"},{"title":"新しいChromeでスクロールが取れない？　scrollingElement？ | Ginpen.com","url":"https://ginpen.com/2017/10/06/chrome-61-scrolltop/"},{"title":"Document.scrollingElement - Web APIs | MDN","url":"https://developer.mozilla.org/en-US/docs/Web/API/Document/scrollingElement"}]},{"category":"SoftwareLibrary","title":"bahmutov/dont-break: Checks if the current version of your package would break dependent projects","url":"https://github.com/bahmutov/dont-break","tags":["JavaScript","library","testing"],"content":"自分のライブラリがアップデートすることで、そのライブラリユーザーのパッケージが壊れないかをチェックできるツール。 壊れないかをチェックするライブラリを`.dont-break.json`に記述してテストできる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"raymondsze/create-react-scripts: Easily extend the react-scripts to your own version of react-scripts","url":"https://github.com/raymondsze/create-react-scripts","tags":["React","Tools"],"content":"create-react-scriptsの設定を拡張できるようにしたツール","relatedLinks":[{"title":"Create-React-Scripts — create your own react-scripts without fork","url":"https://medium.com/@szer0601/create-react-scripts-create-your-own-react-scripts-without-fork-e73d384c7369"}]},{"category":"SoftwareLibrary","title":"egeozcan/ppipe: pipes values through functions, an alternative to using the proposed pipe operator ( |> ) for ES","url":"https://github.com/egeozcan/ppipe","tags":["JavaScript","library"],"content":"pipe operator(`|>`)の代案として書かれたライブラリ","relatedLinks":[]},{"category":"Book","title":"Redux in Action: Marc Garreau, Will Faurot: 9781617294976: Amazon.com: Books","url":"https://www.amazon.com/Redux-Action-Marc-Garreau/dp/1617294977","tags":["redux","JavaScript","book"],"content":"2018年3月30日発売。\nReduxについての書籍","relatedLinks":[]},{"category":"Book","title":"The CLI Book: Writing Successful Command Line Interfaces with Node.js: Robert Kowalski: 9781484231760: Amazon.com: Books","url":"https://www.amazon.com/CLI-Book-Writing-Successful-Interfaces/dp/1484231767","tags":["node.js","book"],"content":"2018年3月17日発売\nNode.jsのCLIアプリケーションについての書籍","relatedLinks":[]},{"category":"Book","title":"Introducing JavaScript Game Development: Learn to use HTML5 and JavaScript to make 2D games: Graeme Stuart: 9781484232514: Amazon.com: Books","url":"https://www.amazon.com/Introducing-JavaScript-Game-Development-Learn/dp/1484232518","tags":["JavaScript","game","book"],"content":"2018年4月12日発売\nCanvasを使った2Dゲームについての書籍","relatedLinks":[{"title":"Introducing JavaScript Game Development - Learn to use HTML5 and | Graeme Stuart | Apress","url":"http://www.apress.com/us/book/9781484232514"}]},{"category":"Book","title":"Front-End Reactive Architectures: Explore the future of the front end using reactive JavaScript frameworks and libraries: Luca Mezzalira: 9781484231791: Amazon.com: Books","url":"https://www.amazon.com/Front-End-Reactive-Architectures-JavaScript-frameworks/dp/1484231791","tags":["JavaScript","book","Rx"],"content":"2018年4月17日発売\nRxやCycle.jsなどを使ったReactiveアーキテクチャについての書籍","relatedLinks":[{"title":"Front-End Reactive Architectures - Explore the future of the | Luca Mezzalira | Apress","url":"http://www.apress.com/gb/book/9781484231791#aboutAuthors"}]},{"category":"Book","title":"Electron: From Beginner to Pro: Learn to Build Cross Platform Desktop Apps using Github's Electron: Chris Griffith, Leif Wells: 9781484228258: Amazon.com: Books","url":"https://www.amazon.com/Electron-Beginner-Platform-Desktop-Githubs/dp/1484228251","tags":["Electron","book"],"content":"2017年12月9日発売\nElectronでのアプリ開発についての書籍。","relatedLinks":[]}]},{"meta":{"title":"2017-10-17のJS: Vue 2.5.0、E2Eテストフレームワーク、GlimmerのBinary Template","author":"azu","layout":"post","date":"2017-10-17T00:54:58.535Z","category":"JSer","tags":["Vue","E2E","Glimmer","Template"],"url":"https://jser.info/2017/10/17/vue-2.5.0-e2e-glimmerbinary-template/"},"items":[{"category":"Headline","title":"TestCafe v0.18.0 Released - Angular Selectors, Using Multiple Reporters, etc | TestCafe","url":"http://devexpress.github.io/testcafe/blog/testcafe-v0-18-0-released.html","tags":["testing","E2E","ReleaseNote"],"content":"TestCafe v0.18.0リリース。\nAngular Selectorのサポート、出力に複数のreporterを指定できるように、FirefoxとChromeでクリーンなプロファイルを使うように、`t.getBrowserConsoleMessages`でコンソールに出力された内容を取得できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 2.6 RC | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2017/10/12/announcing-typescript-2-6-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.6 RCリリース。\n`--strictFunctionTypes`の追加、`// @ts-ignore`でのエラーを抑制するコメントをサポート、`--locale`でCLIの多言語対応、`tsc --watch`の速度改善など","relatedLinks":[{"title":"What","url":"https://github.com/Microsoft/TypeScript/wiki/What's-new-in-TypeScript#typescript-26"}]},{"category":"Headline","title":"Release v2.5.0 Level E · vuejs/vue","url":"https://github.com/vuejs/vue/releases/tag/v2.5.0","tags":["Vue","ReleaseNote"],"content":"Vue 2.5.0リリース。\n`errorCaptured` hookでのエラーハンドリングができるように、TypeScriptの型を改善(破壊的変更)、`v-on`に`.exact` modifierを追加など","relatedLinks":[{"title":"Vue 2.5 release details","url":"https://gist.github.com/yyx990803/9bdff05e5468a60ced06c29c39114c6b"},{"title":"Upcoming TypeScript Changes in Vue 2.5 – The Vue Point – Medium","url":"https://medium.com/the-vue-point/upcoming-typescript-changes-in-vue-2-5-e9bd7e2ecf08"}]},{"category":"Headline","title":"ESLint v4.9.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2017/10/eslint-v4.9.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 4.9.0リリース。\n`--fix`でdry-run実行を行う`--fix-dry-run`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Eloquent JavaScript Third Edition","url":"https://eloquentjavascript.net/3rd_edition/","tags":["book","JavaScript","news"],"content":"Eloquent JavaScripの第三版のCrowdfundingが開始された","relatedLinks":[]},{"category":"Headline","title":"ProseMirror 1.0","url":"http://marijnhaverbeke.nl/blog/prosemirror-1.html","tags":["JavaScript","editor","library","ReleaseNote"],"content":"ProseMirror 1.0リリース。\nProseMirrorはよりよいWYSIWYG-styleのエディタを実装できるコアライブラリで、ProseMirror自体は特定のドキュメント形式には依存していないことが特徴。\n1.xからは安定版とRFCプロセスによる開発を行うという話","relatedLinks":[]},{"category":"Headline","title":"Release v3.7.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v3.7.0","tags":["webpack","ReleaseNote"],"content":"webpack v3.7.0リリース。\n`CommonChunkPlugin`プラグインに`deepChildren`オプションを追加を追加、ES modulesのchunk graphのリファクタリングでパフォーマンスの改善など","relatedLinks":[{"title":"Added deepChildren support from ArcEglos","url":"https://github.com/webpack/webpack/pull/5764"},{"title":"webpack/examples/common-chunk-grandchildren at master · webpack/webpack","url":"https://github.com/webpack/webpack/tree/master/examples/common-chunk-grandchildren"}]},{"category":"Article","title":"Ember.js - Glimmer.js Progress Report","url":"https://emberjs.com/blog/2017/10/10/glimmer-progress-report.html","tags":["JavaScript","article"],"content":"Glimmer.jsについてのステータスについて。\nタグが`<Button />`のようにCapitalスタイルとなるように、要素のプロパティと属性を`@`で区別できるように、Portalのサポート。\nテンプレートをバイナリにするBinary Templatesのサポート予定やSSRについて","relatedLinks":[{"title":"Glimmer","url":"https://www.linkedin.com/pulse/glimmers-optimizing-compiler-chad-hietala/"}]},{"category":"Article","title":"Cypress.io | JavaScript End to End Testing | Cypress is now public beta","url":"https://www.cypress.io/blog/2017/10/10/cypress-is-now-public-beta/","tags":["testing","browser","library"],"content":"E2EテストフレームワークのCypressがオープンソースとして公開された。","relatedLinks":[{"title":"cypress-io/cypress: Cypress is a test runner that helps you write automated tests in the browser.","url":"https://github.com/cypress-io/cypress"}]},{"category":"Article","title":"Dependency Inversion with Redux-Thunk & Typescript – Dave L. – Medium","url":"https://medium.com/@david.losert_73564/dependency-inversion-with-redux-thunk-typescript-e09cebabdc1f","tags":["redux","testing","article"],"content":"redux-thunkの`thunk.withExtraArgument(deps)`を使って依存関係逆転の原則(DIP)を適応する方法について","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 63)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/10/devtools-release-notes","tags":["Chrome","debug","article"],"content":"Chrome 63の開発者ツールについて。\nAuditsパネルにSynkDBを使った脆弱性情報の表示、Workspaces 2.0、remote debuggingが複数のクライアントの同時接続に対応など","relatedLinks":[{"title":"Release 2.5.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v2.5.0"}]},{"category":"Article","title":"NPM Task Running Techniques – Netscape – Medium","url":"https://medium.com/netscape/npm-task-running-techniques-15fe5b697f15","tags":["npm","console","Tools","article"],"content":"npm-run-allを使ったnpm-run-scriptsの実行管理や`wait-on`を使ったサーバが起動するのを待ってからコマンドを処理する方法など","relatedLinks":[]},{"category":"Article","title":"Node.js - a tale of two bugs","url":"https://dev.to/mikeralphson/nodejs---a-tale-of-two-bugs-18c","tags":["node.js","issue","performance","article"],"content":"Node.jsで7.x以降にパフォーマンスリグレッションを見つけ、どのようにデバッグし問題を特定したかについて。\n原因としてはV8の`Error.captureStackTrace`のリグレッションであり、Node.js 8.7.0で修正される予定。","relatedLinks":[]},{"category":"SlideVideo","title":"The productive developer guide to React","url":"https://www.slideshare.net/mauricedb/the-productive-developer-guide-to-react-80642342","tags":["React","slide"],"content":"Reactを使った開発についてのスライド。\n入門的な内容でReactの利点/問題点、create-react-appやRedux、ルーティング\nなどについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"GoogleChrome/confluence: Service and API for Web API Confluence: Metrics for web platform health","url":"https://github.com/GoogleChrome/confluence","tags":["browser","WebPlatformAPI"],"content":"各ブラウザの特有のAPIの数や削除したAPIの数、Shipに失敗したAPIの数、ベロシティなどを可視化してくれるサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dt-fe/number-precision: 🚀1K tiny & fast lib for doing addition, subtraction, multiplication and division operations precisely","url":"https://github.com/dt-fe/number-precision","tags":["JavaScript","library"],"content":"浮動小数点数同士の演算を行うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"SpireTeam/whitelister: Simple, basic filtering and validation tool for Node.js.","url":"https://github.com/SpireTeam/whitelister","tags":["JavaScript","library"],"content":"依存がないフィルタリング/バリデーションライブラリ。\nデフォルトでは結果をPromiseで返し、`sync`メソッドで同期的に処理できる。\nルールに違反した場合はカスタムエラーを投げるようになっている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"planttheidea/fast-equals: A blazing fast equality comparison, either shallow or deep","url":"https://github.com/planttheidea/fast-equals","tags":["JavaScript","library"],"content":"deep-equal、shallow-equalを行うライブラリ。","relatedLinks":[]},{"category":"Book","title":"Atomic Design by Brad Frost","url":"http://atomicdesign.bradfrost.com/","tags":["GUI","CSS","book"],"content":"Atomic Designについての書籍","relatedLinks":[]}]},{"meta":{"title":"2017-10-24のJS: CKEditor 5、MDN Web Docsへのドキュメント統合","author":"azu","layout":"post","date":"2017-10-24T10:41:38.582Z","category":"JSer","tags":["MDN","CKEditor","CORS","domain"],"url":"https://jser.info/2017/10/24/ckeditor-5-mdn-web-docs/"},"items":[{"category":"Headline","title":"What’s New in Microsoft Edge in the Windows 10 Fall Creators Update - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2017/10/17/edgehtml-16-fall-creators-update/","tags":["MSEdge","ReleaseNote"],"content":"MSEdge 16の変更点について。\nCSS Grid Layout、object-fit、Payment Request APIのサポート。\nService Workerの試験的サポート、WebVR対応の改善など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 42 | WebKit","url":"https://webkit.org/blog/8001/release-notes-for-safari-technology-preview-42/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 42リリース。\nPayment Requestの機能実装、`font-display`の実装、`constant()`が`env()`にリネーム、`link rel=preconnect`、`import.meta`のサポート、Web InspectorにCanvasタブを追加など","relatedLinks":[]},{"category":"Headline","title":"Mozilla brings Microsoft, Google, the W3C, Samsung together to create cross-browser documentation on MDN - The Mozilla Blog","url":"https://blog.mozilla.org/blog/2017/10/18/mozilla-brings-microsoft-google-w3c-samsung-together-create-cross-browser-documentation-mdn/","tags":["Mozilla","MS","google","W3C","document","news"],"content":"Mozilla、Microsoft、Googleなどがウェブ開発系のドキュメントをMDNへ集約することになった。","relatedLinks":[{"title":"Documenting the Web together - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2017/10/18/documenting-web-together-mdn-web-docs/"},{"title":"Chromium Blog: Building unified documentation for the web","url":"https://blog.chromium.org/2017/10/building-unified-documentation-for-web.html"},{"title":"W3C to work with MDN on Web Platform documentation | W3C Blog","url":"https://www.w3.org/blog/2017/10/w3c-to-work-with-mdn-on-web-platform-documentation/"}]},{"category":"Headline","title":"CKEditor 5: A new era for rich text editing | CKEditor.com","url":"https://ckeditor.com/blog/CKEditor-5-A-new-era-for-rich-text-editing/","tags":["JavaScript","editor","library","ReleaseNote"],"content":"CKEditor 5の変更点について。\n今までのアーキテクチャを一新し、編集するテキストをデータモデルとしてもつことでContentEditable特有の出力を回避できるように。\nまたエディタ共通の問題についてを扱うEditor Recommendationsサイトの公開など","relatedLinks":[{"title":"Home | editor-recommendations","url":"http://ckeditor.github.io/editor-recommendations/"}]},{"category":"Article","title":"New in Chrome 62  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/10/nic62","tags":["Chrome","ReleaseNote"],"content":"Chrome 62の変更点について。\n Network Information API、OpenType Variable Fonts、WebVRのorigin trialの開始など","relatedLinks":[]},{"category":"Article","title":"The 100% correct way to structure a React app (or why there’s no such thing)","url":"https://hackernoon.com/the-100-correct-way-to-structure-a-react-app-or-why-theres-no-such-thing-3ede534ef1ed","tags":["opinion","React","article"],"content":"Reactアプリケーションのディレクトリ構造について。\nindex.js or コンポーネント名.js、階層構造、exportするものについてなど","relatedLinks":[]},{"category":"Article","title":"Node.js Security Overview","url":"https://nemethgergely.com/nodejs-security-overview/","tags":["node.js","security","article"],"content":"Node.jsと関連するエコスシステムのセキュリティについてをざっくりと。\nCore、npm、express、security.txt、関連サービスやツールなどについて","relatedLinks":[]},{"category":"Article","title":"Introducing PayPal’s open-source cross-domain javascript suite","url":"https://medium.com/@bluepnume/introducing-paypals-open-source-cross-domain-javascript-suite-95f991b2731d","tags":["JavaScript","library","article"],"content":"PayPalが使ってるクロスドメイン関係のライブラリまとめ。\n`postMessage`を使ったやり取り、コンポーネント、Util、同期的なPromiseであるZalgoとsetTimeoutのブロックについて、CORSとiframeについてなど","relatedLinks":[]},{"category":"Article","title":"An imperative guide to forms in Vue.js – LogRocket","url":"https://blog.logrocket.com/an-imperative-guide-to-forms-in-vue-js-7536bfa374e0","tags":["Vue","JavaScript","article"],"content":"Vueを使った各種フォーム要素の管理やバリデーションについての紹介記事","relatedLinks":[]},{"category":"SlideVideo","title":"BlinkOn 8 - Tokyo, Japan - YouTube","url":"http://www.youtube.com/playlist?list=PL9ioqAuyl6UK7Z0HHswBM5JgAp-izn_3S","tags":["blink","video","イベント"],"content":"BlinkOn 8の動画一覧","relatedLinks":[{"title":"BlinkOn 8 Information - Google ドキュメント","url":"https://docs.google.com/document/d/11Y1MK-jVQl_xlhFS8dds_6FsC70jQ_9aOtcWALBiz5k/edit"}]},{"category":"WebsiteDocument","title":"prantlf/nettime: Prints timings of a HTTP/S request, including DNS lookup, TLS handshake etc.","url":"https://github.com/prantlf/nettime","tags":["node.js","Tools","network"],"content":"特定のURLに対するDNS LookupやTCPコネクションの時間などネットワークの接続や通信にかかった時間を計測するCLI","relatedLinks":[]},{"category":"WebsiteDocument","title":"Micro Frontends - extending the microservice idea to frontend development","url":"https://micro-frontends.org/","tags":["JavaScript","architecture","組織"],"content":"Micro Frontendsについて。\nマイクロサービスアーキテクチャ的な考えをフロントエンドの中にも適応していく話。\n機能でのチーム分割、独立したコンポーネントとWeb Components、ナビゲーションなど各トピックごとの実現方法についてを書いていくとのこと","relatedLinks":[{"title":"Micro frontends | Technology Radar | ThoughtWorks","url":"https://www.thoughtworks.com/radar/techniques/micro-frontends"}]},{"category":"WebsiteDocument","title":"Chrome User Experience Report  |  Tools for Web Developers  |  Google Developers","url":"https://developers.google.com/web/tools/chrome-user-experience-report/","tags":["Chrome","統計"],"content":"Chromeの使用統計データを元にしたoriginごとのRUMを集めたBigQueryのデータセット。\norigin、通信タイプ、デバイスの種類、first_paintのヒストグラムを扱うデータセット。","relatedLinks":[{"title":"Chromium Blog: Introducing the Chrome User Experience Report","url":"https://blog.chromium.org/2017/10/introducing-chrome-user-experience-report.html"}]},{"category":"WebsiteDocument","title":"HTTP Archive (beta)","url":"http://beta.httparchive.org/","tags":["webservice","performance","統計"],"content":"新しいHTTP Archiveのβ版が公開された。\nlighthouseを使ったLoad Speed関連の統計データやDesktopとmobileの比較データなどをみることができる","relatedLinks":[{"title":"HTTP Archive on Twitter: ","url":"https://twitter.com/HTTPArchive/status/922582514010488832"}]},{"category":"SoftwareLibrary","title":"dollarshaveclub/es-check: Checks the version of ES in JavaScript files with simple shell commands 🏆","url":"https://github.com/dollarshaveclub/es-check","tags":["JavaScript","Tools"],"content":"Acornを使って特定のECMAScriptバージョンでパースできるかをテストするツール。\nコードが構文的にそのECMAScriptバージョンをサポートしてるかチェックできる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kbrsh/wade: Blazing fast, 1kb search for Javascript","url":"https://github.com/kbrsh/wade","tags":["JavaScript","library"],"content":"深さ優先探索で文字列検索を行うライブラリ","relatedLinks":[{"title":"Inside Wade | Kabir Shah","url":"https://blog.kabir.ml/posts/inside-wade.html"}]},{"category":"SoftwareLibrary","title":"EyeJS - testing framework","url":"https://eye.js.org/","tags":["JavaScript","testing","library"],"content":"nodeとbrowserのモードを持ったテストフレームワーク。","relatedLinks":[]}]},{"meta":{"title":"2017-10-30のJS: Node.js 8.8.0、Chrome 63β、Property-Based Testing","author":"azu","layout":"post","date":"2017-10-30T15:23:18.112Z","category":"JSer","tags":["Node.js","Chrome","Testing"],"url":"https://jser.info/2017/10/31/node.js-8.8.0-chrome-63b-property-based-testing/"},"items":[{"category":"Headline","title":"Node v8.8.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v8.8.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 8.8.0リリース。\nhttp2モジュールがデフォルトで有効化、モジュールのhookを処理を扱えるコマンドライン引数として`--loader`の追加など","relatedLinks":[{"title":"module: resolve and instantiate loader pipeline hooks by guybedford · Pull Request #15445 · nodejs/node","url":"https://github.com/nodejs/node/pull/15445"}]},{"category":"Headline","title":"V8 JavaScript Engine: V8 Release 6.3","url":"https://v8project.blogspot.com/2017/10/v8-release-63.html","tags":["V8","ReleaseNote"],"content":"V8 6.3リリース。\nパフォーマンス改善、`import()`、`Promise#finally`、Aynsc iteratorのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 0.23.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v0.23.0","tags":["testing","JavaScript","library","ReleaseNote"],"content":"AVA 0.23.0リリース。\n`NODE_ENV=test`を設定するように、`snapshotLocation`を`pacakge.json`に書くことでsnapshotファイルの保存場所を指定できるように","relatedLinks":[]},{"category":"Headline","title":"Release 2.4.0 · fuse-box/fuse-box","url":"https://github.com/fuse-box/fuse-box/releases/tag/v2.4.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"FuseBox 2.4.0 リリース。\nQuantum上でのUglify-esのサポート、Vue周りの対応改善、CLIをAPIとして使えるように","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 63 Beta: Dynamic module imports, async iterators and generators, Device Memory API, and permissions UI changes","url":"https://blog.chromium.org/2017/10/chrome-63-beta-dynamic-module-imports_27.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 63 Betaリリース。\nDynamic import、Async iterator、Device Memory API、Promise#finallyの実装、プッシュ通知などの許可ダイアログの変更など。\nまた、EventTargetの仕様追従、印刷時に`beforeprint`と`afterprint`イベントを発火するように、`/deep/`の削除など","relatedLinks":[{"title":"What","url":"https://developers.google.com/web/updates/2017/10/devtools-release-notes"},{"title":"Permission UX  |  Web Fundamentals  |  Google Developers","url":"https://developers.google.com/web/fundamentals/push-notifications/permission-ux"}]},{"category":"Article","title":"Saying Goodbye to Firebug ★ Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2017/10/saying-goodbye-to-firebug/","tags":["Firebug","歴史","firefox","debug","addon"],"content":"FirebugはFirefox57で開発は終了し、Firefoxの開発者ツールが代替となる。\nFirebugからFirefoxの開発者ツールへのマイグレーションガイドも公開されている。また、Firebugの歴史について。","relatedLinks":[{"title":"Migrating from Firebug - Firefox Developer Tools | MDN","url":"https://developer.mozilla.org/en-US/docs/Tools/Migrating_from_Firebug"}]},{"category":"Article","title":"MicrosoftのNapa.jsでJavaScriptをマルチスレッド化する | PLAID engineer blog","url":"http://tech.plaid.co.jp/js_multi_threading/","tags":["node.js","JavaScript","library","article"],"content":"マルチプロセスのWorkerを扱うことができるnapajaについて。\nどのようなモチベーションや構造になっているかについて。\nZoneというワーカーのまとめ役やデータのやり取りの方法についてなど","relatedLinks":[]},{"category":"Article","title":"HTML Web Component using Vanilla JavaScript – Ayush Gupta – Full Stack Web Developer","url":"http://ayushgp.github.io/html-web-components-using-vanilla-js/","tags":["WebComponents","JavaScript","article"],"content":"Web Components入門記事。\n`<user-card />`というデータを取得して表示する要素を例にCustom Elementのライフサイクル、template要素、ShadowDOMについて紹介している","relatedLinks":[]},{"category":"Article","title":"State of Modules in JavaScript - Blog | SitePen","url":"https://www.sitepen.com/blog/2017/10/26/state-of-modules-in-javascript/","tags":["ECMAScript","JavaScript","module"],"content":"ES moduleについての解説記事。\nimport/exportやdynamic import、Node.jsやwebpackなどのbundlerでの扱いについてなど","relatedLinks":[]},{"category":"Article","title":"Unpopular Metrics about JS Bundlers – Andrea Giammarchi – Medium","url":"https://medium.com/@WebReflection/unpopular-metrics-about-js-bundlers-a3c56ea5390d","tags":["JavaScript","Tools","module","article"],"content":"小さなbundleツールである`asbundle`について。 rollupより機能的にも小さくシンプル。ES moduleをbundleするだけのような機能を持っている","relatedLinks":[{"title":"WebReflection/asbundle: A minimalistic CommonJS bundler","url":"https://github.com/WebReflection/asbundle"}]},{"category":"Article","title":"Can You Afford It?: Real-world Web Performance Budgets – Infrequently Noted","url":"https://infrequently.org/2017/10/can-you-afford-it-real-world-web-performance-budgets/","tags":["article","performance","browser"],"content":"初回ロードのTime-to-Interactive (TTI)が5秒以下、それ以降は2秒以下というPerformance Budgetsを元にそれを満たすための配分について。\nこれ満たすための考え方や技術的な手法、補助するツールなどについて","relatedLinks":[{"title":"WebサイトのPerformance Budgetとは | フロントエンドBlog | ミツエーリンクス","url":"https://www.mitsue.co.jp/knowledge/blog/frontend/201612/16_1413.html"}]},{"category":"SlideVideo","title":"Chrome Dev Summit 2017 - YouTube","url":"http://www.youtube.com/playlist?list=PLNYkxOF6rcICUD5nBfRdAR6Fveosnqa5m","tags":["Chrome","イベント","video"],"content":"Chrome Dev Summit 2017の動画まとめ","relatedLinks":[]},{"category":"SlideVideo","title":"とにかく楽してVue.jsでTypeScriptを使いたい","url":"https://www.slideshare.net/sakura_pr/vuejstype-script-81228009","tags":["JavaScript","Vue","slide"],"content":"Vue 2.5のTypeScriptサポートについてのスライド。\nJavaScriptで書かれたVueアプリケーションをTypeScriptに移行する手順について","relatedLinks":[]},{"category":"SlideVideo","title":"Redux. From twitter hype to production by Jenya Terpil","url":"http://slides.com/jenyaterpil/redux-from-twitter-hype-to-production#/","tags":["redux","slide"],"content":"Reduxの動作フローについてのスライド。\nアニメーション画像によってView->Action->Reducer->Stateの流れについてを可視化している。","relatedLinks":[]},{"category":"SlideVideo","title":"Property-Based Testing for Godly Tests","url":"https://www.slideshare.net/garbles/propertybased-testing-for-godly-tests","tags":["JavaScript","testing","slide"],"content":"Property-Based Testingについてのスライド。\nExample-Based Test、Fizz Test、\nProperty-Based Testのカバーできる範囲の違いや特徴について。\n`testcheck`を使ったテストやFlowの型定義からの自動生成についてなど","relatedLinks":[{"title":"unbounce/babel-plugin-transform-flow-to-gen: Flow + Babel + TestCheck == QuickCheck in JavaScript","url":"https://github.com/unbounce/babel-plugin-transform-flow-to-gen"},{"title":"leebyron/testcheck-js: Generative testing for JavaScript","url":"https://github.com/leebyron/testcheck-js"}]},{"category":"WebsiteDocument","title":"webpackmonitor/webpackmonitor: A tool for monitoring webpack optimization metrics through the development process","url":"https://github.com/webpackmonitor/webpackmonitor","tags":["webpack","Tools"],"content":"webpackのstats.json結果をビジュアライズしてくれるツール。","relatedLinks":[]},{"category":"WebsiteDocument","title":"State of Vue.js Report · Monterail","url":"https://www.monterail.com/state-of-vuejs-report","tags":["Vue","PDF"],"content":"Vueに関する80ページほどのレポート。Vue自体の状況、アンケートベースのレポート、利用してる企業のケーススタディなどについて書かれている","relatedLinks":[]},{"category":"WebsiteDocument","title":"Apollo Client 2.0 – Apollo GraphQL","url":"https://dev-blog.apollodata.com/apollo-client-2-0-5c8d0affcec7","tags":["GraphQL","JavaScript","library"],"content":"Apollo Client 2.0について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vitalets/websocket-as-promised: Promise-based API for WebSockets","url":"https://github.com/vitalets/websocket-as-promised","tags":["Promises","WebSocket","library"],"content":"PromiseベースのWebSocketライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nicojs/node-install-local: Installs npm/yarn packages locally without symlink. Exactly the same as your production installation, no compromises.","url":"https://github.com/nicojs/node-install-local","tags":["npm","yarn","Tools"],"content":"npm5やyarnはローカルのパッケージをsymlinkでインストールしてしまうため、symlinkに対応してないツールなどが動作しなくなる。\n通常のパッケージと同じようにディレクトリにインストールすることができるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"softvar/awesome-web-storage: Everything you need to know about Client-side Storage.","url":"https://github.com/softvar/awesome-web-storage","tags":["JavaScript","document"],"content":"Web Storageについてのまとめたドキュメント。\ncookie、localStorage、sessionStorageについての比較、関連ライブラリ、ツールなどについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"feimosi/frameworks-code-comparison: Code comparison of modern frameworks, based on React, Angular and Vue.js","url":"https://github.com/feimosi/frameworks-code-comparison","tags":["Angular","React","Vue","library"],"content":"Angular, React, Vueのコンポーネントで共通して行う処理の扱い方について比較したリポジトリ。\nそれぞれのライブラリごとの短い解説とコードスニペットを紹介してる。","relatedLinks":[]},{"category":"Book","title":"Angular Development with Typescript: Yakov Fain, Anton Moiseev: 9781617295348: Amazon.com: Books","url":"https://www.amazon.com/Angular-Development-Typescript-Yakov-Fain/dp/1617295345","tags":["Angular","TypeScript","book"],"content":"2018年5月30日発売\nAngularとTypeScriptについての本","relatedLinks":[]},{"category":"Book","title":"Amazon.com: TypeScript 2.0 Cookbook eBook: Shiv Shankar Kushwaha: Kindle Store","url":"https://www.amazon.com/TypeScript-Cookbook-Shiv-Shankar-Kushwaha-ebook/dp/B01CR5GCXY","tags":["TypeScript","book"],"content":"2018年8月発売\nTypeScriptクックブック","relatedLinks":[{"title":"TypeScript 2.0 Cookbook | PACKT Books","url":"https://www.packtpub.com/web-development/typescript-20-cookbook"}]}]},{"meta":{"title":"2017-11-07のJS: TypeScript 2.6.、Node.js 8.9.0 LTS、Angular 5.0.0","author":"azu","layout":"post","date":"2017-11-07T01:13:49.333Z","category":"JSer","tags":["TypeScript","Node.js","Angular"],"url":"https://jser.info/2017/11/07/typescript-2.6.-node.js-8.9.0-lts-angular-5.0.0/"},"items":[{"category":"Headline","title":"Announcing TypeScript 2.6 | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2017/10/31/announcing-typescript-2-6/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.6リリース。\n`strictFunctionTypes`のサポート、`--locale`での多言語化、`--watch`の改善、`// ts-ignore`のサポート。\nVSCodeなどでJSDocから型をQuickfixできるように、`@types`の自動インストール対応など","relatedLinks":[{"title":"TypeScript 2.6 変更点と注意点 - abcdefGets","url":"http://abcdef.gets.b6n.ch/entry/2017/11/01/101358"},{"title":"TypeScript 2.6.1 変更点 - Qiita","url":"https://qiita.com/vvakame/items/d2c7cf142fa0af39d2d5"}]},{"category":"Headline","title":"NEWS: Node.js 8 Moves into Long-Term Support and Node.js 9 Becomes the New Current Release Line","url":"https://medium.com/the-node-js-collection/news-node-js-8-moves-into-long-term-support-and-node-js-9-becomes-the-new-current-release-line-74cf754a10a0","tags":["node.js","ReleaseNote"],"content":"Node.js 8.9.0がリリースされ8.xのLong-Term Support(LTS)となった。また同時に開発バージョンである9.xが公開された。","relatedLinks":[{"title":"Node v8.9.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v8.9.0/"},{"title":"Node v9.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v9.0.0/"}]},{"category":"Headline","title":"Node v8.9.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v8.9.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 8.9.0リリース。8.x系のLTSとして公開された。\nnpm 5.5.1へのアップデート、`require.resolve()`に指定パスを探索するオプションが追加、`util.TextEncoder`と`util.TextDecoder`のフラグが外れるなど","relatedLinks":[]},{"category":"Headline","title":"Node v9.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v9.0.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 9.0.0リリース。\nError codeの対応、`assert.deepStrictEqual`がSameValueZeroのロジックで比較するように、`assert`のメソッドがカスタムエラーをサポート、`util.callbackify`、`util.isDeepStrictEqual`の追加など。\nまた`Intl.v8BreakIterator`の削除されている。","relatedLinks":[{"title":"What","url":"https://nemethgergely.com/what-is-new-in-nodejs-9/"}]},{"category":"Headline","title":"Version 5.0.0 of Angular Now Available – Angular Blog","url":"https://blog.angular.io/version-5-0-0-of-angular-now-available-37e414935ced","tags":["Angular","ReleaseNote"],"content":"Angular 5.0.0リリース。\nCLIにBuild Optimizerがデフォルトで適応され、Decoratorなどランタイムでは不要なものを削除できるように。\ni18n pipesのデフォルト挙動の変更やDateFormatの変更。\nRxJS 5.5へのアップデート、Routerのライフサイクルの追加など","relatedLinks":[{"title":"angular/CHANGELOG.md at master · angular/angular","url":"https://github.com/angular/angular/blob/master/CHANGELOG.md#500-pentagonal-donut-2017-11-01"},{"title":"Release 1.5 – Turing · angular/angular-cli","url":"https://github.com/angular/angular-cli/releases/tag/v1.5.0"},{"title":"Angular Update Guide - Beta","url":"https://angular-update-guide.firebaseapp.com/"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 43 | WebKit","url":"https://webkit.org/blog/8016/release-notes-for-safari-technology-preview-43/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 43リリース。\nCache Storage APIがデフォルトで有効化、`createImageBitmap`と`drawImage(imageBitmap)`のサポート。\nWeb Inspectorで新しいネットワークタブ、Canvasタブの有効化、HARエクスポートに対応など","relatedLinks":[{"title":"CacheStorage - Web APIs | MDN","url":"https://developer.mozilla.org/en-US/docs/Web/API/CacheStorage"},{"title":"ImageBitmap - Web API インターフェイス | MDN","url":"https://developer.mozilla.org/ja/docs/Web/API/ImageBitmap"}]},{"category":"Headline","title":"Element 2.0 is here – ELEME Frontend Engineering – Medium","url":"https://medium.com/elemefe/element-2-0-is-here-71bfa217e269","tags":["Vue","ReleaseNote","library"],"content":"Vue向けのUIフレームワークのElement 2.0リリース","relatedLinks":[]},{"category":"Article","title":"Introducing new JavaScript optimizations, WebAssembly, SharedArrayBuffer, and Atomics in EdgeHTML 16 - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2017/10/31/optimizations-webassembly-sharedarraybuffer-atomics-edgehtml-16/","tags":["MSEdge","browser","JavaScript","article"],"content":"MSEdge 16の変更点について。\n特定のスコープの関数を遅延実行できるようにしパフォーマンスの改善、try-catch-finallyの最適化、\nWebAssemblyとSharedArrayBufferをデフォルトで有効化など","relatedLinks":[]},{"category":"Article","title":"Common TypeScript Error Messages - Blog | SitePen","url":"https://www.sitepen.com/blog/2017/11/01/common-typescript-error-messages/","tags":["TypeScript","article"],"content":"TypeScriptのよく見るエラーとその解決方法について","relatedLinks":[]},{"category":"Article","title":"Houdini Paint API | blog.jxck.io","url":"https://blog.jxck.io/entries/2017-10-31/houdini-paint-api.html","tags":["CSS","article"],"content":"CSS Paint APIについての解説とデモ","relatedLinks":[]},{"category":"Article","title":"How to debug Front-end: Console – Pragmatists","url":"https://blog.pragmatists.com/how-to-debug-front-end-console-3456e4ee5504","tags":["browser","Chrome","debiug"],"content":"ブラウザの開発者ツールのConsole APIの紹介","relatedLinks":[]},{"category":"Article","title":"Put Your Webpack Bundle On A Diet - Part 1","url":"https://www.contentful.com/blog/2017/10/10/put-your-webpack-on-a-diet-part-1/","tags":["webpack","performance","article"],"content":"webpackでbundleファイルサイズの最適化についての連載。\nPart 1ではminify、production buildなどの基本的なことを扱っている。\ntree shaking、momentやlodashなどから不要なものを削除、babel-preset-env でのpolyfillの最適化など","relatedLinks":[{"title":"Put Your Webpack Bundle On A Diet - Part 2","url":"https://www.contentful.com/blog/2017/10/19/put-your-webpack-bundle-on-a-diet-part-2/"},{"title":"Put Your Webpack Bundle On A Diet - Part 3","url":"https://www.contentful.com/blog/2017/10/27/put-your-webpack-bundle-on-a-diet-part-3/"}]},{"category":"Article","title":"Tracing method calls via Proxies","url":"http://2ality.com/2017/11/proxy-method-calls.html","tags":["JavaScript","proxy","article"],"content":"ES proxyを使ったメソッド呼び出しのロギングについて","relatedLinks":[]},{"category":"Article","title":"Node.jsのパフォーマンスチューニングのtips - 技術探し","url":"http://abouthiroppy.hatenablog.jp/entry/2017/11/06/095943","tags":["node.js","performance","article"],"content":"Node.jsのデバッグ、Trace系オプション紹介","relatedLinks":[]},{"category":"SlideVideo","title":"プロダクトに 1 から Vue.js を導入した話","url":"https://www.slideshare.net/ShoheiOkada/1-vuejs","tags":["Vue","slide","opinion"],"content":"jQueryベースだったシステムに、Vueを導入してみての話。\nチームへの導入や導入前後での違いについてなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Server.js - server.js","url":"https://serverjs.io/","tags":["node.js","server","library"],"content":"シンプルなNode.jsのサーバライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Atomic CSS","url":"https://acss.io/","tags":["CSS","library","Tools"],"content":"宣言したクラスを元にCSSを作成するフレームワーク/ツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"raphamorim/react-tv: \\[WIP\\] React development for TV (Renderer for low memory applications and Packager for WebOS, Tizen, Orsay) 📺","url":"https://github.com/raphamorim/react-tv","tags":["React","TV","library"],"content":"WebOSなどのTV向けのReactツールキット。\nRendererや開発環境、ツールなどをまとめたもの","relatedLinks":[]},{"category":"Book","title":"React Bits · GitBook","url":"https://www.gitbook.com/book/vasanthk/react-bits/details","tags":["React","book"],"content":"ReactのパターンやTips、アンチパターンについてまとめられた電子書籍","relatedLinks":[]}]},{"meta":{"title":"2017-11-14のJS: React v16.1.0、Firefox DevTools、Docusaurus","author":"azu","layout":"post","date":"2017-11-14T01:27:38.248Z","category":"JSer","tags":["React","Firefox","Tool"],"url":"https://jser.info/2017/11/14/react-v16.1.0-firefox-devtools-docusaurus/"},"items":[{"category":"Headline","title":"PolymerLabs/lit-html: HTML template literals in JavaScript","url":"https://github.com/PolymerLabs/lit-html","tags":["JavaScript","HTML","DOM","library"],"content":"Tagged Template literalでHTMLを書いてレンダリングできるライブラリ。テンプレートのキャッシュが行われ再描画のコストを小さくするモチベーション。`<template>`要素との連携が考えられていて、Custom Elementでの利用がしやすくなっている。","relatedLinks":[{"title":"lit-HTML (Chrome Dev Summit 2017) - YouTube","url":"https://www.youtube.com/watch?v=Io6JjgckHbg"},{"title":"lit-html を調べたメモと考えたこと - EagleLand","url":"https://1000ch.net/posts/2017/lit-html.html"}]},{"category":"Headline","title":"Release v1.0.0 · addyosmani/critical","url":"https://github.com/addyosmani/critical/releases/tag/v1.0.0","tags":["JavaScript","CSS","Tools"],"content":"クリティカルパスの解析、インライン化を行うライブラリであるcritical 1.0.0リリース。\n実行エンジンがPhantomJSからChrome headlessへ変更された","relatedLinks":[]},{"category":"Headline","title":"Dev.Opera — What’s new in Chromium 62 and Opera 49","url":"https://dev.opera.com/blog/opera-49/","tags":["Opera","ReleaseNote"],"content":"Opera 49 (based on Chromium 62)リリース。\nNetwork Information API、OpenType Variable Fonts、DOM要素のMedia Captureなど","relatedLinks":[]},{"category":"Headline","title":"Release v16.1.0 · facebook/react","url":"https://github.com/facebook/react/releases/tag/v16.1.0","tags":["React","ReleaseNote"],"content":"React 16.1.0リリース。\nBowerのサポート終了、`React.Children` utilがPortalをサポート、React DOM Serverに`suppressHydrationWarning`の追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing DraftJS Plugins 2.0 – Nik Graf – Medium","url":"https://medium.com/@nikgraf/announcing-draftjs-plugins-2-0-8c25f2a4df55","tags":["JavaScript","React","plugin","ReleaseNote"],"content":"DraftJSのプラグイン集であるDraftJS Plugins 2.0リリース。\n画像の操作、整形、D&D、mentionやemojiなどに対応するプラグインを公開している。","relatedLinks":[{"title":"DraftJS Plugins - High quality plugins with great UX","url":"https://www.draft-js-plugins.com/"}]},{"category":"Article","title":"ES proposal: \\`import.meta\\` – module metadata","url":"http://2ality.com/2017/11/import-meta.html","tags":["ECMAScript","proposal","node.js"],"content":"Stage 3のECMAScript Proposalである`import.meta`について。\nモジュールのメタデータを扱うオブジェクトの仕様","relatedLinks":[]},{"category":"Article","title":"Creating a Star to Heart Animation with SVG and Vanilla JavaScript | CSS-Tricks","url":"https://css-tricks.com/creating-star-heart-animation-svg-vanilla-javascript/","tags":["SVG","article"],"content":"SVGとJavaScriptでスターやハートを書きアニメーションさせる話。","relatedLinks":[]},{"category":"Article","title":"Angular 5: Upgrading & Summary of New Features ← Alligator.io","url":"https://alligator.io/angular/angular-5/","tags":["Angular","article"],"content":"Angular 5の変更点について。\nAngular CLIの改善や最適化オプション、`updateOn`オプション、`@angular/service-worker`の追加などについて","relatedLinks":[]},{"category":"Article","title":"High-performance service worker loading  |  Web Fundamentals  |  Google Developers","url":"https://developers.google.com/web/fundamentals/primers/service-workers/high-performance-loading","tags":["ServiceWorker","article"],"content":"Service Workerのローディングについてのプラクティス。\nHTMLのキャッシュ、Application Shellパターン、`fetch`ハンドラで何もしない処理を登録するのは避ける、preloadについて","relatedLinks":[]},{"category":"Article","title":"Resource Prioritization – Getting the Browser to Help You  |  Web Fundamentals  |  Google Developers","url":"https://developers.google.com/web/fundamentals/performance/resource-prioritization","tags":["performance","browser","debug","article"],"content":"リソース取得の優先度について。\n開発者ツールでの読み方、`preload`、`preconnect`(`dns-prefetch`)、`prefetch`での優先度の指定やそれぞれのユースケースの紹介など","relatedLinks":[]},{"category":"Article","title":"Proper Error Handling in JavaScript ― Scotch","url":"https://scotch.io/tutorials/proper-error-handling-in-javascript","tags":["JavaScript","article"],"content":"JavaScriptのエラーハンドリングや基本的な構文について。\ntry...catch...finally、throw、window.onerror、コールスタックの読み方、Promiseのエラーハンドリングについてなど","relatedLinks":[]},{"category":"Article","title":"Browser automation revisited - meet Puppeteer","url":"https://nemethgergely.com/puppeteer-browser-automation/","tags":["Chrome","JavaScript","debug","article"],"content":"Puppeteerを使ったデバッグの自動化についての記事。\nコンソールログの取得、スクリーンショット、プロファイルの記録、HTTPリクエストの制御などを行う方法についてを紹介している","relatedLinks":[]},{"category":"SlideVideo","title":"コンポーネント指向と余白の設計","url":"https://www.slideshare.net/manabuyasuda1/ss-71261608","tags":["design","CSS","slide"],"content":"Atomic Design/コンポーネント指向とmargin/paddingのパターンについてのスライド。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Docusaurus · Easy to Maintain Open Source Documentation Websites","url":"https://docusaurus.io/","tags":["React","Markdown","API","document","Tools"],"content":"PrettierやJestなどが利用している静的サイトジェネレータ。\nReactを使ったカスタマイズ、翻訳への対応、ブログ機能やalgoliaを使った検索などライブラリサイト向けの機能を持っている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Debugger PlayGround | Introduction | Mozilla","url":"https://mozilladevelopers.github.io/playground/debugger","tags":["firefox","debug","tutorial"],"content":"Firefoxの開発者ツールのチュートリアル。\nデバッガーの使い方、ブレークポイントの読み方、コールスタックの読み方などについて","relatedLinks":[{"title":"Go beyond console.log with the Firefox Debugger – Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2017/11/go-beyond-console-log-with-the-firefox-debugger/"}]},{"category":"WebsiteDocument","title":"Bogdan-Lyashenko/Under-the-hood-ReactJS: Entire React code base explanation by visual block schemes (Stack+Fiber versions)","url":"https://github.com/Bogdan-Lyashenko/Under-the-hood-ReactJS","tags":["React","document"],"content":"Reactのコードベースの解説リポジトリ。\nコードの構造などの図などとともに、React Fiber、Stack reconcilerなどの解説をしてる","relatedLinks":[{"title":"Bogdan-Lyashenko/js-code-to-svg-flowchart: js2flowchart - a visualization library to convert any JavaScript code into beautiful SVG flowchart. Learn other’s code. Design your code. Refactor code. Document code. Explain code.","url":"https://github.com/Bogdan-Lyashenko/js-code-to-svg-flowchart"}]},{"category":"SoftwareLibrary","title":"lifenautjoe/noel: A universal, human-centric, replayable javascript event emitter.","url":"https://github.com/lifenautjoe/noel","tags":["JavaScript","library"],"content":"イベントハンドラを登録する前に発火したイベントも後からリプレイして再度発火することができるEventEmitterライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"PaperCSS · the less formal CSS framework","url":"https://www.getpapercss.com/","tags":["CSS","library"],"content":"手書き風のCSSフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Bogdan-Lyashenko/js-code-to-svg-flowchart: js2flowchart - a visualization library to convert any JavaScript code into beautiful SVG flowchart. Learn other’s code. Design your code. Refactor code. Document code. Explain code.","url":"https://github.com/Bogdan-Lyashenko/js-code-to-svg-flowchart","tags":["JavaScript","SVG","Tools","library"],"content":"JavaScriptのコードから制御フローチャートの図を作成するツール。 ifやwhileなどのループをそのままフローチャートにしてくれる","relatedLinks":[]}]},{"meta":{"title":"2017-11-19のJS: Firefox 57、JavaScriptのコスト、momentとLuxon","author":"azu","layout":"post","date":"2017-11-19T10:51:22.569Z","category":"JSer","tags":["Firefox","Performance","Date","Moment","i18n"],"url":"https://jser.info/2017/11/19/firefox-57-javascript-momentluxon/"},"items":[{"category":"Headline","title":"Release v0.59.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.59.0","tags":["flowtype","ReleaseNote"],"content":"Flow 0.59.0リリース。\n`$ReadOnly<T>` utility typeの追加、パフォーマンスの改善、`/* flowlint sketchy-null:error */`のようなコメントでLintを有効化できるように","relatedLinks":[]},{"category":"Headline","title":"Node v9.2.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v9.2.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 9.2.0リリース。\n`fs.realpathSync.native`、`fs.realpath.native`、`process.ppid`がexposeされた","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 44 | WebKit","url":"https://webkit.org/blog/8035/release-notes-for-safari-technology-preview-44/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 44リリース。\nPayment Requestがデフォルトで有効化、`createImageBitmap()`の実装、OffscreenCanvasのIDLを追加など","relatedLinks":[]},{"category":"Headline","title":"Introducing security alerts on GitHub","url":"https://github.com/blog/2470-introducing-security-alerts-on-github","tags":["github","security","JavaScript","ruby","news"],"content":"GitHubリポジトリにnpmやgemのセキュリティアラート機能が追加された。","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0-beta.1 · reactjs/redux","url":"https://github.com/reactjs/redux/releases/tag/v4.0.0-beta.1","tags":["redux","JavaScript","TypeScript","ReleaseNote"],"content":"Redux v4.0.0-beta.1リリース。\nTypeScriptの更新、`INIT`をランダムな値に変更、IE11未満のサポートを終了、Dispatchのパフォーマンス改善など","relatedLinks":[{"title":"Redux 4 breaking changes · Issue #1342 · reactjs/redux","url":"https://github.com/reactjs/redux/issues/1342"}]},{"category":"Headline","title":"Firefox — Notes (57.0) — Mozilla","url":"https://www.mozilla.org/en-US/firefox/57.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 57リリース。\nCSSエンジンの書き直しが行われ挙動の変更とパフォーマンスの改善、`watch`/`unwatch`メソッドが非推奨化、`PerformanceObserver`の有効化、Fetchのabortに対応。\nWebRTCの`RTCDataChannel`のメッセージファイルサイズを指定できるように","relatedLinks":[{"title":"Introducing the New Firefox: Firefox Quantum - The Mozilla Blog","url":"https://blog.mozilla.org/blog/2017/11/14/introducing-firefox-quantum/"},{"title":"Firefox Quantum 57 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/57"},{"title":"Firefox 57 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/versions/57/"},{"title":"Using WebRTC data channels - Web APIs | MDN","url":"https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API/Using_data_channels#Understanding_message_size_limits"}]},{"category":"Headline","title":"Release 2.6.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v2.6.0","tags":["Chrome","performance","ReleaseNote"],"content":"lighthouse 2.6.0リリース。\n`redirects`などのチェックツールの追加。\n各スクリプトの起動時間を計測する`bootup-time`、ページの実行時間を計測する`mainthread-work-breakdown`などのAuditを追加","relatedLinks":[]},{"category":"Article","title":"Refactoring React Components with Jest’s Snapshot – Michael Romani – Medium","url":"https://medium.com/@mr4227/refactoring-react-components-with-jests-snapshot-7ed1b9d332cc","tags":["React","testing","article"],"content":"Jestのsnapshotテストを使ったReactコンポーネントのリファクタリングについての記事。\nスナップショットを取ってから、でかいコンポーネントの細分化をテストしながら行う話","relatedLinks":[]},{"category":"Article","title":"How Redux Works: A Counter-Example","url":"https://daveceddia.com/how-does-redux-work/","tags":["redux","tutorial","article"],"content":"Reduxでカウンターアプリを作りながらReduxの使い方や仕組みについてを学ぶチュートリアル。","relatedLinks":[]},{"category":"Article","title":"The Cost Of JavaScript – Dev Channel – Medium","url":"https://medium.com/dev-channel/the-cost-of-javascript-84009f51e99e","tags":["JavaScript","performance","article"],"content":"JavaScriptの実行までのコストについてを解説した記事。\nダウンロード、パース、実行のステップを踏む。同じサイズのJSと画像のコストは異なる点。\nPRPLパターン、Performance Budgetについて。","relatedLinks":[]},{"category":"Article","title":"JavaScript. The Core: 2nd Edition – ds.laboratory","url":"http://dmitrysoshnikov.com/ecmascript/javascript-the-core-2nd-edition/","tags":["JavaScript","ECMAScript","article"],"content":"ECMAScript/JavaScriptにおける用語の定義やその概念の解説。\nECMAScriptの仕様に近いコアな内容。","relatedLinks":[]},{"category":"Article","title":"Clean Code vs. Dirty Code: React Best Practices - American Express Engineering Blog","url":"http://americanexpress.io/clean-code-dirty-code/","tags":["React","opinion","article"],"content":"Reactを題材にしたクリーンなコードについて。\nネーミングやコンポーネントの分割、デフォルト値の扱いなど良くない例とそれを改善した例を元に解説している。","relatedLinks":[]},{"category":"SlideVideo","title":"React Redux を用いた SPA 新規サービスを運用して得た知見と実装例 - ランサーズ（Lancers）エンジニアブログ","url":"https://engineer.blog.lancers.jp/2017/11/react-redux-spa-manage-tips/","tags":["React","redux","slide","JavaScript"],"content":"React+Redux+Sagaを使ったプロジェクトについてのスライド。\nディレクトリ構成や基本的な処理の流れ、HOCを使ったコンポーネントの拡張、ダイアログやストレージへの保存などユースケース毎の実装方法について。\nまたテスト、Sentryを使ったエラー解析、SEO、APIの管理についてなどについて","relatedLinks":[]},{"category":"SlideVideo","title":"JS Kongress 2017 - YouTube","url":"http://www.youtube.com/playlist?list=PL8ajgHZ7PoCt3l5RXoyqVu_r7gYJU0dMx","tags":["JavaScript","イベント","video"],"content":"JS Kongress 2017の動画一覧","relatedLinks":[{"title":"JS Kongress 2017 💻 - The Future of JavaScript, Nov 13-14 2017, Munich","url":"https://2017.js-kongress.de/"}]},{"category":"WebsiteDocument","title":"What Web Can Do Today","url":"https://whatwebcando.today/","tags":["WebPlatformAPI","browser"],"content":"アクセスしているブラウザでさまざまなWeb Platform APIが利用できるかを表示してくれるサイト","relatedLinks":[]},{"category":"WebsiteDocument","title":"\\`performance.mark\\` with metadata is useful for Real user monitoring","url":"https://dev.to/ben/we-welcome-a-wonderful-influx-of-new-members-from-japan-1k0","tags":["performance","browser","library","JavaScript"],"content":"`performance.mark`にメタデータとしてFPSを付加して計測して、ボトルネックになっている行動をログから解析、可視化する方法について","relatedLinks":[{"title":"azu/performance-mark-metadata: ","url":"https://github.com/azu/performance-mark-metadata"},{"title":"performance.markにメタデータを紐付けできるライブラリを書いた | Web Scratch","url":"http://efcl.info/2017/11/15/performance.mark-metadata/"}]},{"category":"WebsiteDocument","title":"stereobooster/react-snap: A zero-configuration static pre-renderer for Single Page Applications","url":"https://github.com/stereobooster/react-snap","tags":["React","library","server"],"content":"Reactをprerenderして静的なHTMLにできるライブラリ。\n設定なしでcreate-react-appと協調して動作することを目標にしている。SSRで扱うことが難しい3rdパーティスクリプトやWebGLなどがオプションで対処できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"moment/luxon: A library for working with dates and times in JS","url":"https://github.com/moment/luxon","tags":["JavaScript","library"],"content":"日付や時間、インターバルを扱うライブラリ。 日付操作やパース、フォーマットを行える。Immutableであり、TimeZoneやIntlを使った国際化に対応している。 Momentとの違いをまとめたドキュメントも公開されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jaredpalmer/react-fns: Browser API's turned into declarative React components and HoC's","url":"https://github.com/jaredpalmer/react-fns","tags":["React","library"],"content":"ReactのHigh Order Componentのコレクションライブラリ。\nデバイスの回転や動作、オンライン/オフライン、Geo、メディアクエリー、スクロール、ロケールを扱えるコンポーネントなどが用意されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"goto-bus-stop/tinyify: a browserify plugin that runs various optimizations, so you don't have to install them all manually. makes your bundles tiny!","url":"https://github.com/goto-bus-stop/tinyify","tags":["browserify","plugin","Tools"],"content":"Browserifyでフラットbundle、unassert、productionビルド、minifyなどをまとめて行うプラグイン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jaredpalmer/razzle: ✨ Create server-rendered universal JavaScript applications with no configuration","url":"https://github.com/jaredpalmer/razzle","tags":["isomorphic","JavaScript","Tools"],"content":"UniversalなJavaScriptアプリケーションを設定なしで書き始められる開発環境ツール。\n`create-react-app`のようなツールだが、React以外でも利用できる。","relatedLinks":[]},{"category":"Book","title":"Pure React","url":"https://daveceddia.com/pure-react/","tags":["React","book"],"content":"Reactについてステップバイステップで学べるサンプルを中心にした書籍。","relatedLinks":[]},{"category":"Book","title":"Manning | Vue.js in Action","url":"https://www.manning.com/books/vue-js-in-action","tags":["Vue","book"],"content":"2018年5月30日発売\nVueについての書籍","relatedLinks":[]},{"category":"Book","title":"超速！ Webページ速度改善ガイド ── 使いやすさは「速さ」から始まる（WEB+DB PRESS plusシリーズ）｜gihyo.jp … 技術評論社","url":"http://gihyo.jp/magazine/wdpress/plus/978-4-7741-9400-4","tags":["browser","performance","book"],"content":"2017年11月23日発売\nウェブページのパフォーマンス改善についての書籍。\nネットワーク、レンダリング、スクリプトの項目ごとに測定方法や改善方法についてを扱う。","relatedLinks":[]},{"category":"Book","title":"Manning | React Native in Action","url":"https://www.manning.com/books/react-native-in-action","tags":["React","book"],"content":"2018年4月30日発売\nReact Nativeについての書籍","relatedLinks":[]}]},{"meta":{"title":"2017-11-28のJS: Firefox 58の変更点、Emscripten/WebAssembly/Rust","author":"azu","layout":"post","date":"2017-11-28T00:43:49.054Z","category":"JSer","tags":["firefox","webassembly","emscripten"],"url":"https://jser.info/2017/11/28/firefox-58-emscripten-webassembly-rust/"},"items":[{"category":"Headline","title":"jsdom/Changelog.md at master · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/master/Changelog.md#1140","tags":["JavaScript","DOM","ReleaseNote"],"content":"jsdom 11.4.0リリース。\n基本的なSVGのサポート、`pretendToBeVisual`オプションの追加、`prepend()/append()/before()/after()/replaceWith()`の追加、`<applet>`要素の削除など","relatedLinks":[]},{"category":"Headline","title":"New in Firefox 58: Developer Edition – Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2017/11/new-in-firefox-58-developer-edition/","tags":["firefox","ReleaseNote"],"content":"Firefox 58について。\nデバッガーでフレームワークのスタックトレースが簡潔化、`console.groups`が折りたためるように。\nまた、WebVR(macOS)、FLACのサポート環境の追加、`PerformanceNavigationTiming `のサポート、Budgetベースのバックグラウンドにおける処理の制限追加など","relatedLinks":[{"title":"budget-based background timeout throttling","url":"https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API#Policies_in_place_to_aid_background_page_performance"}]},{"category":"Headline","title":"Learn Svelte","url":"https://svelte.technology/guide#state-management","tags":["JavaScript","library","news"],"content":"コンパイルできるUIフレームワークのSvelteにStoreが追加された。\nReduxやMobXなどのように`Store`でStateを管理し、変更の監視やcompuate propertyの管理ができる","relatedLinks":[]},{"category":"Article","title":"Dynamic import()  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/11/dynamic-import","tags":["Chrome","JavaScript","safari","article"],"content":"Chrome 63から利用できるDynamic `import()`についての解説","relatedLinks":[]},{"category":"Article","title":"Web Frameworks: Conclusions - Blog | SitePen","url":"https://www.sitepen.com/blog/2017/11/10/web-frameworks-conclusions/","tags":["JavaScript","library","article"],"content":"JavaScriptフレームワークの比較。\n強み、弱み、将来性、選ぶ理由について","relatedLinks":[]},{"category":"Article","title":"WebAssemblyをNodeJS Native Addonの配布形式として使う - Islands in the byte stream","url":"http://gfx.hatenablog.com/entry/2017/11/16/231950","tags":["node.js","WebAssembly"],"content":"Emscriptenを使ってWebAssembl形式にしたNodeモジュールを配布する方法について","relatedLinks":[]},{"category":"Article","title":"Bankai, the friendly web compiler – choo – Medium","url":"https://medium.com/choojs/bankai-the-friendly-web-compiler-35f1916679cc","tags":["browserify","Tools","JavaScript","article"],"content":"Browserifyを使った開発ツールキットについて","relatedLinks":[{"title":"choojs/bankai: - friendly web compiler","url":"https://github.com/choojs/bankai"}]},{"category":"Article","title":"JavaScriptのWebGL 2.0でGPGPU - Qiita","url":"https://qiita.com/teatime77/items/e867d7d462cb553b373d","tags":["JavaScript","WebGL","article"],"content":"WebGL 2.0を使ったGPGPUについての解説記事。\nWebGL 2.0を使った行列計算や他の実装との比較など","relatedLinks":[]},{"category":"Article","title":"ReactNative 本体のバージョンのアップグレードを行う - Qiita","url":"https://qiita.com/hotchpotch/items/5617caccd8749f410631","tags":["React","article"],"content":"ReactNativeの0.44.xから0.49.xへのアップグレードについて。\n`rn-diff`を使った変更内容のチェック、Xcode関係のアップデート、モジュールのマイグレーション、FlowとReactの型変更の対応などについて","relatedLinks":[]},{"category":"SlideVideo","title":"Introduction to Node.js | edX","url":"https://www.edx.org/course/introduction-node-js-microsoft-dev283x","tags":["node.js","MS","video","tutorial"],"content":"MicrosoftのNode.js入門講座","relatedLinks":[]},{"category":"SlideVideo","title":"Source to Binary - journey of V8 javascript engine // Speaker Deck","url":"https://speakerdeck.com/brn/source-to-binary-journey-of-v8-javascript-engine","tags":["V8","slide"],"content":"V8がJavaScriptのコードを実行するフロー、コンパイルパイプラインについてのスライド","relatedLinks":[]},{"category":"WebsiteDocument","title":"JSBench.me - JavaScript performance benchmarking playground","url":"https://jsbench.me/","tags":["JavaScript","benchmark","Tools","webservice"],"content":"JavaScriptのスニペットベンチマークサイト。\njsperfのようにJavaScriptのコードのマイクロベンチマークを取って比較できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"y-js/yjs: A framework for real-time p2p shared editing on any data","url":"https://github.com/y-js/yjs","tags":["JavaScript","p2p","library"],"content":"WebRTC/WebSocktes/XMPPを使ったP2Pでデータのやり取りやテキストの同時編集ができるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"MikeMcl/big.js: A small, fast JavaScript library for arbitrary-precision decimal arithmetic.","url":"https://github.com/MikeMcl/big.js/","tags":["JavaScript","library"],"content":"Javaの`BigDecimal`のJavaScript実装ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"asfktz/autodll-webpack-plugin: Webpack's DllPlugin without the boilerplate","url":"https://github.com/asfktz/autodll-webpack-plugin","tags":["webpack","plugin"],"content":"webpackのDLLを簡単に扱えるようにするDLLプラグイン。\nパッケージの追加や設定の変更をトリガーに再ビルドできる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"aws/aws-amplify: A declarative library for application development using Cloud services with JavaScript","url":"https://github.com/aws/aws-amplify","tags":["aws","JavaScript","library","React"],"content":"AWSとの連携を簡単に行えるライブラリ。認証、Analytics、API、Storageなど。\nまたReact/React Nativeと連携できるライブラリも公開されている。","relatedLinks":[{"title":"Announcing AWS Amplify and the AWS Mobile CLI | AWS Mobile Blog","url":"https://aws.amazon.com/jp/blogs/mobile/announcing-aws-amplify-and-the-aws-mobile-cli/"},{"title":"Get Started - AWS Mobile","url":"http://docs.aws.amazon.com/aws-mobile/latest/developerguide/web-getting-started.html"}]},{"category":"SoftwareLibrary","title":"z-pattern-matching/z: native pattern matching for javascript","url":"https://github.com/z-pattern-matching/z","tags":["JavaScript","library"],"content":"パターンマッチライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"imsnif/synp: Convert yarn.lock to package-lock.json and vice versa","url":"https://github.com/imsnif/synp","tags":["yarn","npm","Tools"],"content":"`yarn.lock`ファイルと`package-lock.json`ファイルを相互変換できるツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"google/ts-style: ☂️ TypeScript style guide, formatter, and linter.","url":"https://github.com/google/ts-style","tags":["Tools","TypeScript","console","google"],"content":"設定不要なコンパイル、コードフォーマット、Lintを行うTypeScript向けのツール。 clang-format、TSLintを利用している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"naver/billboard.js: Re-usable, easy interface JavaScript chart library based on D3 v4+","url":"https://github.com/naver/billboard.js","tags":["d3.js","グラフ","library"],"content":"D3.jsを使ったC3.jsのようなグラフライブラリ。\nC3.jsをforkしたライブラリで、D3.js v4を使いC3.jsとの互換性を持っている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dcodeIO/webassembly: A minimal toolkit and runtime to produce and run WebAssembly modules.","url":"https://github.com/dcodeIO/webassembly","tags":["Tools","WebAssembly","browser","node.js"],"content":"WebAssemblyのツールキットとランタイム。 wasmへのコンパイルに必要な依存の自動ダウンロードやコンパイルができる。 またwasm向けの`console`や`Mtch`などのバインディングを提供するランタイムも含まれている。","relatedLinks":[]},{"category":"Book","title":"ちゃんと使える力を身につける　JavaScriptのきほんのきほん | 大澤 文孝 | 工学 | Kindleストア | Amazon","url":"https://www.amazon.co.jp/%E3%81%A1%E3%82%83%E3%82%93%E3%81%A8%E4%BD%BF%E3%81%88%E3%82%8B%E5%8A%9B%E3%82%92%E8%BA%AB%E3%81%AB%E3%81%A4%E3%81%91%E3%82%8B-JavaScript%E3%81%AE%E3%81%8D%E3%81%BB%E3%82%93%E3%81%AE%E3%81%8D%E3%81%BB%E3%82%93-%E5%A4%A7%E6%BE%A4-%E6%96%87%E5%AD%9D-ebook/dp/B0779R1R3P","tags":["JavaScript","book"],"content":"プログラミング入門者向けのJavaScript入門書","relatedLinks":[]}]},{"meta":{"title":"2017-12-05のJS: npm 5.6.0(beta)、React 16.2.0、New ECMAScript Proposals","author":"azu","layout":"post","date":"2017-12-05T02:02:14.329Z","category":"JSer","tags":["npm","React","ECMAScript"],"url":"https://jser.info/2017/12/05/npm-5.6.0beta-react-16.2.0-new-ecmascript-proposals/"},"items":[{"category":"Headline","title":"React v16.2.0: Improved Support for Fragments - React Blog","url":"https://reactjs.org/blog/2017/11/28/react-v16.2.0-fragment-support.html","tags":["React","ReleaseNote"],"content":"React 16.2.0リリース。\nFramentsのサポート。\n`<></>` または`<Fragment>`要素を使うことでフラグメントを扱うことができる","relatedLinks":[]},{"category":"Headline","title":"Release v3.9.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v3.9.0","tags":["webpack","ReleaseNote"],"content":"webpack 3.9.0リリース。\nスキーマによるバリデーションのエラーメッセージの改善など","relatedLinks":[]},{"category":"Headline","title":"Release v0.60.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.60.0","tags":["flowtype","ReleaseNote"],"content":"Flow 0.60.0リリース。\nserver monitorを追加して変更検知の改善、Flow linterに`unclear-type`、`untyped-import`の追加、`$Values`と`$Keys`の修正など","relatedLinks":[]},{"category":"Headline","title":"Video.js 6.5.0 Release | Video.js Blog","url":"http://blog.videojs.com/video-js-6-5-0-release/","tags":["JavaScript","video","ReleaseNote"],"content":"Video.js 6.5.0リリース。\nプログレスバーのアニメーションを滑らかに、`play()`のハンドリングの改善など","relatedLinks":[]},{"category":"Headline","title":"The npm Blog — v5.6.0 (2017-11-27)","url":"http://blog.npmjs.org/post/167963735925/v560-2017-11-27","tags":["ReleaseNote","npm"],"content":"npm 5.6.0(beta)の変更点について。 クロスプラットフォームで`package-lock.json`の互換性が保てるようになった。 `pacakge-loc.json`を生成するだけの`--package-lock-only`オプションの追加、`--node-options`の追加など","relatedLinks":[]},{"category":"Article","title":"Debugging React performance with React 16 and Chrome Devtools.","url":"https://building.calibreapp.com/debugging-react-performance-with-react-16-and-chrome-devtools-c90698a522ad","tags":["React","performance","browser","article"],"content":"React 16でのパフォーマンスプロファイルの読み方について","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 64)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/11/devtools-release-notes","tags":["Chrome","debug","article"],"content":"Chrome 64の開発者ツールの変更点について。\nパフォーマンスモニタ、Consoleサイドバー、コンソールログをグループ化など","relatedLinks":[]},{"category":"Article","title":"shallow-equal for Object/React props | Web Scratch","url":"http://efcl.info/2017/11/30/shallow-equal/","tags":["JavaScript","React","library","article"],"content":"Shallow Equalを扱うライブラリについて。\nReactの`shouldComponentUpdate`をDeep Equal(`JSON.stringify`)で実装した場合とShallow Equalの速度差について。\nまたShallowな比較で済むように必要な状態管理についてなど。","relatedLinks":[]},{"category":"Article","title":"Chromium のソースコードの歩き方","url":"http://nhiroki.jp/2017/12/01/chromium-sourcecode","tags":["Chrome","blink","article"],"content":"Chrome/Blinkのプロジェクト構造について。\nディレクトリ構造やそれぞれのディレクトリの意味などについて。\nbrowserとrendererでの大枠やBlink内の分け方、コードOwnerや依存の見かたについてなど","relatedLinks":[]},{"category":"Article","title":"JavaScript Performance Optimization Tips: An Overview — SitePoint","url":"https://www.sitepoint.com/javascript-performance-optimization-tips-an-overview/","tags":["JavaScript","performance","article"],"content":"JavaScriptとパフォーマンスについての概要を紹介した記事\nパフォーマンスがよいという定義としてのRAIL、JavaScript実行までのコスト、bundleサイズなどについて","relatedLinks":[]},{"category":"Article","title":"Measuring the Performance of Firefox Quantum with RUM - Akamai Developer Blog","url":"https://developer.akamai.com/blog/2017/11/29/measuring-performance-firefox-quantum-rum/","tags":["firefox","performance","article"],"content":"Firefox 52(ESR)とFirefox 57(Quantum)のAkamaiによるロードパフォーマンス比較。\nAkamaiのRUMによるとDOM Content Loadedの時間が24%改善されたとのこと","relatedLinks":[]},{"category":"Article","title":"最近のselenium-webdriverの話 - Qiita","url":"https://qiita.com/nazomikan/items/61143cbf01274c05b654","tags":["Selenium","article"],"content":"selenium-webdriverのPromiseManager廃止の経緯とネイティブのPromiseを使った書き方への変更について","relatedLinks":[]},{"category":"Article","title":"Almin.js がやってくれること - Qiita","url":"https://qiita.com/kmdsbng/items/dc03d89c0ca5acc30a44","tags":["almin","DDD","article","JavaScript","React"],"content":"ビジネスロジックをViewなどとは分けた状態にして、DDDをやるための土台としてのAlminについて。\nAlminで書いた場合のアプリケーションの処理の流れやドメインオブジェクトの独立性について。","relatedLinks":[]},{"category":"Article","title":"Monitoring the performance of a Node.js web application - Sqreen Blog | Modern Application Security","url":"https://blog.sqreen.io/diy-node-apm/","tags":["node.js","JavaScript","performance","article"],"content":"Node.jsの`async_hook`モジュールを使ったUser Timing APIとAsync Hooks APIを使ったパフォーマンス計測について","relatedLinks":[]},{"category":"Article","title":"ECMAScript proposal updates @ 2017-011 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2017/12/05/ecmascript-proposal-updates","tags":["ECMAScript","proposal","article"],"content":"2017年10月のTC39ミーティングの結果を反映したECMAScript Proposalの変更点まとめ","relatedLinks":[{"title":"agendas/11.md at master · tc39/agendas","url":"https://github.com/tc39/agendas/blob/master/2017/11.md"}]},{"category":"Article","title":"eslint-plugin-vue を作っている話 - Qiita","url":"https://qiita.com/mysticatea/items/860ce3bf0ff387f166ac","tags":["ESLint","Vue","article"],"content":"Vue向けのESLintプラグインである`eslint-plugin-vue`の紹介とオンラインデモについて","relatedLinks":[{"title":"vuejs/eslint-plugin-vue: Official ESLint plugin for Vue.js","url":"https://github.com/vuejs/eslint-plugin-vue"}]},{"category":"Article","title":"Vue.jsでD3.jsを使わずにグラフを実装する - Qiita","url":"https://qiita.com/haribote/items/0bbf6cf5720b078039ff","tags":["Vue","SVG","グラフ","article"],"content":"Vueを使ってSVGでグラフを描画する話。\nデータドリブンで折れ線グラフ、棒グラフ、円グラフなどをSVGで描画する仕組みの作り方について","relatedLinks":[]},{"category":"Article","title":"Performance Calendar » Evolution of <img>: Gif without the GIF","url":"https://calendar.perfplanet.com/2017/animated-gif-without-the-gif/","tags":["safari","article","browser","video","performance"],"content":"GIFと`<video>`でのアニメーション画像について。\nSafari Technology Previewが`<img src=\".mp4\">`をサポートした話。\n`<video>`よりも`<img>`の方がパフォーマンスのよい理由。\nGIF、WebP、mp4でのファイルサイズの違いなどについて","relatedLinks":[]},{"category":"Article","title":"WebRTCで統計情報を収集する - Qiita","url":"https://qiita.com/yusuke84/items/dc6e5a4ed109c4631b66","tags":["WebRTC","article"],"content":"WebRTCでの使用コーデック、送受信ストリーム情報などのメディアやネットワークに関する統計情報を取得する方法について","relatedLinks":[]},{"category":"SlideVideo","title":"New Web Platform APIs // Speaker Deck","url":"https://speakerdeck.com/arnellebalane/new-web-platform-apis","tags":["JavaScript","WebPlatformAPI","Chrome","slide"],"content":"最近増えた色々なWebplatform APIについてのスライド。\nBroadcast Chennel、Network Information、Web Share、Credential Management、Payment API、Resize Observerなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"reactjs/react-a11y: Identifies accessibility issues in your React.js elements","url":"https://github.com/reactjs/react-a11y","tags":["React","accessibility","library"],"content":"Reactコンポーネントのアクセシビリティに関する問題を見つけるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ReactPrimer/ReactPrimer: React component prototyping tool that generates fully connected class component code.","url":"https://github.com/ReactPrimer/ReactPrimer","tags":["React","Tools","software"],"content":"Reactコンポーネントのプロトタイピングツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"WeiChiaChang/stacks-cli: 📊 Analyze website stack from the terminal 💻","url":"https://github.com/WeiChiaChang/stacks-cli","tags":["Tools","JavaScript","library"],"content":"指定したURLが使っているライブラリやCDN、アクセス解析ツール、サーバなどを解析してくれるツール","relatedLinks":[]},{"category":"Book","title":"Web Development with Node and Express, 2nd Edition - O'Reilly Media","url":"http://shop.oreilly.com/product/0636920084266.do","tags":["node.js","book"],"content":"Node.jsとExpressでのウェブアプリ開発についての書籍","relatedLinks":[]}]},{"meta":{"title":"2017-12-11のJS: Parcel、webpack 4.0.0α、Node.js Performance改善ガイド","author":"azu","layout":"post","date":"2017-12-11T00:06:46.000Z","category":"JSer","tags":["bundler","webpack","node.js","performance"],"url":"https://jser.info/2017/12/11/parcel-webpack-4.0.0a-node.js-performance/"},"items":[{"category":"Headline","title":"Release 1.9.0: JSX Fragments, EditorConfig and Arrow Parens · prettier/prettier","url":"https://github.com/prettier/prettier/releases/tag/1.9.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 1.9.0リリース。\nJSXのFragment(`<></>`)ｗｐサポート、EditorConfigのサポート、Markdownのサポート改善。","relatedLinks":[]},{"category":"Headline","title":"📦 Parcel","url":"https://parceljs.org/","tags":["JavaScript","Tools"],"content":"HTML,JS,CSSなどをまとめてbundleできるツール。\n設定不要で使えること、高速にビルドできることが目的のツール。\nファイルタイプに対する処理をプラグインとして追加できる。","relatedLinks":[{"title":"🚀 Announcing Parcel: A blazing fast, zero configuration web application bundler 📦","url":"https://medium.com/@devongovett/announcing-parcel-a-blazing-fast-zero-configuration-web-application-bundler-feac43aac0f1"}]},{"category":"Headline","title":"GoogleChromeLabs/jsvu: JavaScript (engine) Version Updater","url":"https://github.com/GoogleChromeLabs/jsvu","tags":["JavaScript","Tools"],"content":"各種JavaScriptエンジンをダウンロード、インストールできるツール。\neshost-cliと組み合わせることでChakra、JavaScriptCore、SpiderMonkey、V8でのJavaScript実行結果を同時に得られる。","relatedLinks":[{"title":"bterlson/eshost-cli: Run ECMAScript code uniformly across any ECMAScript host","url":"https://github.com/bterlson/eshost-cli"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 45 | WebKit","url":"https://webkit.org/blog/8039/release-notes-for-safari-technology-preview-45/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 45リリース。\nSVGフィルターの最適化、`display:contents`をデフォルトで有効化、`OffscreenCanvas.getContext(\"webgl\")`を実装など","relatedLinks":[]},{"category":"Headline","title":"mochify.js/CHANGES.md at v5.0.0 · mantoni/mochify.js","url":"https://github.com/mantoni/mochify.js/blob/v5.0.0/CHANGES.md","tags":["JavaScript","testing","ReleaseNote"],"content":"Mochaを使ったテストをブラウザで動かすMchify 5.0.0リリース。\nPhantomJSからHeadless Chromeに変更、`--url`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Angular 5.1 & More Now Available – Angular Blog","url":"https://blog.angular.io/angular-5-1-more-now-available-27d372f5eb4e","tags":["Angular","ReleaseNote"],"content":"Angular 5.1リリース。\nCLIがService Workerオプション、App Shellオプションサポート、TypeScript 2.5サポートなど","relatedLinks":[]},{"category":"Headline","title":"webpack 4.0.0-alpha.0 feedback · Issue #6064 · webpack/webpack","url":"https://github.com/webpack/webpack/issues/6064","tags":["webpack","issue","ReleaseNote"],"content":"webpack 4.0.0-alpha.0リリース。\nNode.js 4のサポート終了、`--mode`（dev/prod)の追加。\nmodule typeとしてesm、webassemblyのサポート、`sideEffects`設定のサポート。\n新しいプラグインシステムの追加と既存プラグインの変更など","relatedLinks":[]},{"category":"Article","title":"Qiita の新記事ページのレイアウト実装 - Qiita","url":"https://qiita.com/morishitter/items/c4aa500929f2de441bfd","tags":["CSS","article"],"content":"CSS Grid Layoutと`position: sticky`でのレイアウトについて","relatedLinks":[]},{"category":"Article","title":"PuppeteerでWebページからメインコンテンツっぽいところを抽出してみる - Qiita","url":"https://qiita.com/ukyo/items/287169de85576dfed608","tags":["JavaScript","article","Chrome"],"content":"PuppeteerでスクレイピングしたDOM要素のスコアリングして、メインコンテンツを抽出する仕組みについて","relatedLinks":[]},{"category":"Article","title":"await vs return vs return await - JakeArchibald.com","url":"https://jakearchibald.com/2017/await-vs-return-vs-return-await/","tags":["Promises","JavaScript","article"],"content":"async functionの中で`await`と`return`、`return await`の違いについてを解説した記事","relatedLinks":[]},{"category":"Article","title":"New in Chrome 63  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/12/nic63","tags":["Chrome","ReleaseNote"],"content":"Chrome 63リリース。\nDynamic imports、Async iterator、`Promise#finally`、`Intl.PluralRules`、CSS `overscroll-behavior`プロパティのサポートなど","relatedLinks":[]},{"category":"Article","title":"Node.js Performance 改善ガイド - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2017/12/05/125517","tags":["node.js","performance","article"],"content":"Node.jsのパフォーマンスの調査や測定をする方法について。\nメモリリーク、CPUの処理時間、ファイルI/O、ネットワークのボトルネック調査について。\nまたJavaScriptのdeoptが起きてないか、クラスタやNative Addonなどの代替手法についてなど","relatedLinks":[]},{"category":"Article","title":"Vanilla JSで学ぶRedux - Qiita","url":"https://qiita.com/ryota-murakami/items/2ed6b12943214ecfeeaf","tags":["redux","JavaScript","article"],"content":"Reduxのコードを見ながらReduxの仕組みについて解説している記事。","relatedLinks":[]},{"category":"Article","title":"Prototype Tree · TryCatch","url":"https://zhirzh.github.io/2017/12/06/prototype-tree/","tags":["JavaScript","図","article","d3.js"],"content":"JavaScriptオブジェクトのprototypeツリーをD3.jsを使って可視化する話","relatedLinks":[{"title":"zhirzh/prototype-tree","url":"https://github.com/zhirzh/prototype-tree"}]},{"category":"Article","title":"歴史的遺物callback interfaceの紹介 - Qiita","url":"https://qiita.com/yuki3/items/ab20985e70247c80d19c","tags":["JavaScript","DOM","WebPlatformAPI"],"content":"`addEventListener`のcallback interfaceと`requestAnimationFrame`などのcallback functionという仕様の違いついて。\nイベントハンドラにおける`handleEvent`の動作について","relatedLinks":[]},{"category":"Article","title":"Using Headless Mode in Firefox – Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2017/12/using-headless-mode-in-firefox/","tags":["firefox","Selenium","article"],"content":"SeleniumをFirefoxのHeadlessモードで動かす方法、Debugging Protocolについてなど","relatedLinks":[]},{"category":"Article","title":"Fast Source Map Generation for React Native – David Aurelio – Medium","url":"https://medium.com/@david.aurelio/medium-fast-source-map-generation-for-react-native-ea5549007c18","tags":["JavaScript","sourcemap","library","article"],"content":"React Native(Metro)が利用するSource Mapの高速な実装について\nhttps://github.com/facebook/metro/tree/master/packages/metro-source-map","relatedLinks":[]},{"category":"Article","title":"React Performance Fixes on Airbnb Listing Pages – Airbnb Engineering & Data Science – Medium","url":"https://medium.com/airbnb-engineering/recent-web-performance-fixes-on-airbnb-listing-pages-6cd8d93df6f4","tags":["JavaScript","React","performance","article"],"content":"Reactを使ったアプリケーションのパフォーマンスを測定し、それをどのように修正していったかについての記事。\n`PureComponent`での無駄な描画を防止、スクロール時の処理、入力欄などについて","relatedLinks":[]},{"category":"Article","title":"Performance Calendar » Clearing cache in the browser","url":"https://calendar.perfplanet.com/2017/clearing-cache-in-the-browser/","tags":["browser","article"],"content":"ウェブアプリ側からブラウザのキャッシュをクリアするさまざまな手法のまとめ。\n`location.reload(true)`、Vary、fetch、iframe、Clear-SIte-Dataなどの手法毎にブラウザの対応についてまとめている。","relatedLinks":[]},{"category":"SlideVideo","title":"JSConf Budapest 2017 - YouTube","url":"http://www.youtube.com/playlist?list=PL37ZVnwpeshH9ztZfHqvQhF1_Zm4VcCTD","tags":["JavaScript","video","イベント"],"content":"JSConf Budapest 2017の動画まとめ","relatedLinks":[{"title":"JSConf Budapest 2017","url":"http://jsconfbp.com/"}]},{"category":"SlideVideo","title":"Eirik Vullum: JavaScript Metaprogramming - ES6 Proxy Use and Abuse | JSConf Budapest 2017 - YouTube","url":"https://www.youtube.com/watch?v=_5X2aB_mNp4","tags":["JavaScript","slide","video"],"content":"ES Proxyを活用したメタプログラミングについての発表動画","relatedLinks":[{"title":"JSBP - JavaScript Metaprogramming with Proxies by Eirik Langholm Vullum","url":"http://slides.com/eiriklv/javascript-metaprogramming-with-proxies-41#/"}]},{"category":"SlideVideo","title":"MakeYouAReact - Google スライド","url":"https://docs.google.com/presentation/d/1qh5ZCMI2e45Z4YZBcI62NMDt-1H2Uwx0sZ3T8ScNStk/pub?start=false&loop=false&delayms=60000#slide=id.g18b78f925cfb8077_17","tags":["React","JavaScript","slide","DOM"],"content":"ReactのようなViewライブラリを自作するために必要な技術について解説してるスライド。\n実際に実装を作りながら、DOMのdiff/patchなどについて解説している。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Three.js入門サイト - ICS MEDIA","url":"https://ics.media/tutorial-three/index.html","tags":["JavaScript","WebGL","tutorial"],"content":"Three.jsについてのチュートリアルサイト。\nThree.jsの使い方やWebGLについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"i0natan/nodebestpractices: The largest Node.JS best practices list. Curated from the top ranked articles and always updated","url":"https://github.com/i0natan/nodebestpractices","tags":["node.js","server","document"],"content":"Node.jsとexpressについてのプラクティスガイド。","relatedLinks":[]},{"category":"WebsiteDocument","title":"WasmFiddle","url":"https://wasdk.github.io/WasmFiddle/","tags":["WebAssembly","editor","Tools"],"content":"WebAssemblyのjsfiddle的なサービス。\nWasmのコンパイルと実行、wast/wasmのダウンロードができる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"jsdom/whatwg-mimetype: Parses, serializes, and manipulates MIME types, according to the WHATWG MIME Sniffing Standard","url":"https://github.com/jsdom/whatwg-mimetype","tags":["WHATWG","JavaScript","library"],"content":"MIME typesのパーサ、シリアライズライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"deeplearn.js","url":"https://deeplearnjs.org/","tags":["JavaScript","library","機械学習","WebGL"],"content":"WebGLを使った機械学習向けのライブラリ。\n同期的な(NumPyのような)計算実行と遅延的な(TensorFlowのような)計算実行をサポートしている。","relatedLinks":[]}]},{"meta":{"title":"2017-12-19のJS: JavaScript開発者アンケート2017、Reactのインフラ、CQRS/EventSourcing","author":"azu","layout":"post","date":"2017-12-19T11:21:14.517Z","category":"JSer","tags":["JavaScript","react","cqrs","EventSourcing"],"url":"https://jser.info/2017/12/19/javascript2017-react-cqrseventsourcing/"},"items":[{"category":"Headline","title":"Node v9.3.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v9.3.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 9.3.0リリース\n`--trace-event-categories`に`node.async_hooks`を追加、`module.builtinModules`でビルトインモジュールの一覧を取得できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"moment/CHANGELOG.md at 2.20.0 · moment/moment","url":"https://github.com/moment/moment/blob/2.20.0/CHANGELOG.md","tags":["JavaScript","library","ReleaseNote"],"content":"moment 2.20.0リリース。\nHTML5 inputに対応するフォーマットの追加、`UTC`への変換しないオプションが`toISOString`に追加された","relatedLinks":[{"title":"moment-2.20.0.md","url":"https://gist.github.com/marwahaha/e0d4135fbf8bb75fa85c4aa2bddc5031"}]},{"category":"Headline","title":"Introducing Docusaurus · Docusaurus","url":"https://docusaurus.io/blog/2017/12/14/introducing-docusaurus.html","tags":["document","ReleaseNote","Tools"],"content":"OSSのドキュメントサイト生成ツールであるdocusaurusが正式公開された。\ndocusaurusが作られた理由や使い方について","relatedLinks":[]},{"category":"Headline","title":"Release \"Fast\" By Default · TypeStrong/ts-node","url":"https://github.com/TypeStrong/ts-node/releases/tag/v4.0.0","tags":["TypeScript","ReleaseNote","node.js"],"content":"ts-node 4.0.0リリース。\n`--fast`がデフォルトとなった。\n`--type-check`を使うことで型チェックを合わせて行うように変更。\n`transformers`オプションのサポートなど","relatedLinks":[]},{"category":"Article","title":"Enter AudioWorklet  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/12/audio-worklet","tags":["audio","webworker","JavaScript"],"content":"Chrome 64でフラグ付きの実装が入るAudioWorkletについての解説","relatedLinks":[]},{"category":"Article","title":"The State of JavaScript 2017: Introduction","url":"https://stateofjs.com/2017/introduction/","tags":["JavaScript","アンケート","まとめ"],"content":"JavaScriptの開発者アンケートの結果が公開された。\nJavaScriptのフロントエンドからバックエンドまで幅広くツールや言語、ライブラリ、CSSなどについて扱っている","relatedLinks":[]},{"category":"Article","title":"モバイル開発に役立つJSデバッグ術 - Mercari Engineering Blog","url":"http://tech.mercari.com/entry/2017/12/13/103000","tags":["Chrome","debug","article"],"content":"Chrome開発者ツールの機能紹介をしている記事。\nResponsive表示、ネットワークスロットリング、CPUスロットリング、全ファイル検索など","relatedLinks":[]},{"category":"Article","title":"The Current State of Implementation and Planning for ESModules","url":"https://medium.com/the-node-js-collection/the-current-state-of-implementation-and-planning-for-esmodules-a4ecb2aac07a","tags":["node.js","module","article"],"content":"Node.jsのES Modulesの実装状況や優先度についての説明。\nCommonJSとの相互運用性、mjsのサポート、hook apiのサポート、コアモジュールの対応、`import.meta`についてなど","relatedLinks":[]},{"category":"Article","title":"Behind the Scenes: Improving the Repository Infrastructure - React Blog","url":"https://reactjs.org/blog/2017/12/15/improving-the-repository-infrastructure.html","tags":["React","JavaScript","article"],"content":"Reactのリポジトリのインフラ改善について。\nPrettierでのコード整形、monorepoとyarn workspace、モジュール構造、rollupでのflat bundle、Closure Compilerでの圧縮。\nproductionビルドに対するテスト、Public APIに対するテスト、`npm pack`でのpublish状況再現。\nカスタムビルドの対応、リリースフロー整備など","relatedLinks":[]},{"category":"Article","title":"The global \\`Reflect\\` object, its use cases and things to watch out for","url":"https://www.stefanjudis.com/today-i-learned/the-global-reflect-object-its-use-cases-and-things-to-watch-out-for/","tags":["JavaScript","article"],"content":"`Reflect`の使い方について。\n`Proxy`と合わせて使うものでオブジェクトの変更のloggingを例解説している。","relatedLinks":[]},{"category":"Article","title":"How to debug front-end: Elements – Pragmatists","url":"https://blog.pragmatists.com/how-to-debug-front-end-elements-d97da4cbc3ea","tags":["Chrome","debug"],"content":"Chromeの開発者ツールの使い方について。\nデバッガー、Element inspector、Source、スタイルなどについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"nitin42/react-perf-devtool: A Chrome developer tool extension to inspect performance of React components.","url":"https://github.com/nitin42/react-perf-devtool","tags":["React","performance","Tools","browser","Extension"],"content":"Reactコンポーネントのパフォーマンス計測ツール。\nReactの`performance.measure`の結果を使い、`react-addons-perf`のような計測結果を表示できるブラウザ拡張とツール","relatedLinks":[]},{"category":"WebsiteDocument","title":"Polymer 2 and Googlebot – Dev Channel – Medium","url":"https://medium.com/dev-channel/polymer-2-and-googlebot-2ad50c5727dd","tags":["google","SEO","Chrome","JavaScript","WebComponents"],"content":"PolymerとGoogle Botへの対応について。\nGoogle BotはChrome 41相当であるため、TranspilerやPolyfill、確認方法などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"calirojas506/vue-inspector: Vue.js Inspector for Mobile Devices","url":"https://github.com/calirojas506/vue-inspector","tags":["Vue","debug","mobile","library"],"content":"VueのInspectorライブラリ。\nモバイルデバイス上でVueコンポーネントのデバッグをする目的のツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nik-garmash/hyntax: Straightforward HTML parser","url":"https://github.com/nik-garmash/hyntax","tags":["HTML","library"],"content":"HTMLパーサライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"developit/microbundle: 📦 Zero-configuration bundler for tiny modules.","url":"https://github.com/developit/microbundle","tags":["JavaScript","Tools"],"content":"設定ファイルなしでbundleする目的のRollupのラッパーツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"xtuc/js-webassembly-interpreter: WebAssembly interpreter","url":"https://github.com/xtuc/js-webassembly-interpreter","tags":["WebAssembly","JavaScript","Tools"],"content":"WebAssemblyインタープリタ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Popmotion - A functional JavaScript motion library","url":"https://popmotion.io/","tags":["JavaScript","animation","library"],"content":"関数でモーションを扱うアニメーションライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ballercat/walt: Walt is a JavaScript-like syntax for WebAssembly text format WIP","url":"https://github.com/ballercat/walt","tags":["WebAssembly","flowtype","Tools"],"content":"JavaScript/Flowのサブセットのように書けて、WebAssemblyにコンパイルできる言語とツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"franciscop/state: State management tool using Proxy()","url":"https://github.com/franciscop/state","tags":["JavaScript","library"],"content":"`Proxy`を使ったステート管理ライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sveltejs/sapper: Combat-ready apps, engineered by Svelte","url":"https://github.com/sveltejs/sapper","tags":["JavaScript","library"],"content":"SvelteをつかったNext.jsのようなフレームワーク","relatedLinks":[{"title":"What is Sapper?","url":"https://sapper-template.now.sh/blog/what-is-sapper"}]},{"category":"Book","title":"Manning | Electron in Action","url":"https://www.manning.com/books/electron-in-action","tags":["Electron","book"],"content":"2018年5月1日発売\nElectronについての書籍","relatedLinks":[]},{"category":"Book","title":"Patterns for designing flexible architecture in node.js (CQRS/ES/Onion)","url":"https://medium.com/@domagojk/patterns-for-designing-flexible-architecture-in-node-js-cqrs-es-onion-7eb10bbefe17","tags":["node.js","TypeScript","CQRS","EventSourcing","DDD","JavaScript"],"content":"TypeScriptを使ってCQRS+EventSourcingのパターンでNode.jsアプリを実装する記事。\nサンプルプロジェクトと共にコマンドからイベントを作りそれをRepositoryに保存する流れを紹介してる。","relatedLinks":[{"title":"domagojk/beenion: Online adaptation of a scientific journal publishing and peer reviewing","url":"https://github.com/domagojk/beenion"}]}]},{"meta":{"title":"2017-12-26のJS: Service Worker in MSEdge/Safari、Jest 22、jQuery UIとMobileの統合","author":"azu","layout":"post","date":"2017-12-26T09:55:06.473Z","category":"JSer","tags":["ServiceWorker","jest","jQuery"],"url":"https://jser.info/2017/12/26/service-worker-in-msedgesafari-jest-22-jquery-uimobile/"},"items":[{"category":"Headline","title":"Release Notes for Safari Technology Preview 46 | WebKit","url":"https://webkit.org/blog/8042/release-notes-for-safari-technology-preview-46/","tags":["safari","ReleaseNote","ServiceWorker"],"content":"Safari Technology Preview Release 46リリース。\nService Workerがデフォルトで有効化、`--useBigInt`フラグつきBigIntの実装、`img`要素の`decoding`属性のサポートなど","relatedLinks":[]},{"category":"Headline","title":"V8 JavaScript Engine: V8 release v6.4","url":"https://v8project.blogspot.com/2017/12/v8-release-64.html","tags":["V8","ReleaseNote"],"content":"V8 v6.4リリース。\nパフォーマンス、メモリ使用量の改善。named captureなどの正規表現Proposalの実装と有効化、`import.meta.url`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release Webpack-CLI V.2.0.0 · webpack/webpack-cli","url":"https://github.com/webpack/webpack-cli/releases/tag/v.2.0.0","tags":["webpack","ReleaseNote"],"content":"webpack-cli 2.0.0リリース。\n`add`コマンド、`serve`コマンドの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · karma-runner/karma","url":"https://github.com/karma-runner/karma/releases/tag/v2.0.0","tags":["JavaScript","browser","testing","ReleaseNote"],"content":"Karma v2.0.0リリース。\nNode.js 4未満のサポート終了、エラー表示の改善など","relatedLinks":[]},{"category":"Headline","title":"ESLint v4.14.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2017/12/eslint-v4.14.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 4.14.0リリース。\nパーサ向けにScope解析のhookポイントが追加された。","relatedLinks":[]},{"category":"Headline","title":"Jest 22: Refinements & Custom Runners · Jest","url":"http://facebook.github.io/jest/blog/2017/12/18/jest-22.html","tags":["JavaScript","testing","ReleaseNote"],"content":"Jest 22リリース。\nNode.js 4のサポート終了、カスタムRunnerのコアとなる`jest-worker`の公開。\nテスト結果のフォーマッタの変更、`--detectLeaks`の追加、Babel 7のサポート、MITライセンスに変更など","relatedLinks":[]},{"category":"Article","title":"【連載記事】JavaScriptでプログラミングを学ぶ　その1：基礎と文法","url":"https://sbfl.net/blog/2017/12/14/javascript-programming-1/","tags":["JavaScript","tutorial"],"content":"プログラミングを学んだことない人向けのJavaScript入門連載。","relatedLinks":[]},{"category":"Article","title":"Use a Render Prop! – componentDidBlog","url":"https://cdb.reacttraining.com/use-a-render-prop-50de598f11ce","tags":["React","article"],"content":"Reactの子コンポーネントと値やロジックを共有するパターンとしてのrender propsについて","relatedLinks":[{"title":"Add doc about Render Props by mjackson · Pull Request #355 · reactjs/reactjs.org","url":"https://github.com/reactjs/reactjs.org/pull/355"}]},{"category":"Article","title":"React 🎄","url":"https://react.holiday/","tags":["React","tutorial"],"content":"アドベントカレンダー形式のReactチュートリアル","relatedLinks":[]},{"category":"Article","title":"Service Workers: Going beyond the page - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2017/12/19/service-workers-going-beyond-page/","tags":["MSEdge","ServiceWorker","article"],"content":"MSEdgeのService Workerが実装された。\nService Workerの基本的な使い方やService Workerの制限について書かれている。","relatedLinks":[]},{"category":"Article","title":"The Future of jQuery UI and jQuery Mobile | jQuery UI Blog","url":"http://blog.jqueryui.com/2017/12/the-future-of-jquery-ui-and-jquery-mobile/","tags":["jQuery","UI","mobile","article","opinion"],"content":"jQuery MobileはjQuery UIに依存しているが、今までは別々のチーム/リポジトリとなっていた。\n重複などの無駄があるため、チームを統合し、停滞しているプロジェクトを改善していく指針が公開された。\nあわせてSlackチャンネルを開設して協力者を募集している。","relatedLinks":[]},{"category":"Article","title":"Preloading modules  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2017/12/modulepreload","tags":["JavaScript","module","Chrome","article"],"content":"`<link rel=\"modulepreload\">`について。\n`<link rel=\"preload\">`との違い、モジュールの依存関係はフラットにすべてのファイルを定義するべきかについて","relatedLinks":[]},{"category":"Article","title":"Idiomatic Redux: Using Reselect Selectors for Encapsulation and Performance · Mark's Dev Blog","url":"http://blog.isquaredsoftware.com/2017/12/idiomatic-redux-using-reselect-selectors/","tags":["redux","JavaScript","performance","article","React"],"content":"reselectを使ったパフォーマンスの最適化について。\nreselectはstateからstateを作るライブラリで、入力に対してメモ化が行われている。\nこれを使いReduxのstateからアプリケーションに適切な形へstateを変換させる例について紹介している","relatedLinks":[]},{"category":"Article","title":"ES6 Modules のエラー処理を決定的(deterministic)にした話 - Google ドキュメント","url":"https://docs.google.com/document/d/1Wuc2LVLb2Ii-itnA4sKw_KndJGvZ4mvdfw0POm5qcs4/edit#","tags":["Chrome","module","JavaScript","spec","article","ECMAScript"],"content":"ES Modules(仕様)のエラーがネットワークに依存したものとなっていて、毎回異なるエラーになる問題があった。\nエラーが毎回同じ結果となるように、仕様をどのように修正していったかについて。","relatedLinks":[]},{"category":"Article","title":"ブラウザのしくみ: データ構造とアルゴリズムと雰囲気で理解する DOM と Shadow DOM — hayato.io","url":"https://hayato.io/2017/dom/","tags":["Chrome","WebComponents"],"content":"DOMやShadow DOMの構造や実装についての解説記事。\nShadow DOMの登場によってDOMはツリーのツリー(Super Tree)となっている。\nその場合におけるCSSセレクタのマッチングやイベントパスについてなどをChromeの実装と合わせて解説している。","relatedLinks":[]},{"category":"Article","title":"Lint the Web Forward With Sonarwhal ◆ 24 ways","url":"https://24ways.org/2017/lint-the-web-forward-with-sonarwhal/","tags":["HTML","web ","Tools","article"],"content":"Sonarwhalを使ったウェブサイトのLintについての記事。\nSonarwhalの基本的な使い方や設定について解説している","relatedLinks":[]},{"category":"Article","title":"Testing Angular 2 and Continuous Integration with Jest - Semaphore","url":"https://semaphoreci.com/community/tutorials/testing-angular-2-and-continuous-integration-with-jest","tags":["JavaScript","Angular","testing","article"],"content":"Jestを使ったAngularのテストについて","relatedLinks":[]},{"category":"SlideVideo","title":"日経電子版 サイト高速化とPWA対応 / nikkei-high-performance-pwa // Speaker Deck","url":"https://speakerdeck.com/sisidovski/nikkei-high-performance-pwa","tags":["slide","browser","performance"],"content":"ウェブサイトのパフォーマンス改善についてのスライド。\nアセットの配信の最適化、Resource Hintsでのpreload。\nSpeedCurveを使ってのモニタリングやファイルサイズのチェック。\nService Workerでのキャッシュやデバッグなどについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"amsul/react-performance: Helpers to debug and record component render performance 🚀","url":"https://github.com/amsul/react-performance","tags":["React","library","performance"],"content":"React 16で動く`react-addons-perf`のようなものを目指すライブラリ。\nReactコンポーネントのプロファイルを取れるライブラリ。","relatedLinks":[]},{"category":"Book","title":"Responsively Retrofitting: Retrofitting Web Sites with HTML5 and CSS3: Christopher Schmitt: 9781449364205: Amazon.com: Books","url":"https://www.amazon.com/Responsively-Retrofitting-Sites-HTML5-CSS3/dp/1449364209","tags":["CSS","HTML","book"],"content":"2018年8月25日発売\n既存のレガシーなウェブサイトをモバイル向けにリニューアルする方法についてを扱う書籍","relatedLinks":[]}]},{"meta":{"title":"2018-01-02のJS: npmのパッケージ名のルール変更、gulp 4.0.0プレリリース、Babel 7の変更予定","author":"azu","layout":"post","date":"2018-01-02T11:38:53.116Z","category":"JSer","tags":["npm","gulp","babel"],"url":"https://jser.info/2018/01/02/npm-gulp-4.0.0-babel-7/"},"items":[{"category":"Headline","title":"The npm Blog — New Package Moniker rules","url":"http://blog.npmjs.org/post/168978377570/new-package-moniker-rules","tags":["npm","news","security"],"content":"npmにパッケージをpublishする際のルールが変更された。\nパッケージ名に含まれる`.`、`-`、`_`の違いによる区別をしなくなった。\n`react-native`と`react.native`を同じものとして扱い、タイプミスを狙った類似パッケージの公開を防止する目的。","relatedLinks":[{"title":"validate-npm-package-name","url":"https://www.npmjs.com/package/validate-npm-package-name"}]},{"category":"Headline","title":"Introducing Hyperapp 1.0 🎉 – Jorge Bucaran – Medium","url":"https://medium.com/@JorgeBucaran/introducing-hyperapp-1-0-dbf4229abfef","tags":["JavaScript","library","ReleaseNote"],"content":"hyperapp 1.0.0リリース。","relatedLinks":[{"title":"Release 1.0.0 · hyperapp/hyperapp","url":"https://github.com/hyperapp/hyperapp/releases/tag/1.0.0"}]},{"category":"Headline","title":"Release v4.0.0 · gulpjs/gulp","url":"https://github.com/gulpjs/gulp/releases/tag/v4.0.0","tags":["gulp","ReleaseNote"],"content":"gulp 4.0.0プレリリース。\n`npm install gulp@next`でインストールできるように。\n`gulp.reset`、`gulp.task`の第三引数の削除。\n`gulp.series`と`gulp.parallel`、`gulp.tree`、`gulp.registry`の追加。\n`gulp`と`gulp-cli`の分離など","relatedLinks":[{"title":"gulp/CHANGELOG.md at v4.0.0 · gulpjs/gulp","url":"https://github.com/gulpjs/gulp/blob/v4.0.0/CHANGELOG.md"},{"title":"[","url":"https://github.com/gulpjs/gulp/issues/1486"}]},{"category":"Headline","title":"Ember.js - Ember 2.18 and 3.0 Beta Released","url":"https://emberjs.com/blog/2018/01/01/ember-2-18-released.html","tags":["Ember","ReleaseNote"],"content":"Ember 2.1.8と3.0βリリース。\nEmber 3.0ではIE 9, 10のサポート終了、2.xで非推奨となった機能の削除され、それらは`ember-2-legacy`アドオンにポートされる。","relatedLinks":[{"title":"rfcs/0252-browser-support-changes.md at master · emberjs/rfcs","url":"https://github.com/emberjs/rfcs/blob/master/text/0252-browser-support-changes.md"},{"title":"Ember.js - The Road to Ember 3.0","url":"https://www.emberjs.com/blog/2017/10/03/the-road-to-ember-3-0.html"},{"title":"emberjs/ember-2-legacy","url":"https://github.com/emberjs/ember-2-legacy"}]},{"category":"Headline","title":"Neutrino: Releasing v8 🎉 – Eli Perelman – Medium","url":"https://medium.com/@eliperelman/neutrino-releasing-v8-a643f356f410","tags":["JavaScript","Tools","ReleaseNote"],"content":"JavaScriptの開発環境セットアップツールのNeutrino v8.0.0リリース。\nモジュールを`@neutrinojs`のScoped moduleへ移行、`@neutrinojs/library`などのコアミドルウェアの追加、複数ページのアプリへの対応など","relatedLinks":[{"title":"Migration Guide · Neutrino","url":"https://neutrino.js.org/migration-guide#neutrino-v7-to-v8"}]},{"category":"Article","title":"Performance Calendar » Performance insurance","url":"https://calendar.perfplanet.com/2017/performance-insurance/","tags":["performance","Tools","JavaScript","browser"],"content":"パフォーマンス関係のツール紹介記事。\nファイルサイズチェック、ファイル分割チェック、LightHouse、モニタリングサービスなど","relatedLinks":[]},{"category":"Article","title":"Christmas Gifts for Your Future Self: Testing the Web Platform ◆ 24 ways","url":"https://24ways.org/2017/testing-the-web-platform/","tags":["WebPlatformAPI","testing","article","browser"],"content":"ウェブ標準におけるテストについて。\nWeb Platform Testsでのテストの見かた、コントリビュート方法やテストの書き方についてなど","relatedLinks":[{"title":"web-platform-tests dashboard","url":"https://wpt.fyi/"}]},{"category":"Article","title":"Nearing the 7.0 Release · Babel","url":"https://babeljs.io/blog/2017/12/27/nearing-the-7.0-release","tags":["babel","article"],"content":"Babel 7の変更予定について","relatedLinks":[]},{"category":"Article","title":"ResizeObserver による変更検知と Element Query | blog.jxck.io","url":"https://blog.jxck.io/entries/2017-12-30/resize-observer-and-element-query.html","tags":["WebPlatformAPI","JavaScript"],"content":"ResizeObserverについての解説記事。\n要素のリサイズを監視するObserver API","relatedLinks":[]},{"category":"Article","title":"Profiling adventure - Qiita","url":"https://qiita.com/martinheidegger/items/5a5c40770ef6f47a92b2","tags":["node.js","performance","debug","article"],"content":"Node.jsで`perf_hooks`を使ったプロファイル、Node.jsの`--prof`フラグを使ったより詳細なダンプデータのとり方。\nまた`--inspect-brk`を使いChromeの開発者ツールを使ってのデバッグについて","relatedLinks":[]},{"category":"Article","title":"JavaScript のスレッド並列実行環境","url":"http://nhiroki.jp/2017/12/10/javascript-parallel-processing","tags":["Chrome","JavaScript","webworker","article"],"content":"JavaScriptにおけるスレッド関係の機構について。\nタスクキュー、Web Workerのモデル、スレッド間のメッセージング、データのコピーと移譲(Transferable)、SharedArrayBuffer、Agentの共有メモリモデル。 Worklet/Tasklet、Web Locks、Thread APIについて","relatedLinks":[]},{"category":"Article","title":"Getting Started with Jest and Puppeteer – Noteworthy — The Journal Blog","url":"https://blog.usejournal.com/getting-started-with-jest-and-puppeteer-7cf6c59a2cae","tags":["JavaScript","Chrome","E2E","testing"],"content":"JestとPuppeteerを使ったテストの設定や書き方について","relatedLinks":[]},{"category":"WebsiteDocument","title":"tbfleming/cib: clang running in browser (wasm)","url":"https://github.com/tbfleming/cib/","tags":["JavaScript","WebAssembly","Clang","C++"],"content":"`clang`と`clang-format`をJavaScriptにコンパイルし、ブラウザ上で`clang`を使ってC++をWebAssemblyへコンパイルして実行するデモ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"anseki/leader-line: Draw a leader line in your web page.","url":"https://github.com/anseki/leader-line","tags":["JavaScript","SVG","library"],"content":"指定要素同士を矢印で繋いだり、指定要素への矢印とキャプションを描画できるライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"whoeverest/wsrun: Command runner for Yarn workspaces. Dependency aware.","url":"https://github.com/whoeverest/wsrun","tags":["yarn","Tools"],"content":"Yarn workspace向けのツール。\nlerna runのようにそれぞれのパッケージに対してコマンドを実行できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"keithamus/sort-package-json: Sort an Object or package.json based on the well-known package.json keys","url":"https://github.com/keithamus/sort-package-json","tags":["Tools","node.js"],"content":"`package.json`のフィールドをソートするツール","relatedLinks":[]},{"category":"Book","title":"JavaScript のスレッド並列実行環境","url":"http://nhiroki.jp/2017/12/10/javascript-parallel-processing","tags":["Chrome","webworker","JavaScript"],"content":"JavaScriptにおけるWebWorkerやSharedWorker、Workletなどのスレッドの仕組みについてや違いについて。\nまた検討されているWeb Locks APIやThread APIについて","relatedLinks":[]}]},{"meta":{"title":"2018-01-09のJS: Spectre/Meltdownのブラウザへの影響、FuseBox 3.0、Nuxt.js 1.0","author":"azu","layout":"post","date":"2018-01-09T23:13:18.624Z","category":"JSer","tags":["Security","browser","fusebox","vue"],"url":"https://jser.info/2018/01/10/spectremeltdown-fusebox-3.0-nuxt.js-1.0/"},"items":[{"category":"Headline","title":"Node v8.9.4 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v8.9.4/","tags":["node.js","ReleaseNote"],"content":"Node.js 8.9.4リリース。\nnpm 5.6.0の同梱など","relatedLinks":[{"title":"The npm Blog — v5.6.0 (2017-11-27)","url":"http://blog.npmjs.org/post/167963735925/v560-2017-11-27"}]},{"category":"Headline","title":"Actions Required to Mitigate Speculative Side-Channel Attack Techniques - The Chromium Projects","url":"https://sites.google.com/a/chromium.org/dev/Home/chromium-security/ssca","tags":["JavaScript","security","news","browser"],"content":"Chrome、Firefox、MSEdge、SafariなどのブラウザはMeltdown/Spectre(CPUプロセッサに関する脆弱性)を受ける。\nそのためSharedArrayBufferの無効化や軽減策として`performance.now()`などの挙動を変更する","relatedLinks":[{"title":"Mitigations landing for new class of timing attack | Mozilla Security Blog","url":"https://blog.mozilla.org/security/2018/01/03/mitigations-landing-new-class-timing-attack/"},{"title":"Meltdown and Spectre","url":"https://spectreattack.com/"},{"title":"Mitigating speculative execution side-channel attacks in Microsoft Edge and Internet Explorer - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2018/01/03/speculative-execution-mitigations-microsoft-edge-internet-explorer/#m2GyZlsjAzq0Do6K.97"},{"title":"What Spectre and Meltdown Mean For WebKit | WebKit","url":"https://webkit.org/blog/8048/what-spectre-and-meltdown-mean-for-webkit/"}]},{"category":"Headline","title":"browserify/changelog.markdown at v15.0.0 · browserify/browserify","url":"https://github.com/browserify/browserify/blob/v15.0.0/changelog.markdown","tags":["browserify","ReleaseNote"],"content":"Browserify 15.0.0リリース。\nNode.js 4未満のサポート終了、`module-deps`の依存を更新、`browserify` organizationに移動など","relatedLinks":[{"title":"Release v5.0.0 · browserify/module-deps","url":"https://github.com/browserify/module-deps/releases/tag/v5.0.0"}]},{"category":"Headline","title":"Dev.Opera — What’s new in Chromium 63 and Opera 50","url":"https://dev.opera.com/blog/opera-50/","tags":["Chrome","Opera","ReleaseNote"],"content":"Opera 50 (based on Chromium 63)リリース。\nDynamic import、Async Iterator/Generator、`Promise#finally`、`Intl.PluralRules`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"ESLint v4.15.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2018/01/eslint-v4.15.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 4.15.0リリース。\n`CLIEngine#getRules()`で設定されたルールの取得、`messageId`の追加など開発者向けの機能追加など","relatedLinks":[{"title":"ESLint v4.15.0 - Qiita","url":"https://qiita.com/mysticatea/items/c6c10d4749e7d69d321e"}]},{"category":"Article","title":"ECMAScript 2015以降のJavaScriptの\\`this\\`を理解する | Web Scratch","url":"http://efcl.info/2018/01/04/what-is-this/","tags":["JavaScript","ECMAScript","article"],"content":"JavaScriptの`this`についての解説記事。\n状況によって異なる値を参照する`this`は、どのような仕組みでその値を決まっているかについて。\n関数やArrow Functionでの仕組みの違いなどについて","relatedLinks":[{"title":"asciidwango/js-primer: JavaScriptの入門書","url":"https://github.com/asciidwango/js-primer"}]},{"category":"Article","title":"FuseBox 3.0 — faster than ever – fusebox – Medium","url":"https://medium.com/fusebox/fusebox-3-0-faster-than-ever-5fae4254556c","tags":["JavaScript","Tools","ReleaseNote"],"content":"FuseBox 3.0リリース。\nCode Splittingをデフォルトでサポート、TypeScriptをソースにTree Shakingをサポートするために`ts:main`のサポート。\nパフォーマンスの改善、ウェブサイトのデザイン更新など","relatedLinks":[{"title":"Release 3.0.2 · fuse-box/fuse-box","url":"https://github.com/fuse-box/fuse-box/releases/tag/3.0.2"},{"title":"fuse-box/version3changelog.md at master · fuse-box/fuse-box","url":"https://github.com/fuse-box/fuse-box/blob/master/docs/version3changelog.md"}]},{"category":"Article","title":"New flexbox guides on MDN – Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2018/01/new-flexbox-guides-on-mdn/","tags":["CSS","article","document"],"content":"FlexboxのガイドがMDNに追加された","relatedLinks":[]},{"category":"Article","title":"🐛🔨 The Contributors Guide to webpack — Part 1 🎨 🖼","url":"https://medium.com/webpack/the-contributors-guide-to-webpack-part-1-a0410cc82ca4","tags":["webpack","article","JavaScript"],"content":"webpackのアーキテクチャの解説をする連載。\nwebpack関係のツール、プラグインのエコシステムや動作の仕組み、モジュール依存関係グラフの構築などについて","relatedLinks":[{"title":"TheLarkInn/artsy-webpack-tour: Annotations on webpack source code in a pseudo-guided fashion.","url":"https://github.com/TheLarkInn/artsy-webpack-tour"}]},{"category":"Article","title":"Using React Fragments for the first time","url":"https://javascriptplayground.com/react-fragments/","tags":["JavaScript","React","article"],"content":"React 16で導入されたFragmentについての記事。\nどのような問題を解決するのかや気をつけるべき点、ユースケースについて","relatedLinks":[]},{"category":"Article","title":"What’s New in HTML 5.2?","url":"https://bitsofco.de/whats-new-in-html-5-2/","tags":["W3C","HTML","spec","article"],"content":"W3C HTML 5.2の変更点まとめ。\n`<dialog>`要素、iframeに`allowpaymentrequest`属性の追加、`<main>`要素の複数配置の許容。\nまた`keygen`、`menu`、`menuitem`の削除、HTML4 XHTML1 strict doctypeの削除など","relatedLinks":[{"title":"HTML 5.2: Changes","url":"https://www.w3.org/TR/html52/changes.html#changes"},{"title":"main要素、二つの定義 | フロントエンドBlog | ミツエーリンクス","url":"https://www.mitsue.co.jp/knowledge/blog/frontend/201412/02_1454.html"},{"title":"メモ：両HTMLにおけるmain要素の説明、ついに一定の収束の気配か。 - 水底の血","url":"http://momdo.hatenablog.jp/entry/20180105/1515161004"}]},{"category":"Article","title":"JavaScript Start-up Optimization  |  Web Fundamentals  |  Google Developers","url":"https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/javascript-startup-optimization/","tags":["Chrome","performance","article"],"content":"ウェブサイトの起動速度周りの改善ポイントについてまとめた記事。\nネットワーク、ファイルサイズ、パース、コンパイル、実行コストについてを簡単にまとめたもの","relatedLinks":[{"title":"JavaScript Start-up Performance – reloading – Medium","url":"https://medium.com/reloading/javascript-start-up-performance-69200f43b201"}]},{"category":"Article","title":"Nuxt.js 1.0 is out 🎉 – Nuxt.js – Medium","url":"https://medium.com/@nuxt_js/nuxt-js-1-0-is-out-bab1af459972","tags":["JavaScript","Vue","server","ReleaseNote"],"content":"Vue版Next.jsであるNuxt.js 1.0リリース。\nNode.js 8.0.0未満のサポートを終了。\n今後はドキュメンテーション、パフォーマンス、TypeScriptサポートの改善などを行っていく","relatedLinks":[{"title":"Release v1.0.0 · nuxt/nuxt.js","url":"https://github.com/nuxt/nuxt.js/releases/tag/v1.0.0"}]},{"category":"Article","title":"Sapper: Towards the ideal web app framework","url":"https://svelte.technology/blog/sapper-towards-the-ideal-web-app-framework","tags":["JavaScript","server","library","article"],"content":"SvelteベースのNext.js的なフレームワークであるSapperについて。\nそれぞれのページがSvelteのコンポーネントとなる。\n元々フレームワークからではなくコンパイラとして始まったSvelteと他のフレームワークとの違いについて","relatedLinks":[{"title":"Sapper • Military-grade progressive web apps, powered by Svelte","url":"https://sapper.svelte.technology/"}]},{"category":"Article","title":"The State of JavaScript Frameworks, 2017 | Part 1: Front-End Frameworks","url":"https://www.npmjs.com/npm/state-of-javascript-frameworks-2017-part-1","tags":["npm","JavaScript","article"],"content":"npmのダウンロード数から見るJavaScriptのエコシステムについての連載記事。\nフロントエンドとバックエンドのフレームワーク、Reactに関するエコシステムについて","relatedLinks":[]},{"category":"SlideVideo","title":"Chrome DevTools 101: Debugging JavaScript - YouTube","url":"https://www.youtube.com/watch?v=H0XScE08hy8","tags":["Chrome","debug","video"],"content":"Chrome開発者ツールでのデバッガーの使い方についての動画。\nブレークポイントの種類や貼り方、ステップ実行などについて","relatedLinks":[{"title":"Pause Your Code With Breakpoints  |  Tools for Web Developers  |  Google Developers","url":"https://developers.google.com/web/tools/chrome-devtools/javascript/breakpoints"}]},{"category":"WebsiteDocument","title":"Roadmap of Web Applications on Mobile","url":"https://www.w3.org/2018/01/web-roadmaps/mobile/","tags":["W3C","spec","document"],"content":"W3Cのモバイルのウェブアプリに関する仕様のロードマップ。\nそれぞれの仕様のジャンルごとのまとめ、ステータス、実装状況について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Lighthouse 2.7 Updates  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/01/lighthouse","tags":["Chrome","performance","Tools"],"content":"Lighthouse 2.7リリース。\nSEO auditの追加、手動のアクセシビリティチェックリストの追加、WebP auditの更新など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mweststrate/immer: Create the next immutable state by mutating the current one","url":"https://github.com/mweststrate/immer","tags":["JavaScript","library"],"content":"MutableなAPIでImmutableにオブジェクトや配列を変更できるライブラリ。","relatedLinks":[]}]},{"meta":{"title":"JSer.infoを開始してから7年が経ちました","author":"azu","layout":"post","date":"2018-01-15T00:00:00.000Z","category":"Article","tags":["JSer"],"url":"https://jser.info/2018/01/15/jser-info-7years/"},"items":[]},{"meta":{"title":"2018-01-16のJS: Prettier 1.10、Secure Contexts、TDD in Framework","author":"azu","layout":"post","date":"2018-01-16T01:50:34.773Z","category":"JSer","tags":["prettier","https","TDD"],"url":"https://jser.info/2018/01/16/prettier-1.10-secure-contexts-tdd-in-framework/"},"items":[{"category":"Headline","title":"Release 2.5.0 · qunitjs/qunit","url":"https://github.com/qunitjs/qunit/releases/tag/2.5.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"QUnit 2.5.0リリース。\n`assert.rejects`の追加、`QUnit.onUnhandledRejection`の追加など","relatedLinks":[]},{"category":"Headline","title":"Node v9.4.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v9.4.0/","tags":["node.js","ReleaseNote"],"content":"Node v9.4.0リリース。\nnpm 5.6.0へアップデート、zlibモジュールで`ArrayBuffer`をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 47 | WebKit","url":"https://webkit.org/blog/8060/release-notes-for-safari-technology-preview-47/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 47リリース。\nStorage Access APIの実験的サポート、Service Workerの改善、Web InspectorのCanvasタブをデフォルトで有効化など","relatedLinks":[{"title":"Proposal: Storage Access API · Issue #3338 · whatwg/html","url":"https://github.com/whatwg/html/issues/3338"}]},{"category":"Headline","title":"Prettier 1.10: One Year of Prettier 🎂 · Prettier","url":"https://prettier.io/blog/2018/01/10/1.10.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 1.10リリース。\nVue Single File Componentsのサポート、Prettier Plugin APIの追加。\nPython、PHP、Swiftをプラグインでサポート。","relatedLinks":[]},{"category":"Headline","title":"Announcing Storybook 3.3 – Storybook – Medium","url":"https://medium.com/storybookjs/announcing-storybook-3-3-9972c4bc87ac","tags":["JavaScript","testing","Tools","ReleaseNote"],"content":"Storybook 3.3リリース。\nAngularプロジェクトをサポート、viewportのシミュレート、storyshotsでのテスト改善など","relatedLinks":[]},{"category":"Headline","title":"Release v0.63.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.63.0","tags":["flowtype","ReleaseNote"],"content":"Flow 0.63.0リリース。\nStrict modeでは関数の引数を`const`として扱うように","relatedLinks":[]},{"category":"Headline","title":"Secure Contexts Everywhere | Mozilla Security Blog","url":"https://blog.mozilla.org/security/2018/01/15/secure-contexts-everywhere/","tags":["firefox","security","news","WebPlatformAPI"],"content":"Firefoxは今後に新しい機能(JavaScript、CSS、HTTP、フォーマットなど)に利用する際にはSecure Contexts(HTTPS)を必須にする方針について。\n新しいCSS color keywordのような既存部分の変更については例外とする場合があることについてなど","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0 · epoberezkin/ajv","url":"https://github.com/epoberezkin/ajv/releases/tag/v6.0.0","tags":["JSON","JavaScript","library","ReleaseNote"],"content":"JSON Schema Validatorのajv 6.0.0リリース。\nJSON Schema Draft-07をサポート","relatedLinks":[{"title":"JSON Schema Draft-07 Release Notes","url":"http://json-schema.org/draft-07/json-schema-release-notes.html"}]},{"category":"Article","title":"But really, what is a JavaScript test? – kentcdodds","url":"https://blog.kentcdodds.com/but-really-what-is-a-javascript-test-46fe5f3fad77","tags":["JavaScript","testing","article"],"content":"JavaScriptにおけるテストとはどうやって動くものかについて。\nifとthrowを使ったものから`assert`を使ったもの、テストフレームワークを使った構造化など順を追って見ていく話","relatedLinks":[]},{"category":"Article","title":"Introducing Immer: Immutability the easy way – Michel Weststrate – Medium","url":"https://medium.com/@mweststrate/introducing-immer-immutability-the-easy-way-9d73d8f71cb3","tags":["JavaScript","library","article"],"content":"Immutableにオブジェクトを更新する`immer`について。\nProxyなどを使い実際に変更された場合にのみ、オブジェクト自身を更新する仕組みをもち、また開発中は自動で`Object.freeze`を適応する\nReduxのReducerのようなパターンをMutableなAPIで書ける。","relatedLinks":[{"title":"Simplify Creating Immutable Data Trees With Immer from @mweststrate on @eggheadio","url":"https://egghead.io/lessons/redux-simplify-creating-immutable-data-trees-with-immer"}]},{"category":"Article","title":"HTTP/2 の内幕","url":"http://www.ibm.com/developerworks/jp/web/library/wa-http2-under-the-hood/index.html","tags":["HTTP2","article"],"content":"HTTP/2の歴史や特徴などの概要を簡単にまとめた記事","relatedLinks":[]},{"category":"Article","title":"低帯域幅と高レイテンシの理解  |  Web  |  Google Developers","url":"https://developers.google.com/web/fundamentals/performance/poor-connectivity/?hl=ja","tags":["Chrome","debug","browser","article"],"content":"ネットワークの帯域やレイテンシのシミュレートするツールやlie-fiと呼ばれる問題のあるネットワークの問題について。\nService Workerを使ったネットワークタイムアウトについて","relatedLinks":[]},{"category":"Article","title":"Learn TDD in React","url":"http://learntdd.in/react/","tags":["React","testing","E2E","article"],"content":"Cypressを使ったE2Eテストを書いてからコンポーネントの実装を行う方法についてのチュートリアル。\n`data-test`属性を使ってのテストコンポーネントの指定、機能の実装などについて","relatedLinks":[{"title":"Learn TDD in Vue","url":"http://learntdd.in/vue/"}]},{"category":"Article","title":"What’s new in Vue Devtools 4.0 – The Vue Point – Medium","url":"https://medium.com/the-vue-point/whats-new-in-vue-devtools-4-0-9361e75e05d0","tags":["Vue","debug","Tools","article"],"content":"Vue DevTools 4.0の変更点について。\nコンポーネントのデータ編集、アイテムの追加や削除、Quick Edit、エディタで開く、イベントフィルターの改善など","relatedLinks":[]},{"category":"WebsiteDocument","title":"How to Read the ECMAScript Specification","url":"https://timothygu.me/es-howto/","tags":["ECMAScript","spec","document"],"content":"ECMAScriptの仕様書の読み方についてのドキュメント","relatedLinks":[]},{"category":"WebsiteDocument","title":"2017 JavaScript Rising Stars","url":"https://risingstars.js.org/2017/en/","tags":["JavaScript","library","Tools","まとめ"],"content":"2017年のJavaScript関連におけるStarの増加率でのランキングまとめ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"React Studio","url":"https://reactstudio.com/","tags":["React","GUI","software","mac "],"content":"Reactを使ったサイトを作るGUIエディタ。ページ間の遷移なども扱える。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"russellgoldenberg/scrollama: Scrollytelling with IntersectionObserver.","url":"https://github.com/russellgoldenberg/scrollama","tags":["JavaScript","library"],"content":"IntersectionObserverを使ったスクロールでのクラスの付け外しなどを行えるライブラリ。\nスクロールでデザインが変わるパターンの実装補助ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"NervJS/nerv: A blazing fast React alternative, compatible with IE8 and React 16.","url":"https://github.com/NervJS/nerv","tags":["JavaScript","React","library"],"content":"ReactライクなAPIをもつライブラリ。ファイルサイズや小さくしつつReactとの互換性をもつことを目的にしている。また、IE8をサポートしていて、devToolsやReduxとの連携するパッケージも用意されている。","relatedLinks":[{"title":"What","url":"https://github.com/NervJS/nerv/issues/10#issuecomment-356913486"}]},{"category":"SoftwareLibrary","title":"zouhir/jarvis: A very intelligent browser based Webpack dashboard","url":"https://github.com/zouhir/jarvis","tags":["webpack","Tools","plugin"],"content":"webpackのダッシュボードプラグイン。","relatedLinks":[]},{"category":"Book","title":"React本格入門 導入からテストまで高速で描写するための開発手法（穴井宏幸 柴田和祈 石井直矢 三宮肇）｜翔泳社の本","url":"http://www.shoeisha.co.jp/book/detail/9784798153353","tags":["JavaScript","React","book"],"content":"2018年02月19日発売\nReactに関する書籍。","relatedLinks":[]}]},{"meta":{"title":"2018-01-23のJS: 2018-01-23のJS: Bootstrap 4、create-react-app 1.1.0と2.0、kuker","author":"azu","layout":"post","date":"2018-01-23T03:05:24.055Z","category":"JSer","tags":["CSS","React","debug","browser"],"url":"https://jser.info/2018/01/23/2018-01-23js-bootstrap-4-create-react-app-1.1.02.0-kuker/"},"items":[{"category":"Headline","title":"Release v1.0.0 · GoogleChrome/puppeteer","url":"https://github.com/GoogleChrome/puppeteer/releases/tag/v1.0.0","tags":["Chrome","library","ReleaseNote"],"content":"Puppeteer 1.0.0リリース。\nコードカバレッジAPIのサポート、PDFのカスタマイズ、XPathのサポートなど","relatedLinks":[{"title":"Puppeteer  |  Tools for Web Developers  |  Google Developers","url":"https://developers.google.com/web/tools/puppeteer/"}]},{"category":"Headline","title":"Announcing TypeScript 2.7 RC | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2018/01/17/announcing-typescript-2-7-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.7RCリリース\n\nクラスプロパティへの代入忘れをチェックする`--strictPropertyInitialization`の追加、Tupleの扱いの変更、`in`と`instanceof`の改善など","relatedLinks":[]},{"category":"Headline","title":"Bootstrap 4 · Bootstrap","url":"https://blog.getbootstrap.com/2018/01/18/bootstrap-4/","tags":["CSS","library","ReleaseNote"],"content":"Bootstrap 4リリース。\n4.0ではLessからSassへ、Flexboxの利用、Cardsへの移行、IE 8、9などのサポート終了など。\nβ3からの変更として、printのスタイルの更新サンプル、ドキュメントの追加など","relatedLinks":[{"title":"Bootstrap 4 Beta · Bootstrap","url":"https://blog.getbootstrap.com/2017/08/10/bootstrap-4-beta/"},{"title":"Migrating to v4 · Bootstrap","url":"https://getbootstrap.com/docs/4.0/migration/"}]},{"category":"Headline","title":"Release v5.0.0 · mochajs/mocha","url":"https://github.com/mochajs/mocha/releases/tag/v5.0.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Mocha 5.0.0リリース。\nIE 9、10のサポート終了、テストファイルを追加指定する`--file`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Polymer 3.0: New Year, New Preview - Polymer Project","url":"https://www.polymer-project.org/blog/2018-01-18-polymer-3-new-preview","tags":["WebComponents","JavaScript","library","ReleaseNote"],"content":"Polymer 3.0-pre.4リリース。\n`PropertiesMixin`の追加、`html`タグ関数の改善。\nStableリリースは2018年Q1末を予定","relatedLinks":[]},{"category":"Headline","title":"jQuery 3.3.0 – A fragrant bouquet of deprecations and…is that a new feature? | Official jQuery Blog","url":"http://blog.jquery.com/2018/01/19/jquery-3-3-0-a-fragrant-bouquet-of-deprecations-and-is-that-a-new-feature/","tags":["jQuery","ReleaseNote"],"content":"jQuery 3.3.0リリース。\n`.addClass()`、`.removeClass()`、`.toggleClass()`が配列を受け取れるように。\n`jQuery.now`や`jQuery.isFunction`などが非推奨になるなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.1.0 · facebookincubator/create-react-app","url":"https://github.com/facebookincubator/create-react-app/releases/tag/v1.1.0","tags":["React","Tools","ReleaseNote"],"content":"create-react-app 1.1.0リリース。\n`--use-npm`の追加、`--scripts-version`で`.tar.gz`や`file:`のサポートなど。\n2.0のα版もリリースされ、2.0に含める機能についてはIssueで議論している。","relatedLinks":[{"title":"Roadmap for react-scripts@2.0 · Issue #3815 · facebookincubator/create-react-app","url":"https://github.com/facebookincubator/create-react-app/issues/3815"}]},{"category":"Article","title":"Understanding SVG Coordinate Systems and Transformations (Part 1) — The viewport, viewBox, and preserveAspectRatio","url":"https://www.sarasoueidan.com/blog/svg-coordinate-systems/","tags":["SVG","article"],"content":"SVGのviewport、viewBox、preserveAspectRatioについての詳しい解説","relatedLinks":[]},{"category":"Article","title":"Oxidizing Source Maps with Rust and WebAssembly – Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2018/01/oxidizing-source-maps-with-rust-and-webassembly/","tags":["sourcemap","WebAssembly","article","JavaScript","library","Rust"],"content":"Source Mapパーサ、ジェネレーターをRust + WebAssemblyに書き換えた話。\nRustで書いてwasmに変換して使うことで、JavaScriptの実装に比べて処理時間や処理の安定性が向上したという話","relatedLinks":[{"title":"Use WebAssembly to speed up SourceMapConsumer by fitzgen · Pull Request #306 · mozilla/source-map","url":"https://github.com/mozilla/source-map/pull/306"}]},{"category":"Article","title":"What's New In DevTools (Chrome 65)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/01/devtools","tags":["Chrome","article","debug"],"content":"Chrome 65での開発者ツールの変更点について。\nLocal Overrides、アクセシビリティツール、カラーピッカーにコンストラスト情報の表示、ステップ実行でWorkerやsetTimeoutなどの非同期処理のサポート。\nパフォーマンスパネルで複数の記録を保存できるようになるなど","relatedLinks":[]},{"category":"Article","title":"Debugging your front-end like it's 2019","url":"http://krasimirtsonev.com/blog/article/debugging-your-front-end-like-is-2019","tags":["JavaScript","debug","Flux","redux","Angular","Chrome","Extension"],"content":"kukerという開発者ツールについて。\nredux-devtoolsのようにブラウザに拡張をインストールし、ReduxやReact、Angularなどライブラリのログを見ることができる。\nログを投げる側は`postMessage`を送ることで記録できる。","relatedLinks":[{"title":"krasimir/kuker: Kick-ass browser extension to debug your apps","url":"https://github.com/krasimir/kuker"}]},{"category":"SlideVideo","title":"CSS Grid — Learn all about CSS Grid with Wes Bos in this free video series!","url":"https://cssgrid.io/","tags":["CSS","video"],"content":"CSS Grid講座","relatedLinks":[]},{"category":"WebsiteDocument","title":"Render Props - React","url":"https://reactjs.org/docs/render-props.html","tags":["React","document"],"content":"ReactのRender Propsのパターンについてのドキュメント","relatedLinks":[]},{"category":"WebsiteDocument","title":"Introduction · A Roadmap for Node.js Security","url":"https://nodesecroadmap.fyi/","tags":["node.js","security","document"],"content":"Node.jsのセキュリティに関するドキュメント。Node.jsにおいてセキュリティ的な問題が起きる項目について。\nまたDynamic requireなどコード別の問題などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"krasimir/kuker: Kick-ass browser extension to debug your apps","url":"https://github.com/krasimir/kuker","tags":["JavaScript","debug","Tools","Chrome","Extension"],"content":"クライアントから`postMessage`で投げたログとStateを表示できるビューアのブラウザ拡張。\nReact、Redux、Angular、Vue、HTMLなどに対応したデバッグツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"skerit/json-dry: JSON-dry allows you to serialize & revive objects containing circular references, dates, regexes, class instances,...","url":"https://github.com/skerit/json-dry","tags":["JavaScript","JSON","library"],"content":"正規表現や循環参照に対応したJSONシリアライズ/デシリアライズライブラリ。\nオブジェクトのクローンも行える。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"boltpkg/bolt: ⚡️ Super-powered JavaScript project management","url":"https://github.com/boltpkg/bolt","tags":["JavaScript","Tools"],"content":"lerna/yarn workspaceのようなmonorepo管理ツール。\nbuildやtestなどにデフォルト設定があり、monorepoの環境構築を簡単にできるようにすることが目的","relatedLinks":[]},{"category":"Book","title":"Functional-Light… by Kyle Simpson \\[Leanpub PDF/iPad/Kindle\\]","url":"https://leanpub.com/fljs","tags":["JavaScript","関数型プログラミング","book"],"content":"Functional programming (FP)のアプローチをJavaScriptに適応してFPについて学ぶ書籍","relatedLinks":[]},{"category":"Book","title":"Simplifying JavaScript: Writing Modern JavaScript with ES5, ES6, and Beyond by Joe Morgan | The Pragmatic Bookshelf","url":"https://pragprog.com/book/es6tips/simplifying-javascript","tags":["JavaScript","ECMAScript","book"],"content":"2018年5月10日発売\nES2015以降の新しい構文を学び、読みやすく拡張し易いコードを書く方法についてを学ぶ書籍。","relatedLinks":[]},{"category":"Book","title":"Testing Vue.js Applications: Edd Yerburgh: 9781617295249: Amazon.com: Books","url":"https://www.amazon.com/Testing-Vue-Js-Applications/dp/1617295248","tags":["JavaScript","Vue","testing","book"],"content":"2017年7月30日発売\nVueアプリケーションのテストについての書籍","relatedLinks":[]}]},{"meta":{"title":"2018-01-29のJS: Firefox 58、Safari 11.1(β)、Parcel 1.5.0、webpack 4(β)、ES 2018の機能が決定","author":"azu","layout":"post","date":"2018-01-29T21:51:02.933Z","category":"JSer","tags":["firefox","Safari","Bundler","webpack","parcel"],"url":"https://jser.info/2018/01/30/firefox-58-safari-11.1b-parcel-1.5.0-webpack-4b-es-2018/"},"items":[{"category":"Headline","title":"jsdom/Changelog.md at 11.6.0 · tmpvar/jsdom","url":"https://github.com/tmpvar/jsdom/blob/11.6.0/Changelog.md","tags":["JavaScript","DOM","ReleaseNote"],"content":"jsdom 11.6.0リリース。\n`WebSocket`の実装、`performance`の実装、`window.devicePixelRatio`の追加など","relatedLinks":[]},{"category":"Headline","title":"Firefox — Notes (58.0) — Mozilla","url":"https://www.mozilla.org/en-US/firefox/58.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 58リリース。\nバッググラウンドタブにおけるスロットリングの強化、WebAssembly Streaming Compilerの導入。\nCSS Font Displayのサポート、`Promise#finally`の追加、`PerformanceNavigationTiming` APIの実装など","relatedLinks":[{"title":"Firefox 58: The Quantum Era Continues – Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2018/01/firefox-58-the-quantum-era-continues/"},{"title":"Firefox 58 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/58"},{"title":"Firefox 58 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/versions/58/"}]},{"category":"Headline","title":"📦 Parcel v1.5.0 released: Source Maps, WebAssembly, Rust, and more! 🚀","url":"https://medium.com/@devongovett/parcel-v1-5-0-released-source-maps-webassembly-rust-and-more-3a6385e43b95","tags":["JavaScript","bundler","Tools","ReleaseNote"],"content":"Parcel v1.5.0リリース。\nSource Mapのサポート、WebAssemblyのサポート、`.env`ファイルに対応。\nまた、コンフィグファイルが追加されたときにキャッシュを削除するようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0-beta.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v4.0.0-beta.0","tags":["webpack","ReleaseNote"],"content":"webpack 4.0.0βリリース。\nNode.js 4のサポート終了、`mode`が必須のオプションに、`import()`は常に名前空間オブジェクトを返すように。\nまた、`CommonsChunkPlugin`などの一部プラグインを削除し代わりに`optimization`のオプションで設定できるように変更など","relatedLinks":[{"title":"RIP CommonsChunkPlugin.md","url":"https://gist.github.com/sokra/1522d586b8e5c0f5072d7565c2bee693"},{"title":"🚀webpack 4 beta — try it today!🚀 – webpack – Medium","url":"https://medium.com/webpack/webpack-4-beta-try-it-today-6b1d27d7d7e2"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 48 | WebKit","url":"https://webkit.org/blog/8084/release-notes-for-safari-technology-preview-48/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 48リリース。\nStorage Access APIをデフォルトで有効化、Service Workerの対応改善、`createImageBitmap(ImageBitmap)`の実装など","relatedLinks":[]},{"category":"Headline","title":"Safari 11.1","url":"https://developer.apple.com/library/content/releasenotes/General/WhatsNewInSafari/Articles/Safari_11_1.html","tags":["safari","ReleaseNote"],"content":"現在β公開中のSafari 11.1の変更点について。\nService Worker、Payment Request、`HTMLImageElement.decode()`、Beacon APIのサポート。\nSubresource Integrity、Storage Access API、Intelligent Tracking Preventionの挙動の変更など","relatedLinks":[]},{"category":"Headline","title":"Stable AngularJS and Long Term Support – Angular Blog","url":"https://blog.angular.io/stable-angularjs-and-long-term-support-7e077635ee9c","tags":["Angular","news"],"content":"AngularJS(1.x)のLTSスケジュールについて。\n現在開発中のAngularJS 1.7は2018年7月にリリースされ、そこから3年間メンテされるLTSとなる。\n1.7.x以降はAngularJSに新しい機能などは追加しない予定。","relatedLinks":[]},{"category":"Article","title":"Improvements to the DevTools Console in the Windows 10 Fall Creators Update - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2018/01/17/devtools-console-improvements-edgehtml-16/","tags":["MSEdge","debug","article"],"content":"EdgeHTML16の開発者ツールの改善について","relatedLinks":[]},{"category":"Article","title":"🚀webpack 4 beta — try it today!🚀 – webpack – Medium","url":"https://medium.com/webpack/webpack-4-beta-try-it-today-6b1d27d7d7e2","tags":["webpack","article"],"content":"webpack 4βについての解説記事。\nパフォーマンス、設定、ファイルサイズ、ファイルタイプのサポート、最適化オプションなどについて","relatedLinks":[]},{"category":"Article","title":"ECMAScript proposal updates at 2018-01 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2018/01/28/ecmascript-proposal-updates","tags":["ECMAScript","JavaScript","proposal"],"content":"2018年1月のTC39のミーティング結果を反映したECMAScript Proposalのステータスまとめ。","relatedLinks":[]},{"category":"Article","title":"New in Chrome 64  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/01/nic64","tags":["Chrome","ReleaseNote"],"content":"Chrome 64の変更点について\n`ResizeObservers`、RegExpのNamed Capture、`import.meta`のサポート。`<video>`や`<audio>`の`preload`属性のデフォルト値が`metadata`へと変更など","relatedLinks":[{"title":"New in Chrome 64: ResizeObservers, Named Captures, import.meta and more! - YouTube","url":"https://www.youtube.com/watch?v=y5sb-icqOyg"}]},{"category":"Article","title":"Top 10 JavaScript errors from 1000+ projects (and how to avoid them)","url":"https://rollbar.com/blog/top-10-javascript-errors/","tags":["JavaScript","debug","article"],"content":"エラー収集サービスのRollbarにおいて報告されたJavaScriptのエラーランキング。\nどのようなエラーメッセージか、またどのような状況で発生するかなどを解説している。","relatedLinks":[{"title":"JavaScript エラーリファレンス - JavaScript | MDN","url":"https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Errors"}]},{"category":"Article","title":"ECMAScript 2018: the final feature set","url":"http://2ality.com/2017/02/ecmascript-2018.html","tags":["ECMAScript","proposal","spec"],"content":"2018年1月でECMAScript 2018に入るProposalが決まったため、そのProposalをまとめた記事","relatedLinks":[]},{"category":"WebsiteDocument","title":"JavaScript Object Explorer","url":"https://sdras.github.io/object-explorer/","tags":["JavaScript","tutorial","Tools"],"content":"JavaScriptのオブジェクトに関する操作方法(作成、削除、更新など)を対話的に選択してコードを出してくれるサイト。\n配列版もあり、翻訳も募集している。","relatedLinks":[{"title":"JavaScript Array Explorer","url":"https://sdras.github.io/array-explorer/"},{"title":"Translations needed! · Issue #1 · sdras/object-explorer","url":"https://github.com/sdras/object-explorer/issues/1"}]},{"category":"SoftwareLibrary","title":"0x00A/scratches: A scratchpad. Read, Evaluate, Print, Loop, but with a nicer editor.","url":"https://github.com/0x00A/scratches","tags":["JavaScript","Electron","software","mac "],"content":"Electron製のJavaScriptスクラッチパッド。\nJavaScriptのコードを実行して評価結果を並べて表示するアプリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"fastpack/fastpack: Pack JS code fast & easy","url":"https://github.com/fastpack/fastpack","tags":["JavaScript","Tools","flowtype"],"content":"OCaml製のJavaScript Bundlerツール。\nFlowをパーサとして使い、コードのbundleを行う。postprocessとして他のツールを呼びだすことができる。\n高速なインクリメンタルビルドを行うことが目的。","relatedLinks":[]},{"category":"Book","title":"Webサイトパフォーマンス実践入門 高速なWebページを作りたいあなたに（JeremyL.Wagner 武舎広幸 阿部和也 上西昌弘）｜翔泳社の本","url":"http://www.shoeisha.co.jp/book/detail/9784798155098","tags":["JavaScript","web ","performance","翻訳","book"],"content":"2018年03月19日発売。\nWeb Performance in Actionの翻訳本","relatedLinks":[]}]},{"meta":{"title":"2018-02-05のJS: AVA 1.0.0β、TypeScript 2.7、MDNのブラウザ互換性情報","author":"azu","layout":"post","date":"2018-02-05T11:07:52.801Z","category":"JSer","tags":["ava","TypeScript","mdn","npm"],"url":"https://jser.info/2018/02/05/ava-1.0.0b-typescript-2.7-mdn/"},"items":[{"category":"Headline","title":"Node v9.5.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v9.5.0/","tags":["node.js","ReleaseNote"],"content":"Node v9.5.0リリース。\n`performance.clearEntries(name)`のサポート、`cluster.settings`に`cwd`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 2.7 | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2018/01/31/announcing-typescript-2-7/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.7リリース。\nクラスプロパティのStrictオプションの追加、Definite assignment assertions(`!`)の追加、`--esModuleInterop`を追加しdefault exportするcommonjsとのinteropの改善。\nTuple、`in`、`instanceof`、オブジェクトリテラルの型改善など","relatedLinks":[{"title":"TypeScript 2.7.1 変更点 - Qiita","url":"https://qiita.com/vvakame/items/3a1e628e53a5dd99dfe0"}]},{"category":"Headline","title":"Release 1.0.0-beta.1 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v1.0.0-beta.1","tags":["JavaScript","testing","library"],"content":"AVA 1.0.0β1リリース。\nBabel 7βを利用するように、`test`がテストタイトルを必須に、`powerAssert`の無効オプションは、`babel`と`compileEnhancements`オプションで管理されるように変更など","relatedLinks":[{"title":"No transpile option · Issue #1556 · avajs/ava","url":"https://github.com/avajs/ava/issues/1556"}]},{"category":"Headline","title":"V8 JavaScript Engine: V8 release v6.5","url":"https://v8project.blogspot.com/2018/02/v8-release-65.html","tags":["V8","ReleaseNote"],"content":"V8 6.5リリース。\nUnstruted code modeがデフォルトで有効化、WebAssemblyのStreaming compilationのサポート、Arrayメソッドの改善、疎の配列の改善など","relatedLinks":[{"title":"Untrusted code mitigations · v8/v8 Wiki","url":"https://github.com/v8/v8/wiki/Untrusted-code-mitigations"}]},{"category":"Article","title":"Bootstrap 4.0 Release: What’s New?","url":"https://auth0.com/blog/whats-new-in-bootstrap4/","tags":["CSS","library","article"],"content":"BootStrap 4.0の変更点についての解説。","relatedLinks":[]},{"category":"Article","title":"Stimulus 1.0: A modest JavaScript framework for the HTML you already have","url":"https://m.signalvnoise.com/stimulus-1-0-a-modest-javascript-framework-for-the-html-you-already-have-f04307009130","tags":["JavaScript","ruby","library","article"],"content":"Stimulus 1.0リリース。\nRailsのTurbolinksと共存して動作できるJavaScriptフレームワーク。\nHTMLなテンプレートとJavaScriptなコントローラーを組み合わせてアプリケーションを作る。","relatedLinks":[]},{"category":"Article","title":"Automatic visual diffing with Puppeteer – Monica Dinculescu","url":"https://meowni.ca/posts/2017-puppeteer-tests/","tags":["JavaScript","testing","browser","article"],"content":"Puppeteerを使ったVisual Diffテストについて。\nスクリーンショットをPixelmatchで比較し、画像のDiffを元にテストする話","relatedLinks":[]},{"category":"Article","title":"Introducing React Easy State | @RisingStack","url":"https://blog.risingstack.com/introducing-react-easy-state/","tags":["JavaScript","redux","library"],"content":"ES Proxyを使ったステート管理ライブラリについて","relatedLinks":[{"title":"solkimicreb/react-easy-state: Simple React state management. Made with ❤️ and ES6 Proxies.","url":"https://github.com/solkimicreb/react-easy-state"}]},{"category":"Article","title":"Debugging JavaScript With A Real Debugger You Did Not Know You Already Have — Smashing Magazine","url":"https://www.smashingmagazine.com/2018/02/javascript-firefox-debugger/","tags":["firefox","debug","article"],"content":"Firefoxの開発者ツールの紹介と` debugger.html`について。","relatedLinks":[]},{"category":"Article","title":"Jestなどを使わずにスナップショットテストを書く | Web Scratch","url":"http://efcl.info/2018/02/02/snapshot-test/","tags":["JavaScript","testing","article"],"content":"特別なライブラリを使わずにスナップショットテストを実装する方法について。","relatedLinks":[]},{"category":"Article","title":"Testing your npm package before releasing it using Verdaccio + ngrok","url":"https://blog.strapi.io/testing-npm-package-before-releasing-it-using-verdaccio-and-ngrok/","tags":["npm","article","testing"],"content":"npmパッケージをpublishする前にテスト方法について。\nPrivate npm registryであるVerdaccioにpublishして、localhostトンネルであるngrokを使ってテストするという話","relatedLinks":[]},{"category":"Article","title":"Debugging CSS Performance with Chrome’s Profiling Tools - Ada Developers Academy","url":"http://adadevacademy.tumblr.com/post/170121818942/debugging-css-performance-with-chromes-profiling","tags":["CSS","performance","article"],"content":"CSSのパフォーマンス問題について。\nReactの問題かと疑って色々試した結果、CSSのレンダリングの問題であったケースについて。\nインラインCSS、gradientを直すことで改善されたが、開発者ツールではこの問題がどう見えていたかについて","relatedLinks":[]},{"category":"Article","title":"Introducing Node Clinic - A performance toolkit for Node.js developers | nearForm","url":"https://www.nearform.com/blog/introducing-node-clinic-a-performance-toolkit-for-node-js-developers/","tags":["node.js","performance","Tools","article"],"content":"Node.jsアプリのパフォーマンスモニタリングツールであるClinicについて。\nダッシュボードでCPU、メモリ、イベントループの遅延などを見ることができる","relatedLinks":[{"title":"nearform/node-clinic: Clinic diagnoses your Node.js performance issues","url":"https://github.com/nearform/node-clinic"}]},{"category":"Article","title":"How JavaScript works: The building blocks of Web Workers + 5 cases when you should use them","url":"https://blog.sessionstack.com/how-javascript-works-the-building-blocks-of-web-workers-5-cases-when-you-should-use-them-a547c0757f6a","tags":["webworker","article"],"content":"WebWorkerの使い方やユースケースについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"MDN browser compatibility data: Taking the guesswork out of web compatibility – Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2018/02/mdn-browser-compatibility-data/","tags":["mdn","document","npm","JavaScript","CSS","HTTP"],"content":"MDNが利用してるブラウザのサポート状況をまとめたデータがnpmパッケージとして利用できるようになった。\nこのデータの使い方やサイトのサポートブラウザの可視化する拡張などについて","relatedLinks":[{"title":"mdn-browser-compat-data","url":"https://www.npmjs.com/package/mdn-browser-compat-data"},{"title":"Compat Report – Add-ons for Firefox","url":"https://addons.mozilla.org/en-US/firefox/addon/compat-report/"}]},{"category":"SoftwareLibrary","title":"thejameskyle/glow: Make your Flow errors GLOW","url":"https://github.com/thejameskyle/glow","tags":["flowtype","console","Tools"],"content":"FlowのエラーをCodeFrameにして表示、Watchモード、globで対象のフィルターを行えるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"FullHuman/purgecss: Remove unused css","url":"https://github.com/FullHuman/purgecss","tags":["CSS","Tools","console"],"content":"使ってないCSSを削除するツール。\nコンテンツ(HTML、JSなど)とCSSを渡し、不要となったCSSを削除できる。","relatedLinks":[]}]},{"meta":{"title":"2018-02-13のJS: Inferno v4、SafariでのService Worker、Eloquent JavaScript第三版","author":"azu","layout":"post","date":"2018-02-13T02:04:48.927Z","category":"JSer","tags":["React","inferno","Safari","book"],"url":"https://jser.info/2018/02/13/inferno-v4-safariservice-worker-eloquent-javascript/"},"items":[{"category":"Headline","title":"jest/CHANGELOG.md at v22.2.0 · facebook/jest","url":"https://github.com/facebook/jest/blob/v22.2.0/CHANGELOG.md","tags":["JavaScript","testing","ReleaseNote"],"content":"Jest 22.2.0リリース。","relatedLinks":[]},{"category":"Headline","title":"browserify/changelog.markdown at v16.0.0 · browserify/browserify","url":"https://github.com/browserify/browserify/blob/v16.0.0/changelog.markdown","tags":["browserify","ReleaseNote"],"content":"Browserify 16.0.0リリース。\n`--preserve-symlinks`のサポート、`events`のshimを更新、`--node`オプションを渡したときに`__dirname`と`__filename`を動的に設定するようになるなど","relatedLinks":[]},{"category":"Headline","title":"Dev.Opera — What’s new in Chromium 64 and Opera 51","url":"https://dev.opera.com/blog/opera-51/","tags":["Opera","Chrome","ReleaseNote"],"content":"Opera 51 (based on Chromium 64)リリース。\nResize Observer、`import.meta`、ES2018の正規表現の実装、AudioWorkletのフラグ付き実装など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 49 | WebKit","url":"https://webkit.org/blog/8088/release-notes-for-safari-technology-preview-49/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 49リリース。\nService Worker、Fetchのバグ修正、ITPにデバッグモードを試験的に追加、Media Queryで`calc()`をサポート。\n`String#trimStart`、json superset proposalの実装など","relatedLinks":[{"title":"tc39/proposal-json-superset: Proposal to make all JSON text valid ECMA-262","url":"https://github.com/tc39/proposal-json-superset"}]},{"category":"Headline","title":"Chromium Blog: Chrome 65 Beta: CSS Paint API and the ServerTiming API","url":"https://blog.chromium.org/2018/02/chrome-65-beta-css-paint-api-and.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 65 Betaリリース。\nCSS Paint API、Server Timing API、Feature-Policyの`sync-xhr`をサポート、TLS 1.3(draft-23)のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Eloquent JavaScript","url":"https://eloquentjavascript.net/3rd_edition/","tags":["JavaScript","book","news"],"content":"Eloquent JavaScripの第3版が公開された","relatedLinks":[]},{"category":"Headline","title":"CanJS 4.0","url":"https://www.bitovi.com/blog/canjs-4.0","tags":["JavaScript","library","ReleaseNote"],"content":"CanJS 4.0リリース。\nデバッグツールの追加、テンプレートの記法を統一、ProxyとクラスベースのObservableオブジェクトの追加など","relatedLinks":[]},{"category":"Headline","title":"Release Inferno v4 · infernojs/inferno","url":"https://github.com/infernojs/inferno/releases/tag/v4.0.2","tags":["JavaScript","DOM","library","React","ReleaseNote"],"content":"Inferno v4リリース。\n`Inferno.Component`は`inferno`パッケージに移動、`findDOMNode`は`inferno-compat`パッケージに移動。\n`createPortal`のサポート、RouterがReact Router v4と同じAPIに変更、Mobx、Redux連携の更新、IE9+のサポートなど","relatedLinks":[{"title":"inferno/v4-migration.md at master · infernojs/inferno","url":"https://github.com/infernojs/inferno/blob/master/docs/v4-migration.md"}]},{"category":"Headline","title":"Echo JS on Twitter: \"Echo JS, 2011-2018 - https://t.co/vEiEFdntF8\"","url":"https://twitter.com/echojs/status/962996800738258945","tags":["JavaScript","news"],"content":"echojs.com が閉鎖された","relatedLinks":[]},{"category":"Article","title":"なぜプロダクトに Vue.js を採用したのか? 運用してみてどうっだった? という話 | Nagisaのすゝめ","url":"https://blog.nagisa-inc.jp/archives/2980","tags":["JavaScript","Vue","opinion","article"],"content":"Riotで作られていたサイトをVueでリニューアルした話。\nVueの特徴、ルータ、ステート管理、メリット、デメリットについて","relatedLinks":[]},{"category":"Article","title":"Welcoming Progressive Web Apps to Microsoft Edge and Windows 10 - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2018/02/06/welcoming-progressive-web-apps-edge-windows-10/","tags":["MSEdge","MS"],"content":"Microsoft StoreにPWAアプリを登録できるようになる。\nまた、BingでPWAアプリのクロールを行い一定の条件を満たしたものを表示する。","relatedLinks":[{"title":"PWABuilder","url":"https://www.pwabuilder.com/generator"}]},{"category":"Article","title":"PWAs are coming to iOS 11.3: Cupertino, we have a problem","url":"https://medium.com/@firt/pwas-are-coming-to-ios-11-3-cupertino-we-have-a-problem-2ff49fd7d6ea","tags":["safari","ServiceWorker","article"],"content":"Safari 11.1で実装されたService Workerについて。\n数週間使わてないService Workerは自動的に削除される点やWeb App Manifestのサポート、ホームスクリーンアプリとしての動作で注意する点などについて書かれている","relatedLinks":[{"title":"Workers at Your Service | WebKit","url":"https://webkit.org/blog/8090/workers-at-your-service/"}]},{"category":"Article","title":"Introduction  |  Web Fundamentals  |  Google Developers","url":"https://developers.google.com/web/fundamentals/performance/webpack/","tags":["webpack","tutorial"],"content":"webpackを使った場合に置けるコードの最適化についての記事。\nコード分割やキャッシュ、分析や計測などについて","relatedLinks":[]},{"category":"SlideVideo","title":"Hygen","url":"http://www.hygen.io/","tags":["JavaScript","Tools"],"content":"コードジェネレートツール。\nテンプレートからコードを生成できる。\nYAML Frontmatterでメタデータの定義、ejsでテンプレートの記述、特定の依存がある場合に動作するhook処理などを書ける","relatedLinks":[]},{"category":"SlideVideo","title":"Jake Archibald: In The Loop - JSConf.Asia 2018 - YouTube","url":"https://www.youtube.com/watch?v=cCOL7MC4Pl0","tags":["JavaScript","browser","slide","video"],"content":"ブラウザのイベントループについての発表。\n`setTimeout`、`requestAnimationFrame`の違い。\nイベントループとスタイルの変更の反映のタイミングについて。それぞれを可視化しながら解説している。\nまた、PromiseなどのMicroTaskとの処理順について","relatedLinks":[]},{"category":"SlideVideo","title":"JSConf.Asia 2018 - YouTube","url":"http://www.youtube.com/playlist?list=PL37ZVnwpeshFqN5dcZ704lxI3F5iHDYkl","tags":["JavaScript","イベント","video"],"content":"JSConf.Asia 2018の動画が公開された","relatedLinks":[{"title":"JSConf.Asia Singapore 2018","url":"https://2018.jsconf.asia/"}]},{"category":"WebsiteDocument","title":"Web Assembly Studio","url":"https://webassembly.studio/","tags":["WebAssembly","editor","webservice","Tools"],"content":"CなどでWebAssembly向けのコードを書いて、コンパイル実行できるエディタツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"thejameskyle/unstated: State that goes without saying","url":"https://github.com/thejameskyle/unstated","tags":["React","library"],"content":"Reactの新しいContext APIを使ったステート管理ライブラリ","relatedLinks":[]},{"category":"Book","title":"VimeoSmashing Magazine","url":"https://vimeo.com/smashingmagazine","tags":["JavaScript","イベント"],"content":"SmashingConf London 2018の動画が公開された","relatedLinks":[]}]},{"meta":{"title":"2018-02-20のJS: Ember 3.0、Propel MLでの機械学習","author":"azu","layout":"post","date":"2018-02-20T02:48:02.124Z","category":"JSer","tags":["ember","ML"],"url":"https://jser.info/2018/02/20/ember-3.0-propel-ml/"},"items":[{"category":"Headline","title":"Ember.js - Ember 3.0 Released","url":"https://emberjs.com/blog/2018/02/14/ember-3-0-released.html","tags":["Ember","ReleaseNote"],"content":"Ember 3.0リリース。\nEmber Data、Ember CLIもあわせて3.0に更新されています。","relatedLinks":[]},{"category":"Headline","title":"Tell EJ: Echo JS, a status update - Echo JS","url":"http://www.echojs.com/news/25644","tags":["webservice","news"],"content":"echojsが再開された","relatedLinks":[]},{"category":"Headline","title":"normalize.css/CHANGELOG.md at 8.0.0 · necolas/normalize.css","url":"https://github.com/necolas/normalize.css/blob/8.0.0/CHANGELOG.md","tags":["CSS","ReleaseNote"],"content":"normalize.css 8.0.0リリース。\nAndroid 4、Safari 7、IE 9のサポート終了。","relatedLinks":[]},{"category":"Headline","title":"WebAssembly First Public Working Drafts | W3C News","url":"https://www.w3.org/blog/news/archives/6838","tags":["WebAssembly","news"],"content":"WebAssemblyのFirst Public Working Draftsが公開された","relatedLinks":[]},{"category":"Headline","title":"axios/CHANGELOG.md at v0.18.0 · axios/axios","url":"https://github.com/axios/axios/blob/v0.18.0/CHANGELOG.md","tags":["JavaScript","library","ReleaseNote"],"content":"axios 0.18.0リリース。\nNode.jsでUnix Socketのサポート、型定義の修正など","relatedLinks":[{"title":"Umbrella issue for v1.0.0 · Issue #1333 · axios/axios","url":"https://github.com/axios/axios/issues/1333"}]},{"category":"Article","title":"Service Worker スクリプトのインストールと更新処理","url":"http://nhiroki.jp/2018/02/15/service-worker-install-and-update-scripts","tags":["ServiceWorker","article","JavaScript"],"content":"Service Workerスクリプトのインストール、更新確認のロジック、キャッシュについて。\n`updateViaCache`でのキャッシュを利用するかの設定、24時間以上経過した場合は必ずサーバへ更新確認を行うことについてなど","relatedLinks":[]},{"category":"Article","title":"Creating and Publishing Web Components with Stencil","url":"https://www.twilio.com/blog/2018/02/creating-and-publishing-web-components-with-stencil.html","tags":["JavaScript","WebComponents","article"],"content":"stencilを使ったWeb Componentsをnpmに更新するチュートリアル","relatedLinks":[{"title":"Distributing web components built with Stencil - Stencil","url":"https://stenciljs.com/docs/distribution"}]},{"category":"Article","title":"lit-html と ShadyCSS - jmblog.jp","url":"https://jmblog.jp/posts/2018-02-15/lit-html-with-shadycss/","tags":["WebComponents","CSS","article","library"],"content":"lit-htmlのShandyCSSサポートについて。\nlit-html+ShandyCSSでスタイルのカプセル化を行う方法について","relatedLinks":[]},{"category":"Article","title":"“Web Componentsだけ” で新サービスを実装して見えたこと - Qiita","url":"https://qiita.com/aggre/items/9d77085a32764ffe994d","tags":["WebComponents","article","opinion"],"content":"`lit-html`を使ったWeb Componentsでのウェブアプリ開発について。\nCustom Elementをwidgetとして利用することについて。","relatedLinks":[]},{"category":"Article","title":"TypeScriptの型入門 - Qiita","url":"https://qiita.com/uhyo/items/e2fdef2d3236b9bfe74a","tags":["TypeScript","article"],"content":"TyepScriptの型定義についての記事。\n基本的なプリミティブ、オブジェクト、関数などの型の書き方や意味の説明、特殊な型定義などについてを説明している。","relatedLinks":[]},{"category":"Article","title":"ZEIT – Next.js 5: Universal Webpack, CSS Imports, Plugins and Zones","url":"https://zeit.co/blog/next5","tags":["JavaScript","library","React","ReleaseNote"],"content":"Next.js 5.0リリース。\nUniversal Webpack、CSSやpreact、TypeScriptなどをオプトインでサポートするプラグイン機構の導入、ビルドの高速化など","relatedLinks":[]},{"category":"Article","title":"Replacing jQuery With Vue.js: No Build Step Necessary — Smashing Magazine","url":"https://www.smashingmagazine.com/2018/02/jquery-vue-javascript/","tags":["JavaScript","jQuery","Vue","tutorial"],"content":"jQueryで書いたシンプルなフォームをVueに置き換えていくチュートリアル。\njQueryとVueでのやり方をそれぞれ紹介しながら書き換えている。","relatedLinks":[]},{"category":"SlideVideo","title":"Micro-benchmarking is Hard (Inside Frontend 2, 2018 Feb) - Google スライド","url":"https://docs.google.com/presentation/d/1MXlFGqFQFJByv8k6Ege0pt0GwJQqbjoh7GdIYia9UQg/edit#slide=id.p","tags":["JavaScript","benchmark","webkit","slide"],"content":"マイクロベンチマークの難しさについてのスライド","relatedLinks":[]},{"category":"WebsiteDocument","title":"GoogleChromeLabs/webpack-libs-optimizations: Using a library in your webpack project? Here’s how to optimize it","url":"https://github.com/GoogleChromeLabs/webpack-libs-optimizations","tags":["JavaScript","webpack","tutorial"],"content":"webpackを使ったプロジェクトの最適化について。\n不要な依存を削除してファイルサイズの削減する方法や、代替手段やマイグレーション方法について","relatedLinks":[]},{"category":"WebsiteDocument","title":"photonstorm/phaser: Phaser is a fun, free and fast 2D game framework for making HTML5 games for desktop and mobile web browsers, supporting Canvas and WebGL rendering.","url":"https://github.com/photonstorm/phaser","tags":["JavaScript","HTML","game","canvas","WebGL","library","ReleaseNote"],"content":"phaser 3.0.0がリリースされた","relatedLinks":[]},{"category":"WebsiteDocument","title":"webpack-contrib/webpack-stylish: A stylish, optionated reporter for webpack","url":"https://github.com/webpack-contrib/webpack-stylish","tags":["webpack","plugin"],"content":"webpackのビルド結果の出力を`stylish`形式にするプラグイン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Propel ML","url":"http://propelml.org/","tags":["JavaScript","node.js","library","browser"],"content":"numpyライクなGPUバックエンドを提供するライブラリ。\nブラウザとNode.jsどちらでも動作する。\nRyan DahlとBert Belderが開発している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"busterc/nvx: Run commands on multiple node versions as specified from .travis.yml, circle.yml or arguments; uses npx and is ideal for testing.","url":"https://github.com/busterc/nvx","tags":["node.js","console","Tools"],"content":"指定したNode.jsのバージョンを使ってコマンドを実行できるツール。\nnpmに公開されているNode.jsバイナリを`npx`経由で実行する。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"egoist/franxx: A vanilla JavaScript router that works everywhere.","url":"https://github.com/egoist/franxx","tags":["JavaScript","library"],"content":"特定のフレームワークに依存しないルーターライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Blotter.js","url":"https://blotter.js.org/","tags":["JavaScript","library","example"],"content":"テキストにエフェクトを与えるライブラリ","relatedLinks":[]}]},{"meta":{"title":"2018-02-27のJS: webpack 4、プロファイルとパフォーマンス改善、KeyboardEvent.keyCodeの問題","author":"azu","layout":"post","date":"2018-02-27T02:15:36.179Z","category":"JSer","tags":["webpack","performance","keyboard"],"url":"https://jser.info/2018/02/27/webpack-4-keyboardevent.keycode/"},"items":[{"category":"Headline","title":"jest/CHANGELOG.md at v22.4.0 · facebook/jest","url":"https://github.com/facebook/jest/blob/v22.4.0/CHANGELOG.md","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Jest 22.4.0リリース。","relatedLinks":[]},{"category":"Headline","title":"nohoist in Workspaces | Yarn Blog","url":"https://yarnpkg.com/blog/2018/02/15/nohoist/","tags":["yarn"],"content":"yarn workspaceの`nohoist`オプションについての解説","relatedLinks":[]},{"category":"Headline","title":"Release v1.1.0 · GoogleChrome/puppeteer","url":"https://github.com/GoogleChrome/puppeteer/releases/tag/v1.1.0","tags":["Chrome","library","ReleaseNote"],"content":"puppeteer 1.1.0リリース。\nChromium 66.0.3348.0に更新、`BrowserFetcher`、`page.waitForXPath`のサポート。\n`frame`周りのイベントサポートの追加など","relatedLinks":[]},{"category":"Headline","title":"Release electron v2.0.0-beta.1 · electron/electron","url":"https://github.com/electron/electron/releases/tag/v2.0.0-beta.1","tags":["Electron","ReleaseNote"],"content":"Electron v2.0.0-beta.1リリース。\nChrome 61.0.3163.10、Node 8.9.3に更新。\n非推奨のAPIの削除、`window.loadFile`のサポート、Macでin-app purchaseのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node v9.6.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v9.6.0/","tags":["node.js","ReleaseNote"],"content":"Node v9.6.0リリース。\n`asyncResource.emit{Before,After}`が非推奨となり`asyncResource.runInAsyncScope`を代わりに追加。\nDynamic Importのサポート、`vm`モジュールがES Moduleをサポート、","relatedLinks":[]},{"category":"Headline","title":"Release almin@0.16.0 · almin/almin","url":"https://github.com/almin/almin/releases/tag/almin%400.16.0","tags":["almin","ReleaseNote"],"content":"almin 0.16.0リリース。\n`Context`の`dispatcher`がオプショナルな引数に変更、`almin-react-container`のバグ修正など","relatedLinks":[]},{"category":"Headline","title":"🎼webpack 4: released today!!✨ – webpack – Medium","url":"https://medium.com/webpack/webpack-4-released-today-6cdb994702d4","tags":["webpack","ReleaseNote","opinion"],"content":"webpack 4リリース。\nビルドパフォーマンスの改善、`mode`オプションの追加、`CommonsChunkPlugin`の代わりに`optimize`オプションの追加、`.wasm`、`.mjs`のサポートなど。\n新しいプラグインシステムが導入され、plugin/loader周りに破壊的な変更が行われている。","relatedLinks":[{"title":"Release v4.0.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v4.0.0"},{"title":"webpack 4: mode and optimization – webpack – Medium","url":"https://medium.com/webpack/webpack-4-mode-and-optimization-5423a6bc597a"},{"title":"webpack 4: migration guide for plugins/loaders – webpack – Medium","url":"https://medium.com/webpack/webpack-4-migration-guide-for-plugins-loaders-20a79b927202"},{"title":"Webpack 4.0 Release: What","url":"https://auth0.com/blog/webpack-4-release-what-is-new/"}]},{"category":"Headline","title":"Release v5.7.0 · npm/npm","url":"https://github.com/npm/npm/releases/tag/v5.7.0","tags":["npm","ReleaseNote"],"content":"npm 5.7プレリリース。\npackage-lockのgit merge conflictを解決する`npm-merge-driver`の公開、\n常にlock-fileのみを参照する`npm ci`コマンドの追加など。\n5.7.0には`sudo`利用時に問題があるため、5.7.1がリリースされている。","relatedLinks":[{"title":"npm-merge-driver","url":"https://www.npmjs.com/package/npm-merge-driver"}]},{"category":"Article","title":"Using Promise.prototype.finally in Node.js | www.thecodebarbarian.com","url":"http://thecodebarbarian.com/using-promise-finally-in-node-js.html","tags":["Promises","article","JavaScript"],"content":"`Promise#finally`についての記事。\nPromiseの状態遷移や`finally`の動作について。また`finally`のハンドラでエラーが起きた際の動作について","relatedLinks":[]},{"category":"Article","title":"Measuring the Impact of 3rd-Party Tags with WebPageTest - Andy Davies","url":"http://andydavies.me/blog/2018/02/19/using-webpagetest-to-measure-the-impact-of-3rd-party-tags/","tags":["web ","performance","article"],"content":"WebPageTestを使ってサードパーティスクリプトがロードパフォーマンスにどのような影響を与えているかを比較する方法について。\n特定のリクエストをブロックした結果と比較する方法について","relatedLinks":[]},{"category":"Article","title":"KeyboardEvent.keyCodeとは何か - WebStudio","url":"https://d-toybox.com/studio/lib/what_is_keyCode.html","tags":["DOM","JavaScript","キーボード","article"],"content":"`KeyboardEvent.keyCode`の歴史や実装について。 `keyCode`はOSやブラウザ間で問題があり標準化もされていないため、`key`や`code`を代わりに使うべきという話。","relatedLinks":[]},{"category":"Article","title":"Maybe you don't need Rust and WASM to speed up your JS","url":"https://mrale.ph/blog/2018/02/03/maybe-you-dont-need-rust-to-speed-up-your-js.html","tags":["JavaScript","performance","V8","article","opinion"],"content":"プロファイルを取りながらパフォーマンスを改善していく話。 Rust + wasmで書き直されたSource Mapライブラリを例に、JS版でのボトルネックを調べ改善していく話。 アルゴリズムの改善、言語に依存する問題、実装に依存する問題について","relatedLinks":[]},{"category":"SlideVideo","title":"ECMAScriptの使い方","url":"http://azu.github.io/slide/2018/node/ecmascript39.html","tags":["ECMAScript","JavaScript","slide"],"content":"ECMAScriptのバージョンの歴史、なぜES2016以降の策定プロセスを変更したのかについて。\n各ブラウザ実装の比較、仕様やプロポーザルの調べ方や利用方法について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Wedgetail","url":"https://wedgetail.js.org/index.html","tags":["JavaScript","benchmark","library","node.js","performance","testing"],"content":"コードの実行時間が期待値かをテストするライブラリ。 low、hight、averageを指定しコードの実行時間のテストを行える。 またパーセンタイルに対応している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"theia-ide/theia: Theia is a cloud & desktop IDE framework implemented in TypeScript.","url":"https://github.com/theia-ide/theia","tags":["editor","JavaScript","Electron"],"content":"monaco-editorベースのCould IDE、Desktop IDE。","relatedLinks":[{"title":"Microsoft/monaco-editor: A browser based code editor","url":"https://github.com/Microsoft/monaco-editor"}]},{"category":"Book","title":"Exploring ES2018 and ES2019","url":"http://exploringjs.com/es2018-es2019/","tags":["ECMAScript","book"],"content":"Exploring ES2018 and ES2019が公開された","relatedLinks":[]}]},{"meta":{"title":"2018-03-06のJS:  TestCafe v0.19.0、ランタイム情報を使ったTypeScriptの型付け、Web Componentsでの開発","author":"azu","layout":"post","date":"2018-03-06T01:36:45.772Z","category":"JSer","tags":["E2E","TypeScript"],"url":"https://jser.info/2018/03/06/testcafe-v0.19.0-web-components/"},"items":[{"category":"Headline","title":"Prettier 1.11: CSS fixes and new TypeScript feature support · Prettier","url":"https://prettier.io/blog/2018/02/26/1.11.0.html","tags":["JavaScript","ReleaseNote","Tools"],"content":"Prettier 1.11リリース。\nFacebookのコードベースは100% Prettierを通すようになった。\nPostCSSの対応改善、TypeScript 2.7の対応、pluginでオプションのサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Google Developers Blog: Announcing Flutter beta 1: Build beautiful native apps","url":"https://developers.googleblog.com/2018/02/announcing-flutter-beta-1.html","tags":["google","dart","ReleaseNote"],"content":"Dartを使いモバイルアプリを作るフレームワークのFlutter β1がリリースされた。","relatedLinks":[]},{"category":"Headline","title":"Node v9.7.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v9.7.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 9.7.0リリース。\n`util.getSystemErrorName`の追加、`immediate.ref()`と`immediate.unref()`の追加など","relatedLinks":[]},{"category":"Headline","title":"moment/CHANGELOG.md at develop · moment/moment","url":"https://github.com/moment/moment/blob/develop/CHANGELOG.md","tags":["JavaScript","library","ReleaseNote"],"content":"moment 2.21.0リリース。\nバグ修正やロケールの追加など","relatedLinks":[]},{"category":"Headline","title":"jasmine/3.1.0.md at master · jasmine/jasmine","url":"https://github.com/jasmine/jasmine/blob/master/release_notes/3.1.0.md","tags":["ReleaseNote","jasmine"],"content":"jasmine 3.1リリース。 matcherに`truthy`、`falsy`、`empty`、`notEmpty`の追加など","relatedLinks":[]},{"category":"Headline","title":"TestCafe v0.19.0 Released - Rapid Test Development Tool, Screenshots of Page Elements, etc | TestCafe","url":"http://devexpress.github.io/testcafe/blog/testcafe-v0-19-0-released.html","tags":["JavaScript","ReleaseNote","library","testing"],"content":"TestCafe 0.19.0リリース。 ファイル監視し保存されたら再実行できる`testcafe-live`コマンドの追加。 セレクタの結果をフィルターする`filterVisible`と`filterHidden`の追加、テキストマッチした要素を取得する`withExactText `の追加など","relatedLinks":[]},{"category":"Article","title":"Demystifying ES6 Classes And Prototypal Inheritance ― Scotch","url":"https://scotch.io/tutorials/demystifying-es6-classes-and-prototypal-inheritance","tags":["JavaScript","article"],"content":"ES2015の`class`構文についての解説。\nクラスの定義や使い方、継承について","relatedLinks":[]},{"category":"Article","title":"Exploring different GraphQL Clients – ITNEXT","url":"https://itnext.io/exploring-different-graphql-clients-d1bc69de305f","tags":["GraphQL","library","article"],"content":"GraphQLクライアントの紹介記事。\nFetchQL、GraphQL Request、Apollo Fetch、Lokka、Micro GraphQL React、URQL、Apollo Client、Relay Modernについて","relatedLinks":[]},{"category":"Article","title":"Manual Typing is No Fun: Introducing TypeWiz! – Uri Shaked – Medium","url":"https://medium.com/@urish/manual-typing-is-no-fun-introducing-typewiz-58e3e8813f4c","tags":["JavaScript","TypeScript","library","Tools","webpack"],"content":"TypeScriptの型付けを補助するツール。\nwebpackやnode hookを使い変換したコードを実行し、実行時の関数の引数、返り値、変数へ実際に入った値から型を推測する。\nその推測した型をTypeScriptのコードに対して適応することで型付けを補助する。","relatedLinks":[]},{"category":"Article","title":"Announcing Capacitor 1.0.0 Alpha | The Official Ionic Blog","url":"https://blog.ionicframework.com/announcing-capacitor-1-0-0-alpha/","tags":["JavaScript","article"],"content":"Ionicからクロスプラットフォームで動作するアプリ開発フレームワークのCapacitorがα版公開された","relatedLinks":[]},{"category":"Article","title":"Angular v6で導入されるTree-Shakable DIの紹介 - らこらこブログ","url":"http://lacolaco.hatenablog.com/entry/2018/03/01/150847","tags":["Angular","article"],"content":"Angular 6で導入される新しいDependency Injectionの仕組みと目的について。\nbundleする際のdead codeを削除し易い依存関係にしたDIの仕組み","relatedLinks":[]},{"category":"Article","title":"React.js Frequently Faced Problems – Samer Buna – Medium","url":"https://medium.com/@samerbuna/react-js-frequently-faced-problems-45e7060ef884","tags":["React","article"],"content":"初めてReactを使うときのRact/JSXのつまりどころについて","relatedLinks":[]},{"category":"Article","title":"🌏 Hello World! Progressive Web-Blog!!","url":"https://blog.uskay.io/article/001-pwa-blog-loading","tags":["WebComponents","JavaScript","article","PWA"],"content":"Web Componentsを使ったブログの開発とPRPL Patternでのパフォーマンス最適化について。","relatedLinks":[]},{"category":"Article","title":"hyperHTMLやlit-htmlが効率的に再描画を行う仕組み - Qiita","url":"https://qiita.com/rikuba/items/92da6d99e2b0f831cc65","tags":["JavaScript","DOM","library"],"content":"hyperHTMLやlit-htmlのDOM更新の仕組みについて。\nタグ付きテンプレート関数を使い、初回時に更新時はどの位置の要素を更新するかをマッピング、更新時はマッピングを元に要素/値の更新だけを行う。\nまたテンプレートのキャッシュを利用し無駄なパースを避けるなどの工夫について。","relatedLinks":[]},{"category":"Article","title":"Loading Third-Party JavaScript  |  Web Fundamentals  |  Google Developers","url":"https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/loading-third-party-javascript/","tags":["JavaScript","performance","article"],"content":"サードパーティスクリプトのパフォーマンスへの影響について。\n開発者ツールを使っての可視化、開発者ツールやWebPageTestでリクエストをブロックしての影響度の確認方法、Long Taskの確認方法、Resource Hintなどを使った改善方法について","relatedLinks":[]},{"category":"Article","title":"The npm Blog — Introducing \\`npm ci\\` for faster, more reliable...","url":"http://blog.npmjs.org/post/171556855892/introducing-npm-ci-for-faster-more-reliable","tags":["npm","article"],"content":"`pacakge-lock.json`から常にクリーンインストールする`npm ci`について。\n現在の存在する`node_modules`ディレクトリを削除し、`pacakge-lock.json`を元にインストールするCI環境向けのインストールコマンド。","relatedLinks":[{"title":"zkat/node-package-manager-benchmark at zkat/cipm","url":"https://github.com/zkat/node-package-manager-benchmark/tree/zkat/cipm"}]},{"category":"Article","title":"What's New In DevTools (Chrome 66)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/02/devtools","tags":["Chrome","article"],"content":"Chrome 66の開発者ツールの変更点について。\nネットワークパネルからブラックボックススクリプト化を選択できるように、CSSファイルの変更のみだったLocal OverridesがHTML内のCSSにも対応など","relatedLinks":[]},{"category":"Article","title":"webpack4への簡単なマイグレーションガイド - 技術探し","url":"http://abouthiroppy.hatenablog.jp/entry/migrate-to-webpack4","tags":["webpack","JavaScript","article"],"content":"webpack 4の変更点とマイグレーションのために必要な変更について。","relatedLinks":[]},{"category":"SlideVideo","title":"Web Components で 社内 UI ライブラリを作っている話","url":"https://speakerdeck.com/jmblog/web-components-de-she-nei-ui-raiburariwozuo-tuteiruhua-1","tags":["slide","WebComponents"],"content":"プリミティブなコンポーネントをWebComponentとして作成することに関するスライド。\nReactやAngularなど各種ライブラリから利用できる共通コンポーネントとして作成。\n`lit-html`を使ったコンポーネントとスタイル、コンポーネントの配布の問題についてなど","relatedLinks":[{"title":"Custom Elements Everywhere","url":"https://custom-elements-everywhere.com/"},{"title":"lit-html と ShadyCSS - jmblog.jp","url":"https://jmblog.jp/posts/2018-02-15/lit-html-with-shadycss/"}]},{"category":"WebsiteDocument","title":"Bit - The fastest way to share code","url":"https://bitsrc.io/","tags":["JavaScript","webservice"],"content":"JavaScriptのコード/コンポーネントシェアサービス。\nコンポーネントを管理/公開するCLIが用意されている。\nコンポーネントの公開/管理/発見の難しさの問題の解決を意図したサービス。","relatedLinks":[{"title":"How To “Publish” Multiple Packages From Any Repository In 5 Minutes","url":"https://blog.bitsrc.io/how-to-publish-multiple-packages-from-any-repository-in-5-minutes-9aafd31d85b7"}]},{"category":"SoftwareLibrary","title":"fabiandev/ts-runtime: Runtime Type Checks for TypeScript","url":"https://github.com/fabiandev/ts-runtime","tags":["TypeScript","library","JavaScript"],"content":"TypeScriptのコードをランタイムチェックできるように変換するツール","relatedLinks":[]}]},{"meta":{"title":"2018-03-13のJS: MobX 4.0.0、PreactとGlimmerのパフォーマンス比較実験","author":"azu","layout":"post","date":"2018-03-13T01:26:18.731Z","category":"JSer","tags":["MobX","Preact","glimmer"],"url":"https://jser.info/2018/03/13/preactglimmer/"},"items":[{"category":"Headline","title":"DoneJS 2.0 Released","url":"https://www.bitovi.com/blog/donejs-2.0","tags":["JavaScript","library","Tools","ReleaseNote"],"content":"DoneJS 2.0リリース。\nCanJS 4.0に対応、CIやデプロイの設定を`donejs add`で行えるように、`donejs upgrade`でマイグレーションができるようになっている。\nHTTP/2 pushを使ったインクリメンタルレンダリングの対応改善など","relatedLinks":[{"title":"Create Streamable, High-Performance Web Applications","url":"https://www.bitovi.com/streamable"}]},{"category":"Headline","title":"We have released version 3.0 of OpenPGPjs, an open source OpenPGP library - ProtonMail Blog","url":"https://protonmail.com/blog/openpgpjs-3-release/","tags":["JavaScript","library","ReleaseNote"],"content":"OpenPGPの実装であるOpenPGP.js 3.0リリース","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 65  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/03/nic65","tags":["Chrome","ReleaseNote"],"content":"Chrome 65の変更点について。\nCSS Paint API、Server Tming API、`display: contents`の対応、Feature Policyの対応など。\nまた`document.all`が上書きできなくなるようになるなど","relatedLinks":[{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features#browsers.chrome.desktop%3D65"},{"title":"Chromium Blog: Chrome 65 Beta: CSS Paint API and the ServerTiming API","url":"https://blog.chromium.org/2018/02/chrome-65-beta-css-paint-api-and.html"}]},{"category":"Headline","title":"MobX 4: Better, simpler, faster, smaller – Michel Weststrate – Medium","url":"https://medium.com/@mweststrate/mobx-4-better-simpler-faster-smaller-c1fbc08008da","tags":["JavaScript","library","ReleaseNote"],"content":"MobX 4リリース。\nDecorator proposal(`@decorator`)を使わずに同じことをする`decorate`関数の追加、コレクション向けのUtility APIを追加、`when`の追加など。\nまた`shareGlobalState`の削除、APIのリネーム、default exportをしないようにするなどの破壊的変更が行われている。","relatedLinks":[{"title":"Migrating from mobx 3 to mobx 4 · mobxjs/mobx Wiki","url":"https://github.com/mobxjs/mobx/wiki/Migrating-from-mobx-3-to-mobx-4"},{"title":"mobx/CHANGELOG.md at master · mobxjs/mobx","url":"https://github.com/mobxjs/mobx/blob/master/CHANGELOG.md#400"}]},{"category":"Headline","title":"Release Futura · sass/libsass","url":"https://github.com/sass/libsass/releases/tag/3.5.0","tags":["ReleaseNote","Sass","library"],"content":"libsass 3.5リリース。 引数のtrailing commasサポート、`content-exists`関数のサポート、CSSのCustom Property、`var()`のサポートなど","relatedLinks":[]},{"category":"Article","title":"An imperative guide to forms in React – LogRocket","url":"https://blog.logrocket.com/an-imperative-guide-to-forms-in-react-927d9670170a","tags":["React","library","article"],"content":"Reactを使ったフォームの扱いについての記事。\nFormikを使ったフォームの作成などについて","relatedLinks":[]},{"category":"Article","title":"Emscripting a C library to Wasm  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/03/emscripting-a-c-library","tags":["WebAssembly","JavaScript","article"],"content":"Emscriptenを使いCのコードをWebAssemblyにして実行するチュートリアル。\nlibwebpをwasmにコンパイルする話","relatedLinks":[]},{"category":"Article","title":"Feature Policy による Permission Delegation | blog.jxck.io","url":"https://blog.jxck.io/entries/2018-03-08/feature-policy-permission-delegation.html","tags":["browser","security","article"],"content":"iframe sandbox、CSP、Feature Policyの役割について。\n`sandbox`はホワイリトストでの機能制限、CSPはブラックリストでの機能制限、Feature Policyは権限の設定をオリジンに対して行う。\nまた`sandbox`とFeature Policyの機能重複はしないことについて","relatedLinks":[]},{"category":"Article","title":"Web Workers to the rescue – Rastislav Svarba – Medium","url":"https://rast.io/web-workers-rescue","tags":["JavaScript","webworker","article"],"content":"Web Workerを使った処理の移譲のコストと効果についての記事。\nデータの取得と処理をWorkerに移動した場合の処理時間とWorkerへのデータ受け渡しのコストについて","relatedLinks":[]},{"category":"Article","title":"The npm Blog — Introducing \\`npm ci\\` for faster, more reliable...","url":"http://blog.npmjs.org/post/171556855892/introducing-npm-ci-for-faster-more-reliable","tags":["article","npm"],"content":"`pacakge-lock.json`から常にクリーンインストールする`npm ci`について。 現在の存在する`node_modules`ディレクトリを削除し、`pacakge-lock.json`を元にインストールする。 キャッシュを使わないCI環境向けのインストールコマンド。","relatedLinks":[{"title":"npm ciを使おう あるいはより速く - Qiita","url":"https://qiita.com/mstssk/items/8759c71f328cab802670"}]},{"category":"Article","title":"Lighter than Lightweight: How We Built the Same App Twice with Preact and Glimmer.js | LinkedIn Engineering","url":"https://engineering.linkedin.com/blog/2018/03/how-we-built-the-same-app-twice-with-preact-and-glimmerjs","tags":["JavaScript","article","performance"],"content":"同じアプリをPreactとGlimmer.jsで実装し、ページロードに関するパフォーマンスの比較実験をした結果について。\nファイルサイズは重要であるが、ファイルサイズがすべてを決めるわけではないという点について","relatedLinks":[]},{"category":"WebsiteDocument","title":"andrew--r/frontend-case-studies: 💼 A curated list of technical talks and articles about real-world enterprise frontend development","url":"https://github.com/andrew--r/frontend-case-studies","tags":["JavaScript","企業","まとめ"],"content":"フロントエンドのケーススタディのまとめ。\n色々な企業の事例が書かれている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"30 Seconds of CSS","url":"https://atomiks.github.io/30-seconds-of-css/","tags":["CSS","tutorial"],"content":"CSSのスニペットとその解説をまとめたもの。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Boxy SVG Editor","url":"https://boxy-svg.com/","tags":["SVG","editor","software"],"content":"SVGエディタアプリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pshihn/workly: A really simple way to move a stand-alone function/class to a web worker. 🏋️‍♀️→ 😄","url":"https://github.com/pshihn/workly","tags":["JavaScript","library"],"content":"ProxyとWebWorkerを使い既存の関数やクラスをWorkerで処理するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"midwayjs/pandora: A Manageable, Measurable and Traceable Node.js Application Manager represented by Alibaba powered by TypeScript","url":"https://github.com/midwayjs/pandora","tags":["node.js","library","Tools"],"content":"Alibaba製のNode.jsアプリケーションの管理ツール。\nアプリケーションプロセスの管理、計測、監視、トラブルシューティングのためのデバッグの仕組みなどが持っている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Run","url":"https://run.tools/","tags":["node.js","Tools"],"content":"Node.js製のデプロイツール。\n\"Resource\"という単位で設定を行い、S3へデプロイといったことを行える。\nResourceは自分で作成することができ、どのようなオプションを受け取るかやオプションを受け取って処理を記述できる。","relatedLinks":[{"title":"Resources","url":"https://run.tools/docs/reference/resources"}]},{"category":"SoftwareLibrary","title":"zipson | JSON parse and stringify with compression","url":"https://jgranstrom.github.io/zipson/","tags":["JavaScript","JSON","library"],"content":"`JSON.stringify`/`JSON.parse`の代替ライブラリ。\nデータの圧縮やStreamingのサポートを目的にしている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Rough.js","url":"http://roughjs.com/","tags":["JavaScript","canvas","library"],"content":"手書き風の線を描くCanvasライブラリ","relatedLinks":[]}]},{"meta":{"title":"2018-03-20のJS: TypeScript 2.8RC、Firefox 59、#SmooshGate","author":"azu","layout":"post","date":"2018-03-20T01:23:07.818Z","category":"JSer","tags":["TypeScript","firefox","ECMAScript"],"url":"https://jser.info/2018/03/20/typescript-2.8rc-firefox-59-smooshgate/"},"items":[{"category":"Headline","title":"Announcing TypeScript 2.8 RC | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2018/03/15/announcing-typescript-2-8-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.8 RCリリース。\nConditional Types、Mapped Type Modifierの`-`、`+`ができるように、JSX Pragmasをコメントで指定できるようなるなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.2.0 · GoogleChrome/puppeteer","url":"https://github.com/GoogleChrome/puppeteer/releases/tag/v1.2.0","tags":["Chrome","library","ReleaseNote"],"content":"puppeteer 1.2.0リリース。\n`elementHandle.contentFrame()`の追加、リダイレクト回数を返す`request.redirectChain()`の追加など","relatedLinks":[]},{"category":"Headline","title":"Firefox — Notes (59.0) — Mozilla","url":"https://www.mozilla.org/en-US/firefox/59.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 59リリース。\n開発者ツールの改善、[PointerEvent](https://developer.mozilla.org/en-US/docs/Web/API/PointerEvent \"PointerEvent\")をデフォルトで有効化、[`overscroll-behavior`](https://developer.mozilla.org/en-US/docs/Web/CSS/overscroll-behavior \"overscroll-behavior\")の実装、[`EventTarget`](https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/EventTarget)コンストラクタの実装など","relatedLinks":[{"title":"Firefox 59 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/Firefox/Releases/59"}]},{"category":"Headline","title":"Release Inferno v5.0.0 · infernojs/inferno","url":"https://github.com/infernojs/inferno/releases/tag/v5.0.0","tags":["JavaScript","React","ReleaseNote","library"],"content":"Inferno v5.0.0 リリース。 `.mjs`で配布していたのを`.js`に変更、 IE9のサポート終了、TypeScriptのサポート改善など","relatedLinks":[]},{"category":"Article","title":"とあるLPの制作現場 - Qiita","url":"https://qiita.com/noplan1989/items/a52a957546ddb9efeca3","tags":["web ","design"],"content":"実際にウェブサイトのランディングページ(LP)の作る際にどのように作成したかについて。","relatedLinks":[]},{"category":"Article","title":"How to Build Password Generator with Electron & React Pt.1 - Setting the Stage - Alex Devero Blog","url":"https://blog.alexdevero.com/password-generator-pt1/","tags":["Electron","JavaScript"],"content":"Electronを使ったパスワードジェネレータアプリのチュートリアル","relatedLinks":[]},{"category":"Article","title":"Unblocking Clipboard Access  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/03/clipboardapi","tags":["JavaScript","clipboard","WebPlatformAPI"],"content":"Async Clipboard APIについての紹介。\n今まで`document.execCommand`でやっていたものをちゃんとしたPermissionモデルと共に扱えるAPIについて","relatedLinks":[]},{"category":"Article","title":"Data visualization with react-vis – DailyJS – Medium","url":"https://medium.com/dailyjs/data-visualization-with-react-vis-bd2587fe1660","tags":["React","article"],"content":"react-visを使ったグラフの描画について","relatedLinks":[]},{"category":"Article","title":"webpack 4 の optimization.splitChunks（廃止されたCommonsChunkPluginの代わり） の使い方、使い所 - Qiita","url":"https://qiita.com/soarflat/items/1b5aa7163c087a91877d","tags":["webpack","article"],"content":"webpack 4の`optimization`オプションについて。\n`optimization.*`の設定とそれぞれの出力結果について","relatedLinks":[]},{"category":"Article","title":"Say Hello to Houdini and the CSS Paint API / Coder's Block","url":"https://codersblock.com/blog/say-hello-to-houdini-and-the-css-paint-api/","tags":["CSS","article"],"content":"CSS Paint APIについての記事。\nPaint Workletを使ったスタイルの拡張の書き方やスタイルの適応方法について。\nまた現時点でのCSS Paint APIを含めたHoudiniについて","relatedLinks":[]},{"category":"Article","title":"Redruco: Truco para aprender Redux (Parte 1) – Javier Fernandes – Medium","url":"https://medium.com/@javierfernandes/redruco-truco-para-aprender-redux-parte-1-c72d052576b0","tags":["JavaScript","redux","React","tutorial"],"content":"React/Reduxを使ったアプリケーション開発についての連載。\nReduxが必要となる状態はどのようなケースか、また開発においてもアプリの状態とUIの詳細は独立して考えられることについて。\nStorybookでコンポーネントを確認しながら開発し、アプリを作るチュートリアル。","relatedLinks":[]},{"category":"Article","title":"#SmooshGate FAQ  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/03/smooshgate","tags":["ECMAScript","article","JavaScript","TC39"],"content":"ECMAScriptで`Array.prototype.flatten` Proposalが既存のMooToolsなどのライブラリと名前がバッティングするためbreak the webとなる問題について。\n標準化する実装と異なる点だけではなく、prototypeを列挙している点にも問題がある。\nまた、なぜ既存の実装を変更しても解決にならないかや今後について。","relatedLinks":[]},{"category":"Article","title":"Strongly Typed Event Emitters – Brian Terlson – Medium","url":"https://medium.com/@bterlson/strongly-typed-event-emitters-2c2345801de8","tags":["TypeScript","article"],"content":"TypeScript 2.8(RC)のConditional Typeを使ったEventEmitterの型付けについて","relatedLinks":[{"title":"bterlson/strict-event-emitter-types: A type-only library for strongly typing any event emitter","url":"https://github.com/bterlson/strict-event-emitter-types"}]},{"category":"SlideVideo","title":"nucleartide/emberconf-2018: EmberConf 2018 notes.","url":"https://github.com/nucleartide/emberconf-2018","tags":["JavaScript","イベント","video"],"content":"EmberConf 2018の動画や発表のまとめ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Everyone can now run JavaScript on Cloudflare with Workers","url":"https://blog.cloudflare.com/cloudflare-workers-unleashed/","tags":["cdn","ServiceWorker","webservice"],"content":"Cloudflare Workersが一般公開された。\nCDN上でService Workerと同じようなAPIで処理を書くことができるサービス。","relatedLinks":[]},{"category":"WebsiteDocument","title":"FromJS - Understand JavaScript Apps","url":"http://www.fromjs.com/","tags":["Chrome","DOM","Extension","babel","debug","Tools"],"content":"DOMをインスペクトし、表示されている文字列がコードのどこで生成されているかを検索できるChrome拡張。 既存のHTMLを生成するDOM APIを上書きしトレースしている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vuex-orm/vuex-orm: The Vuex plugin to enable Object-Relational Mapping access to the Vuex Store.","url":"https://github.com/vuex-orm/vuex-orm","tags":["JavaScript","library","Vue","Vuex","ORM"],"content":"複雑なデータ構造を扱うためのVuexプラグイン。リレーションを持ったデータをノーマライズし、RailsやLaravelのようなORMライクなAPIでデータの検索、取得ができる。複雑にネストしたデータ構造をノーマライズすることで、データを扱うコストを一定に保つことが目的。","relatedLinks":[{"title":"Vuexでリレーションを持った複雑なデータ構造を上手く扱うには - Qiita","url":"https://qiita.com/kiaking/items/bcd5360fb3106cf22a81"},{"title":"paularmstrong/normalizr: Normalizes nested JSON according to a schema","url":"https://github.com/paularmstrong/normalizr"}]},{"category":"SoftwareLibrary","title":"maticzav/emma-cli: 📦 Terminal assistant to find and install node packages.","url":"https://github.com/maticzav/emma-cli","tags":["npm","検索","console","Tools"],"content":"npmモジュールの検索とインストールを行うツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"terkelg/prompts: Lightweight, beautiful and user-friendly interactive prompts","url":"https://github.com/terkelg/prompts","tags":["node.js","library","console"],"content":"Node.jsでインタラクティブなプロンプトを表示するライブラリ","relatedLinks":[]}]},{"meta":{"title":"2018-03-26のJS: D3.js 5.0.0、ウェブアプリの技術選定、oclif","author":"azu","layout":"post","date":"2018-03-26T11:22:36.673Z","category":"JSer","tags":["D3.js","architecture","CLI","framework"],"url":"https://jser.info/2018/03/26/d3.js-5.0.0-oclif/"},"items":[{"category":"Headline","title":"ESLint v4.19.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2018/03/eslint-v4.19.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 4.19.0リリース。\nES2018のRegExp拡張に対応など","relatedLinks":[{"title":"ESLint v4.19.0 - Qiita","url":"https://qiita.com/mysticatea/items/be9558c263aca26416ca"}]},{"category":"Headline","title":"Release Release of 1.0.0 · laurentj/slimerjs","url":"https://github.com/laurentj/slimerjs/releases/tag/1.0.0","tags":["firefox","ReleaseNote","library"],"content":"FirefoxベースのPhantomJSライクなライブラリであるSlimerJS 1.0リリース。\nFirefox 56以降では`--headless`を使うことでヘッドレスブラウザとして利用できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"npm/CHANGELOG.md at v5.8.0 · npm/npm","url":"https://github.com/npm/npm/blob/v5.8.0/CHANGELOG.md","tags":["npm","ReleaseNote"],"content":"npm 5.8.0リリース。\n`--no-color`オプションのサポート、`npm ci`の改善など","relatedLinks":[]},{"category":"Headline","title":"d3/CHANGES.md at master · d3/d3","url":"https://github.com/d3/d3/blob/master/CHANGES.md#changes-in-d3-50","tags":["d3.js","ReleaseNote"],"content":"D3.js 5.0リリース。\nロード系のメソッドがコールバックからPromiseを返すように変更、XHRからFetch APIを利用するように。\nまた`d3.schemeCategory20*`を削除し`d3-scale-chromatic`などをつかうようになるなど","relatedLinks":[{"title":"d3/d3-scale-chromatic: Sequential, diverging and categorical color scales.","url":"https://github.com/d3/d3-scale-chromatic"}]},{"category":"Headline","title":"Dev.Opera — What’s new in Chromium 65 and Opera 52","url":"https://dev.opera.com/blog/opera-52/","tags":["Opera","Chrome","ReleaseNote"],"content":"Opera 52 (based on Chromium 65)リリース。\nPaint Worklet、Server Timing API、Feature Policyのサポートなど","relatedLinks":[]},{"category":"Article","title":"Lazy Loading JavaScript Modules With ConditionerJS — Smashing Magazine","url":"https://www.smashingmagazine.com/2018/03/lazy-loading-with-conditioner-js/","tags":["JavaScript","browser","article"],"content":"`data`属性を使ってlazy LoadやResponsiveな動作を定義できるConditionerJSについての紹介","relatedLinks":[{"title":"rikschennink/conditioner: 💆🏻 Frizz free, context-aware, JavaScript modules","url":"https://github.com/rikschennink/conditioner"}]},{"category":"Article","title":"ECMAScript proposal updates at 2018-03 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2018/03/26/ecmascript-proposal-updates","tags":["ECMAScript","proposal"],"content":"2018年3月に行われたTC39ミーティングによってステータスが変更された/追加されたECMAScript Proposalのまとめ","relatedLinks":[]},{"category":"Article","title":"技術要素編: web アプリが新陳代謝を続けるための依存関係の厳選（新規開発のメモ書きシリーズ1） ::ハブろぐ","url":"https://havelog.ayumusato.com/develop/others/e747-scratch_memo_1.html","tags":["JavaScript","project","article","architecture"],"content":"ウェブアプリの技術選定、ビルド設定、コード設計、アーキテクチャについての連載記事。\n新規でウェブアプリを開発する際にどのような理由でライブラリやビルドツール、ディレクトリ構造などの採用したか、配信におけるCDNやパフォーマンス計測について","relatedLinks":[]},{"category":"Article","title":"Getting Started With The Web MIDI API — Smashing Magazine","url":"https://www.smashingmagazine.com/2018/03/web-midi-api/","tags":["JavaScript","web","audio"],"content":"Web MIDI APIについて入門記事","relatedLinks":[]},{"category":"Article","title":"Node.jsとECMAScript Modules - 技術探し","url":"http://blog.hiroppy.me/entry/nodejs-esm","tags":["node.js","module","article"],"content":"Node.jsとES Modulesについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"agis/mcdetect: Catch mixed content issues in the wild","url":"https://github.com/agis/mcdetect","tags":["JavaScript","security","browser","Chrome","Tools"],"content":"Headless Chromeを使ったMixed Contentの検知ツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"continuationlabs/wequire: synchronously load wasm files","url":"https://github.com/continuationlabs/wequire","tags":["node.js","WebAssembly"],"content":"Node.jsで`.wasm`ファイルを同期的読み込めるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"oclif: The Open CLI Framework · Create command line tools your users love","url":"https://oclif.io/","tags":["node.js","console","Tools","library"],"content":"Heroku CLIなどで使われているNode.jsでCLIを作るためのフレームワーク。\nシングルコマンド、マルチコマンドのCLIに対応していて、テンプレートコードの生成やテストの補助も行うツール","relatedLinks":[]},{"category":"Book","title":"Simplifying JavaScript: Writing Modern JavaScript with ES5, ES6, and Beyond: Joe Morgan: 9781680502886: Amazon.com: Books","url":"https://www.amazon.com/Simplifying-JavaScript-Writing-Modern-Beyond/dp/1680502883","tags":["JavaScript","book"],"content":"2018年5月25日発売\nES2015以降を使ったシンプルで読みやすく予想可能なコードの書き方についての書籍","relatedLinks":[]},{"category":"Book","title":"Rediscovering JavaScript: Master ES6, ES7, and ES8 by Venkat Subramaniam | The Pragmatic Bookshelf","url":"https://pragprog.com/book/ves6/rediscovering-javascript","tags":["JavaScript","book"],"content":"2018年6月10日発売\nES2015の構文を使ったJavaScriptの書き方、オブジェクト指向やモジュールについての書籍","relatedLinks":[]},{"category":"Book","title":"\"SurviveJS - Webpack\" Updated to webpack 4","url":"https://survivejs.com/blog/webpack-book-updated-to-webpack-4/","tags":["book","webpack"],"content":"SurviveJS - Webpackがwebpack 4に対応した。","relatedLinks":[]},{"category":"Book","title":"Securing Node Applications: Web Programming Conference | Web Performance Conference | Fluent","url":"https://conferences.oreilly.com/fluent/fl-ca/public/content/securing-node-applications","tags":["node.js","security","book"],"content":"OWASP Top 10 security risksとNode.jsについての小さな書籍。\nそれぞれの脆弱性の紹介やNode.jsを使った場合での対策についてまとめられている","relatedLinks":[]},{"category":"Book","title":"プログレッシブウェブアプリ PWA開発入門 | 電子書籍とプリントオンデマンド（POD） | NextPublishing（ネクストパブリッシング）","url":"https://nextpublishing.jp/book/9553.html","tags":["PWA","book"],"content":"2018年3月23日発売\nProgressive Web Appsについての書籍","relatedLinks":[]}]},{"meta":{"title":"2018-04-01のJS: TypeScript 2.8、React 16.3.0、TensorFlow.js","author":"azu","layout":"post","date":"2018-04-01T05:56:39.824Z","category":"JSer","tags":["TypeScript","react","ML"],"url":"https://jser.info/2018/04/01/typescript-2.8-react-16.3.0-tensorflow.js/"},"items":[{"category":"Headline","title":"React v16.3.0: New lifecycles and context API - React Blog","url":"https://reactjs.org/blog/2018/03/29/react-v-16-3.html","tags":["React","ReleaseNote"],"content":"React v16.3.0リリース。\n新しいContext APIの追加、`createRef`メソッドの追加、`forwardRef`メソッドの追加。\nコンポーネントライフサイクルイベントの変更と追加、`StrictMode`コンポーネントの追加など","relatedLinks":[{"title":"Update on Async Rendering - React Blog","url":"https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html"},{"title":"React v16.3.0: New lifecycles and context API【日本語翻訳】 | maesblog","url":"https://mae.chab.in/archives/60040"}]},{"category":"Headline","title":"March 2018 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/march-2018-security-releases/","tags":["node.js","ReleaseNote","security"],"content":"Node.jsのセキュリティアップデートとして、それぞれのLTSと開発バージョンのアップデートが公開された\n\n- Node.js 9.10.0\n- Node.js 8.11.0 (LTS \"Carbon\")\n- Node.js 6.14.0 (LTS \"Boron\")\n- Node.js 4.9.0 (LTS \"Argon\")","relatedLinks":[]},{"category":"Headline","title":"V8 JavaScript Engine: V8 release v6.6","url":"https://v8project.blogspot.com/2018/03/v8-release-66.html","tags":["V8","Chrome","ReleaseNote"],"content":"V8 v6.6(Chrome 66)リリース。\nECMAScript Proposalの対応として`Function#toString()`の仕様追従、JSがJSONのsupersetとなる仕様追従。\nまた`catch`構文のパラメータを省略に対応、`String#trimStart`や`String#trimEnd`の実装など。\nBackground compilationの対応やAsync、Arrayのパフォーマンス改善など","relatedLinks":[{"title":"Function.prototype.toString revision","url":"https://tc39.github.io/Function-prototype-toString-revision/"},{"title":"tc39/proposal-json-superset: Proposal to make all JSON text valid ECMA-262","url":"https://github.com/tc39/proposal-json-superset"},{"title":"tc39/proposal-string-left-right-trim: A proposal to the ECMAScript standard for including left and right trim of whitespace to strings","url":"https://github.com/tc39/proposal-string-left-right-trim"}]},{"category":"Headline","title":"ZEIT – Next.js 5.1: Faster Page Resolution, Environment Config & More","url":"https://zeit.co/blog/next5-1","tags":["React","node.js","library","ReleaseNote"],"content":"Next.js 5.1リリース。\nページロードの速度改善、設定を定義できる`publicRuntimeConfig`と`serverRuntimeConfig`を追加、エラーハンドリングの改善など","relatedLinks":[]},{"category":"Headline","title":"Release v3.4.0 · storybooks/storybook","url":"https://github.com/storybooks/storybook/releases/tag/v3.4.0","tags":["JavaScript","ui ","library","ReleaseNote","Tools"],"content":"Storybook 3.4.0リリース。\nPolymer 2サポート、AngularとVueのstoryshotサポートなど","relatedLinks":[]},{"category":"Headline","title":"power-assert/CHANGELOG.md at v1.5.0 · power-assert-js/power-assert","url":"https://github.com/power-assert-js/power-assert/blob/v1.5.0/CHANGELOG.md","tags":["JavaScript","testing","library","Tools","ReleaseNote"],"content":"power-assert 1.5.0リリース。\nNode.js 9.9.0で追加された`assert`のstrict modeをサポート","relatedLinks":[{"title":"Node v9.9.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v9.9.0/"},{"title":"Assert | Node.js v9.10.1 Documentation","url":"https://nodejs.org/api/assert.html#assert_strict_mode"}]},{"category":"Headline","title":"📦 Parcel v1.7.0: – devongovett – Medium","url":"https://medium.com/@devongovett/parcel-v1-7-0-9aac0c505837","tags":["JavaScript","Tools","ReleaseNote"],"content":"Parcel v1.7.0リリース。\n`.vue`とPugのサポート、出力するファイルにハッシュ値を付与するように、absolute pathとtilde(`~`) pathのサポート、必要な依存を自動的にインストールするようになるなど","relatedLinks":[]},{"category":"Headline","title":"Dart Sass 1.0.0 is Released « Sass Blog","url":"http://sass.logdown.com/posts/7045860-dart-sass-100-is-released","tags":["Sass","dart","ReleaseNote"],"content":"Dart Sass 1.0リリース。\nRuby Sassについてはメンテナンスモードとなる。","relatedLinks":[]},{"category":"Headline","title":"ESLint v5.0.0-alpha.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2018/03/eslint-v5.0.0-alpha.0-released","tags":["ESLint","serverless"],"content":"ESLint 5.0.0αリリース。\n予定される破壊的な変更についてはマイグレーションガイドで解説されている。","relatedLinks":[{"title":"ESLint v5.0.0 変更点まとめ (随時更新) - Qiita","url":"https://qiita.com/mysticatea/items/f34097961bf2827b675d"},{"title":"Migrating to v5.0.0 - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/docs/5.0.0/user-guide/migrating-to-5.0.0"}]},{"category":"Headline","title":"Announcing TypeScript 2.8 | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2018/03/27/announcing-typescript-2-8/","tags":["ReleaseNote","TypeScript"],"content":"TypeScript 2.8リリース。 Conditional Types、d.tsのみの出力に対応、`@jsx` pragmaコメントのサポート、mapped type modifierの`+`、`-`のサポートなど","relatedLinks":[{"title":"TypeScript 2.8.1 変更点 - Qiita","url":"https://qiita.com/vvakame/items/2e32aeded05997f77dfa"}]},{"category":"Article","title":"Server Timing APIを使ってサーバーサイドのベンチマークを手軽にやる | ブログ :: Web notes.log","url":"http://blog.wnotes.net/blog/article/server-side-benchmark-using-server-timing-api","tags":["node.js","server","library","performance"],"content":"Server Timinig APIを使いサーバサイドのリクエストごとのベンチマークをとり、Chromeの開発者ツールに表示するライブラリについて","relatedLinks":[]},{"category":"Article","title":"Update on Async Rendering - React Blog","url":"https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html","tags":["React","article"],"content":"非同期レンダリングのためのライフサイクルイベントの追加と変更について。\n16.3でイベントの追加、16.xで古いイベントに警告を表示、17.0で古いイベントを廃止。\nまた追加された`getDerivedStateFromProps`と`getSnapshotBeforeUpdate`についての解説","relatedLinks":[]},{"category":"Article","title":"Working with the new CSS Typed Object Model  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/03/cssom","tags":["CSS","article","JavaScript"],"content":"CSS Typed OMについての解説。\nすでにある`style`プロパティと新しく追加された`attributeStyleMap`の違いや、CSS Typed OMで追加されたAPIのメリットや実際の使い方について","relatedLinks":[]},{"category":"Article","title":"WebAssembly/esm-integration: ECMAScript module integration","url":"https://github.com/WebAssembly/esm-integration","tags":["WebAssembly","module","ECMAScript"],"content":"ES Module Integration Proposal for WebAssembly","relatedLinks":[]},{"category":"Article","title":"How display: contents; Works","url":"https://bitsofco.de/how-display-contents-works/","tags":["CSS","article"],"content":"`display: contents;` の解説","relatedLinks":[]},{"category":"WebsiteDocument","title":"CondeNast/perf-timeline-cli: Generate Chrome Performance Timelines via a command line interface","url":"https://github.com/CondeNast/perf-timeline-cli","tags":["Chrome","performance","Tools"],"content":"Chrome開発者ツールのPerformanceパネルの情報を取得するCLIツール。\nPuppeteerを使ってアクセスした結果を取得する","relatedLinks":[]},{"category":"WebsiteDocument","title":"JavaScript in 14 minutes by Jeremy Thomas","url":"https://jgthms.com/javascript-in-14-minutes/","tags":["JavaScript","tutorial"],"content":"ブラウザの開発者ツールで実行しながら学べるJavaScriptチュートリアル","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cmseaton42/task-easy: A simple, customizable, and lightweight priority queue for promises.","url":"https://github.com/cmseaton42/task-easy","tags":["JavaScript","Promises","library"],"content":"Promiseスケジュールライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"asfktz/Awaity.js: A functional, lightweight alternative to bluebird.js, built with async / await in mind.","url":"https://github.com/asfktz/Awaity.js","tags":["JavaScript","Promises","library"],"content":"async/awaitベースのコレクション系ライブラリ\nmap、filter、reduceなどのPromiseに対するコレクション操作を提供するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jacobbogers/libRmath.js: Javascript Pure Implementation of Statistical R \"core\" numerical libRmath.so","url":"https://github.com/jacobbogers/libRmath.js","tags":["JavaScript","TypeScript","R ","library"],"content":"Rの`math`をJavaScriptにポートしたライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"TensorFlow.js","url":"https://js.tensorflow.org/","tags":["MachineLearning","JavaScript","library","WebGL"],"content":"tensorflowのJavaScript版。\nWebGLを使った機械学習を行え、既存の学習モデルはconverterで変換し利用できる。","relatedLinks":[{"title":"tensorflow/tfjs-converter: Convert TensorFlow SavedModel and Keras models to TensorFlow.js","url":"https://github.com/tensorflow/tfjs-converter"}]},{"category":"SoftwareLibrary","title":"jaywcjlove/hotkeys: ➷ A robust Javascript library for capturing keyboard input. It has no dependencies.","url":"https://github.com/jaywcjlove/hotkeys","tags":["JavaScript","キーボード","React","library"],"content":"ショートカットキー管理ライブラリ。","relatedLinks":[]},{"category":"Book","title":"React開発　現場の教科書 | マイナビブックス","url":"https://book.mynavi.jp/ec/products/detail/id=88735","tags":["React","book"],"content":"ReactとAtomic Designについての書籍","relatedLinks":[]},{"category":"Book","title":"CSS Pocket Reference, 5th Edition - O'Reilly Media","url":"http://shop.oreilly.com/product/0636920146353.do","tags":["CSS","book"],"content":"2018年4月発売。\nCSSリファレンス本","relatedLinks":[]}]},{"meta":{"title":"2018-04-10のJS: PWA on iOS & Windows Store、dom-testing-library","author":"azu","layout":"post","date":"2018-04-10T01:35:23.636Z","category":"JSer","tags":["PWA","iOS","windows","dom","tests"],"url":"https://jser.info/2018/04/10/pwa-on-ios-and-windows-store-dom-testing-library/"},"items":[{"category":"Headline","title":"Axe 3.0 has arrived — here’s what you need to know - Deque","url":"https://www.deque.com/blog/axe-3-0-has-arrived/","tags":["accessibility","ReleaseNote"],"content":"Axe 3.0リリース。\nShadow DOMのサポートなど","relatedLinks":[{"title":"Release 3.0.0 · dequelabs/axe-core","url":"https://github.com/dequelabs/axe-core/releases/tag/v3.0.0"}]},{"category":"Headline","title":"First Windows 10 Progressive Web Apps (PWA) published by Microsoft hit the Store | Windows Central","url":"https://www.windowscentral.com/first-batch-windows-10-progressive-web-apps-here","tags":["MS","PWA","news"],"content":"Microsoft StoreにPWAアプリが公開されるようになった","relatedLinks":[]},{"category":"Headline","title":"sails/CHANGELOG.md at v1.0.0 · balderdashy/sails","url":"https://github.com/balderdashy/sails/blob/v1.0.0/CHANGELOG.md","tags":["node.js","JavaScript","ReleaseNote"],"content":"Node.jsのウェブアプリケーションフレームワークであるSails.js 1.0リリース。","relatedLinks":[]},{"category":"Article","title":"React v16.3 changes - blog.koba04.com","url":"http://blog.koba04.com/post/2018/04/04/react-v163-changes/","tags":["React","article"],"content":"React 16.3の変更点について","relatedLinks":[]},{"category":"Article","title":"Lazy Loading Images and Video  |  Web Fundamentals  |  Google Developers","url":"https://developers.google.com/web/fundamentals/performance/lazy-loading-guidance/images-and-video/","tags":["performance","browser","JavaScript","CSS"],"content":"画像や動画の遅延ロードについて。\n画像の遅延ロードとしてIntersection Observerを使った方法、CSSを使った方法について。\n動画とGIFのロード、遅延ロードを補助するライブラリ、ロードに失敗した時のFallbackなどについて","relatedLinks":[]},{"category":"Article","title":"Headless Chrome: an answer to server-side rendering JS sites  |  Tools for Web Developers  |  Google Developers","url":"https://developers.google.com/web/tools/puppeteer/articles/ssr","tags":["Chrome","server","article"],"content":"Headless Chromeを使ったサーバーサイドレンダリングについてのチュートリアル。\nどのように実装するか、最適化について","relatedLinks":[]},{"category":"Article","title":"GoDaddy Open Source Center - Isomorphic Asset System for React and React-Native","url":"https://godaddy.github.io/2018/04/04/isomorphic-asset-system-for-react-and-react-native/","tags":["SVG","React","library","article"],"content":"SVGのアセットを管理するツール、React/React Nativeコンポーネント、webpack loaderなどについて","relatedLinks":[]},{"category":"Article","title":"Strategies for Service Worker Caching for Progressive Web Apps","url":"https://blog.hasura.io/strategies-for-service-worker-caching-d66f3c828433","tags":["ServiceWorker","article"],"content":"Service Workerのキャッシュの仕組みとキャッシュの問題があるケースについて。\n壊れたデプロイを行った時の問題、`service-worker.js`ファイル自体をキャッシュした時の問題、キャッシュすべきでないレスポンスなどについて。\nまた`create-react-app`の事例や`Clear-Site-Data`ヘッダについて","relatedLinks":[]},{"category":"Article","title":"Progressive Web Apps on iOS are here 🚀 – Maximiliano Firtman – Medium","url":"https://medium.com/@firt/progressive-web-apps-on-ios-are-here-d00430dee3a7","tags":["ios","safari","article","ServiceWorker","PWA"],"content":"iOS 11.3でサポートされたService WorkerなどのPWAに関する機能について。\nネイティブアプリと比較した場合の制限やChrome/Androidとの違いなどについて","relatedLinks":[]},{"category":"Article","title":"Transform your codebase using codemods | nec.is","url":"https://nec.is/writing/transform-your-codebase-using-codemods/","tags":["JavaScript","Tools","article","AST"],"content":"jscodeshiftを使ったJavaScriptのコード変換についての記事。\nどのようにJavaScriptのコードを扱うのか、ASTについて、jscodeshiftのAPIについて紹介している","relatedLinks":[]},{"category":"Article","title":"Introducing the Payment Request API for Apple Pay | WebKit","url":"https://webkit.org/blog/8182/introducing-the-payment-request-api-for-apple-pay/","tags":["safari","article"],"content":"Safari 11.1のPayment Request APIでApple Payを利用する方法についての解説記事。\n`-webkit-appearance: -apple-pay-button;\"`のスタイルを指定するだけでAppley Payボタンを表示できる。\nまたPayment Request APIの使い方について。","relatedLinks":[]},{"category":"Article","title":"Understanding JavaScript Proxies by Examining on-change Library","url":"https://codeburst.io/understanding-javascript-proxies-by-examining-on-change-library-f252eddf76c2","tags":["JavaScript","proxy","article"],"content":"プロパティの変更検知をES Proxyで実装しながら、Proxyについて紹介している記事","relatedLinks":[]},{"category":"SlideVideo","title":"Browser Automated Tests // Speaker Deck","url":"https://speakerdeck.com/derekb/browser-automated-tests","tags":["JavaScript","testing","slide"],"content":"puppeteerとmochaを使った自動テストについてのスライド。","relatedLinks":[]},{"category":"WebsiteDocument","title":"React lifecycle methods diagram","url":"http://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/","tags":["React","document"],"content":"React 16.3以降を含むReactのライフサイクルの図","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kentcdodds/dom-testing-library: 🐙 Simple and complete DOM testing utilities that encourage good testing practices.","url":"https://github.com/kentcdodds/dom-testing-library","tags":["JavaScript","DOM","testing","library"],"content":"DOM要素をテストするMatcherライブラリ","relatedLinks":[{"title":"Introducing the react-testing-library 🐐 – kentcdodds","url":"https://blog.kentcdodds.com/introducing-the-react-testing-library-e3a274307e65"}]},{"category":"SoftwareLibrary","title":"kwolfy/webworker-promise: Promise based wrapper for webworkers","url":"https://github.com/kwolfy/webworker-promise","tags":["JavaScript","webworker","library"],"content":"WebWorkerを扱うライブラリ。\nEventEmitterライクなイベントの仕組みとPromiseを使った非同期処理、Worker poolの仕組みなどを持っている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"avwo/whistle: HTTP, HTTPS, WebSocket debugging proxy","url":"https://github.com/avwo/whistle","tags":["HTTP","proxy","debug","node.js"],"content":"Node.jsで書かれたHTTP/HTTPS/WebSocketsのデバッグProxy","relatedLinks":[]}]},{"meta":{"title":"2018-04-17のJS: Safari 11.1の新しい機能、Chrome 67開発者ツール、Webdash","author":"azu","layout":"post","date":"2018-04-17T01:52:52.447Z","category":"JSer","tags":["Safari","Chrome","DevTools"],"url":"https://jser.info/2018/04/17/safari-11.1-chrome-67-webdash/"},"items":[{"category":"Headline","title":"Prettier 1.12: Fixes, Features, and Formatting, Oh My! · Prettier","url":"https://prettier.io/blog/2018/04/11/1.12.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 1.12リリース。\nJavaScript、Markdown、GraphQLのサポート改善など","relatedLinks":[]},{"category":"Headline","title":"New WebKit Features in Safari 11.1 | WebKit","url":"https://webkit.org/blog/8216/new-webkit-features-in-safari-11-1/","tags":["safari","ReleaseNote"],"content":"Safari 11.1の変更点や追加された機能についての開設。\nService Worker、Payment Request API、Clipboard API、Passive Event Listeners、<del>Offscreen Canvas</del>など","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember 3.1 and 3.2 Beta Released","url":"https://emberjs.com/blog/2018/04/13/ember-3-1-released.html","tags":["JavaScript","ReleaseNote"],"content":"Ember 3.1リリース。\nComputed PropertiesがES5 getterで定義されるようになり、`Ember.get()`や`this.get()`使わなくても値が取得できるようになった。\n`@ember/optional-features`がリリースされ、ember-cli経由でEmber自体のBreaking Changeをフラグ管理ができるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v0.70.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.70.0","tags":["flowtype","ReleaseNote"],"content":"Flow 0.70.0リリース。\nReact 16.3(`createContext`、`createRef`)の対応、`--json-version 2`の出力結果に破壊的な変更など","relatedLinks":[]},{"category":"Headline","title":"Release 8.3 “Benigno Numine” · postcss/autoprefixer","url":"https://github.com/postcss/autoprefixer/releases/tag/8.3.0","tags":["CSS","Tools","ReleaseNote"],"content":"Autoprefixer 8.3.0リリース。\n`grid-template`と`@media`の組み合わせをサポート","relatedLinks":[]},{"category":"Headline","title":"zzarcon/default-passive-events: Makes \\{passive: true\\} by default when EventListenerOptions are supported","url":"https://github.com/zzarcon/default-passive-events","tags":["DOM","JavaScript","library"],"content":"Passive Event Listenersをデフォルトで有効化するように`EventTarget.prototype.addEventListener`の処理を上書きするライブラリ","relatedLinks":[]},{"category":"Article","title":"Improving DevTools’ performance, one iteration at a time – Firefox Nightly News","url":"https://blog.nightly.mozilla.org/2018/04/10/improving-devtools-performance-one-iteration-at-a-time/","tags":["firefox","debug","performance","article"],"content":"Firefox 60での開発者ツールのパフォーマンス改善について。","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 67)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/04/devtools","tags":["Chrome","debug","article"],"content":"Chrome 67の開発者ツールの変更点について。\nネットワークパネルの検索改善、リクエストを`fetch` APIのコードとしてコピーできるように、Auditパネルの改善、無限ループを停止できるように。\nまた、メモリパネル、パフォーマンスパネルでSite Isolationを適応時のプロセス分離に対応など","relatedLinks":[]},{"category":"Article","title":"Introducing the Accessibility Inspector in the Firefox Developer Tools – Marco's Accessibility Blog","url":"https://www.marcozehe.de/2018/04/11/introducing-the-accessibility-inspector-in-the-firefox-developer-tools/","tags":["firefox","accessibility","article","debug"],"content":"FirefoxのNightlyビルドで開発者ツールにアクセシビリティパネルが追加されたことについて。\nDOMツリーのアクセシビリティについてをデバッグする機能について","relatedLinks":[]},{"category":"Article","title":"Whats New in Angular 6 ?Walking Tree Technologies | Walking Tree Technologies","url":"https://walkingtree.tech/whats-new-angular-6/","tags":["Angular","article"],"content":"現在RC版が公開されているAngular 6の変更点の概要","relatedLinks":[]},{"category":"Article","title":"SafariのUA文字列が固定されて固定されなくなったおはなし - fragmentary","url":"https://myakura.hatenablog.com/entry/2018/04/16/083000","tags":["safari","article"],"content":"Safari TP 46でUA文字列固定化は一度導入されたが、固定を取りやめることになった経緯について","relatedLinks":[]},{"category":"Article","title":"モバイル/オフラインでも動作するはてなブックマーク検索のPWAを作った | Web Scratch","url":"https://efcl.info/2018/04/16/hatebupwa/","tags":["JavaScript","PWA","React","almin","DDD","article"],"content":"https://hatebupwa.netlify.com/ の技術スタックについて。\nWebWorkerを使った別スレッドでのフィルタリング処理、Servie Workerでのキャッシュ、React ContextとAlmin、domainのシリアライズと永続化についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Automatic Progressive Web Apps using Angular Service Worker by Maxim Salnikov","url":"https://slides.com/webmax/ngsw-ijs-2018#/","tags":["Angular","slide","PWA"],"content":"AngularとPWAについてのスライド。\nAngular CLIでの開発方法、NGSW、Service Workerのバージョン管理や登録を解除するスイッチの導入などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"VuePress","url":"https://vuepress.vuejs.org/","tags":["Vue","Tools"],"content":"Vue.jsを使った静的サイトツール。\ndocusaurusのようにビルトインの機能があり、Vueを使ったテンプレートのカスタマイズができるツール","relatedLinks":[]},{"category":"WebsiteDocument","title":"Sneak Peek at WebAssembly Studio – Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2018/04/sneak-peek-at-webassembly-studio/","tags":["WebAssembly","editor","webservice"],"content":"ブラウザ上でC/C++/RustのコードをWebAssemblyにコンパイルして実行できる開発環境のWebAssembly.Studioがβ公開された","relatedLinks":[{"title":"WebAssembly Studio","url":"https://webassembly.studio/"}]},{"category":"WebsiteDocument","title":"Webdash | The customizable web dashboard","url":"https://webdash.xyz/","tags":["JavaScript","Tools","project"],"content":"ウェブプロジェクトに関するダッシュボードツール。\nパッケージの可視化、npm scriptをボタンで実行、Performance Budgetの表示、Workbox連携などを行う。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sarahdayan/dinero.js: 💸 An immutable library to create, calculate and format monetary values.","url":"https://github.com/sarahdayan/dinero.js","tags":["JavaScript","library"],"content":"通貨の計算を扱うライブラリ。\nImmutableなデータとして通貨と金額を扱い、また浮動小数点数の問題を回避した計算するメソッドを提供する。\nフォーマットには`Number.prototype.toLocaleString`を利用している。","relatedLinks":[{"title":"How to Handle Monetary Values in JavaScript | frontstuff","url":"https://frontstuff.io/how-to-handle-monetary-values-in-javascript"}]},{"category":"SoftwareLibrary","title":"glidejs/glide: A dependency-free JavaScript ES6 slider and carousel. It’s lightweight, flexible and fast. Designed to slide. No less, no more","url":"https://github.com/glidejs/glide","tags":["JavaScript","library","UI"],"content":"依存がないカルーセル/スライダーUIライブラリ","relatedLinks":[]},{"category":"Book","title":"基礎から学ぶ Vue.js | mio |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4863542453/","tags":["JavaScript","Vue","book"],"content":"2018年5月29日発売。\nリファレンス形式のVue.jsについての書籍","relatedLinks":[]},{"category":"Book","title":"ECMAScript Cookbook | PACKT Books","url":"https://www.packtpub.com/web-development/ecmascript-cookbook","tags":["ECMAScript","book"],"content":"ECMAScript 2015以降のコードについて扱うクックブック","relatedLinks":[{"title":"PacktPublishing/ECMAScript-Cookbook: ECMAScript Cookbook, Published By Packt","url":"https://github.com/PacktPublishing/ECMAScript-Cookbook"}]},{"category":"Book","title":"Introduction · Front-End Developer Handbook 2018","url":"https://frontendmasters.com/books/front-end-handbook/2018/","tags":["JavaScript","book"],"content":"Front-End Developer Handbook 2018が公開された","relatedLinks":[]}]},{"meta":{"title":"2018-04-23のJS: Chrome 66、Redux 4.0、Svelte 2.0","author":"azu","layout":"post","date":"2018-04-23T11:03:05.776Z","category":"JSer","tags":["chrome","Redux","svelte"],"url":"https://jser.info/2018/04/23/chrome-66-redux-4.0-svelte-2.0/"},"items":[{"category":"Headline","title":"New in Chrome 66  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/04/nic66","tags":["Chrome","ReleaseNote"],"content":"Chrome 66リリース。\nJSがJSONのsupersetに、trimStart/trimEndのサポート、catch節の引数省略に対応。\nCSS Typed OM、CSS Paint API、AudioWorklet、Mediaの`autoplay`のpolicy変更、Fetch APIが`keepalive`オプションをサポートなど","relatedLinks":[{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features#milestone%3D66"},{"title":"Chromium Blog: Chrome 66 Beta: CSS Typed Object Model, Async Clipboard API, AudioWorklet","url":"https://blog.chromium.org/2018/03/chrome-66-beta-css-typed-object-model.html"}]},{"category":"Headline","title":"Release v4.0.0 · reactjs/redux","url":"https://github.com/reactjs/redux/releases/tag/v4.0.0","tags":["redux","ReleaseNote","TypeScript"],"content":"Redux 4.0.0リリース。\nTypeScriptの型改善、middlewareのdispatchが複数の引数に対応、パフォーマンス改善など","relatedLinks":[]},{"category":"Headline","title":"Release v4.6.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v4.6.0","tags":["webpack","ReleaseNote"],"content":"webpack 4.6.0リリース。\n`import`のコメントでpreloadとprefetchに対応、webpackのコアコードがTypeScriptの`allowJs`と`checkJs`で型チェックされるようになるなど","relatedLinks":[{"title":"add support for link preload/prefetch by sokra · Pull Request #7056 · webpack/webpack","url":"https://github.com/webpack/webpack/pull/7056"},{"title":"Add TypeScript type checking by mohsen1 · Pull Request #6862 · webpack/webpack","url":"https://github.com/webpack/webpack/pull/6862"}]},{"category":"Headline","title":"Svelte v2 is out!","url":"https://svelte.technology/blog/version-2","tags":["JavaScript","ReleaseNote"],"content":"Svelte 2リリース。\nテンプレートの構文を変更、マイグレーションツールの公開、Computed propertiesの引数がオブジェクトに、`component.get`の返り値の変更。\nまた`oncreate`/`ondestroy`のライフサイクルを追加など","relatedLinks":[]},{"category":"Headline","title":"sonarwhal is v1 🎉 – sonarwhal – Medium","url":"https://medium.com/sonarwhal/sonarwhal-is-v1-4262a2f887c9","tags":["JavaScript","Tools","ReleaseNote"],"content":"ウェブサイトのLintツールであるsonarwhal 1.0リリース。","relatedLinks":[]},{"category":"Headline","title":"NativeScript 4.0 is out! 🎉","url":"https://www.nativescript.org/blog/nativescript-4.0-is-out","tags":["JavaScript","ReleaseNote","ios","Android"],"content":"NativeScript 4.0リリース","relatedLinks":[]},{"category":"Headline","title":"Underscore.js","url":"http://underscorejs.org/#1.9.0","tags":["JavaScript","library","ReleaseNote"],"content":"underscore 1.9.0リリース。\n`_.restArguments`、`_.chunk`、`_.isSymbol`などの追加。\n`_.throttle`と`_.debounce`がcancelできるように、パフォーマンス改善など","relatedLinks":[]},{"category":"Article","title":"Hello wasm-pack! – Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2018/04/hello-wasm-pack/","tags":["WebAssembly","Rust","console","Tools"],"content":"RustでWebAssembly向けの開発するツールキット","relatedLinks":[]},{"category":"Article","title":"DasSur.ma – Layers and how to force them","url":"http://dassur.ma/things/forcing-layers/","tags":["CSS","performance","article"],"content":"要素をレイヤー化する方法として`will-change: transform`がある。\nしかし、実際にtransformしていないならば`will-change: opacity`や`backface-visibility: hidden`を使ったほうが良いという話。\n`backface-visibility`の動作についての解説","relatedLinks":[]},{"category":"Article","title":"Dependencies Done Right | Yarn Blog","url":"https://yarnpkg.com/blog/2018/04/18/dependencies-done-right/","tags":["npm","yarn","article"],"content":"pacakge.jsonの`dependencies`、`devDependencies`、`peerDependencies`の意味や使い分けについて。\nバージョンの異なるものが混ざると`instanceof`の問題やファイルサイズが増える問題などについて","relatedLinks":[]},{"category":"Article","title":"Node.js v10の変更点まとめ - 技術探し","url":"http://blog.hiroppy.me/entry/node10","tags":["node.js","article"],"content":"Node.js 10で予定される変更点について","relatedLinks":[]},{"category":"Article","title":"Traversing the DOM with JavaScript | Zell Liew","url":"https://zellwk.com/blog/dom-traversals/","tags":["DOM","article"],"content":"DOMトラバーサルについての記事。\nDOM APIを使ってどのように要素を取得、辿っていくかについて","relatedLinks":[]},{"category":"SlideVideo","title":"Progressive Web App Roadshow - YouTube - YouTube","url":"https://www.youtube.com/playlist?list=PLNYkxOF6rcICnIOm4cfylT0-cEfytBtYt","tags":["PWA","video","google","opinion"],"content":"Progressive Web App(PWA)の概要や何を解決しようとしているものなのか、実装にはなにが必要なのかなどを解説してるシリーズ動画。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"aweary/react-copy-write: ✍️ Immutable state with a mutable API","url":"https://github.com/aweary/react-copy-write","tags":["React","JavaScript","library"],"content":"immerを使ってmutableな操作でstateを更新できるReact Contextを使ったステート管理ライブラリ。","relatedLinks":[]},{"category":"Book","title":"krasimir/react-in-patterns: A free book that talks about design patterns/techniques used while developing with React.","url":"https://github.com/krasimir/react-in-patterns","tags":["React","デザインパターン","book"],"content":"Reactのパターンについての電子書籍","relatedLinks":[]},{"category":"Book","title":"React、Angular、Vue.js、React Nativeを使って学ぶ はじめてのフロントエンド開発 | 原 一浩, taisa, 小松 大輔, 永井 孝, 池内 孝啓, 新井 正貴, 橋本 安司, 日野 洋一郎 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4774197068/","tags":["JavaScript","library","book"],"content":"2018年5月10日発売。\n各フレームワークの紹介とSlackライクなサンプルをベースに解説する書籍","relatedLinks":[]},{"category":"Book","title":"Rediscovering JavaScript: Master ES6, ES7, and ES8: Venkat Subramaniam: 9781680505467: Amazon.com: Books","url":"https://www.amazon.com/dp/1680505467/","tags":["JavaScript","book"],"content":"2018年10月25日発売 ES2015以降についての扱う書籍","relatedLinks":[]},{"category":"Book","title":"Amazon.com: Node.js Microservices - Second Edition: Develop, deploy, and scale microservices with Node 8 eBook: Diogo Resende: Kindle Store","url":"https://www.amazon.com/dp/B079SCMR6T/","tags":["JavaScript","node.js","Microservices","book"],"content":"2018年8月9日発売\nNode.jsのマイクロサービスについての書籍","relatedLinks":[]}]},{"meta":{"title":"2018-05-02のJS: Node.js 10.0.0、npm 6.0.0、Electron 2.0.0","author":"azu","layout":"post","date":"2018-05-02T03:18:06.165Z","category":"JSer","tags":["npm","nodejs","Electron"],"url":"https://jser.info/2018/05/02/node.js-10.0.0-npm-6.0.0-electron-2.0.0/"},"items":[{"category":"Headline","title":"npm/CHANGELOG.md at v6.0.0 · npm/npm","url":"https://github.com/npm/npm/blob/v6.0.0/CHANGELOG.md","tags":["npm","ReleaseNote"],"content":"npm 6.0.0リリース。\n`npm init`で`create-react-app`のようなパッケージを元に初期化できるように、`npm audit`の追加。\nNode.js 4のサポート終了、`npm update`と`npm outdated`の探索アルゴリズムの変更など","relatedLinks":[{"title":"Announcing npm@6 – npm, Inc. – Medium","url":"https://medium.com/npm-inc/announcing-npm-6-5d0b1799a905"}]},{"category":"Headline","title":"rxjs/CHANGELOG.md at 6.0.0 · ReactiveX/rxjs","url":"https://github.com/ReactiveX/rxjs/blob/6.0.0/CHANGELOG.md","tags":["Rx","JavaScript","library","ReleaseNote"],"content":"RxJS 6.0リリース","relatedLinks":[{"title":"RxJS v5.x -","url":"https://docs.google.com/document/d/12nlLt71VLKb-z3YaSGzUfx6mJbc34nsMXtByPUN35cg/edit#heading=h.9gxcyk6xxdc8"}]},{"category":"Headline","title":"Node v10.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v10.0.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 10.0.0リリース。\n10.xは2018年10月にLTSとなる予定。同時にNode-ChakraCoreのプレリリース。\nN-APIがstableに、Assertの変更、V8 6.6への更新、`fs.promises`の追加、`URL`がグローバルへ追加など","relatedLinks":[{"title":"Release Node.js with ChakraCore (node-chakracore-v10.0.0) · nodejs/node-chakracore","url":"https://github.com/nodejs/node-chakracore/releases/tag/node-chakracore-v10.0.0"}]},{"category":"Headline","title":"CKEditor 5 v10.0.0 – the future of rich text editing looks stable","url":"https://ckeditor.com/blog/CKEditor-5-v10.0.0-the-future-of-rich-text-editing-looks-stable/","tags":["editor","JavaScript","library","ReleaseNote"],"content":"CKEditor 5 v10.0.0リリース。\n`contentEditable`ベースではなく、DOM構造をオブジェクトモデルで表現するように、プラグインベースなアーキテクチャに変更。\nライセンスがGPL+LGPL+MPLのトリプルライセンスからGPL 2+のみに変更。","relatedLinks":[]},{"category":"Headline","title":"API documentation - Sinon.JS","url":"http://sinonjs.org/releases/v5.0.1/","tags":["JavaScript","testing","library","ReleaseNote"],"content":"SinonJS 5.0.1リリース。\n`sinon.replace`や`sinon.fake`の追加、`sinon`オブジェクトがデフォルトでsandboxに変更、ES5をサポートしてない実行環境はshimが必要になるなど","relatedLinks":[{"title":"sinon/History.md at master · sinonjs/sinon","url":"https://github.com/sinonjs/sinon/blob/master/History.md#501--2018-04-27"},{"title":"New API: default sandbox and fake by mroderick · Pull Request #1586 · sinonjs/sinon","url":"https://github.com/sinonjs/sinon/pull/1586"}]},{"category":"Headline","title":"Release electron v2.0.0 · electron/electron","url":"https://github.com/electron/electron/releases/tag/v2.0.0","tags":["Electron","ReleaseNote"],"content":"Electron 2.0.0リリース。\nChrome 61、Node.js 8.9、V8 6.1への更新。\n`menu.popup`のシグネチャーの変更、deprecatedなAPIを削除など","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 67 Beta: WebXR Origin Trial, Generic Sensors","url":"https://blog.chromium.org/2018/04/chrome-67-beta-webxr-origin-trial.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 67βリリース。\nGeneric Sensor API、WebXR Device APIのorigin trialの開始。\nBigIntの実装、TransformStreamの実装、Client Hintの`Accept-CH-Lifetime`の対応など","relatedLinks":[{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features#milestone%3D67"},{"title":"Accept-CH-Lifetime support for requesting client hints - Chrome Platform Status","url":"https://www.chromestatus.com/feature/5713139295322112"}]},{"category":"Article","title":"last 2 versions\" considered harmful","url":"https://jamie.build/last-2-versions","tags":["article","browser","Tools"],"content":"autoprefixerなどで使われるbrowserlistの`last 2 versions`指定では、シェアが0%のブラウザも\"最新の2バージョン\"に含まれてしまう問題について。","relatedLinks":[]},{"category":"Article","title":"日経電子版を支える広告技術 — HACK The Nikkei","url":"https://hack.nikkei.com/blog/tech_book_fest04_ds_ad_tech/","tags":["JavaScript","article","広告"],"content":"ウェブサイトのパフォーマンスを劣化させる広告(SDK)とその対策について。 無駄なRTTの削減、ファイルサイズの削減。 メインスレッドで同期処理される`document.write()`対策としてShadow DOMやiframeでの実行やIntersection Observerでの遅延ロードについて。","relatedLinks":[]},{"category":"Article","title":"Introducing the Microsoft Edge DevTools Preview app - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2018/04/25/introducing-the-microsoft-edge-devtools-preview-app/","tags":["MSEdge","debug","Tools","article"],"content":"MSEdgeの開発者ツールをベースにした単体のデバッグアプリについて。\nEDP(Edge DevTools Protocol)を使ってブラウザの外部からデバッグができる。","relatedLinks":[{"title":"Microsoft Edge DevTools Protocol - Microsoft Edge Development | Microsoft Docs","url":"https://docs.microsoft.com/en-us/microsoft-edge/devtools-protocol/"}]},{"category":"Article","title":"A Vue.js App Using Axios With Vuex","url":"https://www.thepolyglotdeveloper.com/2018/04/vuejs-app-using-axios-vuex/","tags":["Vue","article","tutorial"],"content":"Vue、Vuex、Vue Routerを使ったアプリを作るチュートリアル。","relatedLinks":[]},{"category":"Article","title":"Visualizing Layers in Web Inspector | WebKit","url":"https://webkit.org/blog/8262/visualizing-layers-in-web-inspector/","tags":["safari","debug","article"],"content":"SafariのTechnology PreviewにLayer タブが追加された。\nページのレイヤー構造を可視化できるデバッグツール。\nCompositionの問題やコストが高いレイヤーを見つけることができる。","relatedLinks":[]},{"category":"Article","title":"BigInt: arbitrary-precision integers in JavaScript  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/05/bigint","tags":["Chrome","JavaScript","ECMAScript","article"],"content":"Chrome 67で実装された`BitInt`についての解説。\n`Number`とは異なり任意精度の整数を扱える新しいプリミティブ値。\nリテラル表現、typeofの結果、演算子での動き、BigIntとNumberでの演算は`TypeError`になる点などについて","relatedLinks":[{"title":"JavaScriptの任意精度整数: BigInt vs big-integer - Qiita","url":"https://qiita.com/shimataro999/items/ec6fb9e2601cb6e97b82"}]},{"category":"SlideVideo","title":"祝Node-v10リリース これまでのNodeの振り返り // Speaker Deck","url":"https://speakerdeck.com/shigeki/zhu-node-v10ririsu-koremadefalsenodefalsezhen-rifan-ri","tags":["node.js","slide"],"content":"Node.js 10での変更点についてのスライド。\nV8の更新。`for await...of`とStreamの対応、`Error.code`の変更、`EventEmitter#off`の追加、`fs/promises`の追加、`assert.strict`の追加など","relatedLinks":[]},{"category":"WebsiteDocument","title":"TypeScript playground","url":"https://agentcooper.github.io/typescript-play/","tags":["TypeScript","webservice","Tools","editor"],"content":"TypeScript playgroundツール。\n公式のものに比べてTypeScriptのバージョンが選択でき、オプションも詳細に設定できるなどの違いがある。\nまた、入力毎に共有しやすいパーマネントURLを更新してくれる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"BundlePhobia | cost of adding a npm package","url":"https://bundlephobia.com/scan","tags":["webservice","npm","browser"],"content":"package.jsonをアップロードすると依存してるモジュールのファイルサイズ(gzip)などを一覧表示してくれるサービス","relatedLinks":[]},{"category":"WebsiteDocument","title":"linkedin/css-blocks: High performance, maintainable stylesheets.","url":"https://github.com/linkedin/css-blocks","tags":["CSS","library"],"content":"CSSのサブセットとして動くCSS in JSのライブラリとツール。\nコンポーネントと紐付けることで、CSSのクラス名なども圧縮や不要なコードを削除などの最適化ができる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jhiesey/stream-http: Streaming node http in the browser","url":"https://github.com/jhiesey/stream-http","tags":["HTTP","Fetch","library"],"content":"Fetch with streamなどを使ったStream取得HTTPライブラリ。\n非対応のブラウザでは擬似的なStreamを作る","relatedLinks":[]},{"category":"SoftwareLibrary","title":"xx45/dayjs: ⏰Fast 2KB immutable date library alternative to Moment.js with the same modern API","url":"https://github.com/xx45/dayjs","tags":["JavaScript","library"],"content":"ファイルサイズの小さな日付操作ライブラリ。\nmoment.jsの一部と似たAPIを持ち、Immutableなライブラリ。","relatedLinks":[]},{"category":"Book","title":"Hands on Next.js by Christian Nwamba \\[Leanpub PDF/iPad/Kindle\\]","url":"https://leanpub.com/hands-on-nextjs","tags":["server","book","React"],"content":"Next.jsについての書籍","relatedLinks":[]}]},{"meta":{"title":"2018-05-08のJS: Dojo 2.0リリース、Angular 6.0.0リリース","author":"azu","layout":"post","date":"2018-05-08T01:34:28.622Z","category":"JSer","tags":["Dojo","Angular"],"url":"https://jser.info/2018/05/08/dojo-2.0-angular-6.0.0/"},"items":[{"category":"Headline","title":"Introducing Dojo 2.0! | Dojo","url":"https://dojo.io/blog/2018/05/02/2018-05-02-Dojo2-0-0-release/","tags":["JavaScript","library","ReleaseNote"],"content":"Dojo 2.0リリース。\nTypeScriptベースとなり、Virtual DOMを実装しているWidgetsクラスベースのUIシステムをもつ。\nEjectableなdojo/cliを持ちセットアップやデプロイなどを簡単に扱えるようにしている。","relatedLinks":[]},{"category":"Headline","title":"parcel/changelog.md at master · parcel-bundler/parcel","url":"https://github.com/parcel-bundler/parcel/blob/master/changelog.md#180---2018-05-03","tags":["JavaScript","Tools","ReleaseNote"],"content":"Parcel 1.8.0リリース。\n複数のエントリポイントのサポート、モジュールをUMDとしてexportするように、デフォルトのbrowserlistを`> 0.25`に変更など","relatedLinks":[]},{"category":"Headline","title":"Version 6 of Angular Now Available – Angular Blog","url":"https://blog.angular.io/version-6-of-angular-now-available-cc56b0efa7a4","tags":["Angular","ReleaseNote"],"content":"Angular 6.0.0リリース。LTSとなるバージョン。\nCLIに`ng update`/`ng add`コマンドの追加、Angular Elements、Treeshakable Providerなど。\n破壊的な変更としてCLI設定ファイル名が`angular.json`に変更、RxJS 6へ更新など","relatedLinks":[{"title":"angular/CHANGELOG.md at master · angular/angular","url":"https://github.com/angular/angular/blob/master/CHANGELOG.md#600-2018-05-03"},{"title":"Releases · angular/angular-cli","url":"https://github.com/angular/angular-cli/releases"},{"title":"Angular - Angular versioning and releases","url":"https://angular.io/guide/releases"}]},{"category":"Headline","title":"Release v4.8.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v4.8.0","tags":["webpack","ReleaseNote"],"content":"webpack 4.8.0リリース。\nWebAssemblyで可能なら`instantiateStreaming`を利用するように","relatedLinks":[]},{"category":"Headline","title":"phoboslab/Impact: HTML5 Game Engine","url":"https://github.com/phoboslab/Impact","tags":["JavaScript","game","library","news"],"content":"ゲームエンジンImpactjsのソースコードが公開された","relatedLinks":[{"title":"Impact - HTML5 Canvas & JavaScript Game Engine","url":"http://impactjs.com/"}]},{"category":"Article","title":"What’s new in Microsoft Edge in the Windows 10 April 2018 Update - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2018/04/30/edgehtml-17-april-2018-update/","tags":["MSEdge","article"],"content":"Windows 10 April 2018 UpdateにおけるMSEdgeの変更について。","relatedLinks":[]},{"category":"Article","title":"<link rel=”prefetch/preload”> in webpack – webpack – Medium","url":"https://medium.com/webpack/link-rel-prefetch-preload-in-webpack-51a52358f84c","tags":["webpack","article","performance"],"content":"webpack 4.6.0でサポートされた `import(/* webpackPrefetch: true */ \"module\")`について。\nchunkとprefetch/preloadの制御を行うマジックコメント","relatedLinks":[]},{"category":"Article","title":"recomposeではじめるReact Higher-order Components(HoCs) - Qiita","url":"https://qiita.com/locol23/items/ad9c7553176c239f0b15","tags":["React","article","library"],"content":"recomposeが提供するAPIについての解説。","relatedLinks":[]},{"category":"SlideVideo","title":"BlinkOn9: Lightning Talks! - Google スプレッドシート","url":"https://docs.google.com/spreadsheets/d/1DovPnWWSXuG8PRyN-HT7R9gZ4PLihly5ZepqZJ3vmAc/edit#gid=0","tags":["blink","V8","Chrome","イベント"],"content":"BlinkOn9の動画やスライドまとめ","relatedLinks":[]},{"category":"SlideVideo","title":"Advanced React Patterns","url":"https://frontendmasters.com/courses/advanced-react-patterns/","tags":["React","video","tutorial"],"content":"ReactのRender Props、State管理、Provider/Combiningパターンについての動画講座","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ds300/patch-package: Fix broken node modules with no fuss 📦👌","url":"https://github.com/ds300/patch-package","tags":["npm","library","Tools"],"content":"npmで配布されているモジュールに対してインストール時にpatchを当てるツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Oblosys/react-lifecycle-visualizer: Real-time visualizer for React lifecycle methods","url":"https://github.com/Oblosys/react-lifecycle-visualizer","tags":["React","library"],"content":"Reactのライフサイクルイベントを可視化するライブラリ。\nHOCとして動作する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sindresorhus/ow: Function argument validation for humans","url":"https://github.com/sindresorhus/ow","tags":["JavaScript","library"],"content":"関数の引数をバリデーションする関数を作成するライブラリ。\nエラーメッセージが英語として読めるような物が出力される","relatedLinks":[]},{"category":"Book","title":"The Ember.js Way (Developer's Library): Brian Cardarella, Alex Navasardyan: 9780321994530: Amazon.com: Books","url":"https://www.amazon.com/dp/0321994531/","tags":["Ember","book"],"content":"2019年2月26日発売\nEmber.jsについての書籍","relatedLinks":[]},{"category":"Book","title":"WebAssembly 開発環境構築の本 | WebAssembly 開発環境構築の本","url":"https://wasm-dev-book.netlify.com/","tags":["WebAssembly","book"],"content":"WebAssemblyについての電子書籍。\nWebAssemblyの開発環境やRust、TypeScriptとの連携方法についてなど","relatedLinks":[{"title":"WebAssembly 開発環境構築の本を公開しました - mizdra's blog","url":"http://www.mizdra.net/entry/2018/05/07/080000"}]}]},{"meta":{"title":"2018-05-15のJS: フロントエンドツールアンケート結果、Firefox 60、Lighthouse 3.0β","author":"azu","layout":"post","date":"2018-05-15T01:33:11.228Z","category":"JSer","tags":["frontend","firefox","Lighthouse"],"url":"https://jser.info/2018/05/15/frontend-tooling-firefox-60-lighthouse-3.0b/"},"items":[{"category":"Headline","title":"Node v10.1.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v10.1.0/","tags":["node.js","ReleaseNote"],"content":"Node v10.1.0リリース。\n`require(\"fs/promises\")`が`require(\"fs\").promises`に変更、`request.aborted`プロパティの追加など","relatedLinks":[]},{"category":"Headline","title":"Firefox — Notes (60.0) — Mozilla","url":"https://www.mozilla.org/en-US/firefox/60.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 60.0リリース。\nES Modulesの有効化、`Array#values`の有効化、Web Authentication APIのサポート、WebVR APIがmacOSで有効化。\nまたESRのバージョンが60へ更新など。","relatedLinks":[{"title":"Firefox 60 – Modules and More – Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2018/05/firefox-60-modules-and-more/"},{"title":"Firefox 60 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/60"}]},{"category":"Headline","title":"Video.js 7 is here! 🎉 | Video.js Blog","url":"http://blog.videojs.com/video-js-7-is-here/","tags":["JavaScript","video","library","ReleaseNote"],"content":"Video.js 7リリース。\nVideo.js HTTP Streaming (VHS)プラグインでHLSとDASHを試験的にサポート。\n古いブラウザサポートのコードを削除、オプトアウトだったGoogle Analyticsの収集を終了など","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0 · webpack-contrib/webpack-serve","url":"https://github.com/webpack-contrib/webpack-serve/releases/tag/v1.0.0","tags":["webpack","debug","library","ReleaseNote"],"content":"webpack-serve 1.0.0リリース。\n`webpack-dev-server`の後継となるwebpack向けの開発サーバ","relatedLinks":[]},{"category":"Headline","title":"Release v0.72.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.72.0","tags":["flowtype","ReleaseNote"],"content":"flow 0.72.0リリース。\n`$Either<T>`, `$All<T>`, `$Type<T>`の廃止。\nLanguage Server Protocolの改善、Stage 1のnullish coalescingをサポートなど","relatedLinks":[]},{"category":"Headline","title":"The Front-End Tooling Survey 2018 - Results - AshleyNolan.co.uk - Blog and Portfolio for Ashley Nolan","url":"https://ashleynolan.co.uk/blog/frontend-tooling-survey-2018-results","tags":["CSS","JavaScript","Tools","アンケート","news"],"content":"JavaScript、CSS、ツールなどについての開発者アンケート。 利用言語、ライブラリ、Lint、テスト、bundlerなどについて項目ごとのアンケート結果が公開されている","relatedLinks":[]},{"category":"Article","title":"Using Lighthouse To Improve Page Load Performance  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/05/lighthouse","tags":["JavaScript","Tools","performance","article"],"content":"Lighthouseによって検出できるページロードパフォーマンスの問題について。\npreloadした方がいいリソースの表示、JavaScriptのパースと実装の時間表示、リダイレクト検出、利用してないコード量の表示、preconnectによるRTTのコストの削減予測など","relatedLinks":[]},{"category":"Article","title":"The npm Blog — \\`npm audit\\`: identify and fix insecure...","url":"https://blog.npmjs.org/post/173719309445/npm-audit-identify-and-fix-insecure","tags":["npm","article"],"content":"npm 6で入ったセキュリティチェックをする`npm audit`コマンドについての解説","relatedLinks":[]},{"category":"Article","title":"Introducing the Microsoft Edge DevTools Protocol - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2018/05/11/introducing-edge-devtools-protocol/#0b7zCRAl1ApIqZ6D.97","tags":["MSEdge","article","debug"],"content":"リモートデバッグができるMicrosoft Edge DevTools Protocolの解説。","relatedLinks":[]},{"category":"Article","title":"実践PWA：光る電卓「Llumino PWA」の開発と技術解説 - ここぽんのーと","url":"https://cocopon.me/blog/2018/05/pwa-llumino-dev/","tags":["PWA","JavaScript","article"],"content":"ネイティブアプリだったものをPWAで再現する話。\nCSSアニメーション、Service Worker、Web App Manifest、インタラクションについて","relatedLinks":[]},{"category":"Article","title":"Announcing Lighthouse 3.0  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/05/lighthouse3","tags":["JavaScript","ReleaseNote","Tools","performance"],"content":"Lighthouse 3.0プレリリース。 レポートUIの変更、それぞれのスコアのWeightの変更、First Contentful Paintの追加、RTTのコスト表示の追加など。 その他の変更点としてFirst InteractiveをFirst CPU Idleに名前の変更など","relatedLinks":[]},{"category":"SlideVideo","title":"Google I/O 2018 - All Sessions - YouTube - YouTube","url":"http://www.youtube.com/playlist?list=PLOU2XLYxmsIInFRc3M44HUTQc3b_YJ4-Y","tags":["google","video"],"content":"Google I/O 2018の動画まとめ","relatedLinks":[]},{"category":"SlideVideo","title":"TSConf 2018 - YouTube - YouTube","url":"https://www.youtube.com/playlist?list=PL2z7rCjEG2ksF0rJ8Qwp1y5eTjqiPIRfT","tags":["TypeScript","イベント","video"],"content":"TSConf 2018の動画まとめ","relatedLinks":[{"title":"TSConf 2018 | Seattle","url":"https://tsconf.io/"}]},{"category":"SlideVideo","title":"What's new in Chrome DevTools (Google I/O '18) - YouTube","url":"https://www.youtube.com/watch?v=mfuE53x4b3k&feature=youtu.be","tags":["Chrome","debug","video"],"content":"Chromeの開発者ツールの新しい機能について。\n非同期処理やWorkerでのブレークポイントの改善、検索機能の改善、LightHouseのアップデートとView Traceのデモ、コンソールのEaget Evaluationのデモなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jspm.io - Native ES Modules CDN","url":"https://jspm.io/","tags":["JavaScript","library","webservice"],"content":"npmモジュールをES moduleとしてロードできるようにしてくれるCDNサービス。\nCommonJSなモジュールはES moduleとして読み込めるように変換される。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"isomorphic-git/isomorphic-git: A pure JavaScript implementation of git for node and browsers!","url":"https://github.com/isomorphic-git/isomorphic-git","tags":["JavaScript","git","library"],"content":"Pure JavaScriptなGitの実装ライブラリ。\nNode.jsとブラウザで動作する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Nest - A progressive Node.js web framework","url":"https://nestjs.com/","tags":["node.js","library","TypeScript"],"content":"Node.jsのウェブフレームワーク。\nTypeScriptで書かれていて、AngularのようにDecoratorを使った宣言的な記述を行う。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jorgebucaran/classcat: JavaScript function for conditionally concatenating CSS classes.","url":"https://github.com/jorgebucaran/classcat","tags":["JavaScript","library"],"content":"CSSのクラス名文字列を結合したり、条件付きで消したりするライブラリ。","relatedLinks":[]}]},{"meta":{"title":"2018-05-22のJS: Firefox 61の開発者ツール、Next.js 6、Data-Forge","author":"azu","layout":"post","date":"2018-05-21T23:42:56.258Z","category":"JSer","tags":["firefox","Next.js","data"],"url":"https://jser.info/2018/05/22/firefox-61next.js-6data-forge/"},"items":[{"category":"Headline","title":"New in Firefox 61: Developer Edition – Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2018/05/new-in-firefox-61-developer-edition/","tags":["firefox","ReleaseNote"],"content":"Firefox 61 Developer Editionの変更点について。\n開発者ツールの改善、Source Mapの対応改善、HARファイルのimport/export、アクセシビリティインスペクタの追加など。","relatedLinks":[]},{"category":"Headline","title":"TestCafe v0.20.0 Released | TestCafe","url":"http://devexpress.github.io/testcafe/blog/testcafe-v0-20-0-released.html","tags":["JavaScript","testing","ReleaseNote"],"content":"TestCafe v0.20.0リリース。\nHTTPリクエスト、レスポンスのhookを行えるように。\nproxyを無視できるパターンを指定できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 2.9 RC | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2018/05/16/announcing-typescript-2-9-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.9 RCリリース。\n`keyof`がSymbolとnumberに対応、`import(path)` typeのサポート、`import.meta`のサポート、JSXのgenericsをサポートなど","relatedLinks":[]},{"category":"Headline","title":"saadq/lynt: ✨ A zero config JavaScript linter with support for Typescript, Flow, and React.","url":"https://github.com/saadq/lynt","tags":["JavaScript","Tools","TypeScript","React","flowtype"],"content":"設定なしに使えることを目的としたLintツール。\nESLintやTSLintを使いopinionatedなLintを行う。\nスタイルに関するルールは含めずにエラーに関するものだけに限定している。","relatedLinks":[]},{"category":"Headline","title":"ZEIT – Next.js 6 and Nextjs.org","url":"https://zeit.co/blog/next6","tags":["node.js","JavaScript","React","ReleaseNote"],"content":"Next.js 6リリース。\n`_app.js`でアプリのライフサイクルなどに対して拡張できるように、Babel 7(RC)にアップデート、`@babel/preset-typescript`を使ってTypeScriptをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v5.2.0 · mochajs/mocha","url":"https://github.com/mochajs/mocha/releases/tag/v5.2.0","tags":["JavaScript","testing","ReleaseNote"],"content":"Mocha 5.2.0リリース。\n`mocha.opts`にコメントがかけるように、APIドキュメントの更新など","relatedLinks":[{"title":"Home - Documentation","url":"https://mochajs.org/api/"}]},{"category":"Headline","title":"Release 3.0.0-beta.1 - 2018.05.20 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.0.0-beta.1","tags":["JavaScript","library","polyfill","ReleaseNote"],"content":"core-js 3.0.0 β1リリース。\nProposalである`Object.fromEntries`、`Map`や`Set`のコレクションメソッドの実装など。\nあわせてwithdrawされたProposalの実装を削除。\nまたいくつかのブラウザバージョンでのバグに対処など","relatedLinks":[{"title":"core-js@3 by zloirock · Pull Request #325 · zloirock/core-js","url":"https://github.com/zloirock/core-js/pull/325"}]},{"category":"Headline","title":"Chromium Blog: Evolving Chrome's security indicators","url":"https://blog.chromium.org/2018/05/evolving-chromes-security-indicators.html","tags":["Chrome","HTTPS","HTTP","security"],"content":"ChromeのHTTPSとHTTPのURLバーの表示の変更予定について。\nHTTPSはデフォルトになっていくため\"Secure\"ラベルを外していき、\nHTTPの方が例外的なものとして\"Not Secure\"というラベルをつけるという方針について。","relatedLinks":[]},{"category":"Article","title":"Storybook vs Styleguidist – Chroma","url":"https://blog.hichroma.com/storybook-vs-styleguidist-2bd93d6dcc06","tags":["JavaScript","React","article"],"content":"StorybookとStyleguidistの違い、どのようなときに使うのかについて","relatedLinks":[]},{"category":"Article","title":"Type-Safe Object Merging in TypeScript 2.8","url":"https://spin.atomicobject.com/2018/05/14/type-safe-object-merging-2-8/","tags":["TypeScript","article"],"content":"TypeScript 2.8のConditional Typeを使ったType Safeなオブジェクトマージについて","relatedLinks":[]},{"category":"SlideVideo","title":"Native JavaScript modules by Serg Hospodarets","url":"https://slides.com/malyw/native-js-modules#/","tags":["JavaScript","module","slide"],"content":"ES modulesについてのスライド。\nAMD、CommonJSなどとの比較、`<script type=module>`がDeferred by defaultであることやmoduleの動作について。\nまた循環参照の対応、パスの扱い、Dynamic import、パフォーマンスやテストなどについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sloria/local-repl: 🐚 Project-specific configuration for the Node.js REPL","url":"https://github.com/sloria/local-repl","tags":["node.js","Tools"],"content":"Node.jsでプロジェクト毎にaliasや依存などを指定できるREPL","relatedLinks":[]},{"category":"SoftwareLibrary","title":"home","url":"https://layerjs.org/","tags":["JavaScript","library","HTML","animation"],"content":"`Stage`と`Frame`の属性を付けた要素を元にレイヤーを作り、トランジションなどの遷移アニメーションを表現するライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"planttheidea/fast-copy: A blazing fast deep object copier","url":"https://github.com/planttheidea/fast-copy","tags":["JavaScript","library"],"content":"オブジェクトのdeep copyを行うライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Data-Forge","url":"http://www.data-forge-js.com/","tags":["JavaScript","library"],"content":"CSVやJSONなどのデータの読み込み、加工、集約、整形などを行うライブラリ。\nLINQとPandasをインスパイアして作成されていて、メソッドチェーン(内部的にIterator)で処理を書ける。","relatedLinks":[{"title":"Manning | Data Wrangling with JavaScript","url":"https://www.manning.com/books/data-wrangling-with-javascript?a_aid=datawranglingwithjavascript&a_bid=acc654f9"}]},{"category":"SoftwareLibrary","title":"rsuite/rsuite: A suite of React components .","url":"https://github.com/rsuite/rsuite","tags":["React","UI","library"],"content":"Reactを使ったUIコンポーネント集ライブラリ","relatedLinks":[]},{"category":"Book","title":"Manning | Data Wrangling with JavaScript","url":"https://www.manning.com/books/data-wrangling-with-javascript?a_aid=datawranglingwithjavascript&a_bid=acc654f9","tags":["JavaScript","book"],"content":"JavaScriptを使ったデータラングリング(データ処理)についての書籍","relatedLinks":[]},{"category":"Book","title":"Pro Vue.js 2: Adam Freeman: 9781484238042: Amazon.com: Books","url":"https://www.amazon.com/dp/1484238044/","tags":["Vue","JavaScript","book"],"content":"2019年1月17日発売\nVueについての書籍","relatedLinks":[]}]},{"meta":{"title":"2018-05-29のJS: React v16.4.0、Chrome 68の開発者ツール、自分で作るbundler","author":"azu","layout":"post","date":"2018-05-29T01:42:22.336Z","category":"JSer","tags":["React","Chrome","bundler"],"url":"https://jser.info/2018/05/29/react-v16.4.0chrome-68bundler/"},"items":[{"category":"Headline","title":"React v16.4.0: Pointer Events - React Blog","url":"https://reactjs.org/blog/2018/05/23/react-v-16-4.html","tags":["React","ReleaseNote"],"content":"React 16.4リリース。\n`getDerivedStateFromProps`のバグ修正、Pointer Eventsのサポート。\n試験的に`<Profiler />`のサポート、また実験的実装だったReact Call Returnを削除など","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at 11.11.0 · jsdom/jsdom","url":"https://github.com/jsdom/jsdom/blob/11.11.0/Changelog.md","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"jsdom 11.11.0リリース。\n`Node#getRootNode`メソッドの追加、`whatwg-url`のアップデートなど","relatedLinks":[]},{"category":"Headline","title":"Node v10.2.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v10.2.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 10.2.0リリース。\n`assert.throws`の第2引数のバリデーションオブジェクトに正規表現を指定できるように。\nCore APIのモジュールがnamed exportされるようになりES moduleからはnamed importできるようになるなど","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates at 2018-05 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2018/05/28/ecmascript-proposal-updates","tags":["ECMAScript","proposal","news"],"content":"2018年5月に行われたTC39ミーティング結果のECMAScript ProposalのStatus変更点まとめ。\nOptional `catch`、JSON supersetがStage 4となった。","relatedLinks":[]},{"category":"Headline","title":"Prettier 1.13: Conquering the web! · Prettier","url":"https://prettier.io/blog/2018/05/27/1.13.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 1.13リリース。\nブラウザで動作するように、TypeScritp 2.9のサポート。\n`JSON.stringify`スタイルのフォーマットをサポートし`pacakge.json`とnpm/yarnとの整形の互換性を向上など","relatedLinks":[]},{"category":"Headline","title":"Release v4.10.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v4.10.0","tags":["JavaScript","bundler","webpack","ReleaseNote"],"content":"webpack v4.10.0リリース。\nWebAssemblyのTree Shakingをサポート(Dead Code Eliminationは未実装)、wasmのruntimeのファイルサイズを軽量化など","relatedLinks":[]},{"category":"Article","title":"JavaScriptのStreams APIで細切れのデータを読み書きする","url":"https://sbfl.net/blog/2018/05/26/javascript-streams-api/","tags":["stream","JavaScript","DOM","article"],"content":"WHATWG Stream APIについて。\nReadable Stream、TransformStream、WritableStreamの使い方や繋げ方について","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 68)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/05/devtools","tags":["Chrome","debug","article"],"content":"Chrome 68の開発者ツールの変更点について。\nEaget Evaluation、補完の改善、Lighthouse 3.0への更新、\"Add property path watch\"の追加など","relatedLinks":[]},{"category":"Article","title":"Web最新技術がてんこ盛りのreact-native-domから目が離せない - ナカザンドットネット","url":"http://blog.nkzn.info/entry/2018/05/26/020312","tags":["React","DOM","article"],"content":"React Native DOMというReact NativeをWebにPortするライブラリについての解説。\nどのような仕組みでReact NativeのものをWebにPortしているかについて","relatedLinks":[{"title":"vincentriemer/react-native-dom: An experimental, comprehensive port of React Native to the web.","url":"https://github.com/vincentriemer/react-native-dom"}]},{"category":"Article","title":"Drupal JavaScript Initiative: The Road to a Modern Administration UI | Lullabot","url":"https://www.lullabot.com/articles/drupal-javascript-initiative-the-road-to-a-modern-administration-ui","tags":["JavaScript","React","server","library","article","CMS"],"content":"DrupalはjQueryをコアに採用していたが、モダンなJavaScriptの仕組みを取り込むためにReactを採用することにした。\nこの決定をするために管理画面のプロトタイプを作成し、どのようなことを学び、課題を見つけたかについて。またフォームの問題についてなど","relatedLinks":[{"title":"jsdrupal/drupal-admin-ui: v fancy ⬅️✌️➡️","url":"https://github.com/jsdrupal/drupal-admin-ui"}]},{"category":"Article","title":"ブラウザのネットワークエラーをレポートさせるNetwork Error Loggingが来た - ASnoKaze blog","url":"https://asnokaze.hatenablog.com/entry/2018/05/28/210830","tags":["Chrome","debug","network","article"],"content":"Chrome開発版で実装されたNetwork Error Loggingについて。\nネットワークエラーが発生したときに指定したエンドポイントでレポートを送ることができる仕組み。\nDNSやTCP、TLSなどについてのエラーをクライアントから送信できる","relatedLinks":[]},{"category":"SlideVideo","title":"ReactEurope 2018 - Day 1 - YouTube - YouTube","url":"https://www.youtube.com/playlist?list=PLCC436JpVnK3xH_ArpIjdkYDGwWNkVa73","tags":["React","イベント","video"],"content":"ReactEurope 2018の動画まとめ","relatedLinks":[{"title":"ReactEurope 2018 - Day 2 - YouTube - YouTube","url":"https://www.youtube.com/playlist?list=PLCC436JpVnK1X7atG6EIz467Evs4TMX_5"}]},{"category":"SlideVideo","title":"PWA Beginners 勉強会 #4 A2HSのちょっと深い話v2","url":"https://www.slideshare.net/MasahikoJinno2/pwa-beginners-4-a2hsv2","tags":["ios","Android","Chrome","slide","PWA"],"content":"Add to HomeScreenについてのスライド。\n対応方法、App Install Bannersの制御やユースケースについて。\nまたAndroid/Chromeでの動作とiOS/Safariでの動作の違いなどについて","relatedLinks":[]},{"category":"SlideVideo","title":"Assert(js) Conf 2018 - YouTube - YouTube","url":"https://www.youtube.com/playlist?list=PLZ66c9_z3umNSrKSb5cmpxdXZcIPNvKGw","tags":["JavaScript","testing","video"],"content":"Assert(JS)カンファレンスの動画まとめ","relatedLinks":[{"title":"Assert(js)","url":"https://www.assertjs.com/"}]},{"category":"WebsiteDocument","title":"Ameba Accessibility Guidelines","url":"https://openameba.github.io/a11y-guidelines/","tags":["accessibility","document"],"content":"Amebaのアクセシビリティガイドライン。\n項目ごとにWCAG 2.0との対応項目、悪い実装例、良い実装例が書かれている","relatedLinks":[]},{"category":"WebsiteDocument","title":"popcodeorg/popcode: An HTML/CSS/JavaScript editor for use in the classroom","url":"https://github.com/popcodeorg/popcode","tags":["HTML","CSS","JavaScript","Tools","editor"],"content":"JSFiddleのようなエディタ環境ウェブアプリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"GoogleChromeLabs/audioworklet-polyfill: 🔊 Polyfill AudioWorklet using the legacy ScriptProcessor API.","url":"https://github.com/GoogleChromeLabs/audioworklet-polyfill","tags":["JavaScript","audio","library"],"content":"AudioWorkletのpolyfill","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Vuesax","url":"https://lusaxweb.github.io/vuesax/","tags":["Vue","library"],"content":"VueコンポーネントのUIフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Wired Elements","url":"https://wiredjs.com/","tags":["JavaScript","UI","WebComponents","library"],"content":"Web Componentsとして実装されている手書き風のUIコンポーネントライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"trekhleb/javascript-algorithms: Algorithms and data structures implemented in JavaScript with explanations and links to further readings","url":"https://github.com/trekhleb/javascript-algorithms","tags":["JavaScript","algorithm","library"],"content":"JavaScriptで様々なデータ構造/探索アルゴリズムを実装しているリポジトリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vladocar/flexy: Flexy is minimal CSS framework made with Flex","url":"https://github.com/vladocar/flexy","tags":["CSS","library"],"content":"Flexboxを使った小さなレイアウトフレームワーク。\nカラムレイアウトをクラス名で指定できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ronami/minipack: 📦 A simplified example of a modern module bundler written in JavaScript","url":"https://github.com/ronami/minipack","tags":["JavaScript","AST","example"],"content":"JavaScriptパーサを使った小さなbundlerの実装サンプル。\nどのようにbundlerを実装するかがコメント付きで紹介されている。","relatedLinks":[{"title":"Build your own bundler by Ronen Amiel","url":"https://slides.com/ronenamiel/build-your-own-bundler-10-13#/"}]},{"category":"SoftwareLibrary","title":"xtuc/webassemblyjs: Toolchain for WebAssembly","url":"https://github.com/xtuc/webassemblyjs","tags":["AST","JavaScript","WebAssembly","library"],"content":"WebAssemblyのAST Toolchain。 Parser、Traverser、Printer、AST編集のヘルパー、整形ツールなどを揃えたmonorepo","relatedLinks":[]},{"category":"Book","title":"js-primer(JavaScript入門本)がオフラインで読めるようになりました | Web Scratch","url":"https://efcl.info/2018/05/25/js-primer-offline/","tags":["JavaScript","book"],"content":"js-primerがworkboxを使ってオフラインでも読めるようになった。 同じオフラインでもpdfやepubと違って内容が更新されれば、自動的に最新版を見られる。","relatedLinks":[]}]},{"meta":{"title":"2018-06-05のJS: Safari 12の変更予定、Jest 23、sucrase","author":"azu","layout":"post","date":"2018-06-05T00:34:04.007Z","category":"JSer","tags":["safari","jest","babel","transpiler"],"url":"https://jser.info/2018/06/05/safari-12jest-23sucrase/"},"items":[{"category":"Headline","title":"New in Chrome 67  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/05/nic67","tags":["Chrome","ReleaseNote"],"content":"Chrome 67リリース。\nDesktop PWA、Generic Sensor API、`BigInt`のサポート、開発者ツールの更新など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 2.9 | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2018/05/31/announcing-typescript-2-9/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 2.9リリース。\n`import()` typeの追加、JSONファイルをimportしたときに型推論がされるように、Tagged Template Stringの型改善など","relatedLinks":[{"title":"TypeScript 2.9 変更点 - Qiita","url":"https://qiita.com/utatti/items/9f6c60f11620f7df50c0"},{"title":"TypeScript 2.9.1 変更点 - Qiita","url":"https://qiita.com/vvakame/items/0b22e5e34023e4c5d074"}]},{"category":"Headline","title":"Release 1.0.0-beta.5 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v1.0.0-beta.5","tags":["JavaScript","testing","ReleaseNote"],"content":"AVA 1.0.0-beta.5リリース。\n`ava.config.js`の設定ファイルのサポート、`t.throws`で`code`プロパティをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 8.6 “Follow Reason” · postcss/autoprefixer","url":"https://github.com/postcss/autoprefixer/releases/tag/8.6.0","tags":["CSS","Tools","ReleaseNote"],"content":"Autoprefixer 8.6リリース。\nCSS Gridの`gap`をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 57 | WebKit","url":"https://webkit.org/blog/8307/release-notes-for-safari-technology-preview-57/","tags":["webkit","ReleaseNote"],"content":"Safari Technology Preview Release 57リリース。\nクロスオリジンWindow間でのアクセスを制限できる`Cross-Origin-Options` HTTPヘッダの試験的サポート、modern EME APIをデフォルトで有効化など。","relatedLinks":[]},{"category":"Headline","title":"Jest 23: 🔥 Blazing Fast Delightful Testing · Jest","url":"https://facebook.github.io/jest/blog/2018/05/29/jest-23-blazing-fast-delightful-testing.html","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Jest 23リリース。\nInteractive Snapshot Modeの追加、非同期なカスタムmatcherを作成できるように、`jest-each`がコアに同梱、`toStrictEqual`などのmatcherの追加","relatedLinks":[]},{"category":"Headline","title":"What’s New in Safari - Apple Developer","url":"https://developer.apple.com/safari/whats-new/","tags":["safari","ReleaseNote"],"content":"Safari 12の変更予定。\nwatchOSで動作するように、`font-display`のサポート、ITP 2.0、CORBの一部をサポート、`.safariextz`スタイルのSafari拡張を非推奨化など","relatedLinks":[]},{"category":"Article","title":"Simplify Web Worker code with Comlink","url":"https://davidea.st/articles/comlink-simple-web-worker","tags":["JavaScript","webworker","article"],"content":"Web Workerの動作についての解説やComlinkを使ったWeb Workerの利用方法について","relatedLinks":[{"title":"GoogleChromeLabs/comlink: Comlink makes WebWorkers enjoyable.","url":"https://github.com/GoogleChromeLabs/comlink"}]},{"category":"Article","title":"Beyond SPAs: alternative architectures for your PWA  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/05/beyond-spa","tags":["server","ServiceWorker","article","JavaScript"],"content":"Service WorkerとExpressを使ったページ単位の(SPAではない)ウェブアプリのためのアーキテクチャと実装サンプルについて。\nルーティングをクライアントとサーバで共有し、パーシャルなViewをStream APIで取得しレンダリングする。また動的なメタ情報の渡し方についてなど","relatedLinks":[{"title":"GoogleChromeLabs/so-pwa: A progressive web app to read Stack Overflow content.","url":"https://github.com/GoogleChromeLabs/so-pwa"}]},{"category":"Article","title":"Getting Started With CSS Layout — Smashing Magazine","url":"https://www.smashingmagazine.com/2018/05/guide-css-layout/","tags":["CSS","article"],"content":"CSSのレイアウトについての記事。\nFloat、Flex、Gridなどのレイアウトの仕組み。\nBoxとContents、Alignmentなどについて","relatedLinks":[]},{"category":"SlideVideo","title":"JavaScript engines: The Good Parts™ // slidr.io","url":"https://slidr.io/mathiasbynens/javascript-engines-the-good-parts#1","tags":["JavaScript","slide"],"content":"JavaScriptエンジンの最適化パスについてのスライド。\nV8、Spidermonkey、Chackra、JavaScriptCoreそれぞれの最適化パスの流れやShapeと最適化が崩れるパターンについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"GoogleChromeLabs/critters: 🦔 A Webpack plugin to inline your critical CSS and lazy-load the rest.","url":"https://github.com/GoogleChromeLabs/critters","tags":["webpack","plugin","performance"],"content":"クリティカルCSSのインライン化、外部ファイルのlazy loadとprefetchの対応を行うwebpack plugin。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Reach Router - Overview","url":"https://reach.tech/router","tags":["JavaScript","React","library","accessibility"],"content":"React向けのルーターライブラリ。\nReact Routerの元々の作者が作成していて、Focus Mangementなどのアクセシビリティが考慮されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"alangpierce/sucrase: Super-fast alternative to Babel for when you can target modern JS runtimes","url":"https://github.com/alangpierce/sucrase","tags":["babel","jsx","flowtype","TypeScript","Tools"],"content":"BabelのParserをforkして作られたJSX/Flow/TypeScriptなどをJSに変換するツール。\nES2015+が動く実行環境向けへコードを変換する際に、それ以外(JSX/Flow/TypeScript)の変換を高速に行うことが目的。\nBabelとは異なりプラグインのステップを省くことで変換速度を向上させている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"hybridsjs/hybrids: UI library for creating Web Components with simple and functional API","url":"https://github.com/hybridsjs/hybrids/","tags":["WebComponents","library"],"content":"`lit-html`のようにCustom Elementを作成できる`html`や`define`などを提供するライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Alex1990/tiny-cookie: A tiny cookie manipulation plugin for the browser.","url":"https://github.com/Alex1990/tiny-cookie","tags":["JavaScript","library"],"content":"小さなクッキー操作ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"GoogleChromeLabs/comlink: Comlink makes WebWorkers enjoyable.","url":"https://github.com/GoogleChromeLabs/comlink","tags":["JavaScript","library","webworker"],"content":"Proxyを使ったWeb Workerライブラリ。\nWorker内での実装をProxyして`postMessage`などのメッセージングを隠蔽してくれる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"marblejs/marble: Marble.js - functional reactive HTTP middleware framework built on top of Node.js platform, TypeScript and RxJS library.","url":"https://github.com/marblejs/marble","tags":["Rx","JavaScript","server","HTTP"],"content":"Rxjsを使ったHTTPミドルウェアフレームワーク。\nNode.jsにおいてリクエスト、レスポンスに対する処理を書ける。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Keyframes.app","url":"https://keyframes.app/","tags":["CSS","Tools","editor"],"content":"CSS animationのGUIエディタ。 CSS animationのプロパティを設定して、実際にアニメーションとして再生しながら変化するプロパティを決めたCSSを出力できる","relatedLinks":[]},{"category":"Book","title":"Testing Vue.js Applications: Edd Yerburgh: 9781617295249: Amazon.com: Books","url":"https://www.amazon.com/dp/1617295248/","tags":["Vue","testing","book","JavaScript"],"content":"2018年8月31日発売。\nVue.jsのテスト本。","relatedLinks":[]}]},{"meta":{"title":"PhantomJSの開発が終了しリポジトリがアーカイブ化された","author":"azu","layout":"post","date":"2018-06-11T13:31:00.000Z","category":"Article","tags":["PhantomJS","JavaScript"],"url":"https://jser.info/2018/06/11/phantomjs-ended/"},"items":[]},{"meta":{"title":"2018-06-12のJS: MobX 5.0.0、PhantomJS EOL、Node.jsにおける設計ミス","author":"azu","layout":"post","date":"2018-06-12T01:00:43.591Z","category":"JSer","tags":["mobx","phantomjs","Node.js"],"url":"https://jser.info/2018/06/12/mobx-5.0.0phantomjs-eolnode.js/"},"items":[{"category":"Headline","title":"Safari Technology Preview 58, with Safari 12 Features, is Now Available | WebKit","url":"https://webkit.org/blog/8327/safari-technology-preview-58-with-safari-12-features-is-now-available/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview Release 58リリース。\nSafari 12相当の機能が含まれている。","relatedLinks":[{"title":"What’s New in Safari - Apple Developer","url":"https://developer.apple.com/safari/whats-new/"}]},{"category":"Headline","title":"Release v6.1.0 · npm/npm","url":"https://github.com/npm/npm/releases/tag/v6.1.0","tags":["npm","ReleaseNote"],"content":"npm 6.1.0リリース。\n`npm audit fix`の追加、`npm init <pkg>`がgit urlをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 68 Beta: add to home screen, payment handler, page lifecycle","url":"https://blog.chromium.org/2018/06/chrome-68-beta-add-to-home-screen.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 68βリリース。\nPayment Handler API、Page Lifecycle API、`customElements.upgrade()`、 Keyboard lock APIのサポートなど","relatedLinks":[]},{"category":"Headline","title":"mobx/CHANGELOG.md at master · mobxjs/mobx","url":"https://github.com/mobxjs/mobx/blob/master/CHANGELOG.md#500","tags":["JavaScript","ReleaseNote","library"],"content":"MobX 5.0.0リリース。\nObservableに`Proxy`を利用するようになり、IEなどProxyがない環境は非サポートに。\nまた、公開されるパッケージのコード自体もES2015となった。","relatedLinks":[]},{"category":"Headline","title":"Release Inferno v5.1.0 · infernojs/inferno","url":"https://github.com/infernojs/inferno/releases/tag/v5.1.0","tags":["JavaScript","React","library","ReleaseNote"],"content":"Inferno v5.1.0 リリース。\n`Inferno-devtools`の書き直しなど","relatedLinks":[]},{"category":"Article","title":"Yarn import now uses package-lock.json | Yarn Blog","url":"https://yarnpkg.com/blog/2018/06/04/yarn-import-package-lock/","tags":["ReleaseNote","article","npm","yarn"],"content":"yarn 1.7.0で`package-lock.json`を`yarn.lock`としてimportできるようになった。","relatedLinks":[{"title":"Competing lockfiles create poor UX · Issue #5654 · yarnpkg/yarn","url":"https://github.com/yarnpkg/yarn/issues/5654"}]},{"category":"Article","title":"You Probably Don't Need Derived State - React Blog","url":"https://reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html","tags":["React","article"],"content":"React 16.3で導入された`getDerivedStateFromProps`のケーススタディ。\n`getDerivedStateFromProps`はpropsの変化を元にstateを更新するために利用する。どのような時に利用するべきか、しないべきかについて","relatedLinks":[]},{"category":"Article","title":"Flow から TypeScript に移行しました - てくすた","url":"http://texta.pixta.jp/entry/2018/06/07/120000","tags":["flowtype","TypeScript","article"],"content":"FlowからTypeScriptへの移行について。\n移行の理由、移行の手順やツールの組み合わせについてなどについて","relatedLinks":[]},{"category":"Article","title":"Assessing Loading Performance in Real Life with Navigation and Resource Timing  |  Web Fundamentals  |  Google Developers","url":"https://developers.google.com/web/fundamentals/performance/navigation-and-resource-timing/","tags":["browser","performance","article","JavaScript"],"content":"Navigation TimingとResource Timingについて。\nそれぞれのAPIの使い方や取得できるデータの意味、クロスオリジンのリソースの`Timing-Allow-Origin`ヘッダによる対応。\nまたRUMのデータとして集める場合のデータの送信方法として`navigation.sendBeacon`の使い方やfailbackについてなど","relatedLinks":[]},{"category":"Article","title":"これからpjaxを使う人に知っておいてほしいこと – Design Report – デザインレポート","url":"https://glitter-style.jp/labo/web-resource/master-the-pjax/","tags":["JavaScript","ajax","article"],"content":"pjaxについての連載記事。\npjaxの動作原理や利点、代表的な実装方法、利用する際の注意点、イベント管理、メモリリークの問題など、設計について書かれている","relatedLinks":[]},{"category":"Article","title":"Almin 0.17リリース – executeの型付け、新しいReact Contextのサポート | Web Scratch","url":"https://efcl.info/2018/06/11/almin-0.17/","tags":["almin","JavaScript","library","ReleaseNote"],"content":"Almin 0.17リリース。\nTypeScriptで`execute`の引数の型チェックができるように、React Context APIを使ったモジュールの公開、ファイルサイズの削減など","relatedLinks":[]},{"category":"Article","title":"Deprecating cssnext","url":"https://moox.io/blog/deprecating-cssnext/","tags":["CSS","PostCSS","article"],"content":"`cssnext`がdeprecatedとなり、`postcss-preset-env`の利用が推奨されるようになった。\nマイグレーション方法や違いについてなど","relatedLinks":[{"title":"postcss-preset-env","url":"https://preset-env.cssdb.org/"},{"title":"A notice to cssnext users · Issue #32 · csstools/postcss-preset-env","url":"https://github.com/csstools/postcss-preset-env/issues/32"}]},{"category":"Article","title":"2018 年の tree shaking | 株式会社カブク","url":"https://www.kabuku.co.jp/developers/tree-shaking-in-2018","tags":["JavaScript","article","webpack"],"content":"Tree Shakingと呼ばれるビルドの最適化がどのように行われるかについて。 webpackにおいてES modulesで書いてもTree Shankingされない場合について。 またRxJsでの例など","relatedLinks":[]},{"category":"Article","title":"PhantomJSの開発が終了しリポジトリがアーカイブ化された - JSer.info","url":"https://jser.info/2018/06/11/phantomjs-ended/","tags":["JavaScript","browser","article"],"content":"PhantomJSのリポジトリがArchived(read-only)になり正式に開発が終了となった。","relatedLinks":[]},{"category":"SlideVideo","title":"10 Things I Regret About Node.js - Ryan Dahl - JSConf EU 2018 - YouTube","url":"https://www.youtube.com/watch?v=M3BM9TB-8yA&feature=youtu.be","tags":["node.js","video"],"content":"Node.jsの作成者であるryによるNode.js初期のデザインミスついての発表。\nまたTypeScriptのruntimeとして作成してるDenoの紹介。\nDenoのゴールはsandbox firstのセキュリティ、モジュールシステムの簡素化、ブラウザとの互換性など","relatedLinks":[{"title":"Node.js における設計ミス By Ryan Dahl - from scratch","url":"http://yosuke-furukawa.hatenablog.com/entry/2018/06/07/080335"}]},{"category":"SlideVideo","title":"JSConf EU 2018 - YouTube - YouTube","url":"https://www.youtube.com/playlist?list=PL37ZVnwpeshG2YXJkun_lyNTtM-Qb3MKa","tags":["JavaScript","イベント","video"],"content":"JSConf EU 2018の動画まとめ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"WaldoJeffers/conductor: Mix both synchronous and asynchronous code without hassle","url":"https://github.com/WaldoJeffers/conductor","tags":["JavaScript","library"],"content":"syncとasyncな処理を同様のコードフローで扱うためのUtilityライブラリ。\nmap、compose、pluckなど LodashやRamdaによく似たAPIを持つライブラリ。","relatedLinks":[{"title":"Why I’m building Conductor – Achille Urbain – Medium","url":"https://medium.com/@achille.urbain/why-im-building-conductor-fa780da821cd"}]},{"category":"SoftwareLibrary","title":"garris/BackstopJS: Catch CSS curve balls.","url":"https://github.com/garris/BackstopJS","tags":["CSS","testing","library","Tools"],"content":"CSSのリグレッションテストツール。\nヘッドレスブラウザでレンダリングして、描画結果の違いをテストできる","relatedLinks":[]},{"category":"Book","title":"Introduction · React","url":"https://chrisnoring.gitbooks.io/react/content/","tags":["React","book"],"content":"ReactやRedux、MobXなどについての電子書籍","relatedLinks":[]},{"category":"Book","title":"The GraphQL Guide","url":"https://graphql.guide/","tags":["GraphQL","book"],"content":"GraphQLについての書籍","relatedLinks":[]}]},{"meta":{"title":"2018-06-19のJS: Parcel v1.9.0、puppeteer 1.5.0、JavaScript modulesの今後","author":"azu","layout":"post","date":"2018-06-19T01:43:49.565Z","category":"JSer","tags":["Parcel","Chrome","puppeteer","javascript"],"url":"https://jser.info/2018/06/19/parcel-v1.9.0puppeteer-1.5.0javascript-modules/"},"items":[{"category":"Headline","title":"📦 Parcel v1.9.0 — Tree Shaking, 2x faster watcher, and more! 🚀","url":"https://medium.com/@devongovett/parcel-v1-9-0-tree-shaking-2x-faster-watcher-and-more-87f2e1a70f79","tags":["JavaScript","Tools","ReleaseNote"],"content":"Parcel v1.9.0リリース。\nTree Shakingの実装、`sideEffects`のサポート、ファイル監視の改善、Sassの`~/` importのサポートなど","relatedLinks":[{"title":"parcel/changelog.md at master · parcel-bundler/parcel","url":"https://github.com/parcel-bundler/parcel/blob/master/changelog.md#190---2018-06-14"}]},{"category":"Headline","title":"Release v1.5.0 · GoogleChrome/puppeteer","url":"https://github.com/GoogleChrome/puppeteer/releases/tag/v1.5.0","tags":["JavaScript","Chrome","Tools","ReleaseNote"],"content":"Puppeteer v1.5.0リリース。\n`BrowserContext`が追加され複数の独立したブラウザセッションを扱えるように、`Worker`クラスの追加、公式サイトが`pptr.dev`となるなど","relatedLinks":[]},{"category":"Headline","title":"Announcing: Greenkeeper 3 – Greenkeeper Blog","url":"https://blog.greenkeeper.io/announcing-greenkeeper-3-1504f5113998","tags":["webservice","JavaScript","library","ReleaseNote"],"content":"依存パッケージの管理サービスであるGreenkeeper 3リリース。\nmonorepoのサポート、`greenkeeper.json`の設定ファイルをサポート、コミットメッセージのカスタマイズができるようになるなど","relatedLinks":[]},{"category":"Article","title":"素のJavaScriptプロジェクトにtsconfig.jsonを置いといてVSCodeの便利さを享受する - Qiita","url":"https://qiita.com/terrierscript/items/a9826bc58d550d1b2764","tags":["TypeScript","article"],"content":"TypeScritptをJavaScript/JSDocの型チェックツールとして利用する方法について","relatedLinks":[]},{"category":"Article","title":"Keeping Node.js Fast: Tools, Techniques, And Tips For Making High-Performance Node.js Servers — Smashing Magazine","url":"https://www.smashingmagazine.com/2018/06/nodejs-tools-techniques-performance-servers/","tags":["node.js","article"],"content":"Node.jsサーバの`autocannon`を使ったベンチマーク、パフォーマンスのボトルネック調査、メモリリークの調査や改善などについて","relatedLinks":[]},{"category":"Article","title":"Detecting autofilled fields in Javascript – Tommy Brunn – Medium","url":"https://medium.com/@brunn/detecting-autofilled-fields-in-javascript-aed598d25da7","tags":["CSS","JavaScript","article"],"content":"フォームのautofillを検知する方法について。\nautofillにCSS animationをつけて、`animtaionstart`で発生を検知する方法について","relatedLinks":[]},{"category":"Article","title":"🚀 Introducing Akita: A New State Management Pattern for Angular Applications","url":"https://netbasal.com/introducing-akita-a-new-state-management-pattern-for-angular-applications-f2f0fab5a8","tags":["JavaScript","Angular","TypeScript","library","article"],"content":"Angular向けのステート管理ライブラリであるAkitaについての記事。","relatedLinks":[{"title":"datorama/akita: 🚀 Simple and Effective State Management for Angular Applications","url":"https://github.com/datorama/akita"}]},{"category":"Article","title":"JavaScript engine fundamentals: Shapes and Inline Caches · Mathias Bynens","url":"https://mathiasbynens.be/notes/shapes-ics","tags":["JavaScript","article","video"],"content":"JavaScriptエンジンがどのようにJavaScriptのコードを処理しているかについての解説。\nそれぞれのブラウザがもつJavaScript VMにおける最適化のパイプライン処理について","relatedLinks":[]},{"category":"Article","title":"Node.jsでつくるNode.js - もくじ - Qiita","url":"https://qiita.com/massie_g/items/3ee11c105b4458686bc1","tags":["JavaScript","node.js","AST","article"],"content":"JavaScriptでJavaScriptのサブセットを作る話。\n「RubyでつくるRuby ゼロから学びなおすプログラミング言語入門」のNode.jsでの実装について。","relatedLinks":[]},{"category":"Article","title":"Understanding the Almighty Reducer | CSS-Tricks","url":"https://css-tricks.com/understanding-the-almighty-reducer/","tags":["JavaScript","article"],"content":"`Array.prototype.reduce`についての記事。\n`reduce`メソッドの動作イメージや、動きについて動画を混じえて解説している。","relatedLinks":[]},{"category":"Article","title":"Using JavaScript modules on the web  |  Web Fundamentals  |  Google Developers","url":"https://developers.google.com/web/fundamentals/primers/modules","tags":["JavaScript","module","article"],"content":"JavaScriptモジュールの挙動や実装についての記事。\nブラウザでのscriptとmoduleの挙動の違い、Dynamic importと`import.meta`について。\nまた、bundleした場合とのパフォーマンスの差や小さくexportしたモジュールの方が有利な点やHTTP/2とPreload。\nChromeで検討が進められてるWeb Packaging、Layered API、Workerとの連携などについて","relatedLinks":[]},{"category":"Article","title":"基礎からはじめるReact入門連載一覧：CodeZine（コードジン）","url":"https://codezine.jp/article/corner/688","tags":["React","article"],"content":"React入門に関する連載記事。\nReactの基礎からRedux、Storybookなど外部ライブラリなどについて扱っている","relatedLinks":[]},{"category":"Article","title":"Isomorphic ES Modules - The blog of Ada Rose Cannon","url":"https://ada.is/blog/2018/06/15/isomorphic-es-modules/","tags":["JavaScript","node.js","server","isomorphic"],"content":"ES module形式で配布されているHyperHTMLを使ってブラウザとNode.jsで同じライブラリをそのまま`import`してウェブアプリを作成する話。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Netflix/pollyjs: Record, Replay, and Stub HTTP Interactions.","url":"https://github.com/Netflix/pollyjs","tags":["HTTP","JavaScript","testing","node.js"],"content":"HTTPリクエスト/レスポンスの記録、再生を行うJavaScriptライブラリとNode.jsサーバ。\nまたHTTPリクエストのインターセプトして任意のレスポンスを返せる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"snipsco/yett: 🔐A small webpage library to control the execution of (third party) scripts","url":"https://github.com/snipsco/yett","tags":["library","JavaScript","security"],"content":"JavaScriptの読み込みをブラックリストで管理するライブラリ。\n`MutationObserver`や`document.create`をhookし、指定URLのJavaScriptを読み込みをブロックできる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ecrmnn/collect.js: 💎 Convenient and dependency free wrapper for working with arrays and objects","url":"https://github.com/ecrmnn/collect.js","tags":["JavaScript","library"],"content":"配列やオブジェクトに対するユーティリティ関数のライブラリ。\nLaravelが持つCollectionsをJavaScriptにportしたもの","relatedLinks":[{"title":"Collections - Laravel - The PHP Framework For Web Artisans","url":"https://laravel.com/docs/5.4/collections"}]},{"category":"Book","title":"スラスラ読める JavaScriptふりがなプログラミング | 及川卓也, リブロワークス | 工学 | Kindleストア | Amazon","url":"https://www.amazon.co.jp/dp/B07DR76HSG/","tags":["JavaScript","book"],"content":"2018年6月22日発売\nJavaScriptのコードにルビでふりがなをつけて解説する書籍。","relatedLinks":[]}]},{"meta":{"title":"2018-06-25のJS: Node.js 10.5.0 Workerサポート、ESLint 5.0.0、AirbnbとReact Native","author":"azu","layout":"post","date":"2018-06-25T23:32:36.229Z","category":"JSer","tags":["Node.js","ESLint","ReactNative"],"url":"https://jser.info/2018/06/26/node.js-10.5.0-workereslint-5.0.0airbnbreact-native/"},"items":[{"category":"Headline","title":"V8 JavaScript Engine: V8 release v6.8","url":"https://v8project.blogspot.com/2018/06/v8-release-68.html","tags":["V8","ReleaseNote"],"content":"V8 v6.8リリース。\n関数自身が外の関数の不要な情報を持っていたのをリファクタリングしてメモリの改善。\n`Object.assign`をC++からJSの実装に変更してパフォーマンス改善、`TypedArray.prototype.sort`のパフォーマンス改善など","relatedLinks":[]},{"category":"Headline","title":"Node v10.5.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v10.5.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 10.5.0リリース。\n`fs.stat`などがBigIntをサポート、`--experimental-worker`のフラグ付きでWorkerのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 59 | WebKit","url":"https://webkit.org/blog/8332/release-notes-for-safari-technology-preview-59/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 59リリース。\nITP 2.0への更新、Web Animationsのデフォルト有効化。\nES Proposalの`Symbol.prototype.description`のサポート、BitIntの実装など","relatedLinks":[{"title":"Web Animations in WebKit | WebKit","url":"https://webkit.org/blog/8343/web-animations-in-webkit/"}]},{"category":"Headline","title":"ESLint v5.0.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2018/06/eslint-v5.0.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 5.0.0リリース。\nNode.js 4のサポート終了、`eslint:recommended`の更新、ルールのデフォルトオプションの変更、Lint対象がないときにfatal errorとなるように。\nプラグイン周りの変更など","relatedLinks":[{"title":"Migrating to v5.0.0 - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/docs/user-guide/migrating-to-5.0.0"}]},{"category":"Headline","title":"Announcing winston@3.0.0! — GoDaddy Open Source Center","url":"https://godaddy.github.io/2018/06/12/announcing-winston-3/","tags":["node.js","library","ReleaseNote"],"content":"ロガーライブラリであるwinston 3.0.0リリース。","relatedLinks":[{"title":"winston/CONTRIBUTING.md at master · winstonjs/winston","url":"https://github.com/winstonjs/winston/blob/master/CONTRIBUTING.md#what-makes-up-winston300"},{"title":"winston/CHANGELOG.md at master · winstonjs/winston","url":"https://github.com/winstonjs/winston/blob/master/CHANGELOG.md#v300--2018-06-12"}]},{"category":"Article","title":"React Native at Airbnb – Airbnb Engineering & Data Science – Medium","url":"https://medium.com/airbnb-engineering/react-native-at-airbnb-f95aa460be1c","tags":["React","ios","Android","JavaScript","article"],"content":"AirbnbでのReact Nativeについて。\nReact Nativeの技術的解説、上手くいった点、上手くいかなかった点。\nクロスプラットフォームアプリ開発の技術的/組織的な難しさなどから、当初の目標を達成できないためAirbnbではReact Nativeからネイティブに移行するという話。","relatedLinks":[{"title":"react-native-jp/react-native-at-airbnb-jp-translation","url":"https://github.com/react-native-jp/react-native-at-airbnb-jp-translation"}]},{"category":"Article","title":"社内勉強会TechLunchで\"JavaScript ASTことはじめ\"という発表をしました - Medley Developer Blog","url":"https://developer.medley.jp/entry/2018/06/22/130000","tags":["JavaScript","AST","article"],"content":"JavaScriptのASTやAST Explorerの使い方について","relatedLinks":[]},{"category":"Article","title":"Understanding Jest Mocks – Rick Hanlon II – Medium","url":"https://medium.com/@rickhanlonii/understanding-jest-mocks-f0046c68e53c","tags":["JavaScript","testing","article"],"content":"jestのmock機能について解析。\n`jest.mock`、`jest.spy`などについて","relatedLinks":[]},{"category":"Article","title":"react-ideal-image/introduction.md at master · stereobooster/react-ideal-image","url":"https://github.com/stereobooster/react-ideal-image/blob/master/introduction.md","tags":["JavaScript","React","article"],"content":"react-ideal-imageの画像表示の実装について。\nLazy Loading、プレースホルダー、LQIP、レスポンシブ、アダプティブな表示方法について解説している。","relatedLinks":[]},{"category":"SlideVideo","title":"The Critical Request - Speaker Deck","url":"https://speakerdeck.com/benschwarz/the-critical-request","tags":["browser","performance","slide"],"content":"First Meaningful Paintまでに必要なリソースへのリクエストと優先度についてのスライド。\npreloadなどによるwebfontの読み込み改善について","relatedLinks":[]},{"category":"SlideVideo","title":"Automated Dependency Updates with Renovate","url":"https://www.slideshare.net/teppeis/automated-dependency-updates-with-renovate-102769685","tags":["JavaScript","npm","slide"],"content":"リポジトリが依存するパッケージのバージョン更新をRenovateを使って自動化することについてのスライド。","relatedLinks":[{"title":"Renovate | Automated Dependency Updates","url":"https://renovatebot.com/"}]},{"category":"SlideVideo","title":"Redux Refactoring Patterns with @ngrx/platform - Speaker Deck","url":"https://speakerdeck.com/gregonnet/platform","tags":["redux","Angular","リファクタリング","slide"],"content":"ngrxについてのスライド。\nReduxのパターン、switch-caseのパターンとFactoryパターン、どのようにStateを扱うかについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Progressive web apps - App Center | MDN","url":"https://developer.mozilla.org/en-US/Apps/Progressive","tags":["PWA","tutorial"],"content":"MDNのPWAチュートリアルガイド","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Microsoft/license-checker-webpack-plugin: Webpack plugin that verifies licenses of all external dependencies in a compilation, and outputs them to a file.","url":"https://github.com/Microsoft/license-checker-webpack-plugin","tags":["webpack","license"],"content":"利用してるライブラリのライセンスチェックやまとめたライセンスファイルを生成するwebpackプラグイン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Simonwep/pickr: Flat, simple and hackable Color-Picker. No dependencies, no jQuery. Compatible with all CSS Frameworks e.g. Bootstrap, Materialize.","url":"https://github.com/Simonwep/pickr","tags":["color","JavaScript","UI","library"],"content":"依存のないカラーピッカーライブラリ","relatedLinks":[]},{"category":"Book","title":"Amazon.com: Mastering JavaScript Design Patterns - Third Edition: Create scalable and reliable applications with advanced JavaScript Design Patterns using reliable code. eBook: Tomas Corral: Kindle Store","url":"https://www.amazon.com/dp/B07D6LQNK3/","tags":["JavaScript","book"],"content":"2019年1月9日発売\nMastering JavaScript Design Patternsの第3版","relatedLinks":[]},{"category":"Book","title":"動かしながらさくっと身につく 今こそホンキで覚えるJavaScript\\[JS/ES2016対応\\] | 狩野 祐東 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4802611242/","tags":["JavaScript","book"],"content":"2018年7月17日発売","relatedLinks":[]}]},{"meta":{"title":"2018-07-02のJS: Firefox 61、ECMAScript 2018リリース、CSS4はどこにある？","author":"azu","layout":"post","date":"2018-07-02T22:40:14.980Z","category":"JSer","tags":["firefox","ECMAScript","CSS"],"url":"https://jser.info/2018/07/03/firefox-61ecmascript-2018css4/"},"items":[{"category":"Headline","title":"Firefox — Notes (61.0) — Mozilla","url":"https://www.mozilla.org/en-US/firefox/61.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 61.0リリース。\nTLS 1.3のドラフトサポートをデフォルトで有効化、アクセシビリティインスペクタの実装。\n`PerformanceServerTiming`のサポート、Fetch APIの`credentials`のデフォルト値を`same-origin`に変更、WebVRがmacOSで有効化など","relatedLinks":[{"title":"Firefox 61 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/Firefox/Releases/61"}]},{"category":"Headline","title":"Dev.Opera — What’s new in Chromium 67 and Opera 54","url":"https://dev.opera.com/blog/opera-54/","tags":["Opera","Chrome","ReleaseNote"],"content":"Opera 54 (based on Chromium 67)リリース。\nGeneric Sensors、Custom Elementが既存のHTML Elementを拡張できるように、Stream APIがtransformをサポートなど","relatedLinks":[]},{"category":"Headline","title":"lighthouse/changelog.md at v3.0.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/blob/v3.0.0/changelog.md","tags":["Chrome","performance","Tools","ReleaseNote"],"content":"Lighthouse 3.0リリース。\nレポートUIの変更、それぞれのスコアのWeightの変更、First Contentful Paintの追加、RTTのコスト表示の追加など。","relatedLinks":[{"title":"Announcing Lighthouse 3.0  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/05/lighthouse3"}]},{"category":"Headline","title":"Ecma latest news","url":"http://www.ecma-international.org/news/index.html","tags":["ECMAScript","news"],"content":"ECMA-262 9th edition - ECMAScript® 2018リリース","relatedLinks":[{"title":"ECMAScript® 2018 Language Specification","url":"https://www.ecma-international.org/ecma-262/9.0/"}]},{"category":"Article","title":"E2EテストをPhantomJSから、Puppeteer + Headless Chromeへ移行しました - LCL Engineers' Blog","url":"http://techblog.lclco.com/entry/2018/06/28/080000","tags":["browser","JavaScript","testing","article"],"content":"Capybara + PhantomJSで行っていたテストを、Puppeteer + Headless Chromeに移行していくという話。\nPuppeteerの機能紹介やデバッグ方法について。","relatedLinks":[]},{"category":"Article","title":"Web Performance Checklist – ITNEXT","url":"https://itnext.io/web-performance-checklist-6b616f3c6f0d","tags":["browser","performance","article"],"content":"ウェブアプリにおけるパフォーマンスのチェック項目のまとめ。\n最適化のアプローチについての概要まとめ","relatedLinks":[]},{"category":"Article","title":"Making Web Components Work | Mixpanel Engineering","url":"https://engineering.mixpanel.com/2018/06/12/making-web-components-work/","tags":["WebComponents","article"],"content":"Web Componentsを使って作ったパネルコンポーネントについての記事。\nsnabbdomを使ったVirtual DOMを使い描画し、Web Conponentsでのステート管理についてなど。","relatedLinks":[]},{"category":"Article","title":"AudioWorklet Design Pattern  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/06/audio-worklet-design-pattern","tags":["JavaScript","web ","audio","article"],"content":"AudioWorkletのデザインパターンについて。\nWebAssembly、SharedArrayBufferとの組み合わせての利用についてなど","relatedLinks":[]},{"category":"Article","title":"Introduction to Feature Policy  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/06/feature-policy","tags":["browser","security","article","CSP"],"content":"Feature Policyについて。\nCSPはセキュリティのコントールをし、Feature Policyは機能に対してのコントールをする点について。\nFeature Policyの指定方法やどのようなときに使うべきかについて","relatedLinks":[]},{"category":"SlideVideo","title":"Where is CSS4? When is it coming out? - YouTube","url":"https://www.youtube.com/watch?v=Jtmkk6odggs","tags":["CSS","spec","video"],"content":"CSS4はどこにあるのという問いに対する説明の動画。\nCSS3のときに仕様がmoduleに分解され、それぞれのModuleはLevel 3となった。\nその後のSpecはModuleごとにLevelをあげ、また新しく追加されたModuleはLevel 1から開始する。\nそのためCSS4という全体を表すものはないという話。","relatedLinks":[]},{"category":"SlideVideo","title":"Vue.js プロジェクトの爆発させかた #ichigayageek / How to explosion Vue.js project - Speaker Deck","url":"https://speakerdeck.com/potato4d/how-to-explosion-vue-dot-js-project","tags":["Vue","slide"],"content":"Vueを使ったプロジェクトで遭遇する問題についてのスライド。\n規模が大きくなってきたときのステートの管理方法、デザイナーとの協業、既存のウェブアプリへの部分的な適応、別のテンプレートエンジンとの組み合わせなどについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"wg-effectiveness/process\\_jp.md at master · w3c/wg-effectiveness","url":"https://github.com/w3c/wg-effectiveness/blob/master/process_jp.md","tags":["W3C","spec","翻訳"],"content":"\"忙しい人のためのW3Cプロセス入門\"\nW3C Process for Busy Peopleの日本語訳","relatedLinks":[]},{"category":"WebsiteDocument","title":"kay-is/react-from-zero: A simple (99% ES2015 less) tutorial for React","url":"https://github.com/kay-is/react-from-zero","tags":["React","tutorial"],"content":"Reactを一から学ぶチュートリアル。\nブラウザだけで動くReactのコードを見ながら、Reactについてを解説している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Swiip/compo: 🎼Compo·sing Web Compo·nents","url":"https://github.com/Swiip/compo","tags":["WebComponents","JavaScript","library"],"content":"WebComponentでUIを作成するための関数を提供するライブラリ。","relatedLinks":[{"title":"Announcing: compo – Matthieu Lux (@Swiip) – Medium","url":"https://medium.com/@Swiip_51904/announcing-compo-3ba9e15890a7"}]},{"category":"SoftwareLibrary","title":"mizchi/trans-loader: webpack-less frontend with service-worker","url":"https://github.com/mizchi/trans-loader","tags":["ServiceWorker","babel","TypeScript","npm","JavaScript","library"],"content":"Service Workerを使ってBabelやTypeScriptでの変換を行うスクリプト。\nnpmのモジュールをjspm.ioを使ってロードできる。","relatedLinks":[{"title":"trans-loader: node/webpack なしではじめるフロントエンドプロジェクト - Qiita","url":"https://qiita.com/mizchi/items/796a5c392d306a44a918"},{"title":"jspm.io - Native ES Modules CDN","url":"https://jspm.io/"}]},{"category":"SoftwareLibrary","title":"kitze/JSUI: A powerful UI toolkit for managing JavaScript apps","url":"https://github.com/kitze/JSUI","tags":["JavaScript","GUI","project"],"content":"JavaScriptのプロジェクト管理GUI。\nGUIでアプリの作成、プロジェクトのダッシュボード、タスクの実行などができる","relatedLinks":[]}]},{"meta":{"title":"2018-07-10のJS: Jest 23.3.0 インラインスナップショット、npm.community","author":"azu","layout":"post","date":"2018-07-10T01:59:55.517Z","category":"JSer","tags":["jest","npm",null],"url":"https://jser.info/2018/07/10/jest-23.3.0-npm.community/"},"items":[{"category":"Headline","title":"Ember.js - Ember 3.2 Released","url":"https://emberjs.com/blog/2018/06/29/ember-3-2-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember 3.2リリース。\nテンプレートに`let`ヘルパーの追加、`Ember.Logger`などが非推奨に","relatedLinks":[]},{"category":"Headline","title":"jest/CHANGELOG.md at v23.3.0 · facebook/jest","url":"https://github.com/facebook/jest/blob/v23.3.0/CHANGELOG.md","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Jest 23.3.0リリース。\nインラインでスナップショットテストをする`toMatchInlineSnapshot`と`toThrowErrorMatchingInlineSnapshot`の追加など","relatedLinks":[]},{"category":"Headline","title":"Node v10.6.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v10.6.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 10.6.0リリース。\n`require('dns').promises`の追加、`Atomics.wake`を`Atomics.notify`にリネームするECMAScriptの仕様追従など","relatedLinks":[]},{"category":"Headline","title":"The npm Blog — Announcing npm.community","url":"https://blog.npmjs.org/post/175587538995/announcing-npmcommunity","tags":["npm","community","issue"],"content":"npmに関するIssueはDiscourse(npm.community)で扱うようにするという話。\n既存のnpmリポジトリに立てられたIssueはアーカイブ化され、新規のIssueはnpm.communityの特定のカテゴリで扱うようになる。","relatedLinks":[{"title":"npm forum","url":"https://npm.community/"}]},{"category":"Headline","title":"ESLint v5.1.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2018/07/eslint-v5.1.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 5.1.0リリース。\n`no-catch-shadow`はdeprecatedとなり、代わりに`no-shadow`の利用を推奨している。","relatedLinks":[]},{"category":"Headline","title":"Official Google Webmaster Central Blog: Using page speed in mobile search ranking","url":"https://webmasters.googleblog.com/2018/01/using-page-speed-in-mobile-search.html","tags":["google","SEO","performance","news"],"content":"Googleのモバイル検索で\"Speed Update\"が有効化された。\n表示が遅いサイトは表示ランキングに影響する仕組み。","relatedLinks":[{"title":"Chrome User Experience Report  |  Tools for Web Developers  |  Google Developers","url":"https://developers.google.com/web/tools/chrome-user-experience-report/"}]},{"category":"Article","title":"フロントエンドの「想定外」に対応する考え方とTipsいくつか | ダーシマ・ヱンヂニヤリング","url":"https://necomesi.jp/blog/tsmd/posts/229","tags":["browser","JavaScript"],"content":"ブラウザの設定により使わない機能を考慮したデザインについて。\nデフォルトフォント、Adblock、拡張機能、JavaScriptの無効化、Cookieの無効化/プライベートモードに対する対応などについて","relatedLinks":[]},{"category":"Article","title":"What Is Redux: A Designer’s Guide — Smashing Magazine","url":"https://www.smashingmagazine.com/2018/07/redux-designers-guide/","tags":["redux","article"],"content":"Designer向けのReduxとはどういうもの？という解説。\nデータ受け取りどのようにコンポーネントの表示に反映させるかやデータ(State)変更、Optimistic UIなどについて図とともに概念を説明している","relatedLinks":[]},{"category":"Article","title":"face-api.js — JavaScript API for Face Recognition in the Browser with tensorflow.js","url":"https://itnext.io/face-api-js-javascript-api-for-face-recognition-in-the-browser-with-tensorflow-js-bcc2a6c4cf07","tags":["JavaScript","library","article"],"content":"tensorflow.jsベースの顔検出/認識ライブラリであるface-api.jsについての記事。Face DetectionとFace Recognitionの実装方法や使い方についての解説","relatedLinks":[{"title":"justadudewhohacks/face-api.js: JavaScript API for face detection and face recognition in the browser with tensorflow.js","url":"https://github.com/justadudewhohacks/face-api.js"}]},{"category":"Article","title":"Optimization Auditing: A Deep Dive into Chrome's Dev Console — SitePoint","url":"https://www.sitepoint.com/optimization-auditing-a-deep-dive-into-chromes-dev-console/","tags":["Chrome","debug","article"],"content":"Chromeの開発者ツールの機能についての解説。\nコンソールやパフォーマンスなどのツールについてスクリーンショットとともに紹介している。","relatedLinks":[]},{"category":"Article","title":"An adventure in sparse arrays","url":"https://remysharp.com/2018/06/26/an-adventure-in-sparse-arrays","tags":["JavaScript","article"],"content":"JavaScriptの配列におけるsparse array(疎の配列)についての記事。 配列に穴があるときに、ループやメソッドなど列挙する際の扱いなどについて","relatedLinks":[]},{"category":"Article","title":"Seva Zaikov - Node.js REPL in Depth","url":"https://blog.bloomca.me/2018/07/09/nodejs-repl-in-depth.html","tags":["node.js","article"],"content":"Node.jsのREPLについての記事。\nREPLで利用できる特別なコマンド、自動的に使えるモジュールやモジュールとして`repl`を使う方法についてなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"justadudewhohacks/face-api.js: JavaScript API for face detection and face recognition in the browser with tensorflow.js","url":"https://github.com/justadudewhohacks/face-api.js","tags":["JavaScript","MachineLearning","library"],"content":"tensorflow.jsを使った顔検出/認識ライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"microstates/microstates.js: Composable State Primitives for JavaScript","url":"https://github.com/microstates/microstates.js","tags":["JavaScript","library"],"content":"Immutableなオブジェクトをデータ型とオブジェクトの指定をして作成するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"retejs/rete: JavaScript framework for visual programming and creating node editor","url":"https://github.com/retejs/rete","tags":["JavaScript","library","program"],"content":"ビジュアルプログラミングのためのフレームワーク。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jamiemccrindle/axax: Async Iterator Extensions for JavaScript e.g. map, reduce, filter, flatMap, etc.","url":"https://github.com/jamiemccrindle/axax","tags":["JavaScript","library"],"content":"Async Iteratorを使った`map`、`reduce`、`filter`、`flatMap`、`pipe`などの実装ライブラリ。\nRxJSやコレクション系ライブラリと似たメソッドを提供するライブラリ","relatedLinks":[]}]},{"meta":{"title":"2018-07-17のJS: TypeScript 3.0.0 RC、ウイルスとnpmパッケージ、Property based testing","author":"azu","layout":"post","date":"2018-07-17T02:20:17.375Z","category":"JSer","tags":["TypeScript","eslint","npmjs","testing"],"url":"https://jser.info/2018/07/17/typescript-3.0.0-rcnpmproperty-based-testing/"},"items":[{"category":"Headline","title":"The npm Blog — v6.2.0","url":"https://blog.npmjs.org/post/175871462900/v620","tags":["npm","ReleaseNote"],"content":"npm 6.2.0リリース。\n`npm audit`にawkなどでパースしやすい`--parseable`オプションの追加、` sign-git-commit`の設定を追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 3.0 RC | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2018/07/12/announcing-typescript-3-0-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.0 RCリリース。\nmonorepo向けのサポートがメイン。\nProject Referencesによりmonorepo内の別パッケージの型定義を参照できるようになり、Build modeによって関連するパッケージのビルドをインクリメンタルに行える。\ntuples型の改善、`unknown`型の追加、Reactのdefault propsのサポートなど","relatedLinks":[{"title":"TypeScript 3.0.0-RC 変更点 - Qiita","url":"https://qiita.com/vvakame/items/57a0559c45b88b2ae168"}]},{"category":"Headline","title":"Release v1.6.0 · GoogleChrome/puppeteer","url":"https://github.com/GoogleChrome/puppeteer/releases/tag/v1.6.0","tags":["Chrome","library","ReleaseNote"],"content":"Puppeteer v1.6.0リリース。\n`page.waitForRequest`と`page.waitForResponse`のサポート。\n要素が現在のviewportに表示されているかを判定する`elementHandle.isIntersectingViewport`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release 9.0 “A Mari Usque Ad Mare” · postcss/autoprefixer","url":"https://github.com/postcss/autoprefixer/releases/tag/9.0.0","tags":["CSS","Tools","ReleaseNote"],"content":"Autoprefixer 9.0、Browserslist 4.0、PostCSS 7.0.0リリース。\nNode.js 4のサポート終了など","relatedLinks":[]},{"category":"Headline","title":"Postmortem for Malicious Packages Published on July 12th, 2018 - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2018/07/postmortem-for-malicious-package-publishes","tags":["ESLint","npm","security","node.js"],"content":"`.npmrc`の内容を盗み取る`eslint-scope@3.7.2`と`eslint-config-eslint@5.0.2`が公開された問題についてのレポート。\nパスワードリスト攻撃で取られてたアカウントのtokenから直接publishされ、その後npm incによって全ユーザーのtokenがリセットされた。\n攻撃手法や対策について","relatedLinks":[{"title":"The npm Blog — Incident report: npm, Inc. operations incident of...","url":"https://blog.npmjs.org/post/175824896885/incident-report-npm-inc-operations-incident-of"},{"title":"2018/07/12 に発生したセキュリティ インシデント (eslint-scope@3.7.2) について - Qiita","url":"https://qiita.com/mysticatea/items/0141657e4478d9cf4614"}]},{"category":"Article","title":"Site Isolation for web developers  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/07/site-isolation","tags":["Chrome","browser","security"],"content":"Chrome 67でデフォルト有効化されたSite Isolationについて。\nレンダラープロセスを分離することで、サイドチャネル攻撃やオリジン超えの攻撃によって機密情報が盗まれるのを防止する。\nCORB、iframeなどにおけるloadとunloadにおける挙動の違いなどについて","relatedLinks":[{"title":"Google Online Security Blog: Mitigating Spectre with Site Isolation in Chrome","url":"https://security.googleblog.com/2018/07/mitigating-spectre-with-site-isolation.html"}]},{"category":"SlideVideo","title":"The CSS Paint API | CSS-Tricks","url":"https://css-tricks.com/the-css-paint-api/","tags":["CSS","JavaScript"],"content":"CSS Paint APIについての記事。\n新しいShapeの追加、カスタムプロパティとの連携方法について","relatedLinks":[]},{"category":"SlideVideo","title":"Life of a Pixel 2018 - Google スライド","url":"https://docs.google.com/presentation/d/1boPxbgNrTU0ddsc144rcXayGA_WF53k96imRH8Mp34Y/mobilepresent#slide=id.p","tags":["browser","Chrome","slide"],"content":"Chromeのレンダリングの仕組みについてのスライド。\nDOM、Style、Layout、Paint、Rasterization。\n変更があったときに再レンダリングやCompositingなどの処理の流れなどについて。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Vue.js Cheat Sheet","url":"https://flaviocopes.com/vue-cheat-sheet/","tags":["Vue","チートシート"],"content":"Vueチートシート","relatedLinks":[]},{"category":"WebsiteDocument","title":"Browsh","url":"https://www.brow.sh/","tags":["browser","console","firefox"],"content":"Firefoxをバックエンド(WebExtensions)に使ったテキストブラウザ。\nCSSやWebGL、画像や動画などの描画結果をテキストベースで閲覧できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dubzzz/fast-check: Property based testing framework for JavaScript (like QuickCheck) written in TypeScript","url":"https://github.com/dubzzz/fast-check","tags":["JavaScript","testing","library","TypeScript"],"content":"Property based testingを行うテストライブラリ。\n値のパターンや組み合わせを定義してランダムな値を生成してテストできる。\nまたテストが失敗した際には`seed`値を使って同じ組み合わせを再現してテストできる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"joshwcomeau/guppy","url":"https://github.com/joshwcomeau/guppy","tags":["React","GUI","Tools","software"],"content":"React向けのアプリケーション管理、タスク実行を行えるGUIアプリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"teadjs/tead: Lighting the way to simpler testing","url":"https://github.com/teadjs/tead","tags":["JavaScript","testing","library"],"content":"シンプルなテストフレームワーク。\n`[actual, expected]`の組み合わせを返すだけでテストできる。","relatedLinks":[]},{"category":"Book","title":"Programming TypeScript: Making Your JavaScript Applications Scale: Boris Cherny: 9781492037651: Amazon.com: Books","url":"https://www.amazon.com/dp/1492037656/","tags":["TypeScript","book"],"content":"2019年4月4日発売\nTypeScriptでのアプリケーション開発についての書籍","relatedLinks":[]}]},{"meta":{"title":"2018-07-24のJS: Monthly Webの作り方、普通のHTMLの書き方","author":"azu","layout":"post","date":"2018-07-24T00:40:57.119Z","category":"JSer","tags":["Web","HTML"],"url":"https://jser.info/2018/07/24/monthly-webhtml/"},"items":[{"category":"Headline","title":"Release Notes for Safari Technology Preview 61 | WebKit","url":"https://webkit.org/blog/8365/release-notes-for-safari-technology-preview-61/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 61リリース。\n`Element.toggleAttribute`のサポート、`fetch`の`credentials`のデフォルト値を`same-origin`へ変更など","relatedLinks":[{"title":"Element.toggleAttribute | blog.jxck.io","url":"https://blog.jxck.io/entries/2018-07-20/toggle-attribute.html"}]},{"category":"Headline","title":"Node v10.7.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v10.7.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 10.7.0リリース。\n`console.timeLog()`の実装、`process.hrtime.bigint()`の実装、`--title`コマンドライン引数でプロセスのタイトルを指定できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember 3.3 Released","url":"https://emberjs.com/blog/2018/07/16/ember-3-3-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember 3.3リリース。\njQueryの依存をオプショナルにできるように","relatedLinks":[{"title":"Release v3.3.0 · emberjs/ember.js","url":"https://github.com/emberjs/ember.js/releases/tag/v3.3.0"}]},{"category":"Headline","title":"Support the native graal packages by ChadKillingsworth · Pull Request #90 · google/closure-compiler-npm","url":"https://github.com/google/closure-compiler-npm/pull/90","tags":["JavaScript","Java","news","Tools"],"content":"Closure Compilerにネイティブバイナリが同梱された(macOSとLinux)","relatedLinks":[{"title":"Release 20180716.0.0 · google/closure-compiler-npm","url":"https://github.com/google/closure-compiler-npm/releases/tag/20180716.0.0"}]},{"category":"Headline","title":"CanJS 5.0","url":"https://www.bitovi.com/blog/canjs-5","tags":["JavaScript","library","ReleaseNote"],"content":"CanJS 5.0リリース。","relatedLinks":[]},{"category":"Article","title":"Connection-Aware Components | Max Böck - Frontend Web Developer","url":"https://mxb.at/blog/connection-aware-components/","tags":["JavaScript","article","React"],"content":"Network Information APIや`navigator.onLine`などを使った接続情報を考慮したReactコンポーネントの作り方について","relatedLinks":[]},{"category":"Article","title":"Compiler in JavaScript using ANTLR – DailyJS – Medium","url":"https://medium.com/dailyjs/compiler-in-javascript-using-antlr-9ec53fd2780f","tags":["JavaScript","article","AST"],"content":"ANTLRを使ってコンパイラを作る話。\nECMAScriptを入力にしてPythonのコードを出力するコンパイラをどうのように作るかについて","relatedLinks":[{"title":"antlr4 - npm","url":"https://www.npmjs.com/package/antlr4"}]},{"category":"Article","title":"Element.toggleAttribute | blog.jxck.io","url":"https://blog.jxck.io/entries/2018-07-20/toggle-attribute.html","tags":["DOM","JavaScript"],"content":"属性の値をトグルをする`Element.prototype.toggleAttribute`について","relatedLinks":[]},{"category":"Article","title":"PWACompat: the Web App Manifest for all browsers  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/07/pwacompat","tags":["PWA","Tools","article","polyfill"],"content":"Web App Manifestから古いSafariやレガシーブラウザ向けにメタ要素を追加するライブラリ。","relatedLinks":[{"title":"GoogleChromeLabs/pwacompat: PWACompat to bring Web App Manifest to older browsers","url":"https://github.com/GoogleChromeLabs/pwacompat"}]},{"category":"Article","title":"Operationalizing Node.js for Server Side Rendering – Airbnb Engineering & Data Science – Medium","url":"https://medium.com/airbnb-engineering/operationalizing-node-js-for-server-side-rendering-c5ba718acfc9","tags":["React","node.js","article"],"content":"AirbnbにおけるReactのサーバサイドレンダリングのパフォーマンスについての記事。JavaScriptがどのように非同期処理をしているかやボトルネックとなる場所についてなど","relatedLinks":[]},{"category":"Article","title":"Monthly Web の作り方 2018 年版 | blog.jxck.io","url":"https://blog.jxck.io/entries/2018-07-18/how-to-logging-monthly-web.html","tags":["web","spec","proposal","article"],"content":"ウェブ標準に関する仕様や実装の一次情報について。\nブラウザ、WHATWG/W3C、TC39、IETFに関して、それぞれどのような形で情報が公開されているかについてまとめられている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"GoogleChromeLabs/ndb: ndb is an improved debugging experience for Node.js, enabled by Chrome DevTools","url":"https://github.com/GoogleChromeLabs/ndb","tags":["Chrome","node.js","Tools"],"content":"Puppeteerを使ったNode.jsのデバッガーツール。\nNode.jsのアプリに対してChrome開発者ツールでデバッグできる。\n`node --inspect`に比べてコンソールパネルでの実行、ブレークポイントの対応、プロファイル周りなどが追加されている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"普通のHTMLの書き方","url":"https://hail2u.net/documents/html-best-practices.html","tags":["HTML","HTML5","document","spec"],"content":"HTMLの避けるべき非推奨な書き方、簡潔な書き方、セマンティック、アクセシビリティを考慮した書き方などについてのドキュメント。\nそれぞれの項目に悪い例と良い例つきで解説されている。よくある記述の仕様的な解説なども書かれている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nathan/pax: The fastest JavaScript bundler in the galaxy.","url":"https://github.com/nathan/pax","tags":["Rust","JavaScript","bundler","Tools"],"content":"Rust製のJavaScript Bundler","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ramhejazi/draxt: draxt.js – NodeList-like/jQuery-like package for File System (node.js)","url":"https://github.com/ramhejazi/draxt","tags":["node.js","library"],"content":"Node.jsの`fs`を配列などのようにメソッドチェーンで操作できるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"imbrn/v8n: JavaScript fluent validation library.","url":"https://github.com/imbrn/v8n","tags":["JavaScript","library"],"content":"メソッドチェーンでバリデーションルールを書けるライブラリ","relatedLinks":[]}]},{"meta":{"title":"2018-07-31のJS: TypeScript 3.0、Chrome 68、Vueの内部技術","author":"azu","layout":"post","date":"2018-07-31T00:34:34.373Z","category":"JSer","tags":["typescript","chrome","Vue"],"url":"https://jser.info/2018/07/31/typescript-3.0chrome-68vue/"},"items":[{"category":"Headline","title":"Prettier 1.14: YAML Support · Prettier","url":"https://prettier.io/blog/2018/07/29/1.14.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 1.14リリース。\nYAMLのサポート、Front matterをサポート、`requirePragma`と`requirePragma`を各言語でサポート、CJK処理を改善してパフォーマンスの改善など","relatedLinks":[]},{"category":"Headline","title":"Angular v6.1 Now Available — TypeScript 2.9, Scroll Positioning, and more","url":"https://blog.angular.io/angular-v6-1-now-available-typescript-2-9-scroll-positioning-and-more-9f1c03007bb6","tags":["Angular","ReleaseNote"],"content":"Angular v6.1リリース。\nルーターの`scrollPositionRestoration`オプションでスクロール位置の保存に対応、TypeScript 2.9サポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing the Ionic 4 Beta | The Official Ionic Blog","url":"https://blog.ionicframework.com/announcing-ionic-4-beta/","tags":["JavaScript","library","ReleaseNote"],"content":"クロスプラットフォームアプリ開発フレームワークのIonic 4 Betaリリース。","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 3.0 | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2018/07/30/announcing-typescript-3-0/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.0リリース。\nProject references、可変長引数にGenerics型パラメータを適応できるように、Tuple型の改善、`unknown`型の追加、Reactの`defaultProps`の型のサポートなど","relatedLinks":[{"title":"TypeScript 3.0.0-RC 変更点 - Qiita","url":"https://qiita.com/vvakame/items/57a0559c45b88b2ae168"}]},{"category":"Article","title":"New in Chrome 68  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/07/nic68","tags":["Chrome","ReleaseNote"],"content":"Chrome 68リリース。\nHTTPなサイトにはNot Secureの表示がでるように。\nPage Lifecycle APIのサポート、`customElements.upgrade()`のサポート、Service WorkerにおけるHTTPキャッシュのデフォルトの挙動を変更など","relatedLinks":[{"title":"Chrome Releases: Stable Channel Update for Desktop","url":"https://chromereleases.googleblog.com/2018/07/stable-channel-update-for-desktop.html"},{"title":"Chromium Blog: Chrome 68 Beta: add to home screen, payment handler, page lifecycle","url":"https://blog.chromium.org/2018/06/chrome-68-beta-add-to-home-screen.html"},{"title":"Fresher service workers, by default  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/06/fresher-sw"}]},{"category":"Article","title":"Page Lifecycle API  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/07/page-lifecycle-api","tags":["JavaScript","Chrome","article","WebPlatformAPI"],"content":"Page Lifecycle APIについての解説。\nウェブページにライフサイクルの概念を導入する。`visibilitychange`など既存のイベントや新しく追加された`freeze`、`resume`などイベントの紹介、ライフサイクルにおけるStateについてを解説している。","relatedLinks":[]},{"category":"Article","title":"A one year PWA retrospective – Pinterest Engineering – Medium","url":"https://medium.com/@Pinterest_Engineering/a-one-year-pwa-retrospective-f4a2f4129e05","tags":["PWA","article"],"content":"PinterestのモバイルサイトのPWA化についてのタイムライン。\nログインユーザーからログアウトユーザーへの適応、GestaltとUIレイアウト、bundleサイズについてなど","relatedLinks":[]},{"category":"Article","title":"time-travel.md","url":"https://gist.github.com/jasonLaster/1e220992c294a571dd9b59abd084ccf2","tags":["debug","firefox","article"],"content":"FirefoxのNightlyに入ったWebReplayの使い方や機能について。 一連の操作や状態を保存してブレークポイントからの状態をもどしていったり、リプレイできるデバッグ機能。バグの再現とデバッグなどに利用できる。","relatedLinks":[]},{"category":"Article","title":"Redux vs. The React Context API","url":"https://daveceddia.com/context-api-vs-redux/","tags":["React","article"],"content":"React Contextの使い方や動作についての解説。Reduxでのステート管理との違いやContextはReduxを置き換えるものではない点についてなど","relatedLinks":[]},{"category":"Article","title":"Removing Babel's Stage Presets · Babel","url":"https://babeljs.io/blog/2018/07/27/removing-babels-stage-presets","tags":["babel","article"],"content":"Babel 7では`babel-preset-stage-0`のようなStage Presetを公開しないことについて。\nStage Presetを削除することにした背景やProposalへのフィードバックについて。","relatedLinks":[]},{"category":"Article","title":"Logging Activity With The Web Beacon API — Smashing Magazine","url":"https://www.smashingmagazine.com/2018/07/logging-activity-web-beacon-api/","tags":["JavaScript","article"],"content":"`navigator.sendBeacon`を使ってページを離脱する前にログを送信する方法について。\nまたGDPRやDNTの対応について","relatedLinks":[]},{"category":"WebsiteDocument","title":"thedaviddias/Front-End-Performance-Checklist: 🎮 The only Front-End Performance Checklist that runs faster than the others","url":"https://github.com/thedaviddias/Front-End-Performance-Checklist","tags":["browser","performance","document"],"content":"フロントエンドのパフォーマンスチェックリスト","relatedLinks":[]},{"category":"WebsiteDocument","title":"perf-tools/performance at master · artifact-project/perf-tools","url":"https://github.com/artifact-project/perf-tools/tree/master/performance","tags":["JavaScript","performance","library"],"content":"User Timing APIのpolyfillライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cozmo/jsQR: A pure javascript QR code reading library. This library takes in raw images and will locate, extract and parse any QR code found within.","url":"https://github.com/cozmo/jsQR","tags":["JavaScript","library"],"content":"依存がないQRコードリーダライブラリ","relatedLinks":[]},{"category":"Book","title":"Vue技术内幕","url":"http://hcysun.me/vue-design/","tags":["Vue","JavaScript","ebook"],"content":"Vue.jsのソースコードを解説する電子書籍。\nディレクトリ構造、オプションや初期化処理、リアクティブシステムの実装、テンプレートのパースとジェネレートの仕組み、Virtual DOMについてなど","relatedLinks":[]}]},{"meta":{"title":"2018-08-07のJS: Chrome 69 Beta、React/Vue/PreactのSSR XSSの修正、Preact 8.3.0","author":"azu","layout":"post","date":"2018-08-07T00:52:37.711Z","category":"JSer","tags":["chrome","react","vue","preact"],"url":"https://jser.info/2018/08/07/chrome-69-betareactvuepreactssr-xsspreact-8.3.0/"},"items":[{"category":"Headline","title":"Node v10.8.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v10.8.0/","tags":["node.js","npm","ReleaseNote"],"content":"Node v10.8.0リリース。\nnpm 6.2.0が同梱されるようになった。","relatedLinks":[]},{"category":"Headline","title":"React v16.4.2: Server-side vulnerability fix - React Blog","url":"https://reactjs.org/blog/2018/08/01/react-v-16-4-2.html","tags":["React","ReleaseNote","security"],"content":"React 16.4.2リリース。\nSSRにおいてユーザー入力をコンポーネントの属性名に渡せるとXSSが発生する問題を修正。\nminorごとに同様のpatchリリースが公開されている。\nVueとPreactも同様の問題があり、合わせてsecurity fixがリリースされた。","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 62 | WebKit","url":"https://webkit.org/blog/8384/release-notes-for-safari-technology-preview-62/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 62リリース。\nITPデバッグモードの試験的追加、`JSON.stringify`の修正、HLSストリームのキャッシュを無効化、CSS Gridの`gap`プロパティにおける`calc`が動くように修正など","relatedLinks":[]},{"category":"Headline","title":"TestCafe v0.21.0 Released | TestCafe","url":"http://devexpress.github.io/testcafe/blog/testcafe-v0-21-0-released.html","tags":["browser","testing","E2E","ReleaseNote"],"content":"TestCafe v0.21.0リリース。\nテストページをHTTPSでアクセスできるように、スクリーンショットのパスに変数を使えるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Dojo Version 3.0 | Dojo","url":"https://dojo.io/blog/2018/07/27/2018-07-27-Dojo-version-3-release/","tags":["JavaScript","library","ReleaseNote"],"content":"Dojo 3.0リリース。\nパッケージが細かく別れていたものを`@dojo/framework`に統合して利用できるように変更。マイグレーションスクリプトも公開されている。","relatedLinks":[{"title":"framework/V3-Migration-Guide.md at master · dojo/framework","url":"https://github.com/dojo/framework/blob/master/docs/V3-Migration-Guide.md"}]},{"category":"Headline","title":"ESLint v5.3.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2018/08/eslint-v5.3.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 5.3.0リリース。\n正規表現に関するルールが2つ、Async Functionに関するルールが2つ追加された。","relatedLinks":[{"title":"ESLint v5.3.0 - Qiita","url":"https://qiita.com/mysticatea/items/eb99e18d6cc7c3bf9317"},{"title":"Promise のコンストラクタに渡した async function 内で throw しても rejected な Promise は作られない（常に fulfilled になる） - Humanity","url":"http://tyru.hatenablog.com/entry/2018/08/04/220530"}]},{"category":"Headline","title":"Release 8.3.0 · developit/preact","url":"https://github.com/developit/preact/releases/tag/8.3.0","tags":["React","library","ReleaseNote"],"content":"Preact 8.3.0リリース。\n`getDerivedStateFromProps`と`getSnapshotBeforeUpdate`に対応。moduleを`.mjs`で出力するように、`setState`の挙動をReactに近づけるように修正など","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 69 Beta: CSS tricks, and more","url":"https://blog.chromium.org/2018/08/chrome-69-beta-av1-video-decoder-css.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 69βリリース。 CSS conic gradients、CSS scroll snap、CSS `env()` functionのサポート。\nReportingObserver API、Keyboard Map APIのサポートなど","relatedLinks":[{"title":"Audio/Video Updates in Chrome 69  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/08/chrome-69-media-updates"},{"title":"Deprecations and removals in Chrome 69  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/08/chrome-69-deps-rems"},{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features#browsers.chrome.desktop%3D69"}]},{"category":"Article","title":"Vue.js で XSS を作り込まないために気を付けること - SSTエンジニアブログ","url":"https://techblog.securesky-tech.com/entry/2018/08/01/110000","tags":["Vue","security","article","XSS"],"content":"Vue.jsでXSSが発生するポイントについての解説。\n`v-html`、`href`のバインディグ、サーバサイドのテンプレートとCSRでのエスケープ漏れなどについて","relatedLinks":[]},{"category":"Article","title":"JSDocで型チェックする - Qiita","url":"https://qiita.com/shisama/items/016288d38165d542fffd","tags":["TypeScript","article"],"content":"TypeScriptの`allowJs`と`checkJs`を使ったJavaScriptでの型チェックについて。\nJSDocで書いた型アノテーションや型定義ファイルを元に型チェックを行う方法について","relatedLinks":[]},{"category":"Article","title":"The Cost Of JavaScript In 2018 – Addy Osmani – Medium","url":"https://medium.com/@addyosmani/the-cost-of-javascript-in-2018-7d8950fbb5d4","tags":["JavaScript","article","performance"],"content":"JavaScriptのパフォーマンスコストについての記事。\nファイルサイズ、ロード時間、インタラクティブになるまでの時間、モバイルや低スペックマシンでのコスト。\nまたパフォーマンスを改善するパターンなどについて","relatedLinks":[]},{"category":"Article","title":"I created the exact same app in React and Vue. Here are the differences.","url":"https://medium.com/javascript-in-plain-english/i-created-the-exact-same-app-in-react-and-vue-here-are-the-differences-e9a1ae8077fd","tags":["Vue","React","article"],"content":"VueとReactで同じTodoアプリを作って比較する記事。\n処理ごとにそれぞれのやり方を比較して紹介している。","relatedLinks":[]},{"category":"Article","title":"ちゃんと理解するCode Splitting - Qiita","url":"https://qiita.com/seya/items/06b160adb7801ae9e66f","tags":["webpack","article","JavaScript"],"content":"webpackにおけるCode Splittingの動作の解説。Code Splittingのメリットとデメリット。\nCode SplittingするUIのパターンやDynamic Import、`webpackPrefetch`オプション、VueやReactでの対応についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Storybook Tutorial","url":"https://www.learnstorybook.com/","tags":["React","Angular","Vue","tutorial"],"content":"Storybookのチュートリアル。\nReact、Angular、Vueに対応したStirybookでのコンポーネント開発やChromaticを使ったビジュアルテストなどについて書かれている","relatedLinks":[{"title":"Chromatic visual testing for React","url":"https://www.chromaticqa.com/"}]},{"category":"WebsiteDocument","title":"Frontend News","url":"https://frontendnews.io/","tags":["CSS","DOM","JavaScript","mail","web"],"content":"フロントエンドに関する1週間に1つのTipsについてを更新するサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Fusion.js Documentation","url":"https://fusionjs.com/","tags":["JavaScript","library","plugin","browser","node.js"],"content":"UberのプラグインベースなBrowser/Node.jsウェブフレームワーク。コアにプラグインの仕組みとDIの仕組みを持ち、ReactやRedux、KoaなどUberがよく利用しているものをプラグインとして導入できる。\nwebpackやbabelなどをラップするcliがあり、create-react-appのように設定ファイルを触らずに開発ができる。","relatedLinks":[{"title":"Introducing Fusion.js: A Plugin-based Universal Web Framework","url":"https://eng.uber.com/fusionjs/"}]},{"category":"SoftwareLibrary","title":"sasha240100/between.js: Lightweight JavaScript (ES6) tweening engine","url":"https://github.com/sasha240100/between.js","tags":["JavaScript","library"],"content":"AからBへ値の変化を扱えるライブラリ。\nTweening animationのような特定のイージングやループでの値の変化を扱う。","relatedLinks":[]}]},{"meta":{"title":"2018-08-13のJS: sonarwhal to webhint、Dart 2、Vue CLI 3","author":"azu","layout":"post","date":"2018-08-13T12:22:03.816Z","category":"JSer","tags":["webhint","dart","vue"],"url":"https://jser.info/2018/08/13/sonarwhal-to-webhintdart-2vue-cli-3/"},"items":[{"category":"Headline","title":"webhint: a hinting engine for the web – webhint – Medium","url":"https://medium.com/webhint/webhint-a-hinting-engine-for-the-web-ef0d3fa32ea9","tags":["JavaScript","Tools","ReleaseNote"],"content":"webhint(sonarwhal)のリリース。\nsonarwhalからwebhintへ名前の変更、起動時間の改善、`npm create hintrc`で設定ファイルを作成できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"V8 JavaScript Engine: V8 release v6.9","url":"https://v8project.blogspot.com/2018/08/v8-release-69.html","tags":["V8","ReleaseNote"],"content":"V8 v6.9リリース。\nメモリ使用量の削減、WebAssemblyコンパイラの起動速度などの改善、DataViewの速度改善など","relatedLinks":[]},{"category":"Headline","title":"Announcing Dart 2 Stable and the Dart Web Platform – Dart – Medium","url":"https://medium.com/dartlang/dart-2-stable-and-the-dart-web-platform-3775d5f8eac7","tags":["dart","ReleaseNote"],"content":"Dart 2リリース。","relatedLinks":[{"title":"Dart 2 | Dart","url":"https://www.dartlang.org/dart-2"}]},{"category":"Headline","title":"Release v3.0.0 · lerna/lerna","url":"https://github.com/lerna/lerna/releases/tag/v3.0.0","tags":["JavaScript","monorepo","ReleaseNote","Tools"],"content":"monorepo管理ツールのlerna 3.0.0リリース。\n`lerna publish`と`lerna version`コマンドに分離、`lerna changed`の追加。\n`lerna publish`時に自動的にGitへ`--no-verify`を渡すのをやめ`--commit-hook`オプションを追加、lerna自身をmonorepoで管理するようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · karma-runner/karma","url":"https://github.com/karma-runner/karma/releases/tag/v3.0.0","tags":["browser","testing","ReleaseNote"],"content":"Karma 3.0.0リリース。\nデフォルトのタイムアウト時間の変更、`karma init`で`ChromeHeadless`を選択できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Vue CLI 3.0 is here! – The Vue Point – Medium","url":"https://medium.com/the-vue-point/vue-cli-3-0-is-here-c42bebe28fbb","tags":["Vue","console","Tools","ReleaseNote"],"content":"Vue CLI 3.0リリース。\nCLIが書き直されたバージョンでリッチな機能を多くもつ。\nejectしなくてもwebpackなどをカスタマイズできるように、プラグインシステム、ダッシュボードのGUI、開発サーバ、ビルドやModern Modeについてなど","relatedLinks":[{"title":"mozilla-neutrino/webpack-chain: A chaining API to generate and simplify the modification of Webpack configurations.","url":"https://github.com/mozilla-neutrino/webpack-chain"}]},{"category":"Headline","title":"Release v7.0.0-rc.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v7.0.0-rc.0","tags":["babel","ReleaseNote"],"content":"Babel 7 RCリリース。","relatedLinks":[]},{"category":"Article","title":"AngularJSのリプレースにAngularを選んだ話 - BizReach Tech Blog","url":"https://tech.bizreach.co.jp/posts/51/angular-upgrade/","tags":["Angular","article"],"content":"AngularJS(1.x)で書かれたページをパフォーマンスと将来性の問題からAngular(2以降)に移行した話。\n複数のアプリに対応できるようにUIコンポーネントをライブラリ化、Atomic Components、standard-versionを使ったバージョン管理についてなど","relatedLinks":[{"title":"大規模Angular SPA開発に立ち向かうためにアプリとUIを切り分けた話 - BizReach Tech Blog","url":"https://tech.bizreach.co.jp/posts/204/angular-upgrade-second/"}]},{"category":"Article","title":"Introducing Electron Fiddle – Felix Rieseberg – Medium","url":"https://medium.com/@felixrieseberg/introducing-electron-fiddle-1de2be1ba6e7","tags":["Electron","article","software","editor"],"content":"ElectronアプリをJSFiddleのようなプレイグラウンドで開発できるアプリ。\nエディタにコードを書いてElectronアプリを実行したり、コードをgistに共有したり、アプリのパッケージ化できる","relatedLinks":[{"title":"electron/fiddle: 🚀 The easiest way to get started with Electron","url":"https://github.com/electron/fiddle"}]},{"category":"Article","title":"Variable Scope in Modern JavaScript with var, let and const | Andy Carter","url":"https://andy-carter.com/blog/variable-scope-in-modern-javascript","tags":["JavaScript","article"],"content":"`var`、`let`、`const`の変数のスコープについて解説している記事。","relatedLinks":[{"title":"関数とスコープ · JavaScriptの入門書 #jsprimer","url":"https://asciidwango.github.io/js-primer/basic/function-scope/"}]},{"category":"SoftwareLibrary","title":"NaturalIntelligence/fast-xml-parser: Validate XML, Parse XML to JS/JSON and vise versa, or parse XML to Nimn rapidly without C/C++ based libraries and no callback","url":"https://github.com/NaturalIntelligence/fast-xml-parser","tags":["XML","JavaScript","library"],"content":"Pure JavaScriptなXML to JSON、JSON to XMLの変換ライブラリ。","relatedLinks":[]},{"category":"Book","title":"Introduction · Human Redux","url":"https://read.reduxbook.com/","tags":["redux","book"],"content":"Reduxについての書籍。\nReduxの使い方、Selector、ルーティング、非同期処理やエラー処理、Redux Bundlerなどについて","relatedLinks":[]},{"category":"Book","title":"JavaScript for impatient programmers","url":"http://exploringjs.com/impatient-js/","tags":["JavaScript","book"],"content":"JavaScriptの文法や機能についてのJavaScript初心者向けの書籍。\n各章ごとにエクササイズが用意されており、ES2018を含む主要な機能を一覧的に学べる書籍。","relatedLinks":[]},{"category":"Book","title":"React Native+Expoではじめるスマホアプリ開発 ~JavaScriptによるアプリ構築の実際~ | 松澤 太郎 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4839966648/","tags":["React","book","ios","Android"],"content":"2018年8月29日発売\nReact Nativeでのアプリ開発についての書籍。","relatedLinks":[]}]},{"meta":{"title":"2018-08-21のJS: webpack 4のマイナーな変更、スクロールの歴史、Puppeteer Recorder","author":"azu","layout":"post","date":"2018-08-21T01:39:48.415Z","category":"JSer","tags":["webpack","history","Puppeteer"],"url":"https://jser.info/2018/08/21/webpack-4puppeteer-recorder/"},"items":[{"category":"Headline","title":"Release: npm@6.4.0 - 📣 announcements - npm forum","url":"https://npm.community/t/release-npm-6-4-0/1417","tags":["npm","ReleaseNote"],"content":"npm 6.4.0リリース。\nIPv6が使える場合はIPv6を使うように、`npm audit`に`--audit-level`を追加など","relatedLinks":[]},{"category":"Article","title":"Variable Scope in Modern JavaScript with var, let and const | Andy Carter","url":"https://andy-carter.com/blog/variable-scope-in-modern-javascript","tags":["JavaScript","article"],"content":"`var`、`let`、`const`の変数のスコープについて解説している記事。","relatedLinks":[{"title":"関数とスコープ · JavaScriptの入門書 #jsprimer","url":"https://asciidwango.github.io/js-primer/basic/function-scope/"}]},{"category":"Article","title":"Better tree shaking with deep scope analysis – webpack – Medium","url":"https://medium.com/webpack/better-tree-shaking-with-deep-scope-analysis-a0b788c0ce77","tags":["webpack","JavaScript","article"],"content":"webpackのTree Shakingではモジュール間同士の依存に関するDead Code Eliminationに動かないケースがあった。\nそのパターンを解決するプラグインとその動作の解説について","relatedLinks":[{"title":"vincentdchan/webpack-deep-scope-analysis-plugin: A webpack plugin for deep scope analysis","url":"https://github.com/vincentdchan/webpack-deep-scope-analysis-plugin"},{"title":"Unexpected code after tree-shake · Issue #6264 · webpack/webpack","url":"https://github.com/webpack/webpack/issues/6264"}]},{"category":"Article","title":"webpack 4.0 to 4.16: Did you know? – webpack – Medium","url":"https://medium.com/webpack/webpack-4-0-to-4-16-did-you-know-71e25a57fa6b","tags":["webpack","article"],"content":"webpack 4以降の変更点について。\n`optimization`に`automaticNameDelimiter`、`maxSize`オプションの追加。\nDynamic Importでpreloadなどを指定できる`webpackPrefetch`や、そのまま`import()`として出力するための`webpackIgnore`コメントのサポートなど。","relatedLinks":[]},{"category":"Article","title":"Scroll to the future — Martian Chronicles, Evil Martians’ team blog","url":"https://evilmartians.com/chronicles/scroll-to-the-future-modern-javascript-css-scrolling-implementations","tags":["browser","UI","WebPlatformAPI","CSS","JavaScript"],"content":"ブラウザとスクロールについての歴史や変更についてをまとめた記事。\nスクロールバーのOSやブラウザでの表示の違い、`Element#scrollIntoView`やCSS `scroll-behavior`でのスクロールの挙動。\nまたstickyやIntersection Observer、`overscroll-behavior`プロパティなどについて","relatedLinks":[]},{"category":"Article","title":"Cross-tab Synchronization with the Web Locks API - Blog | SitePen","url":"https://www.sitepen.com/blog/2018/08/14/cross-tab-synchronization-with-the-web-locks-api/","tags":["WebPlatformAPI","Chrome","JavaScript","article"],"content":"Web Locks APIを使ったタブ間同士のコミュニケーションについて。\nWeb Locks APIのユースケースや使い方について","relatedLinks":[{"title":"WICG/web-locks: Cross-tab resource coordination API","url":"https://github.com/WICG/web-locks/"}]},{"category":"Article","title":"JavaScript engine fundamentals: optimizing prototypes · Mathias Bynens","url":"https://mathiasbynens.be/notes/prototypes","tags":["JavaScript","V8"],"content":"JavaScriptエンジン(V8)の`prototype`の最適化の仕組みについての解説","relatedLinks":[]},{"category":"SlideVideo","title":"Tangled World of Web Technology ― Are we safe? - Speaker Deck","url":"https://speakerdeck.com/lmt_swallow/tangled-world-of-web-technology-are-we-safe","tags":["JavaScript","library","XSS","slide","security"],"content":"ブラウザでの新しい技術と今まである技術が絡んだ脆弱性についてのスライド。\nReactやVueといったデフォルトエスケープされるライブラリにおいてもXSSは起こるケースがあること。\nまた、Service WorkerやCSPなど新しい技術と今まである技術が絡み合うことで発生する問題などの紹介。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Puppeteer Recorder - Chrome ウェブストア","url":"https://chrome.google.com/webstore/detail/puppeteer-recorder/djeegiggegleadkkbgopoonhjimgehda","tags":["Chrome","Extension","testing"],"content":"Chromeの操作を記録してPuppeteerで再生できるスクリプトを出力できるブラウザ拡張。","relatedLinks":[]},{"category":"WebsiteDocument","title":"deepsweet/foxr: 🦊 Node.js API to control Firefox","url":"https://github.com/deepsweet/foxr","tags":["firefox","API","node.js"],"content":"Firefoxをremote protocol経由で操作するNode.jsライブラリ。\nHeadlessモードにも対応し、APIはPuppeteerのサブセット互換のものを提供することを目的としている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Angular Console","url":"https://angularconsole.com/","tags":["Angular","console","GUI","software"],"content":"Angular CLIのUIを提供することを目的にしたアプリ。\nAngular CLIでできる操作をGUIから行えるようにすることが目的。","relatedLinks":[{"title":"Angular Console — The UI for the Angular CLI – nrwl","url":"https://blog.nrwl.io/angular-console-the-ui-for-the-angular-cli-a5d0924240b7"}]},{"category":"SoftwareLibrary","title":"flowchart.js","url":"http://flowchart.js.org/","tags":["JavaScript","SVG","library","グラフ"],"content":"テキストからSVGのフローチャートを作成するJavaScriptライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Tonejs/Tone.js: A Web Audio framework for making interactive music in the browser.","url":"https://github.com/Tonejs/Tone.js","tags":["web ","audio","API","library"],"content":"Web Audio APIを使ったインタラクティブミュージックを作成するためのフレームワーク。\nMax/MSPインスパイアなシグナルプロセッシング向けの処理やモジュールを提供するのが目的","relatedLinks":[]},{"category":"SoftwareLibrary","title":"arguiot/TheoremJS: A Math library for computation in JavaScript","url":"https://github.com/arguiot/TheoremJS","tags":["JavaScript","library"],"content":"MathやNumber、代数、統計などに関する関数を集めたmathematicalフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"spencermountain/spacetime: A lightweight javascript timezone library","url":"https://github.com/spencermountain/spacetime","tags":["JavaScript","i18n","library"],"content":"他のライブラリに依存していないタイムゾーンライブラリ。また、i18n APIには直接依存していない。歴史的なタイムゾーンの扱いを省略することでファイルサイズを小さくしている。","relatedLinks":[{"title":"Home · spencermountain/spacetime Wiki","url":"https://github.com/spencermountain/spacetime/wiki"}]},{"category":"Book","title":"Vue.js入門 基礎から実践アプリケーション開発まで | 川口 和也, 手島 拓也, 野田 陽平, 喜多 啓介, 片山 真也 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4297100916/","tags":["Vue","book"],"content":"2018年9月22日発売\nVue.jsについての書籍","relatedLinks":[]},{"category":"Book","title":"JavaScript Data Structures and Algorithms: An Introduction to Understanding and Implementing Core Data Structure and Algorithm Fundamentals: Sammie Bae: 9781484239872: Amazon.com: Books","url":"https://www.amazon.com/dp/1484239873/","tags":["JavaScript","book"],"content":"2019年3月11日発売\nJavaScriptでのデータ構造やアルゴリズムについての書籍","relatedLinks":[]},{"category":"Book","title":"JavaScript逆引きレシピ 第2版 達人が選んだ珠玉の現場ワザ（山田祥寛）｜翔泳社の本","url":"https://www.shoeisha.co.jp/book/detail/9784798157573","tags":["JavaScript","book"],"content":"2018年10月15日発売\nJavaScriptの逆引きリファレンス本","relatedLinks":[]}]},{"meta":{"title":"2018-08-28のJS: Babel 7、BabelとTypeScript、継続的なパフォーマンス改善と計測","author":"azu","layout":"post","date":"2018-08-28T02:02:42.367Z","category":"JSer","tags":["babel","TypeScript","performance"],"url":"https://jser.info/2018/08/28/babel-7babeltypescript/"},"items":[{"category":"Headline","title":"jsdom/Changelog.md at master · jsdom/jsdom","url":"https://github.com/jsdom/jsdom/blob/master/Changelog.md#1200","tags":["JavaScript","DOM","ReleaseNote"],"content":"jsdom 12.0.0リリース。\nNode.js 8以降が必要になるように、`ResourceLoader`の追加、依存の更新など","relatedLinks":[]},{"category":"Headline","title":"Johnny-Five.io: Johnny-Five v1.0","url":"http://johnny-five.io/news/v1_0/","tags":["JavaScript","library","ReleaseNote"],"content":"Robotics Programming Frameworkの Johnny-Five v1.0リリース","relatedLinks":[]},{"category":"Headline","title":"Release v1.1.0 · stimulusjs/stimulus","url":"https://github.com/stimulusjs/stimulus/releases/tag/v1.1.0","tags":["JavaScript","HTML","library","ReleaseNote"],"content":"Turbolinksと連携できるJavaScriptフレームワークのStimulus 1.1.0リリース。\n`@stimulus/polyfills`の追加、`data-action`属性で複数のactionを指定時にその順序を尊重するように、`DOMContentLoaded`で処理を開始するようになるなど","relatedLinks":[]},{"category":"Headline","title":"Almin v0.18 – React Native compatible · Almin","url":"https://almin.js.org/blog/2018/08/27/almin-0.18.html","tags":["JavaScript","library","ReleaseNote","almin"],"content":"ステート管理ライブラリのAlmin 0.18.0リリース。\nTypeScript 3.0に対応、React Nativeとの互換性の向上、ファイルサイズの削減など","relatedLinks":[]},{"category":"Headline","title":"Babel 7 Released · Babel","url":"https://babeljs.io/blog/2018/08/27/7.0.0","tags":["babel","ReleaseNote"],"content":"Babel 7リリース。\nNode.js 4以下のサポート終了、`@babel`スコープへモジュールを移動、`es2015`のような年号プリセットを廃止し`preset-env`に移行、Stageプリセットを廃止。\n`babel.config.js`での設定をサポート、パフォーマンスの改善など。\nマイグレーションは`babel-upgrade`で行える。","relatedLinks":[{"title":"babel/babel-upgrade: ⬆️ A tool for upgrading Babel versions (to v7): ","url":"https://github.com/babel/babel-upgrade"}]},{"category":"Article","title":"dep: a little Node.js dependency installer – Daijiro Wachi – Medium","url":"https://medium.com/@watilde/dep-a-little-node-js-dependency-installer-b8fead7596d3","tags":["node.js","article","npm"],"content":"`package.json`の依存をインストールできる`dep`について。\n`npm`のコマンドと違って`install`、`lock`、`run`のみを扱う","relatedLinks":[]},{"category":"Article","title":"WorkerDOM: Concurrency for JavaScript programming with the DOM – Accelerated Mobile Pages Project","url":"https://amphtml.wordpress.com/2018/08/21/workerdom/","tags":["DOM","webworker","article","AMP","JavaScript"],"content":"WebWorkerの中で動くDOMの実装のアルファ版を公開したという話。\nメインスレッドでの処理が重なるとjankとなるため、WorkerスレッドでDOM APIの処理を行う実験的実装。\nHydrateしたデータでWorkerとの間をやりとりし、変更はMutationObserverで監視する","relatedLinks":[{"title":"WorkerDOM: JavaScript Concurrency and the DOM - Speaker Deck","url":"https://speakerdeck.com/cramforce/workerdom-javascript-concurrency-and-the-dom"},{"title":"ampproject/worker-dom: The same DOM API and Frameworks you know, but in a Web Worker.","url":"https://github.com/ampproject/worker-dom"}]},{"category":"Article","title":"Why GraphQL: Advantages, Disadvantages & Alternatives - RWieruch","url":"https://www.robinwieruch.de/why-graphql-advantages-disadvantages-alternatives/","tags":["graphic","article","tutorial"],"content":"GraphQLに関する連載記事。\nGraphQLの特徴、メリット、デメリット、Apolloについて。またApollo Serverとexpressを使ってGraphQLサーバを作成するチュートリアルなど","relatedLinks":[{"title":"GraphQL Server Tutorial with Apollo Server and Express - RWieruch","url":"https://www.robinwieruch.de/graphql-apollo-server-tutorial/"}]},{"category":"Article","title":"Web Performance Made Easy: Google I/O 2018 edition  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/08/web-performance-made-easy","tags":["browser","performance","Chrome","article"],"content":"ウェブサイトのパフォーマンスについての概要的な記事の。\nLightHouseやChromeの開発者ツールを使った不必要なリソースの把握。\nJavaScriptのサイズが起動速度に与える影響やファイルサイズの削減、レンダリングのボトルネックの取り除く方法などについて","relatedLinks":[]},{"category":"Article","title":"TypeScript and Babel 7 | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2018/08/27/typescript-and-babel-7/","tags":["TypeScript","babel","article"],"content":"Babel 7の`@babel/typescript`について。\nBabelでTypeScriptのコードをJavaScriptへ変換(型情報を除去)できる。\n型チェックやいくつかのTS独自の構文をサポートしないという制限はあるが、Babelのエコシステム上でTSのコードを扱える。","relatedLinks":[]},{"category":"Article","title":"Service Worker Caching Strategies Based on Request Types","url":"https://medium.com/dev-channel/service-worker-caching-strategies-based-on-request-types-57411dd7652c","tags":["Fetch","ServiceWorker","article"],"content":"どの種類に対するリクエストかを判定できる`Request.destination`について。 `Request.destination`を使いキャッシュの戦略を変えるという話。注意点として、一部リクエストは空文字列となり判定できないという話。\nまた`Request.mode`や`Request.url`などとの組み合わせについて","relatedLinks":[]},{"category":"SlideVideo","title":"Webpagetestから始める継続的パフォーマンス改善","url":"http://azu.github.io/slide/2018/roppongijs/webpagetest-performance.html","tags":["browser","performance","webservice","slide"],"content":"ウェブアプリの継続的なパフォーマンス改善についてのスライド。\nパフォーマンス改善と指標、それを測るための継続的な計測とサービスについて。\nWebPagetestを中心にどのように計測して可視化し、改善した結果を確認したりリグレッションを防ぐかについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"A brief guide to using WebpageTest - Frontend News #5","url":"https://frontendnews.io/editions/2018-08-22-a-brief-guide-to-webpagetest","tags":["browser","performance","webservice"],"content":"ウェブサイトのパフォーマンス計測サービスであるWebPagetestの使い方を解説した記事。\nそれぞれのビューの読み方や指標となる値などについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rikschennink/fitty: ✨ Makes text fit perfectly","url":"https://github.com/rikschennink/fitty","tags":["JavaScript","DOM","library"],"content":"指定した要素に対してテキストのサイズを合わせるライブラリ。\nカスタムフォントなどにも対応している","relatedLinks":[]}]},{"meta":{"title":"2018年9月22日(土)に JSer.info 400回目記念イベントを開催します","author":"azu","layout":"post","date":"2018-08-31T13:15:00.000Z","category":"Article","tags":["イベント","JSer.info"],"url":"https://jser.info/2018/08/31/jser-400-event-announce/"},"items":[]},{"meta":{"title":"2018-09-04のJS: Browser Interoperability、Mobile Form Design、400回記念イベントページ公開","author":"azu","layout":"post","date":"2018-09-04T02:19:41.829Z","category":"JSer","tags":["browser","Mobile","form"],"url":"https://jser.info/2018/09/04/browser-interoperabilitymobile-form-design400/"},"items":[{"category":"Headline","title":"Release Notes for Safari Technology Preview 64 | WebKit","url":"https://webkit.org/blog/8406/release-notes-for-safari-technology-preview-64/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 64リリース。\nWebWorkerの`name`オプションをサポート、Safari Push Notificationsでパーミッションを要求するのはユーザージェスチャ起因じゃないとできなくなるなど","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Charting Browser Interoperability","url":"https://blog.chromium.org/2018/08/charting-browser-interoperability.html","tags":["browser","WebPlatformAPI"],"content":"ブラウザのAPIに関するinteroperabilityについての記事\nブラウザ固有のAPIの数、削除されているAPIの数などのデータの見方。\nまたそれらのAPIをどのように集めているかについてなど","relatedLinks":[{"title":"Web API Confluence Dashboard","url":"https://web-confluence.appspot.com/#!/"}]},{"category":"Headline","title":"Release v3.5.0 · fuse-box/fuse-box","url":"https://github.com/fuse-box/fuse-box/releases/tag/v3.5.0","tags":["node.js","bundler","ReleaseNote"],"content":"FuseBox 3.5.0リリース。\ntargetに`npm-server`, `npm-browser`, `npm-universal`を追加など","relatedLinks":[]},{"category":"Headline","title":"Release v0.80.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.80.0","tags":["flowtype","ReleaseNote"],"content":"Flow 0.80.0リリース。\nFlow lintのseverity算出の仕組みの変更、いつくかのlibdefの型を変更など","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 70)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/08/devtools","tags":["Chrome","article"],"content":"Chrome 70の開発者ツールの変更点について。\nLive Expressions、ネットワークスロットリングをコマンドメニューから選択できるように、AudioContextに関するEvent Listener BreakPointのサポートなど","relatedLinks":[]},{"category":"Article","title":"Best Practices For Mobile Form Design — Smashing Magazine","url":"https://www.smashingmagazine.com/2018/08/best-practices-for-mobile-form-design/","tags":["mobile","design","article"],"content":"モバイルでのフォームのデザインについての記事。\nラベルの置き方、フィールドのサイズ、確認項目、パスワードの表示、フィールドの分割、選択肢の置き方、アクセシビリティについてなど","relatedLinks":[]},{"category":"Article","title":"Introducing F2 – Sima – Medium","url":"https://medium.com/@SimaZwx/https-medium-com-simazwx-introducing-f2-c44fb4e74c2d","tags":["JavaScript","グラフ","library","mobile","article"],"content":"モバイル向けに作られたインタラクティブグラフライブラリのF2について。","relatedLinks":[{"title":"antvis/f2: 📱📈An elegant, interactive and flexible charting library for mobile.","url":"https://github.com/antvis/f2/"}]},{"category":"Article","title":"Using the React DevTools Profiler to Diagnose React App Performance Issues | Netlify","url":"https://www.netlify.com/blog/2018/08/29/using-the-react-devtools-profiler-to-diagnose-react-app-performance-issues/","tags":["React","performance","article"],"content":"Reactの新しい開発者ツールのProfierを使ったパフォーマンスの問題の見つけ方について。\nReact Renderのcommits回数が多い問題を見つけて、debounceでcommitを減らすようにした話","relatedLinks":[]},{"category":"Article","title":"マイクロサービス/API時代のフロントエンド開発 - ＠IT","url":"http://www.atmarkit.co.jp/ait/series/9324/","tags":["BFF","server","API","article"],"content":"BFF（Backends For Frontends）についての連載記事。\nUIのためAPIサーバであるBFFの役割、ユースケース、アンチパターンについてなど","relatedLinks":[]},{"category":"Article","title":"Array.prototype.sort について | メモログ","url":"https://memolog.org/2018/about-array-prototype-sort.html","tags":["JavaScript","V8","article"],"content":"各ブラウザのJavaScriptエンジンのsotの実装について。 仕様では安定ソートを保証しないが、大体が安定ソートになっていっている。\nV8はV8 7.0/Chrome 70でTimSortになる。","relatedLinks":[{"title":"Mathias Bynens on Twitter: ","url":"https://twitter.com/mathias/status/1036626116654637057"}]},{"category":"SlideVideo","title":"TypeScript導入で得られる「変えていく勇気」 / The courage to change by TypeScript - Speaker Deck","url":"https://speakerdeck.com/okunokentaro/the-courage-to-change-by-typescript","tags":["TypeScript","slide"],"content":"TypeScriptを使ったアプリケーション開発についてのスライド。\n今のTypeScriptでは型定義ファイルの管理方法、途中から導入するための手段などが整備されている点について。\nまた型を活用したリファクタリングを行いやすいアーキテクチャについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"dy/font-measure: Compute font metrics such as x-height, cap height, ascent, descent and tittle for any web font.","url":"https://github.com/dy/font-measure","tags":["JavaScript","library"],"content":"font familyを指定すると、そのfontのメトリクス情報を返してくれるライブラリ。 Canvasを使い計測している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"UpperCod/Atomico: 🔥 A small library to work with web components","url":"https://github.com/uppercod/atomico","tags":["WebComponents","jsx","JavaScript","library"],"content":"JSXをサポートしたWebComponentを作成するライブラリ。\nCustom ElementにReactライクなライフサイクルイベントを追加している","relatedLinks":[]},{"category":"Book","title":"WebGL Insights 日本語版 - アスキードワンゴ","url":"https://asciidwango.jp/post/176833750840/webgl-insights-%E6%97%A5%E6%9C%AC%E8%AA%9E%E7%89%88","tags":["WebGL","book"],"content":"2018年8月24日発売\nWebGL Insightsの翻訳本","relatedLinks":[{"title":" WebGL Insights ","url":"http://www.webglinsights.com/"}]}]},{"meta":{"title":"2018-09-11のJS: Firefox 62.0、whatwg-fetch 3.0.0、Removing jQuery from GitHub.com","author":"azu","layout":"post","date":"2018-09-11T02:04:31.970Z","category":"JSer","tags":["Firefox","GitHub","jQuery"],"url":"https://jser.info/2018/09/11/firefox-62.0whatwg-fetch-3.0.0removing-jquery-from-github.com/"},"items":[{"category":"Headline","title":"New in Chrome 69  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/09/nic69","tags":["Chrome","ReleaseNote"],"content":"Chrome 69リリース。\nCSS Scroll Snap、CSS `env`とDisplay cutouts、Web Locks API、OffscreenCanvasのサポートなど","relatedLinks":[{"title":"Chromium Blog: Chrome 69 Beta: CSS tricks, and more","url":"https://blog.chromium.org/2018/08/chrome-69-beta-av1-video-decoder-css.html"},{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features#browsers.chrome.desktop%3D69"}]},{"category":"Headline","title":"Node v10.10.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v10.10.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 10.10.0リリース\n`fs`モジュールが`TypedArray`と`DataView`をサポート、`http2`モジュールがexperimentalではなくなった。\nまた`vm.compileFunction`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release fetch 3.0.0 · github/fetch","url":"https://github.com/github/fetch/releases/tag/v3.0.0","tags":["Fetch","JavaScript","library","polyfill","ReleaseNote"],"content":"Fetch polyfill 3.0.0リリース。\n`credentials`のデフォルト値を`same-origin`に変更、`Request`をキャンセルするための`signal`をサポート、仕様の追従など","relatedLinks":[]},{"category":"Headline","title":"Release v16.5.0 · facebook/react","url":"https://github.com/facebook/react/releases/tag/v16.5.0","tags":["React","ReleaseNote"],"content":"React 16.5.0リリース。\nReact DevTools Profilerのサポート、`onAuxClick`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Firefox 62.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/62.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 62.0リリース。\n開発者ツールでShape Path Editorの追加、CORSエラー表示の改善。\n`Array#flat`と`Array#flatMap`をデフォルト有効化、`import.meta`のサポート、WebDriver APIの更新など","relatedLinks":[{"title":"Firefox 62 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/62"}]},{"category":"Article","title":"Web performance review: TradeMe | Wildly Inaccurate","url":"https://wildlyinaccurate.com/web-performance-review-trademe/","tags":["browser","performance","article"],"content":"SpeedCurveで計測しながら、ページの表示のパフォーマンスを改善する話。\n何がボトルネックであるかを調べて、Hero Elementであるトップ画像の表示を早く表示するかについて。\nまた改善後もperformance budgetsをもとに修正し続けることについて","relatedLinks":[]},{"category":"Article","title":"The Reporting API  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/09/reportingapi","tags":["browser","WebPlatformAPI","article"],"content":"Reporting APIについて。\n指定したURLに対してCSP違反、Feature Policy違反、deprecationｍネットワークエラーなどのレポートを送信できる。\nまたレポートが送信されたかをデバッグする方法について","relatedLinks":[]},{"category":"Article","title":"Developer Tools support for Web Components in Firefox 63 – Firefox Nightly News","url":"https://blog.nightly.mozilla.org/2018/09/06/developer-tools-support-for-web-components-in-firefox-63/","tags":["firefox","debug","WebComponents","article"],"content":"Firefox 63でWeb Componentsがデフォルトで有効化され開発者ツールも`<template>`要素やShadow DOMなどに対応する","relatedLinks":[]},{"category":"Article","title":"Removing jQuery from GitHub.com frontend | GitHub Engineering","url":"https://githubengineering.com/removing-jquery-from-github-frontend/","tags":["github","jQuery","JavaScript","WebComponents","article"],"content":"GitHubがjQueryの依存を外すまでの話。\njQueryの機能はウェブ標準で代替できるものが増え、また一部のjQueryのメソッドチェーンには意図通りではない挙動があった。\nコードで使われてる`jQuery`のメトリクスをとり可視化、ESLintを使ってjQueryの利用をCIでチェック、Polyfillを使うなどしてウェブ標準の実装に置き換えていった話。","relatedLinks":[{"title":"dgraham/eslint-plugin-jquery: Disallow jQuery functions with native equivalents.","url":"https://github.com/dgraham/eslint-plugin-jquery#readme"}]},{"category":"Article","title":"Asynchronous Access to HTTP Cookies  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/09/asynchronous-access-to-http-cookies","tags":["Chrome","JavaScript","article"],"content":"Chrome 69でOrigin Trialを開始した Cookie Store APIについて。\n`document.cookie` APIとは異なり非同期処理として扱え、値の変更も監視できる。\nまたServie Workerからも利用できるようになっている","relatedLinks":[]},{"category":"Article","title":"Inside look at modern web browser (part 1)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/09/inside-browser-part1","tags":["Chrome","browser","article"],"content":"Chromeのプロセスについての連載。\nどのようにプロセス分離されているか、ページナビゲーションからの各処理の流れなどについて","relatedLinks":[]},{"category":"Article","title":"A tour of JavaScript timers on the web | Read the Tea Leaves","url":"https://nolanlawson.com/2018/09/01/a-tour-of-javascript-timers-on-the-web/","tags":["JavaScript","article"],"content":"JavaScriptのタイマー処理についての解説。\nmicrotask、`setTimeout`/`setInterval`、\n`setImmediate`、\n`requestAnimationFrame`、`requestIdleCallback`について","relatedLinks":[]},{"category":"Article","title":"TypeScript with Babel: A Beautiful Marriage – DailyJS – Medium","url":"https://medium.com/dailyjs/typescript-babel-ce24f724398","tags":["TypeScript","babel","article"],"content":"Babel 7の`@babel/preset-typescript`でサポートされたTypeScriptのコードコンパイルについて。\nユースケースや`.ts`をBabelでコンパイルして`tsc`で型チェックをする例などについて。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lusakasa/sqorn: A Javascript library for building SQL queries","url":"https://github.com/lusakasa/sqorn","tags":["JavaScript","SQL","library"],"content":"Tagged Template Literalを使ったSQLクエリビルダー","relatedLinks":[]},{"category":"Book","title":"Nuxt.jsビギナーズガイド―Vue.js ベースのフレームワークによるシングルページアプリケーション開発 | 花谷 拓磨 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4863542569/","tags":["Vue","book"],"content":"2018年10月19日発売\nNuxt.jsについての書籍","relatedLinks":[]},{"category":"Book","title":"Practical React Native: Build Two Full Projects and One Full Game using React Native: Frank Zammetti: 9781484239384: Amazon.com: Books","url":"https://www.amazon.com/dp/1484239385/","tags":["JavaScript","React","book"],"content":"2019年3月10日発売\nReact Nativeについての書籍","relatedLinks":[]},{"category":"Book","title":"Browsers, Devices, and Fonts: A Designer's Guide to Fonts and How They Function on the Web: Gary Rozanc: 9781138612310: Amazon.com: Books","url":"https://www.amazon.com/dp/1138612316/","tags":["web","desin","fonts","book"],"content":"2018年12月8日発売\nウェブタイポグラフィについての書籍。\nWeb Fontsとデザインについて","relatedLinks":[]},{"category":"Book","title":"Jump Start Vue.js: Nilson Jacques: 9781925836097: Amazon.com: Books","url":"https://www.amazon.com/dp/1925836096/","tags":["Vue","JavaScript","book"],"content":"2019年2月25日発売\nVue、Vuex、Nuxt.jsについて簡潔に紹介する書籍","relatedLinks":[]}]},{"meta":{"title":"2018-09-18のJS: Chrome 70 beta、縦書きの実装、Vue Patterns","author":"azu","layout":"post","date":"2018-09-18T01:52:53.161Z","category":"JSer","tags":["chrome","vue","css"],"url":"https://jser.info/2018/09/18/chrome-70-betavue-patterns/"},"items":[{"category":"Headline","title":"Announcing TypeScript 3.1 RC | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2018/09/13/announcing-typescript-3-1-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.1 RCリリース。\nMapped TypeでTupleやArrayの扱いを改善、関数にプロパティを定義できるように。\nまた破壊的な変更点として`lib.d.ts`をWeb IDLから生成するためベンダー独自の型が削除される。`typeof foo === \"function\"`でのtype gurdeの挙動の変更など","relatedLinks":[{"title":"Breaking Changes · Microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/Breaking-Changes"}]},{"category":"Headline","title":"Chromium Blog: Chrome 70 beta: shape detection, web authentication, and more","url":"https://blog.chromium.org/2018/09/chrome-70-beta-shape-detection-web.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 70リリース。\nShape Detection APIのorigin trialの開始、 Web Authenticationで指紋認証をサポート、Web Workerで`name`オプション、TLS 1.3のサポート。\nWeb Components v0を非推奨化など","relatedLinks":[]},{"category":"Headline","title":"Acorn 6.0.0 released - Acorn - discuss.Tern","url":"https://discuss.ternjs.net/t/acorn-6-0-0-released/230","tags":["JavaScript","library","ReleaseNote"],"content":"JavaScriptパーサのAcorn 6.0.0リリース。\nTypeScriptの型定義を同梱、`ecmaVersion`のデフォルト値を`9`に変更、いくつかの内部処理を別パッケージに分離など。","relatedLinks":[]},{"category":"Headline","title":"neonious/lowjs: A port of Node.JS with far lower system requirements. Community version for POSIX systems such as Linux, uClinux or Mac OS X.","url":"https://github.com/neonious/lowjs","tags":["JavaScript","node.js","library"],"content":"組み込み向けのファイルサイズが2MB程度のNode.jsポート。 V8の代わりにDuktapeを使っている。","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · janl/mustache.js","url":"https://github.com/janl/mustache.js/releases/tag/v3.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"mustache.js 3.0.0リリース。\nプリミティブ型のプロパティのレンダリングに対応、`render`の第４引数にdelimiterを指定できるようにしキャッシュの問題を修正など","relatedLinks":[]},{"category":"Article","title":"カクヨムでの縦組み表示の実装と、縦書きWebの将来に向けて (builderscon tokyo 2018) - Hatena Developer Blog","url":"http://developer.hatenastaff.com/entry/2018/09/11/152905","tags":["CSS","HTML","article","browser"],"content":"縦書き表示を行った際のブラウザのバグや問題への対象方法について","relatedLinks":[]},{"category":"Article","title":"Introducing the React Profiler – React Blog","url":"https://reactjs.org/blog/2018/09/10/introducing-the-react-profiler.html","tags":["React","performance","article"],"content":"React 16.5でサポートされたプロファイルと開発者ツールについて。\n開発者ツールでの計測方法(dev/prod)、使い方などについて","relatedLinks":[]},{"category":"Article","title":"Why React16 is a blessing to React developers – freeCodeCamp.org","url":"https://medium.freecodecamp.org/why-react16-is-a-blessing-to-react-developers-31433bfc210a","tags":["React","article"],"content":"React 16で追加された機能の紹介。\n`componentDidCatch`のエラーハンドリング、Fragments、Portal、Custom DOM Attributesについて。\nRef周りのAPIやContext APIの追加、ライフサイクルの変更についてなど","relatedLinks":[]},{"category":"Article","title":"Operational Introduction to Algebraic Effects and Continuations","url":"https://gist.github.com/yelouafi/57825fdd223e5337ba0cd2b6ed757f53","tags":["JavaScript","article"],"content":"redux-sagaの作者によるJavaScriptでのAlgebraic Effectsについての連載。\nContinuation Passing Style (CPS)について","relatedLinks":[]},{"category":"Article","title":"Vue conference and meetup videos from 2018 (Q1 digest) - MeetupFeed","url":"https://blog.meetupfeed.com/vue-conference-and-meetup-videos-from-2018-q1-digest/","tags":["article","video","Vue"],"content":"Vueに関するカンファレンスやイベントなどの発表、動画をまとめた記事。\n各発表の概要とリンクが紹介されている","relatedLinks":[]},{"category":"WebsiteDocument","title":"Webフロントエンド パフォーマンス改善ハンドブックを公開しました - dwango on GitHub","url":"https://dwango.github.io/articles/web-frontend-performance-handbook/","tags":["JavaScript","React","document","performance"],"content":"ウェブサイトのパフォーマンス改善についてのドキュメント。ランタイムとページロードタイムにおける問題の見つけ方や改善の事例についてまとめられたもの。","relatedLinks":[{"title":"Introduction · Webフロントエンド パフォーマンス改善ハンドブック","url":"https://dwango-js.github.io/performance-handbook/"}]},{"category":"WebsiteDocument","title":"Vue Patterns","url":"https://learn-vuejs.github.io/vue-patterns/","tags":["Vue","tutorial","document"],"content":"Vueにおけるパターンについてまとめたドキュメント。\n基本的なコンポーネントの宣言方法や使い方、エラーハンドリング、 Composition、HOCやRender Propsなどのパターンについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"UmiJS","url":"https://umijs.org/","tags":["JavaScript","library","Tools","React"],"content":"Next.jsライクなJavaScriptフレームワーク。\nwebpackを使ったビルド、開発サーバ、Nuxt.jsのようなルーティング、プラグインでの拡張などをサポートしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"axa-group/nlp.js: An NLP library built in node over Natural, with entity extraction, sentiment analysis, automatic language identify, and so more","url":"https://github.com/axa-group/nlp.js","tags":["JavaScript","library","nlp"],"content":"いろいろな自然言語に対応してるNLPライブラリ。\n言語の推定、Classifier、levenshtein距離など自然言語処理で使ういろいろな処理を実装している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"getgauge/taiko: A node.js library to automate chrome/chromium browser","url":"https://github.com/getgauge/taiko","tags":["Chrome","library","Tools","console"],"content":"REPLでChromeを操作するコードを実行していき、その操作内容をコードで出力できるツール。\n出力されたコードを使って操作を再現することができる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"intoli/user-agents: A JavaScript library for generating random user agents with data that's updated daily.","url":"https://github.com/intoli/user-agents","tags":["JavaScript","library"],"content":"任意のUA(User Agent)を生成するライブラリ。\nモバイルや特定の範囲のUAなどを指定して生成もできる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"SamVerschueren/tsd-check: Check TypeScript type definitions","url":"https://github.com/SamVerschueren/tsd-check","tags":["Tools","TypeScript","testing","library"],"content":"TypeScriptの型定義チェックライブラリ。 Genericsを使ったassertionのように利用できる。","relatedLinks":[]}]},{"meta":{"title":"JSer.info 400回記念イベントを開催しました","author":"azu","layout":"post","date":"2018-09-22T12:51:00.000Z","category":"Article","tags":["イベント","jser.info"],"url":"https://jser.info/2018/09/22/jser-info-400/"},"items":[]},{"meta":{"title":"2018-09-25のJS: Gatsby 2.0.0、Nuxt.js 2.0、Next.js 7、Idle Until Urgent","author":"azu","layout":"post","date":"2018-09-25T00:58:46.109Z","category":"JSer","tags":["nuxtjs","nextjs","requestIdleCallback"],"url":"https://jser.info/2018/09/25/gatsby-2.0.0nuxt.js-2.0next.js-7idle-until-urgent/"},"items":[{"category":"Headline","title":"What’s New in Safari - Apple Developer","url":"https://developer.apple.com/safari/whats-new/","tags":["ReleaseNote","safari"],"content":"Safari 12リリース。\nwatchOSで動作するように、`font-display`のサポート、iPadでFullscreen APIのサポート。\nITP 2.0、CORBの一部をサポート、`.safariextz`スタイルのSafari拡張を非推奨化など","relatedLinks":[]},{"category":"Headline","title":"Announcing Gatsby 2.0.0 🎉🎉🎉 | GatsbyJS","url":"https://www.gatsbyjs.org/blog/2018-09-17-gatsby-v2/","tags":["React","Tools","ReleaseNote"],"content":"静的サイトジェネレータとして知られるGatsby 2.0.0リリース。\nRuntimeのサイズを削減、React 16、webpack 4、Babel 7に対応。\n`react-router`から`@reach/router`に変更。`layout`コンポーネントをプラグインに移動など","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · nuxt/nuxt.js","url":"https://github.com/nuxt/nuxt.js/releases/tag/v2.0.0","tags":["Vue","library","ReleaseNote"],"content":"Nuxt.js 2.0.0リリース。\nBabel7、webpack 4を使うように、serverとclientの成果物を別々のディレクトリに出力できるように、`nuxt.config.js`で`server`オプションのサポートなど","relatedLinks":[{"title":"Nuxt.js 2.0: Webpack 4, ESM Modules, create-nuxt-app and more! 💫","url":"https://medium.com/@nuxt_js/nuxt-js-2-0-webpack-4-esm-modules-create-nuxt-app-and-more-6936ce80d94c"}]},{"category":"Headline","title":"Next.js 7 - Next.js Blog","url":"https://nextjs.org/blog/next-7/","tags":["React","JavaScript","library","ReleaseNote"],"content":"Next.js 7.0.0リリース。\nBabel 7、webpack 4へのアップグレード、`react-error-overlay`を使ったエラー表示を行うように。\nCSSに対してもDynamic Importをサポート、`assetPrefix`オプションのサポートなど","relatedLinks":[{"title":"Release 7.0.0 · zeit/next.js","url":"https://github.com/zeit/next.js/releases/tag/7.0.0"}]},{"category":"Headline","title":"Release electron v3.0.0 · electron/electron","url":"https://github.com/electron/electron/releases/tag/v3.0.0","tags":["Electron","ReleaseNote"],"content":"Electron 3.0リリース。\nChrome 66、Node 10.2.0へのアップデート。`app.isPackaged`、`app.whenReady()`の追加、いくつかのAPIの名前を変更といった破壊的な変更も行われている。","relatedLinks":[{"title":"electron/breaking-changes.md at master · electron/electron","url":"https://github.com/electron/electron/blob/master/docs/api/breaking-changes.md#breaking-api-changes-30"}]},{"category":"Article","title":"一休.comスマホサイトのパフォーマンス改善（JavaScript編） - 一休.com Developers Blog","url":"https://user-first.ikyu.co.jp/entry/2018/09/20/090000","tags":["JavaScript","Vue","performance"],"content":"Calibreを使ったパフォーマンス計測とBudgetの設定、ファイルサイズの削減による最適化、Vueの`v-if`と`v-show`の処理の違い、遅延ロードなどのパフォーマンス改善について","relatedLinks":[]},{"category":"Article","title":"React製のSPAのパフォーマンスチューニング実例 | リクルートテクノロジーズ　メンバーズブログ","url":"https://recruit-tech.co.jp/blog/2018/09/19/react_spa_performance_tuning/","tags":["React","performance","article"],"content":"Reactコンポーネントの`shouldComponentUpdate`ライフサイクルメソッドの動作とパフォーマンスについて。\n`shouldComponentUpdate`の実装の違いによるコンポーネントの最適化の違いやボトルネックを開発者ツールで見つける方法についてなど","relatedLinks":[]},{"category":"Article","title":"Idle Until Urgent — Philip Walton","url":"https://philipwalton.com/articles/idle-until-urgent/","tags":["JavaScript","performance","article"],"content":"すぐに実行するとコストが高いものを`requestIdleCallback`を使い遅延実行することでfirst input delay (FID)を改善するという話。\nそれらのパターンをまとめたidliveというライブラリの使い方やユースケースについて","relatedLinks":[{"title":"GoogleChromeLabs/idlize: Helper classes and methods for implementing the idle-until-urgent pattern","url":"https://github.com/GoogleChromeLabs/idlize"}]},{"category":"Article","title":"レガシーなフロントエンドコードを整理するためにどう立ち向かったか - Misoca開発者ブログ","url":"https://tech.misoca.jp/entry/2018/09/21/110000","tags":["JavaScript","リファクタリング","article"],"content":"jQueryで書かれていたDOM操作とロジックがべったりだったコードをどのようにリファクタリングしていったかについて。\nコードにおけるデータの読み書きの流れを整理どこまでをリファクタリング対象にするかを決めテストを書いて進めたかについて","relatedLinks":[]},{"category":"SlideVideo","title":"「1⇒100」のために「0⇒1」を考える フロントエンド - Speaker Deck","url":"https://speakerdeck.com/mukai21/1-100-falsetameni-0-1-wokao-eru-hurontoendo","tags":["JavaScript","TypeScript","design","slide","設計"],"content":"1=>100のフェーズは長くこの段階での変更は難しいため、0=>1の段階で基礎を作ることの重要性についてのスライド。\n多人数開発でのコンポーネントガイド、PrettierやLint、テストとTypeScript、パッケージの更新を定期的に行うことについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Firefox Reality Developers Guide","url":"https://blog.mozvr.com/firefox-reality-developers-guide/","tags":["VR","firefox","JavaScript"],"content":"WebVRをサポートしているライブラリについて。\nまたVRアプリでの最適化で気をつける点やFirefox Realityでのデバッグ方法について書かれている。","relatedLinks":[{"title":"Remote Debugging Firefox Reality","url":"https://blog.mozvr.com/remote-debugging-firefox-reality/"}]},{"category":"SoftwareLibrary","title":"bokub/lyo: 📦 Node.js to browser - The easy way","url":"https://github.com/bokub/lyo","tags":["JavaScript","bundler","Tools","console"],"content":"Browserify、Babel、UglifyJSを使った設定ファイルを使わないブラウザ向けにbundleするツール。\nXOのようにopnionatedな設定を提供することで、設定自体をしなくても使えるようにしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"GoogleChromeLabs/worker-plugin: 🐳 Adds native Web Worker bundling support to Webpack.","url":"https://github.com/GoogleChromeLabs/worker-plugin","tags":["webpack","webworker","plugin"],"content":"`new Worker`指定したファイルを自動的にbundleするwebpackプラグイン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"KidkArolis/space-router: Minimal, yet awesome, universal router.","url":"https://github.com/KidkArolis/space-router","tags":["JavaScript","React","library"],"content":"ファイルサイズが小さなReact向けのルーターライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"JamesHenry/typescript-estree: A parser that converts TypeScript source code into an ESTree-compatible form","url":"https://github.com/JamesHenry/typescript-estree","tags":["TypeScript","JavaScript","AST","library"],"content":"TypeScript Compilerを使ってTypeScriptコードからESTree互換のASTを出力するパーサライブラリ","relatedLinks":[]},{"category":"Book","title":"できるキッズ　子どもと学ぶ　JavaScriptプログラミング入門 できるキッズシリーズ | 大澤文孝, できるシリーズ編集部 | 工学 | Kindleストア | Amazon","url":"https://www.amazon.co.jp/dp/B07HHR8J4B/","tags":["JavaScript","book"],"content":"2018年9月21日発売\nプログラミング教育としてのJavaScript本","relatedLinks":[]}]},{"meta":{"title":"2018-10-02のJS: Cypress正式リリース、TypeScript 3.1、Parcel 1.10.0、Vue 3.0のロードマップ","author":"azu","layout":"post","date":"2018-10-02T00:53:18.850Z","category":"JSer","tags":["cypress","TypeSript","parcel","Vue"],"url":"https://jser.info/2018/10/02/cypresstypescript-3.1parcel-1.10.0vue-3.0/"},"items":[{"category":"Headline","title":"We're officially out of beta!","url":"https://www.cypress.io/blog/2018/09/20/cypress-is-officially-out-of-beta/","tags":["E2E","testing","library","ReleaseNote"],"content":"Cypressが正式リリース。\n今後のロードマップとして、IE11を含むクロスブラウザ、Flakyテストを見つけるためのリトライと分析、GitHub連携などを予定している","relatedLinks":[]},{"category":"Headline","title":"📦 Parcel v1.10.0 — Babel 7, Flow, Elm, and more! 🚀","url":"https://medium.com/@devongovett/parcel-v1-10-0-babel-7-flow-elm-and-more-c20736553573","tags":["JavaScript","bundler","ReleaseNote"],"content":"Parcel 1.10.0リリース。\nBabel 7、Flowの自動検出、Elm対応、インライン`<script>`と`<style>`の対応、HTMLのimportに対応など","relatedLinks":[]},{"category":"Headline","title":"husky/CHANGELOG.md at master · typicode/husky","url":"https://github.com/typicode/husky/blob/master/CHANGELOG.md#100","tags":["JavaScript","library","Tools","ReleaseNote"],"content":"Git Hook管理ツールであるHusky 1.0.0リリース。\nNode.js 4のサポート終了、`scripts`フィールドから`husky`フィールドへ設定を移行、`.huskyrc`のサポートなど。\nマイグレーションは`husky-upgrade`コマンドで行える","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 66 | WebKit","url":"https://webkit.org/blog/8414/release-notes-for-safari-technology-preview-66/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 66リリース。\nWeb Share API、CSS Conic Gradientsのサポート。\n実験的にWebRTC Unified Plan、Media Capabilities APIをサポートなど","relatedLinks":[]},{"category":"Headline","title":"SystemJS 2.0.0 Release","url":"https://guybedford.com/systemjs-2.0","tags":["JavaScript","ReleaseNote","library","module"],"content":"SystemJS 2.0.0リリース。 `s.js`でレガシーブラウザのサポート、`system.js`で新しいProposalや仕様などをサポートする方針。 Package Name MapsやWeb Assembly Integrationなどの実装など","relatedLinks":[]},{"category":"Headline","title":"Release Inferno v6.0.0-rc.0 · infernojs/inferno","url":"https://github.com/infernojs/inferno/releases/tag/v6.0.0-rc.0","tags":["JavaScript","library","React","ReleaseNote"],"content":"Inferno v6.0.0-rc.0リリース。\nFragmentsのサポート、`getDerivedStateFromProps`と`getSnapshotBeforeUpdate`のライフサイクルイベントをサポートなど","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2018-09 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2018/10/01/ecmascript-proposal-updates","tags":["ECMAScript","proposal","news"],"content":"2018年9月に行われたTC39ミーティングで変更があったECMAScriptのProposalのまとめ。\n`JSON.parse`の拡張Proposalの追加、Temporal(Dates and Times)がStage 2になるなど","relatedLinks":[]},{"category":"Headline","title":"Release 1.0.0 · basecamp/trix","url":"https://github.com/basecamp/trix/releases/tag/1.0.0","tags":["JavaScript","editor","library","ReleaseNote"],"content":"Basecampが作成しているリッチエディタのtrix 1.0.0がリリースされた。","relatedLinks":[{"title":"Trix: A rich text editor for everyday writing","url":"https://trix-editor.org/"}]},{"category":"Headline","title":"Announcing TypeScript 3.1 | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/announcing-typescript-3-1/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.1リリース。\nMapped Tuple Type、namespaceを使わずに関数へプロパティ追加できるように、TypeScriptのバージョンごとに型を配布できる`typesVersions`フィールドをサポート。\n`then`をAsync/Awaitへリファクタリングできるようになるなど","relatedLinks":[{"title":"TypeScript 3.1 の Mapped Tuple Typeについて - Qiita","url":"https://qiita.com/Quramy/items/c596b1bacf591da545b2"},{"title":"Breaking Changes · Microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/Breaking-Changes#typescript-31"}]},{"category":"Headline","title":"nw/node-release-lines: API for Node.js release metadata","url":"https://github.com/nw/node-release-lines","tags":["node.js","library"],"content":"Node.jsのリリース情報を取得できるライブラリ。\nLTSのバージョンやEOLなバージョンの取得、バージョンごとの状態を取得などができる","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 66 | WebKit","url":"https://webkit.org/blog/8414/release-notes-for-safari-technology-preview-66/","tags":["ReleaseNote","safari"],"content":"Safari Technology Preview 66リリース。 Web Share API、CSS Conic Gradientsのサポート。 試験的にWebRTC Unified Plan、Media Capabilities APIをサポートなど","relatedLinks":[]},{"category":"Article","title":"What's New in Vue Devtools 5.0 Beta","url":"https://www.telerik.com/blogs/whats-new-in-vue-devtools-5-beta","tags":["Vue","debug","Extension","article"],"content":"Vue DevTools 5.0βについて。\nRouting Tab、Performance Tab、Settings Tab、VuexのStateの編集機能について","relatedLinks":[{"title":"Release v5.0.0-beta.1 · vuejs/vue-devtools","url":"https://github.com/vuejs/vue-devtools/releases/tag/v5.0.0-beta.1"}]},{"category":"Article","title":"Payment Request API: 統合ガイド  |  Web  |  Google Developers","url":"https://developers.google.com/web/fundamentals/payments/","tags":["Chrome","WebPlatformAPI","article"],"content":"Payment Request APIについての記事。\nPayment Request APIを使った取引のプロセス、APIの使い方、Feature Detectの方法などについて","relatedLinks":[]},{"category":"Article","title":"Node.jsでのイベントループの仕組みとタイマーについて - 技術探し","url":"https://blog.hiroppy.me/entry/nodejs-event-loop","tags":["node.js","article"],"content":"Node.jsのイベントループのフェーズについての解説。\nNode.js/V8 ではどのようにイベントループを回しているかについて","relatedLinks":[]},{"category":"Article","title":"JavaScript typeof – LogRocket","url":"https://blog.logrocket.com/javascript-typeof-2511d53a1a62","tags":["JavaScript","article"],"content":"JavaScriptの`typeof`を使ったデータ型のチェックについて。\nまたプリミティブ型とWrapper objectについて","relatedLinks":[]},{"category":"Article","title":"The Importance Of Manual Accessibility Testing — Smashing Magazine","url":"https://www.smashingmagazine.com/2018/09/importance-manual-accessibility-testing/","tags":["accessibility","article"],"content":"アクセシビリティの手動テストや自動テスト関するリソースを紹介している記事","relatedLinks":[]},{"category":"Article","title":"turtleDB: A JavaScript Framework for building offline-first, collaborative web apps","url":"https://hackernoon.com/turtledb-a-javascript-framework-for-building-offline-first-collaborative-web-apps-7183cd787163","tags":["JavaScript","データベース","library","article"],"content":"Offline-FirstなデータベースライブラリのturtleDBについて。\nクライアント側はIndexedDBでローカルに保存でき、サーバ側はMongoDBなどのアダプタとして動作する。オフラインではクライアントに保存でき、オンラインでは同期ができるような仕組み","relatedLinks":[{"title":"turtle-DB/turtleDB: Official turtleDB project","url":"https://github.com/turtle-DB/turtleDB"}]},{"category":"Article","title":"Plans for the Next Iteration of Vue.js – The Vue Point – Medium","url":"https://medium.com/the-vue-point/plans-for-the-next-iteration-of-vue-js-777ffea6fabf","tags":["Vue","article"],"content":"Vue 3.0のロードマップについて。 クラスベースコンポーネント、Functional Component、コードベースをTypeSript化、Observer/Schedulerの分離、ES Proxyベースのobserverについて。 またProxyを使えないIE11も制限ありでサポート予定。","relatedLinks":[{"title":"[","url":"https://qiita.com/unecochan/items/ac206365745257d68926"}]},{"category":"WebsiteDocument","title":"Array - 30 seconds of code","url":"https://30secondsofcode.org/","tags":["JavaScript","document"],"content":"JavaScriptのコードスニペット集。\n典型的な処理のスニペットをまとめている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Leko/hothouse: Continuous dependency update for Node.js project","url":"https://github.com/Leko/hothouse","tags":["npm","yarn","github","console","Tools"],"content":"npmtとyarnに対応しているGreenkeeperのような依存パッケージの更新PRを出してくれるツール","relatedLinks":[]}]},{"meta":{"title":"2018-10-09のJS: Create React App 2.0、EdgeHTML 18、Node.jsフレームワークアンケート","author":"azu","layout":"post","date":"2018-10-09T02:30:12.103Z","category":"JSer","tags":["reactjs","msedge","nodejs"],"url":"https://jser.info/2018/10/09/create-react-app-2.0edgehtml-18node.js/"},"items":[{"category":"Headline","title":"Create React App 2.0: Babel 7, Sass, and More – React Blog","url":"https://reactjs.org/blog/2018/10/01/create-react-app-v2.html","tags":["React","ReleaseNote"],"content":"create-react-app 2.0リリース。\nBabel 7、webpack 4、Jest 23に更新。\nNode.js 6のサポート終了、IE11のサポートを行うpolyfillを分離、Proxyの設定方法変更、Service Workerをオプトインに変更など","relatedLinks":[]},{"category":"Headline","title":"Release v1.9.0 · GoogleChrome/puppeteer","url":"https://github.com/GoogleChrome/puppeteer/releases/tag/v1.9.0","tags":["Chrome","library","ReleaseNote"],"content":"Puppeteer v1.9.0リリース。\nChromium 71.0に更新、async stack tracesのサポート、Browserifyでbundleできるようになりブラウザ上でも実行できるように。\n`frame.goto`や`frame.waitForNavigation`の追加など","relatedLinks":[]},{"category":"Headline","title":"What’s new in Microsoft Edge in the Windows 10 October 2018 Update - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog","url":"https://blogs.windows.com/msedgedev/2018/10/04/edgehtml-18-october-2018-update/","tags":["MSEdge","ReleaseNote"],"content":"Windows 10 October 2018 Updateに含まれるEdgeHTML 18の変更点について。\nWeb Authenticationの実装、Media autoplay policyの導入、CSS masking、background blendのサポート。\nWeb Notificationでbadgeをサポート、XSSフィルターの廃止など","relatedLinks":[{"title":"What's new in EdgeHTML 18 - Microsoft Edge Development | Microsoft Docs","url":"https://docs.microsoft.com/en-us/microsoft-edge/dev-guide?WT.mc_id=windowsdocs-twitter#new-apis-in-edgehtml-18"}]},{"category":"Headline","title":"Ember.js - Ember 3.4 Released","url":"https://emberjs.com/blog/2018/10/07/ember-3-4-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember 3.4リリース。\n`<Tag />`のようにかぎ括弧で書けるように、Custom Component Managerの機能追加、`component#sendAction`を非推奨化など","relatedLinks":[{"title":"Release v3.4.0 · emberjs/ember.js","url":"https://github.com/emberjs/ember.js/releases/tag/v3.4.0"}]},{"category":"Headline","title":"jsdom/Changelog.md at master · jsdom/jsdom","url":"https://github.com/jsdom/jsdom/blob/master/Changelog.md#1220","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"JSDOM 12.2.0リリース。\nShadow DOMのサポート、`Element#toggleAttribute`メソッドのサポートなど","relatedLinks":[]},{"category":"Article","title":"Content Security Policy Level 3におけるXSS対策 - pixiv inside","url":"https://inside.pixiv.blog/kobo/5137","tags":["CSP","security","browser","article"],"content":"CSPのscript-srcとstrict-dynamicについて。\nドメインホワイトリストの問題とnonceによる実行制限について","relatedLinks":[]},{"category":"Article","title":"ライブラリをES2015(ES6)で書いて公開する所から始めよう | Web Scratch","url":"https://efcl.info/2015/01/09/write-es6/","tags":["babel","JavaScript","article","tutorial"],"content":"Babelを使ったES2015以降のコードで書くプロジェクトのセットアップやnpmでライブラリ公開の準備などについてのチュートリアル。\nよくあるJavaScriptライブラリのディレクトリ構造などについて。\nBabel 7に対応する更新が行われた","relatedLinks":[]},{"category":"Article","title":"WebAssembly on Cloudflare Workers","url":"https://blog.cloudflare.com/webassembly-on-cloudflare-workers/","tags":["WebAssembly","ServiceWorker","article"],"content":"Cloudflare Worker内でWebAssemblyが動作するようになった","relatedLinks":[]},{"category":"Article","title":"Working with Babel 7 and Webpack | The Basement","url":"https://www.thebasement.be/working-with-babel-7-and-webpack/","tags":["babel","webpack","article"],"content":"Babel7とwebpackを使った設定方法についての解説記事。\n`@babel/preset-env`の`useBuiltIns`オプションやデバッグ方法についてなど","relatedLinks":[]},{"category":"Article","title":"On Node Framework Popularity – hueniverse","url":"https://hueniverse.com/on-node-framework-popularity-355fbde5cbe4","tags":["node.js","library","article"],"content":"Node.jsのサーバフレームワークアンケート結果について。\nExpress、Hapi、Koaなどの利用率や好み、使い続けるかについてのアンケート結果がまとめられている","relatedLinks":[]},{"category":"Article","title":"Calls between JavaScript and WebAssembly are finally fast 🎉 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2018/10/calls-between-javascript-and-webassembly-are-finally-fast-%F0%9F%8E%89/","tags":["firefox","WebAssembly","article"],"content":"Firefox WebAssemblyで関数呼び出しが改善された話とその仕組みについて。\nWebAssemblyとJITの関係、WebAssemblyで最適化した関数とビルドイン関数の呼び出しの比較など","relatedLinks":[]},{"category":"WebsiteDocument","title":"本書の対象読者及び目的 - Sound for Javascripters","url":"https://ongaku-daisukikko-club.gitbook.io/music-for-javascripter/","tags":["web ","audio","book","JavaScript","testing"],"content":"Web Audio APIとMIDI Keyboardを使ってシンセサイザーを作る内容の書籍。\nCodesandboxを使いながらウェブブラウザ上でコードを書いてテストを行い実行していく。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jamesseanwright/wax: An experimental, JSX-compatible renderer for the Web Audio API","url":"https://github.com/jamesseanwright/wax","tags":["jsx","web ","audio","library"],"content":"Web Audio APIをJSXを使って宣言的に記述できるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"simov/request-compose: Composable HTTP Client","url":"https://github.com/simov/request-compose","tags":["JavaScript","node.js","library"],"content":"Node.js向けのComposeできるHTTPライブラリ。\n関数をcomposeしてHTTPリクエストやレスポンスの処理を行える。","relatedLinks":[{"title":"Composable HTTP Client for NodeJS - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/simov/composable-http-client-for-nodejs-83f"}]},{"category":"SoftwareLibrary","title":"terser-js/terser: JavaScript parser, mangler, optimizer and beautifier toolkit for ES6+","url":"https://github.com/terser-js/terser","tags":["JavaScript","Tools","library"],"content":"uglify-esをforkしたminifyツール。\nuglify-esがメンテナンスされていないため(uglify-js自体は開発されている)、ES2015+に対応することを目的に開発されている。","relatedLinks":[]}]},{"meta":{"title":"2018-10-16のJS: Node.js v10.12.0、Inferno v6.0.0、ブラウザのTLS 1.0と1.1終了時期","author":"azu","layout":"post","date":"2018-10-16T00:07:04.230Z","category":"JSer","tags":["Node.js","react","Inferno","TLS"],"url":"https://jser.info/2018/10/16/node.js-v10.12.0inferno-v6.0.0tls-1.01.1/"},"items":[{"category":"Headline","title":"Node v10.12.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v10.12.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 10.12.0リリース。\n`util.inspect`に`sorted`オプションの追加、`fs.mkdir`に`recursive`オプションの追加、WebSockets over HTTP/2のサポート。\n`module.createRequireFromPath(filename)`の追加、`URL`とPathの相互変換するメソッドを`url`モジュールに追加など","relatedLinks":[{"title":"module: add createRequireFunction method by devsnek · Pull Request #19360 · nodejs/node","url":"https://github.com/nodejs/node/pull/19360"},{"title":"Discussion: File URLs in Node.js · Issue #22502 · nodejs/node","url":"https://github.com/nodejs/node/issues/22502"}]},{"category":"Headline","title":"ESLint v5.7.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2018/10/eslint-v5.7.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v5.7.0リリース。\n`no-tabs`ルールに`allowIndentationTabs`オプションの追加、`camelcase`ルールに`allow`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.1 · reduxjs/redux","url":"https://github.com/reduxjs/redux/releases/tag/v4.0.1","tags":["redux","JavaScript","library","ReleaseNote"],"content":"Redux 4.0.1リリース。\n`.mjs`をサポート、unpkgフィールドを追加など","relatedLinks":[]},{"category":"Headline","title":"Release Inferno v6.0.0 · infernojs/inferno","url":"https://github.com/infernojs/inferno/releases/tag/v6.0.0","tags":["JavaScript","React","library","ReleaseNote"],"content":"Inferno v6.0.0リリース。\n`hydrate`を別パッケージに移行、スタイルプロパティがhyphenを使った命名規則に、Reactのライフサイクルイベントとの互換性向上。\nString refsを削除、CreateRef/ForwardRef APIの追加、Fragmentsのサポートなど","relatedLinks":[{"title":"inferno/v6-migration.md at master · infernojs/inferno","url":"https://github.com/infernojs/inferno/blob/master/docs/v6-migration.md"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 67 | WebKit","url":"https://webkit.org/blog/8419/release-notes-for-safari-technology-preview-67/","tags":["safari","webkit","ReleaseNote"],"content":"Safari Technology Preview 67リリース。\nPointer Eventsを試験的にサポート、H264  Simulcastの有効化、`CSS.registerProperty`の`initialValue`プロパティのサポートなど","relatedLinks":[{"title":"CSS.registerProperty","url":"https://www.w3.org/TR/css-properties-values-api-1/#the-registerproperty-function"}]},{"category":"Headline","title":"V8 release v7.0 · V8","url":"https://v8.dev/blog/v8-release-70","tags":["V8","ReleaseNote"],"content":"V8 7.0リリース。\nEmbedded builtinsでのメモリ消費量の削減、WebAssembly ThreadsのOrigin Trialの開始、`Array#sort`が安定ソートになるなど","relatedLinks":[{"title":"Getting things sorted in V8 · V8","url":"https://v8.dev/blog/array-sort"}]},{"category":"Headline","title":"lolex/History.md at master · sinonjs/lolex","url":"https://github.com/sinonjs/lolex/blob/master/History.md#300--2018-10-08","tags":["JavaScript","ReleaseNote","library","testing"],"content":"Sinon.jsでも使われるFake TimerライブラリであるLolex 3.0リリース。 `Clock#countTimers`の追加、negative tickは例外を投げるように変更など","relatedLinks":[{"title":"sinon/History.md at master · sinonjs/sinon","url":"https://github.com/sinonjs/sinon/blob/master/History.md#700--2018-10-14"}]},{"category":"Article","title":"What's New In DevTools (Chrome 71)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/10/devtools","tags":["chromre","debug","ReleaseNote"],"content":"Chrome 71の開発者ツールの変更点について。\nDOM nodeをglobal variableとして保存できるように、HARファイルに`_initiator`と`_priority`を追加、PiPのbreakpointをサポートなど","relatedLinks":[]},{"category":"Article","title":"AddyOsmani.com - Start Performance Budgeting","url":"https://addyosmani.com/blog/performance-budgets/","tags":["browser","performance","article"],"content":"performance budgetとはなにかについての記事。performance budgetとして使うことがある指標やその設定例。\n新しい機能開発をするときにステークホルダーとの理解を共有に使うケースやトレードオフについてなど","relatedLinks":[]},{"category":"Article","title":"What’s New in Create React App 2.0 Video Series – Elijah Manor – Medium","url":"https://medium.com/@elijahmanor/whats-new-in-create-react-app-2-0-video-series-4ffaaa7cb7df","tags":["React","tutorial","video","article"],"content":"Create React App 2.0についてのスクリーンキャストと解説","relatedLinks":[]},{"category":"Article","title":"Webpack v3 → v4移行パッケージ対照表 - Qiita","url":"https://qiita.com/shimarin/items/17707fa575744ca0bd89","tags":["webpack","article"],"content":"webpack3から4への移行におけるオプションやプラグインなどの対応関係や変更点について","relatedLinks":[]},{"category":"SlideVideo","title":"SinnerSchrader Tech Session '18 - 2018 - The Year of Web Components - Speaker Deck","url":"https://speakerdeck.com/dkundel/sinnerschrader-tech-session-18-2018-the-year-of-web-components","tags":["WebComponents","slide"],"content":"Web Componentsについてのスライド。\nWeb Componentsを構成する仕様の紹介、ツールやフレームワークについて","relatedLinks":[]},{"category":"SlideVideo","title":"npm and the future of JavaScript","url":"https://slides.com/seldo/npm-future-of-javascript#/","tags":["npm","JavaScript","library","slide"],"content":"npmとJavaScriptのエコシステムについてスライド。\nフロントエンドフレームワークやバックエンドフレームワークのシェアの変化、何にnpmを使っているかについてなど。","relatedLinks":[]},{"category":"WebsiteDocument","title":"smooth-code/loadable-components: React code splitting made easy ✂️✨","url":"https://github.com/smooth-code/loadable-components","tags":["React","library"],"content":"Dynamic ImportやCode Splitting、SSRに対応したReactコンポーネントの動的ロードを扱うライブラリ","relatedLinks":[{"title":"loadable-components + TypeScriptでSSRとCSRに対応したdynamic importを実現する - 技術探し","url":"https://blog.hiroppy.me/entry/loadable-components"}]},{"category":"SoftwareLibrary","title":"JavaScript Visualizer","url":"https://javascriptvisualizer.com/","tags":["JavaScript","Tools"],"content":"JavaScriptコードの実行をステップごとにインタプリタ的に実行しながら、実行コンテキストがどのように変化しているかを見られるツール。","relatedLinks":[]},{"category":"Book","title":"入門JavaScript フロントエンドエンジニアになるための基本と実践スキル | 玉川 純 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4798153907/","tags":["JavaScript","book"],"content":"2018年11月28日発売。\n初心者向けのJavaScriptについての書籍","relatedLinks":[]}]},{"meta":{"title":"2018-10-21のJS: Chrome 70、Angular 7、LoopBack 4 GA","author":"azu","layout":"post","date":"2018-10-21T14:10:58.305Z","category":"JSer","tags":["chrome","angular","LoopBack"],"url":"https://jser.info/2018/10/21/chrome-70angular-7loopback-4-ga/"},"items":[{"category":"Headline","title":"New in Chrome 70  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/10/nic70","tags":["Chrome","ReleaseNote"],"content":"Chrome 70リリース。\nDesktop PWA(Windows)のサポート、Credential Management APIで指紋認証をサポート、Web Workerで`name`オプション、TLS 1.3のサポート。 Web Components v0を非推奨化など","relatedLinks":[{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features#browsers.chrome.desktop%3D70"},{"title":"Chromium Blog: Chrome 70 beta: shape detection, web authentication, and more","url":"https://blog.chromium.org/2018/09/chrome-70-beta-shape-detection-web.html"},{"title":"Deprecations and removals in Chrome 70  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/09/chrome-70-deps-rems"}]},{"category":"Headline","title":"Release 7.0.2 · zeit/next.js","url":"https://github.com/zeit/next.js/releases/tag/7.0.2","tags":["JavaScript","React","security","ReleaseNote"],"content":"Next.js 7.0.2リリース。\n7.0.0と7.0.1にあったエラー画面でのXSSが修正された。","relatedLinks":[]},{"category":"Headline","title":"Version 7 of Angular — CLI Prompts, Virtual Scroll, Drag and Drop and more","url":"https://blog.angular.io/version-7-of-angular-cli-prompts-virtual-scroll-drag-and-drop-and-more-c594e22e7b8c","tags":["Angular","ReleaseNote"],"content":"Angular 7リリース。\nTypeScript 3.1のサポート、Virtual Scrollingの対応、CDKでDrag and Dropのサポート。\n`reflect-metadata`がproductionビルドに誤って含まれるケースを防止する改善など","relatedLinks":[{"title":"angular/CHANGELOG.md at master · angular/angular","url":"https://github.com/angular/angular/blob/master/CHANGELOG.md#700-2018-10-18"},{"title":"Angular 7リリースノート – Angular Blog日本語訳 | maesblog","url":"https://mae.chab.in/archives/60226"}]},{"category":"Headline","title":"StrongLoop - Announcing LoopBack 4 GA is Now Ready for Production Use!","url":"https://strongloop.com/strongblog/loopback-4-ga","tags":["node.js","library","ReleaseNote"],"content":"Node.js APIフレームワークのLoopBack 4GAリリース。\nコアがTypeScriptで書き直され、OpenAPI形式への出力対応。\nLTSポリシーも合わせて更新され、LoopBack 4は2021年4月までサポートされる予定。","relatedLinks":[{"title":"LoopBack 4","url":"https://v4.loopback.io/"}]},{"category":"Article","title":"Node.jsにおけるプロトタイプ汚染攻撃とは何か - ぼちぼち日記","url":"https://jovi0608.hatenablog.com/entry/2018/10/19/083725","tags":["JavaScript","security","node.js","article"],"content":"Prototype pollutionについて。\nオブジェクトをマージする際などに`__proto__`プロパティによって意図しない書き換えが行われる問題について","relatedLinks":[]},{"category":"Article","title":"Angular 4アプリケーションをAngular 6に移行する | 株式会社カブク","url":"https://www.kabuku.co.jp/developers/migration-from-ng4-to-ng6","tags":["Angular","article"],"content":"Angular 4.xから6.xへの移行方法について。\nAngular 4のLTSが2018年9月で終了するため、6.xへどのように移行するかについて。\n移行した結果ビルド時間やファイルサイズが改善されたことについて","relatedLinks":[]},{"category":"Article","title":"On the Roadmap: Exact Objects by Default – Flow – Medium","url":"https://medium.com/flow-type/on-the-roadmap-exact-objects-by-default-16b72933c5cf","tags":["article","flowtype"],"content":"Flow 0.84.0からExact Objects（`{| |}`相当）がデフォルトになる変更予定について。 その他のプロパティを許可する新しい構文として`{foo: number, ...}`を導入し、どのようにマイグレーションしていくかについて","relatedLinks":[]},{"category":"Article","title":"Re-ducksパターン：React + Redux のディレクトリ構成ベストプラクティス","url":"https://noah.plus/blog/021/","tags":["JavaScript","React","article","redux"],"content":"Reduxの文脈で見るDucksパターンとRe-ducksパターンについて。 ファイルディレクトリ構造をどのようなルールにするかやそれによって解決できることについて","relatedLinks":[]},{"category":"SlideVideo","title":"マークアップをパワーアップするWAI-ARIA","url":"https://masup9.github.io/dist23/#/","tags":["WAI-ARIA","slide"],"content":"WAI-AIRAの目的、使い方、ユースケースについて解説しているスライド。\nrole、ステート、プロパティを付与したときにウェブブラウザやアクセシビリティの支援技術に伝わるかについて。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Gridsome - Build blazing fast websites with Vue.js and GraphQL","url":"https://gridsome.org/","tags":["Vue","GraphQL","Tools","library"],"content":"VueとGraphQLを使った静的サイトツール/フレームワーク。\nGatsby.jsインスパイアなフレームワークでGraphQL経由レイヤーを経由してデータソースにアクセスする。","relatedLinks":[]},{"category":"WebsiteDocument","title":"perf-tools/timekeeper at master · artifact-project/perf-tools","url":"https://github.com/artifact-project/perf-tools/tree/master/timekeeper","tags":["JavaScript","library","performance"],"content":"指定区間の時間計測結果をコンソールやパフォーマンスタブ(Performance Timing API)に出力できるライブラリ","relatedLinks":[]},{"category":"WebsiteDocument","title":"nico3333fr/CSP-useful: Collection of scripts, thoughts about CSP (Content Security Policy)","url":"https://github.com/nico3333fr/CSP-useful","tags":["CSP","testing","document"],"content":"CSPレポートのサンプルやノイズになってるCSPレポートなどについてまとめてるリポジトリ。またCSPのTipsやユースケースについて書かれている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"terkelg/zet: Set() as it should be","url":"https://github.com/terkelg/zet","tags":["JavaScript","library"],"content":"`Set`を使った和集合、積集合などの演算をサポートしたライブラリ。\n`Set`同士の集合演算を行う`Set`のサブクラスライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"f/graphql.js: A Simple and Isomorphic GraphQL Client for JavaScript","url":"https://github.com/f/graphql.js","tags":["GraphQL","library","JavaScript"],"content":"IsomorphicなGraphQLクライアントライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"segmentio/evergreen: 🌲 Evergreen React UI Framework by Segment","url":"https://github.com/segmentio/evergreen/","tags":["React","UI","library"],"content":"SegmentによるReact UIフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Tencent/omi: Next generation web framework in 4kb JavaScript (Web Components + JSX + Proxy + Store + Path Updating)","url":"https://github.com/Tencent/omi","tags":["WebComponents","JavaScript","library"],"content":"Web Componentsをベースにしたフレームワーク。\nJSXのサポート、ES Proxyを使った変更検知、Shadow DOMを使ったScoped CSSなど持っている","relatedLinks":[]}]},{"meta":{"title":"2018-10-30のJS: Node.js 11.0.0、Storybook 4.0.0、Firefox 63","author":"azu","layout":"post","date":"2018-10-30T02:55:37.476Z","category":"JSer","tags":["node","Storybook","firefox"],"url":"https://jser.info/2018/10/30/node.js-11.0.0storybook-4.0.0firefox-63/"},"items":[{"category":"Headline","title":"Release v3.1.0 · karma-runner/karma","url":"https://github.com/karma-runner/karma/releases/tag/v3.1.0","tags":["JavaScript","testing","E2E"],"content":"Karma 3.1.0リリース。\nsocket timeoutのオプション追加、ES modules対応、ファイルを強制的に更新する`refreshFile`メソッドの追加など","relatedLinks":[]},{"category":"Headline","title":"Node v11.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v11.0.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 11.0.0リリース。\nV8 7.0へ更新、`http.request`メソッドのオプションがデフォルトではWHATWG URLでパースされるように。\nまた`TextEncoder`/`TextDecoder`が`util`からグローバルへ移動、`process.binding()`の非推奨化など","relatedLinks":[{"title":"October Brings Node.js 10.x to LTS and Node.js 11 to Current!","url":"https://medium.com/@nodejs/october-brings-node-js-10-x-to-lts-and-node-js-11-to-current-ae19f8f12b51"}]},{"category":"Headline","title":"jasmine/3.3.0.md at master · jasmine/jasmine","url":"https://github.com/jasmine/jasmine/blob/master/release_notes/3.3.0.md","tags":["JavaScript","testing","ReleaseNote"],"content":"Jasmine 3.3リリース。\n`expect().withContext()`の追加、`toBeRejectedWith`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 68 | WebKit","url":"https://webkit.org/blog/8475/release-notes-for-safari-technology-preview-68/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 68リリース。\n`<input type=\"color\">`をデフォルトで有効化、`target=\"_blank\"`をデフォルトで`rel=noopener`にする変更。\nWebRTCでVP8をサポート、WebVTTでのインラインスタイルをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · storybooks/storybook","url":"https://github.com/storybooks/storybook/releases/tag/v4.0.0","tags":["JavaScript","testing","Tools","ReleaseNote"],"content":"Storybook 4.0.0リリース。\nBabel 7/webacpk 4へのアップデート、Ember/MarkoJS/Mithril/HTML/Svelte/Riotのサポート。\nモバイルの表示改善、theme変数の実装など","relatedLinks":[{"title":"storybook/MIGRATION.md at master · storybooks/storybook","url":"https://github.com/storybooks/storybook/blob/master/MIGRATION.md#from-version-34x-to-40x"},{"title":"Storybook 4.0 is here! – Storybook – Medium","url":"https://medium.com/storybookjs/storybook-4-0-is-here-10b9857fc7de"}]},{"category":"Headline","title":"React v16.6.0: lazy, memo and contextType – React Blog","url":"https://reactjs.org/blog/2018/10/23/react-v-16-6.html","tags":["React","ReleaseNote"],"content":"React 16.6.0リリース。\n`React.memo`、`React.lazy`、`static contextType`、`static getDerivedStateFromError()`のサポートなど。\nStrictModeで廃止予定のAPIのwarningを出すようになるなど","relatedLinks":[]},{"category":"Headline","title":"Firefox 63.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/63.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 63リリース。\nWeb Componentsのサポート、Media Capabilities API、Async Clipboard API のサポート。\nクロスブラウザ互換のために`Window.event`プロパティの実装、`Clear-Site-Data`ヘッダがデフォルトで有効化など","relatedLinks":[{"title":"Firefox 63 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/63"},{"title":"Firefox 63 Site Compatibility | Firefox Site Compatibility","url":"https://www.fxsitecompat.com/en-CA/versions/63/"}]},{"category":"Headline","title":"jsdom/Changelog.md at master · jsdom/jsdom","url":"https://github.com/jsdom/jsdom/blob/master/Changelog.md#1300","tags":["JavaScript","DOM","ReleaseNote"],"content":"jsdom 13.0.0リリース。\n`canvas`パッケージの1.xをサポート終了し、`2.x`のみサポート。\nXML serializationのサポート、`addEventListener`で`passive`オプションのサポートなど","relatedLinks":[]},{"category":"Headline","title":"gRPC-Web is going GA - Cloud Native Computing Foundation","url":"https://www.cncf.io/blog/2018/10/24/grpc-web-is-going-ga/","tags":["JavaScript","library","ReleaseNote"],"content":"gRPC-Webが正式にリリース。\nWebブラウザなどからgRPCを呼び出すためのクライアントライブラリ。","relatedLinks":[]},{"category":"Article","title":"gas-webpagetestでWebPagetestのパフォーマンス計測を自動化、可視化する | Web Scratch","url":"https://efcl.info/2018/10/22/gas-webpagetest/","tags":["performance","webservice","Tools","article"],"content":"WebPagetestを使ったパフォーマンス計測を自動化、Google DataStudioを使ったデータの可視化について","relatedLinks":[]},{"category":"Article","title":"The Intl.RelativeTimeFormat API  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/10/intl-relativetimeformat","tags":["JavaScript","i18n","article"],"content":"`Intl.RelativeTimeFormat`を相対時間のローカライズについて。","relatedLinks":[]},{"category":"Article","title":"Angular+Firebaseでチャットアプリを作る - Qiita","url":"https://qiita.com/Yamamoto0525/items/a76ea4b3924eeb82b0f9","tags":["Angular","firebase","article"],"content":"AngularとFirebaseを使ってチャットウェブアプリを作るハンズオン形式の連載","relatedLinks":[]},{"category":"Article","title":"私のReactのコンポーネント実装アンチパターン - Qiita","url":"https://qiita.com/seya/items/7a0d20da4de5fab14426","tags":["React","article"],"content":"Reactコンポーネントのアンチパターンについて。\nコンポーネントの分割と責務、Propsの渡し方などについて","relatedLinks":[]},{"category":"Article","title":"Asking for required annotations – Flow – Medium","url":"https://medium.com/flow-type/asking-for-required-annotations-64d4f9c1edf8","tags":["flowtype","article"],"content":"Flow 0.85.0で修正が入った\"missing annotation\"についての解説記事。\n型annotationが存在しない場合に0.85.0からはエラーとなる。","relatedLinks":[{"title":"Release v0.85.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.85.0"}]},{"category":"SlideVideo","title":"RuhrJS 2018 - Tobias Koppers - webpack and the challenge of WebAssembly - YouTube","url":"https://www.youtube.com/watch?v=k86Z_6_BJy0","tags":["webpack","WebAssembly","slide","video"],"content":"webpackのWebAssembly対応についての発表。\nWebAssembly APIやWebAssemblyの実行フェーズの解説。\nwebpackからwasmファイルを簡単に利用できるようにするため、どのようにwasmを扱うかやCode Splittingの対応についてなど","relatedLinks":[{"title":"slides/webpack-wasm-challenge.pdf at master · sokra/slides","url":"https://github.com/sokra/slides/blob/master/data/webpack-wasm-challenge.pdf"}]},{"category":"SlideVideo","title":"React Conf 2018 - YouTube","url":"https://www.youtube.com/playlist?list=PLPxbbTqCLbGE5AihOSExAa4wUM-P42EIJ","tags":["React","イベント","video"],"content":"React Conf 2018の動画まとめ","relatedLinks":[{"title":"React Conf 2018 - Fall 2018 in Lake Las Vegas, Nevada","url":"https://conf.reactjs.org/"}]},{"category":"SlideVideo","title":"実践AST FlowからTypeScriptへの変換","url":"https://talks.leko.jp/transform-flow-to-typescript-using-ast/#0","tags":["flowtype","TypeScript","slide"],"content":"FlowからTypeScriptへの変換を行うBabelプラグインについてスライド。\nBabelプラグインを書いてコード変換を行う話","relatedLinks":[{"title":"CureApp/babel-plugin-flow-to-typescript: Babel plugin to convert Flow code into TypeScript","url":"https://github.com/CureApp/babel-plugin-flow-to-typescript"}]},{"category":"SoftwareLibrary","title":"suchipi/fs-remote: Drop-in replacement for fs that lets you write to the filesystem from the browser","url":"https://github.com/suchipi/fs-remote","tags":["node.js","JavaScript","browser","library"],"content":"`fs`のブラウザ向け実装と`fs`サーバのライブラリ。\n`fs`を行うサーバを立て、ブラウザからサーバにXHRやWebSocketsでアクセスする。","relatedLinks":[]}]},{"meta":{"title":"2018-11-06のJS: Node.js 10.13.0(LTS)、React Hooks、Vueコンポーネントのテスト","author":"azu","layout":"post","date":"2018-11-06T02:10:18.488Z","category":"JSer","tags":["node","react","vue"],"url":"https://jser.info/2018/11/06/node.js-10.13.0ltsreact-hooksvue/"},"items":[{"category":"Headline","title":"Release v2.1.0 · facebook/create-react-app","url":"https://github.com/facebook/create-react-app/releases/tag/v2.1.0","tags":["React","Tools","ReleaseNote"],"content":"create-react-app 2.1.0リリース。\nBabelを使ったTypeScriptサポート。\n`create-react-app my-app --typescript`でTypeScriptプロジェクトとして作成できるようになった。","relatedLinks":[]},{"category":"Headline","title":"Video.js 7.3: Responsive Layout, Fill Mode, createLogger | Video.js Blog","url":"https://blog.videojs.com/video-js-7-3-responsive-layout-fill-mode-createlogger/","tags":["video","JavaScript","library","ReleaseNote"],"content":"video.js 7.3リリース。\nFill Modeをplayer modeに格上げ、`createLogger`メソッドの追加など","relatedLinks":[]},{"category":"Headline","title":"Node v11.1.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v11.1.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 11.1.0リリース。\nICUのアップデート、REPLでトップレベル`await`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Read Me - Squirrelly","url":"https://squirrelly.js.org/","tags":["JavaScript","library"],"content":"ファイルサイズの小さなテンプレートエンジン。Handlebarsのようなカスタムヘルパー、delimiterの指定、フィルター、プリコンパイル、HTML以外への出力などに対応している","relatedLinks":[{"title":"Introducing Squirrelly: a fast, lightweight, and simple JS template engine","url":"https://hackernoon.com/introducing-squirrelly-a-fast-lightweight-and-simple-js-template-engine-70a873d765c9"}]},{"category":"Headline","title":"Node v10.13.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v10.13.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 10.13.0リリース。 Node.js 10.xがLong Term Support (LTS)となり、2021年4月までメンテンスされる。","relatedLinks":[]},{"category":"Headline","title":"V8 release v7.1 · V8","url":"https://v8.dev/blog/v8-release-71","tags":["V8","ReleaseNote"],"content":"V8 v7.1リリース。\nパフォーマンスの最適化、Wasmで`postMessage`をサポート。`Intl.RelativeTimeFormat`のサポート、`globalThis` Proposalをサポートなど","relatedLinks":[]},{"category":"Article","title":"Making Sense of React Hooks – Dan Abramov – Medium","url":"https://medium.com/@dan_abramov/making-sense-of-react-hooks-fdbde8803889","tags":["React","article","opinion","proposal"],"content":"React v16.7.0-alphaで導入された\"Hooks\"のProposalについて。\n\nHooksが解決したい問題として巨大コンポーネント、重複ロジック、HOCなどの複雜なパターンをあげている。あわせてHooksの動作原理などについて書かれている。\nまた、Hooksはまだ試験的なものであるためフィードバックなどを求めている。","relatedLinks":[{"title":"Introducing Hooks – React","url":"https://reactjs.org/docs/hooks-intro.html"},{"title":"RFC: React Hooks by sebmarkbage · Pull Request #68 · reactjs/rfcs","url":"https://github.com/reactjs/rfcs/pull/68"},{"title":"Array destructuring for multi-value returns (in light of React hooks) - Google ドキュメント","url":"https://docs.google.com/document/d/1hWb-lQW4NSG9yRpyyiAA_9Ktytd5lypLnVLhPX9vamE/edit#heading=h.83axxx51uiaq"},{"title":"React Conf 2018のKeynoteで発表されたHooks、Concurrent Reactのまとめ - Cybozu Inside Out | サイボウズエンジニアのブログ","url":"https://blog.cybozu.io/entry/2018/11/02/113000"}]},{"category":"Article","title":"Node.jsにおけるprototype汚染攻撃への対策 - SSTエンジニアブログ","url":"https://techblog.securesky-tech.com/entry/2018/10/31/","tags":["JavaScript","security","article"],"content":"Prototype pollution攻撃への対応方法について。\nMapや`Object.create(null)`で`__proto__`の上書きを防ぐ方法、ネイティブの実装を上書きしてしまう方法などについて","relatedLinks":[]},{"category":"Article","title":"Build a Bucket List Travel App with React and Material-UI (part 0) | appendTo","url":"https://appendto.com/2018/10/build-a-bucket-listing-travel-app-with-react-and-material-ui/","tags":["tutorial","React","article"],"content":"ReactとMaterial UIを使ってトラベルウェブアプリを作る連載。\nスクレイピングしての候補データの取得、Pixabayを使っての画像取得、WikiVoyageを使ってので情報取得。\nそれらの情報を表示するウェブアプリを作成するチュートリアル。","relatedLinks":[]},{"category":"Article","title":"Reactで開発するチームが共通認識しておきたい重要な概念 - KitchHike Tech Blog","url":"https://tech.kitchhike.com/entry/2018/10/31/233000","tags":["React","redux","article","設計","opinion"],"content":"Reactを使ったチーム開発において認識を合わせてておくとスムーズな概念について。\nSFC、Flux/Redux、Context API、Renderパターン、SuspenseとHooksなどのトピックごとに解説とどのような方針をもって進めたかについて書かれている。","relatedLinks":[]},{"category":"SlideVideo","title":"\\[JAPANESE\\] Why vue-cli needed a UI and what you can do with it","url":"https://slides.com/akryum/vue-cli-18-3-jp#/","tags":["Vue","console","Tools","slide"],"content":"Vue CLIについてのスライド。\nVue CLIは\"Ease of Access\"のために様々な機能をもっている。\nビルドツールチェイン、`vue ui`、プラグインシステムについて。","relatedLinks":[{"title":"Why vue-cli needed a UI and what you can do with it","url":"https://slides.com/akryum/vue-cli-18-3#/"}]},{"category":"SlideVideo","title":"1年間単体テストを書き続けた現場から送る Vue Component のテスト / Vue Component Test - Speaker Deck","url":"https://speakerdeck.com/tsuchikazu/vue-component-test","tags":["Vue","slide","testing"],"content":"Vueコンポーネントのテストについてのスライド。\nライフサイクル、Props/Vuex State、User Interactionのテスト方法などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Web Performance 101: JS, CSS, HTTP, images & fonts | PerfPerfPerf","url":"https://3perf.com/talks/web-perf-101/","tags":["performance","slide","browser"],"content":"ウェブパフォーマンスについてのスライドを文字起こししたもの。\nJavaScript、CSS、HTTP、Images、Fonts、Toolsについてそれぞれパフォーマンスの最適化についてのトピックが紹介されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gruns/irondb: A relentless key-value store for the browser.","url":"https://github.com/gruns/irondb","tags":["JavaScript","browser","library"],"content":"Cookie、IndexedDB、LocalStorageなどを重複して保存できるKey Valueストアライブラリ。\nEvercookieのように複数のストレージに保存することで、どれが消えても他のデータから復元できるようにしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"frontarm/async-javascript-cheatsheet: Cheatsheet for promises and async/await","url":"https://github.com/frontarm/async-javascript-cheatsheet","tags":["JavaScript","Promises","チートシート"],"content":"Async/Await、Promiseについてのチートシート","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Stencil","url":"https://stenciljs.com/","tags":["WebComponents","library","TypeScript","jsx"],"content":"Web Componentsフレームワークとコンパイラー。フレームワークに則ったコンポーネント\nを書きWeb Components(Custom Elements)へコンパイルするツール。\nTypeScriptやJSXをサポートし、ランタイムでコンポーネントのライフサイクル、非同期レンダリングなどをサポートしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"chunqiuyiyu/ervy: Bring charts to terminal.","url":"https://github.com/chunqiuyiyu/ervy","tags":["node.js","グラフ","library"],"content":"ターミナルにグラフを描画できるライブラリ。\nBar, Pie, Bullet,  Donut, Gauge, Scatterなどのグラフを描画できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"GoogleChromeLabs/carlo: Web rendering surface for Node applications","url":"https://github.com/GoogleChromeLabs/carlo","tags":["Chrome","Electron","library","node.js"],"content":"ユーザー環境にインストール済みのChromeとPuppeteer経由で通信してNodeとBrowserを連携できる開発ツール。\nElectronのようなChromeをWebViewとしたアプリ開発ができる。Nodeからデータを送るといったことができ、Node向けのGUIフレームワークとして利用できる。","relatedLinks":[]}]},{"meta":{"title":"2018-11-13のJS: Prettier 1.15のHTMLサポート、TypeScriptガイド、BigIntsのJavaScript実装","author":"azu","layout":"post","date":"2018-11-13T02:30:26.184Z","category":"JSer","tags":["Prettier","TypeScript","BigInt"],"url":"https://jser.info/2018/11/13/prettier-1.15htmltypescriptbigintsjavascript/"},"items":[{"category":"Headline","title":"Prettier 1.15: HTML, Vue, Angular and MDX Support · Prettier","url":"https://prettier.io/blog/2018/11/07/1.15.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 1.15リリース。\nHTML/Vue/Angular/MDXのサポート。\nフォーマットの改善、エラーメッセージの改善など","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0-beta.1 · reduxjs/react-redux","url":"https://github.com/reduxjs/react-redux/releases/tag/v6.0.0-beta.1","tags":["React","redux","ReleaseNote"],"content":"react-redux 6.0.0βリリース。\nReact Context に対応した。","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 69 | WebKit","url":"https://webkit.org/blog/8479/release-notes-for-safari-technology-preview-69/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 69リリース。\nCSS Conic Gradientsがデフォルトで有効化、CSS Painting APIの対応改善、Web SQL利用時にコンソールへ警告メッセージを追加など","relatedLinks":[]},{"category":"Headline","title":"ESLint v5.9.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2018/11/eslint-v5.9.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 5.9.0リリース。\n`--fix-type`オプションが追加され、`problem`、`suggestion`、`layout`の種類を選択して修正を適応できるようになった","relatedLinks":[]},{"category":"Headline","title":"Release 1.0.0-rc.2 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v1.0.0-rc.2","tags":["JavaScript","testing","ReleaseNote"],"content":"AVA 1.0.0 RC2リリース。\nスナップショットテストの改善、TypeScriptの型チェック改善など","relatedLinks":[]},{"category":"Article","title":"nystudio107 | An Annotated webpack 4 Config for Frontend Web…","url":"https://nystudio107.com/blog/an-annotated-webpack-4-config-for-frontend-web-development","tags":["webpack","article"],"content":"webpack 4の設定についての解説記事","relatedLinks":[]},{"category":"Article","title":"Fullstack React: An Introduction to Hooks in React","url":"https://www.fullstackreact.com/articles/an-introduction-to-hooks-in-react/","tags":["React","article"],"content":"α公開されているReact Hooksの使い方やテスト方法についての解説記事。\n`useState`などそれぞれのAPIについての挙動や使い方について解説している","relatedLinks":[]},{"category":"Article","title":"How to Use SVG Patterns as Backgrounds","url":"https://webdesign.tutsplus.com/tutorials/how-to-use-svg-patterns-as-backgrounds--cms-31507","tags":["SVG","article"],"content":"SVGパターンを背景として使う方法についての解説記事。\nCSS TilingとSVG `<pattern>`要素でのやり方やサポートブラウザについて","relatedLinks":[]},{"category":"Article","title":"Announcing Test262 Report - javascript, testing, web standards - Bocoup","url":"https://bocoup.com/blog/announcing-test262-report","tags":["ECMAScript","JavaScript","testing","article"],"content":"各JavaScriptエンジンがECMAScriptの仕様テストであるTest262をどれだけパスしているかを一覧できるTest262 Reportというサイトについて","relatedLinks":[{"title":"Test262 Report","url":"https://test262.report/"}]},{"category":"Article","title":"The Definitive TypeScript Guide - Blog | SitePen","url":"https://www.sitepen.com/blog/2018/10/29/update-the-definitive-typescript-guide/","tags":["TypeScript","article"],"content":"TypeScript初心者向けのガイド。\nコンパイル方法、TypeScriptの型の解説、Type Guards、型定義ファイルなどについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"leoafarias/neardb: Simple document db made for globally distributed reads.","url":"https://github.com/leoafarias/neardb","tags":["browser","node.js","library"],"content":"AWS S3、Google Cloud Storageなどに対応したデータベースライブラリ。\nCloudflare WorkerやLambda@Edgeなどで動かす目的のストレージライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sokra/rawact: \\[POC\\] A babel plugin which compiles React.js components into native DOM instructions to eliminate the need for the react library at runtime.","url":"https://github.com/sokra/rawact","tags":["babel","React","plugin"],"content":"Reactで書かれたコンポーネントをDOM APIで書かれたものへ変換するBabelプラグイン。\nランタイムでReactを利用しなくても動くように変換する実験的なプラグイン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"enquirer/enquirer: Stylish, intuitive and user-friendly prompt system.","url":"https://github.com/enquirer/enquirer","tags":["node.js","JavaScript","library"],"content":"ターミナルでの入力や選択などを補助するプロンプトライブラリ。\n値の種類別のプロンプトやアンケートの投票など高機能なCUIライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"GoogleChromeLabs/jsbi: JSBI is a pure-JavaScript implementation of the official ECMAScript BigInt proposal.","url":"https://github.com/GoogleChromeLabs/jsbi","tags":["JavaScript","library","ECMAScript"],"content":"BigIntをJavaScriptのオブジェクトとして実装したライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Evercoder/culori: 🌈 A general-purpose color library for JavaScript.","url":"https://github.com/Evercoder/culori","tags":["color","JavaScript","library"],"content":"RGBやHSLなどの色空間の操作ライブラリ。","relatedLinks":[]}]},{"meta":{"title":"2018-11-20のJS: TypeScript 3.2 RC、Chrome Dev Summit、The State of JavaScriptアンケート","author":"azu","layout":"post","date":"2018-11-20T02:18:50.396Z","category":"JSer","tags":["typescript","Chrome","JavaScript"],"url":"https://jser.info/2018/11/20/typescript-3.2-rcchrome-dev-summitthe-state-of-javascript/"},"items":[{"category":"Headline","title":"Announcing TypeScript 3.2 RC | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2018/11/15/announcing-typescript-3-2-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.2 RCリリース。\n`strictBindCallApply`オプションが追加され`bind`、`call`、`apply`の型付け改善、Object spread/restとGenericsの組み合わせを改善、BigIntサポート。\nCLIに`--showConfig`オプションの追加など","relatedLinks":[{"title":"TypeScript 3.2.0-RC 変更点 - Qiita","url":"https://qiita.com/vvakame/items/79557e00cfe6d3c612cd"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 70 | WebKit","url":"https://webkit.org/blog/8496/release-notes-for-safari-technology-preview-70/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 70リリース。\nHTTPなサイトに\"Not Secure\"表示が出るように変更。\n\nWeb AnimationsとIntersection Observerの対応改善、IndexedDBのデフォルトの最大容量が500MBに制限など","relatedLinks":[{"title":"azu on Twitter: ","url":"https://twitter.com/azu_re/status/1063247013905481728"}]},{"category":"Headline","title":"Release v4.26.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v4.26.0","tags":["webpack","ReleaseNote"],"content":"webpack 4.26.0リリース。\nデフォルトのminifierをuglify-esからterserに変更","relatedLinks":[{"title":"terser-js/terser: JavaScript parser, mangler, optimizer and beautifier toolkit for ES6+","url":"https://github.com/terser-js/terser"}]},{"category":"Article","title":"The Three Types of Performance Testing – CSS Wizardry – CSS Architecture, Web Performance Optimisation, and more, by Harry Roberts","url":"https://csswizardry.com/2018/10/three-types-of-performance-testing/","tags":["JavaScript","browser","testing","article","performance"],"content":"3種類のパフォーマンステストについて。\nProactive, Reactive, Passiveの3分類でパフォーマンステストについて説明されている","relatedLinks":[]},{"category":"Article","title":"The Power of Web Components - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2018/11/the-power-of-web-components/","tags":["WebComponents","article"],"content":"Web Componentsの概要的な記事。\nWeb Componentsを構成する`<template>`、Custom Elements、Shadow DOMについて解説している","relatedLinks":[]},{"category":"Article","title":"Handling Errors in JavaScript: the definite guide – gitconnected | Become a Better Developer","url":"https://levelup.gitconnected.com/the-definite-guide-to-handling-errors-gracefully-in-javascript-58424d9c60e6","tags":["JavaScript","article","node.js"],"content":"JavaScriptのエラーハンドリングについて。\ntry...catch、非同期処理、async functionとtry...catch。\nカスタムErrorオブジェクト、ユーザーへのエラー表示、エラーコードについてなど","relatedLinks":[]},{"category":"Article","title":"React for the Angular Dev – Austin – Medium","url":"https://medium.com/@amcdnl/react-for-the-angular-dev-be21a39a382","tags":["JavaScript","Angular","React","article"],"content":"Angularユーザー向けのReactエコシステム解説記事。\n機能的な対応関係となるライブラリやツールなどのエコシステムの例、Angularとは異なりスタイルガイドが公式にあるわけではないなどスタンスの違いなどについて。","relatedLinks":[]},{"category":"Article","title":"What's in the future of the web? / Twitter","url":"https://mobile.twitter.com/i/moments/1062511192097214464","tags":["Chrome","article"],"content":"Chrome Dev Summitで発表された内容に関する記事やリポジトリのまとめ","relatedLinks":[]},{"category":"Article","title":"自作フレームワークをつくって学ぶ 仮想DOM実践入門 | Black Everyday Company","url":"https://kuroeveryday.blogspot.com/2018/11/how-to-create-virtual-dom-framework.html","tags":["VirtualDOM","JavaScript","tutorial","article"],"content":"Virtual DOMの仕組みについてVirtual DOMを実装しながら学んでいくチュートリアル。\nVirtual DOMとして作ったオブジェクトを実際のDOMにどのように反映するか差分の変更検知などの実装。\nまたHyperAppのようなActionの実行と表示更新のスケジュール管理のようなフレームワークとしての動きについてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Micro Frontends の理論と実践  -価値提供を高速化する真のマイクロサービスのあり方- / The Theory and Practice of Micro Frontends - Speaker Deck","url":"https://speakerdeck.com/nobuhikosawai/the-theory-and-practice-of-micro-frontends","tags":["JavaScript","設計","slide","Microservices"],"content":"マイクロフロントエンドのメリット、デメリットについてのスライド。\nデプロイや技術の独立性、疎結合、組織論、パフォーマンスの問題など。\nマイクロフロントエンドの実装や実装例について。キャッシュ、グロールバルステート、サービス間の状態の連動方法についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Chrome Dev Summit 2018 - All Sessions - YouTube","url":"https://www.youtube.com/playlist?list=PLNYkxOF6rcIDjlCx1PcphPpmf43aKOAdF","tags":["Chrome","video"],"content":"Chrome Dev Summit 2018の動画まとめ","relatedLinks":[]},{"category":"SlideVideo","title":"The State of JavaScript 2018: Introduction","url":"https://2018.stateofjs.com/introduction/","tags":["JavaScript","アンケート"],"content":"JavaScriptアンケートのState of JavaScript 2018の結果が公開された。\n言語、フレームワーク、データレイヤー、バックエンド、テスト、モバイルなどについてのアンケート結果と過去のデータからの推移についてが見られる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Measure  |  web.dev","url":"https://web.dev/measure","tags":["webservice","Tools","performance","gool"],"content":"指定したURLに対してLighthouseを動かしてパフォーマンスレポートを取得できるツール。\nLighthouseのレポートをダウンロードできる","relatedLinks":[{"title":"Chromium Blog: PageSpeed Insights, now powered by Lighthouse","url":"https://blog.chromium.org/2018/11/pagespeed-insights-now-powered-by.html"}]},{"category":"WebsiteDocument","title":"Heydon/bruck: A prototyping system built with web components and the Houdini Paint API","url":"https://github.com/Heydon/bruck","tags":["WebComponents","CSS","library"],"content":"Web ComponentsとCSS Paint APIを使ったワイヤーモックアップコンポーネントライブラリ","relatedLinks":[]},{"category":"WebsiteDocument","title":"The Accessibility Object Model (AOM) 日本語訳 | aom","url":"https://masup9.github.io/aom/","tags":["accessibility","JavaScript","翻訳"],"content":"JavaScriptからアクセシビリティツリーを操作するためのAccesiblity Object Modelドキュメントの日本語訳","relatedLinks":[]},{"category":"WebsiteDocument","title":"Home  |  web.dev","url":"https://web.dev/","tags":["google","document"],"content":"Googleのウェブパフォーマンス、セキュリティ、アクセシビリティ、SEOなどウェブ開発に関するドキュメントサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"GoogleWebComponents/model-viewer: Easily display interactive 3D models on the web and in AR!","url":"https://github.com/GoogleWebComponents/model-viewer","tags":["3D","JavaScript","library","WebComponents"],"content":"glTF/GLB modelsを表示できるWeb Componentsライブラリ。\nResize Observer、Web Components、WebXRなどいろいろなAPIを使って実装されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"heyscrumpy/tiptap: A rich-text editor for Vue.js","url":"https://github.com/heyscrumpy/tiptap","tags":["JavaScript","Vue","library","editor"],"content":"ProsemirrorとVueベースのリッチエディタライブラリ","relatedLinks":[]}]},{"meta":{"title":"2018-11-27のJS: Web Components入門、React-Reduxの歴史と実装、 HTTP/3 explained","author":"azu","layout":"post","date":"2018-11-27T02:18:42.009Z","category":"JSer","tags":["WebComponents","react","redux","HTTP3"],"url":"https://jser.info/2018/11/27/web-componentsreact-redux-http3-explained/"},"items":[{"category":"Article","title":"Lets Build Web Components! Part 1: The Standards - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/bennypowers/lets-build-web-components-part-1-the-standards-3e85","tags":["WebComponents","article"],"content":"Web Componentsについての連載。\nWeb Componentsの構成要素、polyfill、読み込み方法、ライフサイクル、非同期ロード。\nまた`:host`や`<slot>`、スタイル、アクセシビリティ、Polymerなどのフレームワークについて","relatedLinks":[]},{"category":"Article","title":"WebSockets - A Conceptual Deep-Dive | Ably Realtime","url":"https://www.ably.io/concepts/websockets","tags":["WebSocket","article","library"],"content":"WebSocketについての記事。 Cometのようなポーリングによる通信、WebSocketによるハンドシェイクについて。 `WebSocket`を使っての接続方法や著名なライブラリの紹介など","relatedLinks":[]},{"category":"Article","title":"Idiomatic Redux: The History and Implementation of React-Redux · Mark's Dev Blog","url":"https://blog.isquaredsoftware.com/2018/11/react-redux-history-implementation/","tags":["React","redux","article"],"content":"react-reduxの歴史と今後について\n今までのreact-reduxの実装とv6 β実装されたContext APIベースの実装。\nまた、React Hooksを使った実装のProposalについてなど","relatedLinks":[]},{"category":"Article","title":"ZEIT – ncc: Node.js Compiler Collection","url":"https://zeit.co/blog/ncc","tags":["node.js","Tools","article"],"content":"Node.jsのプログラムを依存含めて1つのファイルにするnccについて。\nファイル1つにまとめることで配布性や実行時の起動時間のI/Oオーバヘッドの改善を目的としている。","relatedLinks":[{"title":"zeit/ncc: Node.js Compiler Collection","url":"https://github.com/zeit/ncc"}]},{"category":"Article","title":"Malicious code found in npm package event-stream downloaded 8 million times in the past 2.5 months | Snyk","url":"https://snyk.io/blog/malicious-code-found-in-npm-package-event-stream","tags":["node.js","npm","library","security","article"],"content":"`event-stream@3.3.6`と`flatmap-stream`の問題について。\n`flatmap-stream`にwalletsからbitcoinを盗むコードが含まれており、`event-stream@3.3.6`がこのパッケージに依存していた問題について。\n現在`flatmap-stream`はnpmからunpublishされている","relatedLinks":[{"title":"I don't know what to say. · Issue #116 · dominictarr/event-stream","url":"https://github.com/dominictarr/event-stream/issues/116"},{"title":"statement on event-stream compromise","url":"https://gist.github.com/dominictarr/9fd9c1024c94592bc7268d36b8d83b3a"}]},{"category":"Article","title":"How we made Carousell’s mobile web experience 3x faster","url":"https://medium.com/carousell-insider/how-we-made-carousells-mobile-web-experience-3x-faster-bbb3be93e006","tags":["performance","article"],"content":"carousellにおけるパフォーマンス改善について。\nPRPLパターン、Critical CSS、Lazy LOading、画像の圧縮とCDN、Service Workerの導入などについて","relatedLinks":[]},{"category":"Article","title":"フロントエンド向けvalidator: favalidの紹介 - asterisc","url":"http://akito0107.hatenablog.com/entry/2018/11/23/195538","tags":["JavaScript","library","article"],"content":"バリデーターを関数で書いてcombineできるライブラリのfavalidについて","relatedLinks":[{"title":"akito0107/favalid: make your favorite validators.","url":"https://github.com/akito0107/favalid"}]},{"category":"SlideVideo","title":"seo\\_for\\_spa.pdf - Speaker Deck","url":"https://speakerdeck.com/kazuyaseki/seo-for-spa-cfb3706f-ae1d-4c6f-a83f-96dc2452f32b","tags":["browser","SEO","google","slide"],"content":"Google botに適切に解釈されるようにするための手法についてのスライド。\nGoogle botがChrome 41相当であることによる制限、タイムアウトの検証、Dynamic Rendering(prerender)やSSRなどの対策についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Angular Webアプリケーションの最新設計手法.pdf - Speaker Deck","url":"https://speakerdeck.com/koumatsumot0/angular-webahurikesiyonfalsezui-xin-she-ji-shou-fa","tags":["Angular","slide"],"content":"Angularのコンポーネント設計やステート管理についてのスライド","relatedLinks":[]},{"category":"SlideVideo","title":"PWA導入の成果と課題 / nikkei-pwa-html5conf2018 - Speaker Deck","url":"https://speakerdeck.com/sisidovski/nikkei-pwa-html5conf2018","tags":["PWA","performance","slide"],"content":"PWAの導入と運用しての課題についてのスライド。\nService Workerによるパフォーマンスの改善、Add to HomeScreenのハンドリング、Performance Budgetの設定方法とパフォーマンス監視などについて","relatedLinks":[]},{"category":"SlideVideo","title":"HTTP and 5G (fixed1)","url":"https://www.slideshare.net/dynamis/httpp-and-5g-fixed1","tags":["QUIC","browser","network","slide"],"content":"5G環境での通信試験についてのスライド。\n5Gの試験環境における輻輳制御方法CUBICとBBRの比較、HTTP/1、HTTP/2、QUICの比較などについて","relatedLinks":[]},{"category":"SlideVideo","title":"Class features in NodeFest Japan - Google スライド","url":"https://docs.google.com/presentation/d/1nsR7QnPlyhlPj1ff4cYyARwcWrYM1j_fM7dpbFZM3K8/mobilepresent#slide=id.p","tags":["ECMAScript","proposal","slide"],"content":"ECMAScript ProposalのPrivate fieldsについてのスライド。\nprivateを実現するための構文として`#variable`を使う理由や経緯、構文、現在のStageについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"google/js-green-licenses: JavaScript package.json License Checker","url":"https://github.com/google/js-green-licenses","tags":["JavaScript","library","npm","ライセンス"],"content":"`package.json`にかかれている依存ライブラリのライセンスチェックツール。\nPull Reuqest対するチェックなども対応している","relatedLinks":[]},{"category":"WebsiteDocument","title":"KidkArolis/jetpack: 🚀 Jetpack – a more convenient webpack dev server.","url":"https://github.com/KidkArolis/jetpack","tags":["webpack","Tools"],"content":"webpackベースの開発サーバ、ビルドツール。\nParcelのようにデフォルトの設定があり、設定なしで利用できることを目的としている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"wasmerio/wasmer: High-Performance WebAssembly JIT interpreter","url":"https://github.com/wasmerio/wasmer","tags":["WebAssembly","console","Tools","Rust"],"content":"WebAssemblyファイル(`.wasm`と`.wat`)を実行できるスタンドアローンなツール。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Introduction · HTTP/3 explained","url":"https://http3-explained.haxx.se/en/","tags":["http3","document"],"content":"HTTP/3とQUICについての解説ドキュメント。\nTCPとUDP、HTTP/2との違い、QUICの仕組みなどについて","relatedLinks":[{"title":"http2 explained · GitBook (Legacy)","url":"https://legacy.gitbook.com/book/bagder/http2-explained/details"}]},{"category":"SoftwareLibrary","title":"developit/htm: Hyperscript Tagged Markup: JSX alternative using standard tagged templates, with compiler support.","url":"https://github.com/developit/htm","tags":["HTML","babal","jsx","library"],"content":"JSXライクなTagged Templatesライブラリ。babelプラグインでコンパイルも可能になっている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"areknawo/Rex: Your RegEx companion.","url":"https://github.com/areknawo/rex","tags":["JavaScript","正規表現","library","TypeScript"],"content":"メソッドチェーンで正規表現を作成したり、マッチング、置換するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"boneskull/create-yo: Use any Yeoman generator with \"npm init\"","url":"https://github.com/boneskull/create-yo","tags":["npm","library"],"content":"`npm init yo <generator>`できるYoeman向けのツール","relatedLinks":[]}]},{"meta":{"title":"2018-12-04のJS: TypeScript 3.2、React 16.xロードマップ、ESLintのビルトインJSDocサポート終了の予定","author":"azu","layout":"post","date":"2018-12-04T00:33:24.889Z","category":"JSer","tags":["typescript","react","eslint","JSDoc"],"url":"https://jser.info/2018/12/04/typescript-3.2react-16.xeslintjsdoc/"},"items":[{"category":"Headline","title":"Dev.Opera — What’s new in Chromium 70 and Opera 57","url":"https://dev.opera.com/blog/opera-57/","tags":["Opera","ReleaseNote"],"content":"Opera 57 (based on Chromium 70)リリース。\nFeature Detectionの混乱をさけるために`ontouch*`イベントの属性はデスクトップにおいてデフォルトで無効化、`postMessage`に`targetOrigin`オプションの追加。\nWeb Components V1を非推奨化など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 3.2 | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2018/11/29/announcing-typescript-3-2/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.2リリース。`strictBindCallApply`オプションが追加され`bind`、`call`、`apply`の型付け改善、Object spread/restとGenericsの組み合わせを改善、BigIntサポート。\n`tsconfig.json`の`extends`がnode_modulesのパスに対応など","relatedLinks":[]},{"category":"Article","title":"Lazy loading (and preloading) components in React 16.6","url":"https://medium.com/@pomber/lazy-loading-and-preloading-components-in-react-16-6-804de091c82d","tags":["React","article"],"content":"`React.lazy()`を使ったコンポーネントの遅延ロードについて","relatedLinks":[]},{"category":"Article","title":"End-of-Life for Built-in JSDoc Support in ESLint - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2018/11/jsdoc-end-of-life","tags":["ESLint","article"],"content":"ESLintのJSDocサポートが4.0.0でビルトインではなくなることについて。\nこれにあわせてJSDocパーサのDoctrineも更新されなくなる。\n既存のJSDoc関係のルールは別途プラグインとして切り出される。","relatedLinks":[{"title":"eslint/doctrine: JSDoc parser","url":"https://github.com/eslint/doctrine"}]},{"category":"Article","title":"React 16.x Roadmap – React Blog","url":"https://reactjs.org/blog/2018/11/27/react-16-roadmap.html","tags":["React","article"],"content":"React 16.xのロードマップについて。\n16.7でReact Hooks、16.8でConcurrent Mode、16.9でSuspense for Data Fetchingをリリース予定。\nまた、React DOMのモダン化やSSRに対するSuspenseを検討中。","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 72)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/11/devtools","tags":["Chrome","article"],"content":"Chrome 72の開発者ツールの変更点。\nPerformance metricsのビジュアライズ、\"Copy JS path\"(セレクタを指定するコードのコピー)を追加、Lighthouseのアップデートなど","relatedLinks":[]},{"category":"Article","title":"Modern Frontend Testing with Cypress.io Framework - Snipcart","url":"https://snipcart.com/blog/frontend-testing-cypress","tags":["E2E","testing","article"],"content":"Cypressを使ったE2Eテストについてのチュートリアル","relatedLinks":[]},{"category":"Article","title":"Web workers vs Service workers vs Worklets","url":"https://bitsofco.de/web-workers-vs-service-workers-vs-worklets/","tags":["webworker","webservice","article"],"content":"Web Worker、Service Worker、Workletsの役割や動作についてを簡単に紹介している記事。\nブラウザのメインスレッドとは異なるスレッドでコードを実行するWorkerについて","relatedLinks":[]},{"category":"Article","title":"ECMAScript proposal updates @ 2018-11 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2018/12/01/ecmascript-proposal-updates","tags":["ECMAScript","proposal"],"content":"2018年11月のTC39ミーティングで変更があったECMAScript Proposalのステータスまとめ","relatedLinks":[]},{"category":"Article","title":"What’s new in Create React App 2 – LogRocket","url":"https://blog.logrocket.com/whats-new-in-create-react-app-2-fe8f4f448c75","tags":["React","article"],"content":"Create React App 2.0での変更点について。\nTypeScript対応、Service Workerがオプトインに変更、Babel macrosの対応、`src/setupProxy.js`の対応など","relatedLinks":[]},{"category":"Article","title":"How Does React Tell a Class from a Function? | Overreacted","url":"https://overreacted.io/how-does-react-tell-a-class-from-a-function/","tags":["React","article"],"content":"Reactが関数とクラスで書かれたコンポーネントを呼び分ける必要があるため、内部でどのように判別しているかについての解説","relatedLinks":[]},{"category":"Article","title":"CSS and Network Performance – CSS Wizardry – CSS Architecture, Web Performance Optimisation, and more, by Harry Roberts","url":"https://csswizardry.com/2018/11/css-and-network-performance/","tags":["JavaScript","CSS","article","performance"],"content":"CSSのロードとパフォーマンスについての記事。\n非同期ロード、`@import`を避ける、CSSとJSのロード順の問題などについて","relatedLinks":[]},{"category":"SlideVideo","title":"Scrimba","url":"https://scrimba.com/","tags":["React","Angular","Vue","TypeScript","video","tutorial"],"content":"Angular、React、VueやTypeScriptなどのスクリーンキャストを公開しているサイト","relatedLinks":[]},{"category":"Book","title":"The Second Edition of \"Refactoring\"","url":"https://martinfowler.com/articles/refactoring-2nd-ed.html","tags":["JavaScript","book"],"content":"Refactoring 第二版がリリースされた","relatedLinks":[]}]},{"meta":{"title":"2018-12-11のJS: gulp 4が正式リリース、MSEdgeがChromiumベースに移行","author":"azu","layout":"post","date":"2018-12-11T00:22:12.068Z","category":"JSer","tags":["gulpjs","MSEdge","Chromium"],"url":"https://jser.info/2018/12/11/gulp-4msedgechromium/"},"items":[{"category":"Headline","title":"New in Chrome 71  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/12/nic71","tags":["Chrome","ReleaseNote"],"content":"Chrome 71の変更点について。\n`Intl.RelativeTimeFormat()`のサポート、`text-underline-position`のサポート。\nFetch APIのcredentials-modeのデフォルト値が`omit`から`same-origin`へと変更など","relatedLinks":[]},{"category":"Headline","title":"7.2.0 Released: Private Instance Methods · Babel","url":"https://babeljs.io/blog/2018/12/03/7.2.0.html","tags":["babel","ReleaseNote"],"content":"Babel 7.2.0リリース。\nPrivate methods proposalのサポート、pipeline operator proposalのパースをサポート、replで変換過程を見られるタイムトラベルをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 71 | WebKit","url":"https://webkit.org/blog/8517/release-notes-for-safari-technology-preview-71/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 71リリース。\n`supported-color-schemes`のサポート、Intersection Observerの有効化、Web Authenticationの試験的サポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 8.4.0 · developit/preact","url":"https://github.com/developit/preact/releases/tag/8.4.0","tags":["React","JavaScript","library","ReleaseNote"],"content":"Preact 8.4.0リリース。\nTypeScriptの型定義を改善、パフォーマンスの改善など。\nまた次期メジャーバージョンのPreact Xについて書かれている","relatedLinks":[]},{"category":"Headline","title":"Microsoft Edge: Making the web better through more open source collaboration - Windows Experience BlogWindows Experience Blog","url":"https://blogs.windows.com/windowsexperience/2018/12/06/microsoft-edge-making-the-web-better-through-more-open-source-collaboration/","tags":["MSEdge","news"],"content":"デスクトップMSEdgeはChromiumベース(Blink+V8)に移行し、すべてのWindowsバージョンやmacOS向けなどへ提供予定。\nJavaScriptエンジンのChakraCoreはEdge以外の利用のためサポートを続ける。","relatedLinks":[{"title":"MicrosoftEdge/MSEdge: Microsoft Edge","url":"https://github.com/MicrosoftEdge/MSEdge"},{"title":"Chromium adoption in Microsoft Edge and future of ChakraCore · Issue #5865 · Microsoft/ChakraCore","url":"https://github.com/Microsoft/ChakraCore/issues/5865"},{"title":"MicrosoftEdge/MSEdgeExplainers: Home for explainer documents originated by the Microsoft Edge team","url":"https://github.com/MicrosoftEdge/MSEdgeExplainers"}]},{"category":"Headline","title":"puppeteer/experimental/puppeteer-firefox at master · GoogleChrome/puppeteer","url":"https://github.com/GoogleChrome/puppeteer/tree/master/experimental/puppeteer-firefox","tags":["firefox","node.js","library"],"content":"PuppeteerのFirefox版","relatedLinks":[]},{"category":"Headline","title":"Google Developers Blog: Flutter 1.0: Google’s Portable UI Toolkit","url":"https://developers.googleblog.com/2018/12/flutter-10-googles-portable-ui-toolkit.html","tags":["Flutter","ReleaseNote"],"content":"Flutter 1.0リリース。\nHummingbirdというウェブ向けの出力対応予定について","relatedLinks":[{"title":"Hummingbird: Building Flutter for the Web – Flutter – Medium","url":"https://medium.com/flutter-io/hummingbird-building-flutter-for-the-web-e687c2a023a8"}]},{"category":"Headline","title":"Processing.js 2008-2018","url":"https://blog.humphd.org/processing-js-2008/","tags":["JavaScript","library","news"],"content":"メンテンナンスモードであったProcessing.jsのリポジトリがアーカイブ化された。\nまたProcessing.jsの歴史について。後継ライブラリとしてはp5jsが開発されている。","relatedLinks":[{"title":"processing-js/processing-js: A port of the Processing visualization language to JavaScript.","url":"https://github.com/processing-js/processing-js/"}]},{"category":"Headline","title":"Release v0.88.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.88.0","tags":["flowtype","ReleaseNote"],"content":"Flow 0.88.0リリース。\n`Function`と`Object`を`any`のaliasとして扱うように。\n`flow start --lazy-mode watchman`の追加、`flow config check`コマンドの追加など","relatedLinks":[]},{"category":"Headline","title":"ESLint v5.10.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2018/12/eslint-v5.10.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 5.10.0リリース。\n`padding-line-between-statements`にオプションの追加、\nJSDoc関係のルールである`require-jsdoc`と`valid-jsdoc`が非推奨になるなど","relatedLinks":[{"title":"ESLint v5.10.0 - Qiita","url":"https://qiita.com/mysticatea/items/64a09c3bea4c06d84a2e"}]},{"category":"Headline","title":"🎉 Version 4.0 Now Default 🎉 – gulpjs – Medium","url":"https://medium.com/gulpjs/version-4-now-default-92c6cd4beb45","tags":["gulp","ReleaseNote"],"content":"gulp 4.0が正式リリース。\n`gulp.series`と`gulp.parallel`を追加。\nsourcemapsのビルトインサポート、gulpfileからのexportをタスクとして扱えるように、`gulp`と`gulp-cli`の分離など","relatedLinks":[{"title":"Release v4.0.0 · gulpjs/gulp","url":"https://github.com/gulpjs/gulp/releases/tag/v4.0.0"}]},{"category":"Article","title":"jQueryへの依存を外す方法 - dely engineering blog","url":"https://tech.dely.jp/entry/2018/12/08/160000","tags":["JavaScript","CoffeeScript","TypeScript","リファクタリング","jQuery","article"],"content":"jQueryの依存を外すまでのフローについて。\npolyfill.io の利用、CoffeeScriptからTypeScriptへの移行。\njQueryをVanillaJS + polyfillで動くように書き直し、BackstopJSでビジュアルリグレッションテストする方法について。","relatedLinks":[]},{"category":"Article","title":"Node.js Everywhere with Environment Variables! – Node.js Collection – Medium","url":"https://medium.com/the-node-js-collection/making-your-node-js-work-everywhere-with-environment-variables-2da8cdf6e786","tags":["node.js","article"],"content":"Node.jsでの環境変数の使い方、`.env`を使った環境変数の定義と読み込み方法についてなど","relatedLinks":[]},{"category":"Article","title":"Yahoo! JAPANでの生体認証の取り組み（FIDO2サーバーの仕組みについて） - Yahoo! JAPAN Tech Blog","url":"https://techblog.yahoo.co.jp/advent-calendar-2018/webauthn/","tags":["JavaScript","security","article"],"content":"WebAuthn（Web Authentication）を使った生体認証でのログインフローについての解説","relatedLinks":[]},{"category":"Article","title":"ヤフー株式会社におけるWebフロントエンドの技術選定 - Yahoo! JAPAN Tech Blog","url":"https://techblog.yahoo.co.jp/advent-calendar-2018/yahoo-frontend/","tags":["JavaScript","CSS","company","opinion"],"content":"ヤフー株式会社における各サービスごとのフロントエンドに利用しているフレームワークやライブラリなどについて。\nそれぞれの技術を選定した理由などについてもまとめられている。","relatedLinks":[]},{"category":"Article","title":"Performance Calendar » data-s(h)aver strategies","url":"https://calendar.perfplanet.com/2018/data-shaver-strategies/","tags":["performance","article"],"content":"ブラウザのデータセーバーが有効かを判定し、それに対してどのようなコンテンツを返すかについて。\nコンテンツ数の削減、自動再生の防止、解像度の低い画像の配信、データセーバーが有効になっていることの通知などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Compare HAR files","url":"https://compare.sitespeed.io/","tags":["webservice","performance"],"content":"HARファイル同士を比較できるウェブサービス。\nそれぞれのリソースロードのタイムライン比較、動画、ファイルサイズのDiffなどを出してくれる","relatedLinks":[{"title":"Performance Calendar » Sharing is caring: What’s new with comparing HAR files?","url":"https://calendar.perfplanet.com/2018/sharing-comparing-har-files/"}]},{"category":"SoftwareLibrary","title":"rowanmanning/proclaim: A simple assertion library for server and client side JavaScript.","url":"https://github.com/rowanmanning/proclaim","tags":["JavaScript","library","testing"],"content":"古いブラウザや古いNode.jsでも動作するように書かれたassert系ライブラリ。\nchaiのようにassertの拡張メソッドも実装されている","relatedLinks":[]}]},{"meta":{"title":"2018-12-18のJS: Firefox 64.0、AVA 1.0、ES Modules対応パッケージ検索","author":"azu","layout":"post","date":"2018-12-18T01:21:34.425Z","category":"JSer","tags":["firefox","avajs","testing","Modules"],"url":"https://jser.info/2018/12/18/firefox-64.0ava-1.0es-modules/"},"items":[{"category":"Headline","title":"Firefox 64.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/64.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 64.0リリース。\nFullscreen APIの接頭辞を削除、`requestFullscreen()`などがPromiseを返すように、macOSでWebVR APIを有効化。\n`XMLHttpRequest.getAllResponseHeaders()`がヘッダ名を小文字で返すようになるなど","relatedLinks":[{"title":"Firefox 64 for developers | MDN","url":"https://developer.mozilla.org/ja/docs/Mozilla/Firefox/Releases/64"},{"title":"Firefox 64 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/versions/64/"},{"title":"Firefox 64 Released - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2018/12/firefox-64-released/"}]},{"category":"Headline","title":"Ember.js - Ember 3.6 Released","url":"https://emberjs.com/blog/2018/12/13/ember-3-6-released.html","tags":["Ember","ReleaseNote","JavaScript","library"],"content":"Ember 3.6リリース。\nいくつかの制限はあるがES classをサポート。\n`new EmberObject()`を非推奨化し、`EmberObject.create()`の利用を推奨するようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0 · reduxjs/react-redux","url":"https://github.com/reduxjs/react-redux/releases/tag/v6.0.0","tags":["redux","ReleaseNote"],"content":"React Redux 6.0.0リリース。\nContext APIのサポート、`withRef`オプションは`forwardRef`オプションに置き換えなど","relatedLinks":[]},{"category":"Headline","title":"Release 1.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v1.0.1","tags":["JavaScript","testing","ReleaseNote"],"content":"AVA 1.0リリース。\n`t.throws`の挙動の変更と`t.throwsAsync`の追加。\nBabel 7に対応、`ava.config.js`のサポートなど。\n破壊的な変更として`test`は名前をもつことが必須となり、`t.ifError`の削除など","relatedLinks":[]},{"category":"Headline","title":"billboard.js 1.7.0 release!! – Jae Sung Park – Medium","url":"https://medium.com/@alberto.park/billboard-js-1-7-0-release-4944a2eb59fe","tags":["JavaScript","グラフ","library","ReleaseNote"],"content":"D3.jsベースのグラフライブラリであるbillboard.js 1.7.0リリース。\nMulti Axes、`graph` theme、TypeScriptのサポートなど","relatedLinks":[]},{"category":"Article","title":"Chrome DevToolsを用いたメルカリWebのパフォーマンス計測 - Mercari Engineering Blog","url":"https://tech.mercari.com/entry/2018/12/12/090156","tags":["Chrome","performance","article"],"content":"Chromeの開発者ツールのネットワークパネルやパフォーマンスパネルの読み方について。\nスクリーンショットを元にそれぞれの要素が何を表しているかを説明している","relatedLinks":[]},{"category":"Article","title":"Introducing Background Fetch  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/12/background-fetch","tags":["Chrome","Fetch","ServiceWorker"],"content":"Chrome 71で試験的に導入されるBackground Fetchについて。","relatedLinks":[]},{"category":"Article","title":"An Introduction and Guide to the CSS Object Model (CSSOM) | CSS-Tricks","url":"https://css-tricks.com/an-introduction-and-guide-to-the-css-object-model-cssom/","tags":["CSS","article"],"content":"CSS Object Model (CSSOM) について。\nJavaScriptから要素のスタイルの取得、変更、Priorityや`@keyframes`などへのアクセス方法などについて","relatedLinks":[]},{"category":"Article","title":"worker\\_threadsを使ったNode.js マルチスレッドプログラミング - kakts-log","url":"http://kakts-tec.hatenablog.com/entry/2018/12/14/005316","tags":["node.js","article"],"content":"Node.js 10.5.0で試験的にサポートされた`worker_threads`モジュールについて。\nNode.jsでのWorkerを使ったスレッド処理について","relatedLinks":[]},{"category":"Article","title":"混沌を極める jQuery のコードをいかにして Vue.js に頼らずに整理したか - Qiita","url":"https://qiita.com/cesare/items/c00acd7911afcba21224","tags":["jQuery","JavaScript","リファクタリング"],"content":"jQueryを使い書かれていたイベント処理が密結合で影響範囲が複雑化していた問題について。\nイベントのフローや影響範囲をViewで区切るなど、どのようにリファクタリングを進めたかについて","relatedLinks":[]},{"category":"SlideVideo","title":"HTML5 Conference 2018 - YouTube","url":"https://www.youtube.com/playlist?list=PLeFZWzLJpZccuopdBjJAuod_tYGvVCIHv","tags":["HTML5","イベント","video"],"content":"HTML5 Conference 2018の動画まとめ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Measuring the performance impact of Chrome extensions | DebugBear","url":"https://www.debugbear.com/blog/measuring-the-performance-impact-of-chrome-extensions","tags":["Chrome","performance","browser","Extension"],"content":"Chrome拡張などがパフォーマンス計測に与える影響について","relatedLinks":[]},{"category":"WebsiteDocument","title":"GoogleChromeLabs/quicklink: ⚡️Faster subsequent page-loads by prefetching in-viewport links during idle time","url":"https://github.com/GoogleChromeLabs/quicklink","tags":["JavaScript","library","performance"],"content":"Viewportに表示されているリンクをアイドル時にprefetchを行うライブラリ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Pika | Search modern module esm packages on npm","url":"https://www.pikapkg.com/","tags":["JavaScript","npm","ECMAScript","module","検索","webservice"],"content":"ECMAScriptモジュールに対応したnpmパッケージを検索できるウェブサービス。\n\"module\"フィールドに対応しているパッケージを検索できる。","relatedLinks":[{"title":"Pika | What is Pika?","url":"https://www.pikapkg.com/about/"}]},{"category":"SoftwareLibrary","title":"simov/grant: OAuth Middleware for Express, Koa and Hapi","url":"https://github.com/simov/grant","tags":["OAuth","node.js","library"],"content":"expressなどで使えるOAuth middleware。\npassportのように色々なサービスに対応している","relatedLinks":[{"title":"How does this project compare to Passport? · Issue #77 · simov/grant","url":"https://github.com/simov/grant/issues/77"}]},{"category":"SoftwareLibrary","title":"Wenzil/Mhysa: Dependency-free stream utils for Node.js","url":"https://github.com/Wenzil/Mhysa","tags":["node.js","TypeScript","library","JavaScript"],"content":"Node.js Streamを扱う\nTypeScriptで書かれているライブラリ。`fromArray`からStreamのラッパーを作成し`map`、`reduce`、`merge`、`duplex`などを使いStream処理できるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"zeit/arg: Simple argument parsing","url":"https://github.com/zeit/arg","tags":["JavaScript","node.js","library","TypeScript"],"content":"シンプルなコマンドライン引数パーサライブラリ","relatedLinks":[]}]},{"meta":{"title":"2018-12-25のJS: Chrome 72βとV8 7.2、webpack 5α、スクリーンリーダーの見え方","author":"azu","layout":"post","date":"2018-12-25T02:33:59.081Z","category":"JSer","tags":["chrome","V8","webpack"],"url":"https://jser.info/2018/12/25/chrome-72bv8-7.2webpack-5a/"},"items":[{"category":"Headline","title":"V8 release v7.2 · V8","url":"https://v8.dev/blog/v8-release-72","tags":["V8","ReleaseNote"],"content":"V8 v7.2.リリース。\n`async/await`、Spread Elementsなどのパフォーマンス改善、Publicクラスフィールド、`Intl.ListFormat`、`export * as foo from`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 72 Beta: Public class fields, user activation and more","url":"https://blog.chromium.org/2018/12/chrome-72-beta-public-class-fields-user.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 72 Betaリリース。\nPublic class fieldsの実装、 User Activation Query APIのサポート、HPKPの削除、TLS 1.0と1.1を非推奨化など","relatedLinks":[{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features#browsers.chrome.desktop%3D72"},{"title":"Deprecations and removals in Chrome 72  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/12/chrome-72-deps-rems"}]},{"category":"Headline","title":"Electron 4.0.0 | Electron Blog","url":"https://electronjs.org/blog/electron-4-0","tags":["Electron","ReleaseNote"],"content":"Electron 4.0.0リリース。\n`BrowserWindow`で`remote`モジュールを無効化できるように、WebContentsからの`remote.require`などをイベント処理できるようになるなど。\nmacOS 10.9のサポート終了、`app.makeSingleInstance()`を`app.requestSingleInstanceLock()`に変更など","relatedLinks":[]},{"category":"Headline","title":"webpack 5 alpha feedback · Issue #8537 · webpack/webpack","url":"https://github.com/webpack/webpack/issues/8537","tags":["webpack","ReleaseNote","issue"],"content":"webpack 5αがリリースされフィードバックを募集中。\nv4で非推奨となっているものを削除、`events`などNode.jsのコアモジュールのpolyfillを自動で入れないように変更、chunk idなどの変更など","relatedLinks":[{"title":"changelog-v5/README.md at master · webpack/changelog-v5","url":"https://github.com/webpack/changelog-v5/blob/master/README.md"}]},{"category":"Headline","title":"Release 2.0.0 · developit/htm","url":"https://github.com/developit/htm/releases/tag/2.0.0","tags":["jsx","babel","JavaScript","library"],"content":"JSXライクなタグ関数を提供するHTM 2.0リリース。\nパフォーマンス改善、Babelプラグインの改善など","relatedLinks":[]},{"category":"Headline","title":"Bootstrap 4.2.1 · Bootstrap Blog","url":"https://blog.getbootstrap.com/2018/12/21/bootstrap-4-2-1/","tags":["CSS","ReleaseNote","library"],"content":"Bootstrap 4.2.1リリース。\nSpinner loading、Toast、Switchesコンポーネントの追加、いくつかのユーティリティクラスの追加。","relatedLinks":[]},{"category":"Headline","title":"Bootstrap 3.4.0 · Bootstrap Blog","url":"https://blog.getbootstrap.com/2018/12/13/bootstrap-3-4-0/","tags":["CSS","library","security","ReleaseNote"],"content":"Bootstrap 3.4.0リリース(最新版は4.x系)\ndata属性に関するXSS脆弱性を修正(4.0では修正済み)","relatedLinks":[{"title":"Cross-Site Scripting (XSS) | Snyk","url":"https://snyk.io/vuln/npm:bootstrap:20160627"},{"title":"Fix some XSS in v3 by Johann-S · Pull Request #23687 · twbs/bootstrap","url":"https://github.com/twbs/bootstrap/pull/23687"}]},{"category":"Article","title":"three.js超入門 第0回 3Dコンピュータグラフィックスの基礎 - Qiita","url":"https://qiita.com/watabo_shi/items/f7c559c3cdbcdd0f2629","tags":["3D","JavaScript","article"],"content":"three.js入門の連載記事。\nthree.jsや3DCGの基本的な用語やレンダリング、インタラクションの実装などについて","relatedLinks":[]},{"category":"Article","title":"Cloudworker  -  A local Cloudflare Worker Runner","url":"https://blog.cloudflare.com/cloudworker-a-local-cloudflare-worker-runner/","tags":["JavaScript","node.js","cdn","ServiceWorker"],"content":"Cloudflare Workers向けのスクリプトをローカルで動かすことを目的としたツール","relatedLinks":[{"title":"dollarshaveclub/cloudworker: Run Cloudflare Worker scripts locally","url":"https://github.com/dollarshaveclub/cloudworker"}]},{"category":"Article","title":"FOLIOの画像回帰テストの裏側 – Yosuke Kurami – Medium","url":"https://medium.com/@Quramy/folio%E3%81%AE%E7%94%BB%E5%83%8F%E5%9B%9E%E5%B8%B0%E3%83%86%E3%82%B9%E3%83%88%E3%81%AE%E8%A3%8F%E5%81%B4-c848030991bc","tags":["testing","article","UI"],"content":"画像ベースのビジュアルリグレッションテストの運用について。\nアニメーションやロードが発生する描画結果の画像キャプチャを安定して取る手法やStorybookとテストの段階的な導入についてなど","relatedLinks":[]},{"category":"Article","title":"I Used The Web For A Day Using A Screen Reader — Smashing Magazine","url":"https://www.smashingmagazine.com/2018/12/voiceover-screen-reader-web-apps/","tags":["accessibility","article"],"content":"スクリーンリーダを実際にどのように使うかについて。\nVoiceOverを使っていくつかのサイトを元に、スクリーンリーダの動きやどのようにみえているのかなどについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"現代の JavaScript チュートリアル","url":"https://ja.javascript.info/","tags":["JavaScript","tutorial","翻訳","document"],"content":"https://javascript.info/ の翻訳サイト。 JavaScript、DOM APIについてのチュートリアルサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"swc-project/swc: Super-fast alternative for babel","url":"https://github.com/swc-project/swc","tags":["Rust","JavaScript","babel","Tools"],"content":"Rustで書かれたJavaScript Transpiler。\nBabelなどのようにECMAScriptバージョンに対応した変換を行う。","relatedLinks":[]},{"category":"Book","title":"Introduction - TypeScript Deep Dive 日本語版","url":"https://typescript-jp.gitbook.io/deep-dive/","tags":["TypeScript","翻訳","document"],"content":"TypeScript Deep Diveの日本語訳","relatedLinks":[{"title":"yohamta/typescript-book-jp: TypeScript Bookの日本語訳です。","url":"https://github.com/yohamta/typescript-book-jp"}]}]},{"meta":{"title":"JSerレポート #2: Node.jsコアモジュールとBundler(webpackなど)によるpolyfillのギャップ","author":"azu","layout":"post","date":"2018-12-25T03:14:00.000Z","category":"レポート","tags":["webpack","browserify","node.js","polyfill"],"url":"https://jser.info/2018/12/25/node-browser-libs-gap/"},"items":[]},{"meta":{"title":"2019-01-01のJS: WebdriverIO v5、Rollup 1.0、Rust + WebAssembly + WebWorker","author":"azu","layout":"post","date":"2018-12-31T13:38:01.421Z","category":"JSer","tags":["Selenium","rollup","WebAssembly","Rust"],"url":"https://jser.info/2018/12/31/webdriverio-v5rollup-1.0rust-webassembly-webworker/"},"items":[{"category":"Headline","title":"WebdriverIO v5 Released · WebdriverIO","url":"https://webdriver.io/blog/2018/12/19/webdriverio-v5-released.html","tags":["Selenium","browser","testing","library","ReleaseNote"],"content":"WebdriverIO v5リリース。\n`wdio` CLIは`@wdio/cli`に移動、コマンドがselectorを受け取らないように、メソッドチェーンではなくasync/awaitベースに変更。\nその他にもコマンドのリネームなどの破壊的な変更を多く含む","relatedLinks":[{"title":"webdriverio/CHANGELOG.md at master · webdriverio/webdriverio","url":"https://github.com/webdriverio/webdriverio/blob/master/CHANGELOG.md#v500-2018-12-20"}]},{"category":"Headline","title":"Release v1.0.0 · rollup/rollup","url":"https://github.com/rollup/rollup/releases/tag/v1.0.0","tags":["JavaScript","bundler","ReleaseNote"],"content":"Rollup 1.0.0リリース。\n破壊的な変更としてオプションのリネーム、`bundle.generate`の返す値のフォーマットの変更、`acorn@6`へアップデートなど","relatedLinks":[]},{"category":"Article","title":"「GraphQL」徹底入門 ─ RESTとの比較、API・フロント双方の実装から学ぶ - エンジニアHub｜若手Webエンジニアのキャリアを考える！","url":"https://employment.en-japan.com/engineerhub/entry/2018/12/26/103000","tags":["GraphQL","tutorial","article"],"content":"GraphQLの入門記事。\nGraphQLの利点、欠点、スキーマ/クエリの書き方、VariableやFragmentの使い方について。\nまたRelayの拡張や実際にGraphQLを使った実装例についてなど","relatedLinks":[]},{"category":"Article","title":"Understanding Throttling and Debouncing – Bits and Pieces","url":"https://blog.bitsrc.io/understanding-throttling-and-debouncing-973131c1ba07","tags":["JavaScript","article"],"content":"ThrottlingとDebouncingについてそれぞれを実装しながら挙動を理解していく記事","relatedLinks":[]},{"category":"Article","title":"Comlink + Rust で言語とスレッドの垣根を越えた WebAssembly 開発 - Qiita","url":"https://qiita.com/3846masa/items/92d24e16ebb5151b08ba","tags":["WebAssembly","webworker","Rust","article"],"content":"Rustを使ったWebAssemblyライブラリの開発について。\nRustを使ったwasmのバインディングの作成、webpackを使ったロード方法について。\nまた、処理をメインスレッド外のWebWorkerで行いComlinkでのデータのやり取りする方法について","relatedLinks":[]},{"category":"Article","title":"Babel 7 の主な変更点まとめ - Qiita","url":"https://qiita.com/soarflat/items/21b8955f992bf7d38581","tags":["babel","article"],"content":"Babel 7の主な変更点やマイグレーション方法について","relatedLinks":[]},{"category":"Article","title":"基礎からはじめるReact Native入門連載一覧：CodeZine（コードジン）","url":"https://codezine.jp/article/corner/772","tags":["React","iOS","Android","tutorial"],"content":"React Nativeについての連載記事。","relatedLinks":[]},{"category":"Article","title":"ECMAScript modules in Node.js: the new plan","url":"http://2ality.com/2018/12/nodejs-esm-phases.html","tags":["node.js","article","module"],"content":"Node.jsにおけるES Modulesの扱いについてのまとめ記事。\n`.mjs`のサポートについてやCommonJSとの相互運用性の問題、今後どのような方針が予定されているのかについて","relatedLinks":[]},{"category":"Article","title":"JavaScriptとWeb開発に関するInfoQトレンドレポート","url":"https://www.infoq.com/jp/articles/javascript-web-development-trends","tags":["JavaScript","article"],"content":"InfoQのJavaScriptに関するトレンドレポート。\nイノベーター、アーリーアダプター、アーリーマジョリティ、レイトマジョリティ、ラガードに分けて関連するライブラリ/フレームワーク/ツールについて紹介している。","relatedLinks":[]},{"category":"Article","title":"TypeScriptで実現する型安全な多言語対応（Angularを例に） | 株式会社カブク","url":"https://www.kabuku.co.jp/software_engineer/typescript-angular-i18n/","tags":["Angular","i18n","TypeScript","article"],"content":"翻訳ファイルをTypeScriptのコードとして表現することで型安全な翻訳定義を作成する方法について。\n翻訳ファイルをコードにするメリットとデメリットについてなど","relatedLinks":[]},{"category":"Article","title":"takefumi-yoshii/react-hooks-ogiri: Advent calendar of 2018. This is a showreel using a reaction hook.","url":"https://github.com/takefumi-yoshii/react-hooks-ogiri","tags":["React","example","document"],"content":"React Hooks APIを使ったUIコンポーネントのサンプル実装集","relatedLinks":[{"title":"React Hooks 大喜利 Advent Calendar 2018 - Qiita","url":"https://qiita.com/advent-calendar/2018/react-hooks-ogiri"}]},{"category":"SoftwareLibrary","title":"FontoXML/fontoxpath: A minimalistic XPath 3.1 implementation in pure JavaScript","url":"https://github.com/FontoXML/fontoxpath","tags":["JavaScript","xpath","library"],"content":"XPath 3.1、XQuery 3.1の実装ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jsincss | A JS-in-CSS stylesheet loader","url":"https://jsincss.com/","tags":["JavaScript","CSS","library"],"content":"JavaScriptからテンプレートでCSSを生成でき、イベントによってリアクティブにCSSを変更できるライブラリ。\nプラグインで拡張できるようになっている。","relatedLinks":[{"title":"tomhodgins/jsincss: A JS-in-CSS stylesheet loader","url":"https://github.com/tomhodgins/jsincss"},{"title":"What is a JIC Stylesheet? - Responsive Style","url":"https://responsive.style/theory/what-is-a-jic-stylesheet.html"}]},{"category":"SoftwareLibrary","title":"BabelEdit - Editor for JSON translation files for Angular & React","url":"https://www.codeandweb.com/babeledit","tags":["i18n","React","Angular","software"],"content":"JSONベースの翻訳ファイルエディタ。\nAngularやReactとの連携としたワークフローが紹介されている","relatedLinks":[]}]},{"meta":{"title":"2019-01-08のJS: TypeScriptのロードマップ、FBT i18n Framework、Learn JavaScript","author":"azu","layout":"post","date":"2019-01-08T02:22:36.982Z","category":"JSer","tags":["TypeScript","i18n","JavaScript"],"url":"https://jser.info/2019/01/08/typescriptfbt-i18n-frameworklearn-javascript/"},"items":[{"category":"Headline","title":"Release 2.9.0 · qunitjs/qunit","url":"https://github.com/qunitjs/qunit/releases/tag/2.9.0","tags":["JavaScript","testing","ReleaseNote"],"content":"QUnit 2.9.0リリース","relatedLinks":[]},{"category":"Headline","title":"Release v2.1.3 · facebook/create-react-app","url":"https://github.com/facebook/create-react-app/releases/tag/v2.1.3","tags":["react","webpack","ReleaseNote"],"content":"create-react-app 2.1.3リリース。\n`webpack-dev-server@3.1.10`以下にあった脆弱性を修正したバージョンを取り込んでいる","relatedLinks":[{"title":"Sniffing Codes in Hot Module Reloading Messages - crblog","url":"https://blog.cal1.cn/post/Sniffing%20Codes%20in%20Hot%20Module%20Reloading%20Messages"},{"title":"Release v3.1.11 · webpack/webpack-dev-server","url":"https://github.com/webpack/webpack-dev-server/releases/tag/v3.1.11"},{"title":"npm","url":"https://www.npmjs.com/advisories/725"}]},{"category":"Article","title":"Page Object pattern in JavaScript | LinkedIn","url":"https://www.linkedin.com/pulse/page-object-pattern-javascript-vladim%C3%ADr-gorej/","tags":["JavaScript","testing","article"],"content":"Selenium WebDriverを使ったページオブジェクトパターンについて。\nページオブジェクトとはどのようなものか、要素の抽象化、遅延処理、ページオブジェクトにAssertを含めないことについてなど","relatedLinks":[]},{"category":"Article","title":"Odi - server-side framework - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/dantsk/odi---server-side-framework-2ep7","tags":["JavaScript","node.js","library","TypeScript","article"],"content":"Node.js向けのサーバサイドフレームワーク。Decoratorを使った宣言的な定義やTypeScriptの`emitDecoratorMetadata`を使ったDTOなどを持つ。\n類似するコンセプトを持つNestjsとの違いについてなど","relatedLinks":[{"title":"Odi-ts/odi: 🌪🌌 Opinionated, Declarative, Idiomatic framework for building scalable, supportable, enterprise applications and servers.","url":"https://github.com/Odi-ts/odi"}]},{"category":"Article","title":"Neural networks in JavaScript | Scrimba.com","url":"https://scrimba.com/g/gneuralnetworks","tags":["JavaScript","tutorial","library"],"content":"ニューラルネットワークライブラリであるBrain.jsのインタラクティブなチュートリアル","relatedLinks":[{"title":"BrainJS/brain.js: 🤖 Neural networks in JavaScript","url":"https://github.com/BrainJS/brain.js"}]},{"category":"Article","title":"TypeScript Roadmap: January - June 2019 · Issue #29288 · Microsoft/TypeScript","url":"https://github.com/Microsoft/TypeScript/issues/29288","tags":["TypeScript","issue","article"],"content":"TypeScriptのロードマップ。\nJS/JSDocの扱いの改善、TSLintではなくESLintでのTSのLint改善、パフォーマンス改善、CLIの改善、ドキュメントの改善、Playgroundの改善などに取り組んでいく","relatedLinks":[]},{"category":"WebsiteDocument","title":"Learn JavaScript","url":"https://learnjavascript.online/","tags":["JavaScript","tutorial","webservice"],"content":"JavaScriptについてテストを通るようにコードを書いて学べるサイト。\nそれぞれの項目に対して大量の練習問題があり、復習用にFlashcardsが用意されている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"GoogleChromeLabs/webm-wasm: webm-wasm lets you create webm videos in JavaScript via WebAssembly.","url":"https://github.com/GoogleChromeLabs/webm-wasm","tags":["WebAssembly","library","JavaScript","C++"],"content":"webmをエンコードするWebAssemblyライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"facebookincubator/fbt: A JavaScript Internationalization Framework","url":"https://github.com/facebookincubator/fbt","tags":["JavaScript","u18","library","babel"],"content":"Facebookのi18n JavaScriptフレームワーク。\nソースコードからフレーズの収集、翻訳ファイルの管理、関数やJSXでの翻訳表示、babelプラグインなどを持ったi18nフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"RunJS - Write and run JavaScript instantly","url":"https://projects.lukehaas.me/runjs/","tags":["mac","JavaScript","software","node.js"],"content":"JavaScriptを実行した結果をside by sideで表示できるmacOS向けのアプリ","relatedLinks":[]}]},{"meta":{"title":"JSer.info 8周年","author":"azu","layout":"post","date":"2019-01-16T03:03:00.000Z","category":"Article","tags":["JSer.info"],"url":"https://jser.info/2019/01/16/8-years/"},"items":[]},{"meta":{"title":"2019-01-16のJS: Storybook 4.1、TypeScriptへの段階的移行、2018年のスター数増加率","author":"azu","layout":"post","date":"2019-01-16T02:26:58.093Z","category":"JSer","tags":["storybook","typescript","github"],"url":"https://jser.info/2019/01/16/storybook-4.1typescript2018/"},"items":[{"category":"Headline","title":"Storybook 4.1: Need for Speed – Storybook – Medium","url":"https://medium.com/storybookjs/storybook-4-1-need-for-speed-b05fd5f1e83d","tags":["JavaScript","UI","library","ReleaseNote"],"content":"Storybook 4.1リリース。\nパフォーマンスの改善、React 15.xの後方互換性を追加、 CSS Resources addonの追加など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 73 | WebKit","url":"https://webkit.org/blog/8555/release-notes-for-safari-technology-preview-73/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 73リリース。\n`globalThis`のサポート、Web Inspectorでm3u8の中身をテキスト表示できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Video.js 7.4 | Video.js Blog","url":"https://blog.videojs.com/video-js-7-4/","tags":["JavaScript","video","library","ReleaseNote"],"content":"Video.js 7.4リリース。\nLive UIのサポート、VoiceOverの対応などアクセシビリティの改善など","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · juliangarnier/anime","url":"https://github.com/juliangarnier/anime/releases/tag/v3.0.0","tags":["JavaScript","animation","library","ReleaseNote"],"content":"アニメーションライブラリのanime 3.0.0リリース。\n新しいイージング関数の追加、ライフサイクル系のコールバックを追加、keyframesシステムの刷新など。\n破壊的な変更点としてAPIが一部リネームされている","relatedLinks":[]},{"category":"Headline","title":"Release 1.1.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v1.1.0","tags":["JavaScript","testing","ReleaseNote"],"content":"AVA 1.1.0リリース。\n実行中のテストファイルのパスなどを取得できる`meta`オブジェクトの追加など","relatedLinks":[]},{"category":"Headline","title":"DoneJS 3","url":"https://www.bitovi.com/blog/donejs-3","tags":["JavaScript","library","ReleaseNote"],"content":"DoneJS 3リリース。\nCanJS 5.0、StealJS 2.0へのアップデートなど","relatedLinks":[{"title":"CanJS 5.0","url":"https://www.bitovi.com/blog/canjs-5"},{"title":"donejs - Features","url":"https://donejs.com/Features.html#incremental-rendering"}]},{"category":"Article","title":"Babelで書かれたJavaScriptライブラリをTypeScriptへ移行する方法 | Web Scratch","url":"https://efcl.info/2019/01/09/babel-to-typescript-library/","tags":["JavaScript","babel","TypeScript","article","tutorial"],"content":"ライブラリのコードベースをTypeScriptへマイグレーションしていく方法について。\nBabelで行っていたES2015からの変換処理を`tsc`に移行し、コードベースをTypeScriptへと段階的に変換していくチュートリアル","relatedLinks":[]},{"category":"Article","title":"TypeScript 2.8: Conditional Types — Marius Schulz","url":"https://blog.mariusschulz.com/2019/01/09/typescript-2-8-conditional-types","tags":["TypeScript","article"],"content":"TypeScript 2.8で導入されたConditional Typesについて。\nConditional Typesを使った型の分岐処理について、さまざまなコード例を紹介している。\nNonNullable、Inferの利用例などについて","relatedLinks":[]},{"category":"Article","title":"Computer science in JavaScript 2019: Linked list - Human Who Codes","url":"https://humanwhocodes.com/blog/2019/01/computer-science-in-javascript-linked-list/","tags":["JavaScript","algorithm","article"],"content":"JavaScriptでLinkedListを実装しながら、そのデータ構造について学ぶ記事","relatedLinks":[]},{"category":"Article","title":"Vue + Vue Router + Vuex + Laravelで写真共有アプリを作ろう (1) イントロダクション | Hypertext Candy","url":"https://www.hypertextcandy.com/vue-laravel-tutorial-introduction","tags":["Vue","php","tutorial","article","JavaScript"],"content":"Vue.js + Vue Router + Laravelを使ったSPAアプリケーションを作成する連載記事。\n写真共有アプリを例にクライアントサイドとサーバサイドをどちらも作成していくチュートリアル","relatedLinks":[]},{"category":"Article","title":"How To Learn CSS — Smashing Magazine","url":"https://www.smashingmagazine.com/2019/01/how-to-learn-css/","tags":["CSS","article"],"content":"CSSをどのように学ぶかについての記事。\nSelector、Boxモデル、Flow、Layout、Aligment、SizingなどCSSの基礎となる要素について解説やリソースを紹介している","relatedLinks":[]},{"category":"Article","title":"Front-End Performance Checklist 2019 \\[PDF, Apple Pages, MS Word\\] — Smashing Magazine","url":"https://www.smashingmagazine.com/2019/01/front-end-performance-checklist-2019-pdf-pages/","tags":["performance","article","browser"],"content":"フロントエンドに関するパフォーマンスチェックリスト","relatedLinks":[]},{"category":"Article","title":"Fast GIF parsing on the web with WASM + Wuffs - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/chromiumdev/fast-gif-parsing-on-the-web-with-wasm--wuffs-48l4","tags":["WebAssembly","article"],"content":"GIFパースをEmscripten + WebAssemblyで行う話。\nどのようにbindingを作成し、デコード処理をして、Canvasで描画するかについて","relatedLinks":[{"title":"Emscripten and npm  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/01/emscripten-npm"}]},{"category":"WebsiteDocument","title":"2018 JavaScript Rising Stars","url":"https://risingstars.js.org/2018/en/","tags":["JavaScript","github"],"content":"JavaScript関係のプロダクトにおける、2018年のGitHubスター数の増加数ランキングが公開された","relatedLinks":[]},{"category":"WebsiteDocument","title":"Markdown Driven な scaffolding ツールを作った - wadackel.me","url":"https://blog.wadackel.me/2019/scaffdog/","tags":["Markdown","Tools","node.js"],"content":"Markdownの1ファイルに複数のファイルテンプレートを書いて、複数ファイルを出力できるファイル生成ツール","relatedLinks":[]},{"category":"WebsiteDocument","title":"FromJS - An experimental data-flow analysis tool for front-end JavaScript","url":"http://www.fromjs.com/","tags":["Chrome","DOM","Extension","babel","debug","Tools"],"content":"表示されている文字列がコードのどこで生成されているかをDOMインスペクトできるツール。\nHTMLを生成するDOM APIを上書きして、トレースできるようにしたChromeを立ち上げデバッグできるようにしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"DominicTobias/keshi: A better in-memory cache for Node and the browser","url":"https://github.com/DominicTobias/keshi","tags":["JavaScript","library"],"content":"ブラウザとNode.jsで動くインメモリキャッシュライブラリ","relatedLinks":[]}]},{"meta":{"title":"2019-01-22のJS: Node.js 11.7.0、Lighthouse 4.0.0、Flow to TypeScript","author":"azu","layout":"post","date":"2019-01-22T02:15:44.960Z","category":"JSer","tags":["Node.js","performance","flow","TypeScript"],"url":"https://jser.info/2019/01/22/node.js-11.7.0lighthouse-4.0.0flow-to-typescript/"},"items":[{"category":"Headline","title":"Release Workbox v4.0.0-beta.1 · GoogleChrome/workbox","url":"https://github.com/GoogleChrome/workbox/releases/tag/v4.0.0-beta.1","tags":["ServiceWorker","library","ReleaseNote"],"content":"Workbox 4.0.0β1リリース。\nウェブページで動作する`workbox-window`パッケージの追加、`workbox-cli`に`--watch`の追加など。\n破壊的な変更として`workbox-precaching`が書き直し、`skipWaiting`や`clientsClaim`が`workbox.core.*`へ移動するなど","relatedLinks":[]},{"category":"Headline","title":"The future of TypeScript on ESLint - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2019/01/future-typescript-eslint","tags":["TypeScript","ESLint","news"],"content":"ESLintのTypeScript対応の今後について。\ntypescript-eslintという統合されたプロジェクトで、TypeScriptのパーサやルールの開発を行っていく予定。","relatedLinks":[{"title":"typescript-eslint/typescript-eslint: Monorepo for all the tooling which enables ESLint to support TypeScript","url":"https://github.com/typescript-eslint/typescript-eslint"},{"title":"The Future of eslint-plugin-typescript · Issue #290 · bradzacher/eslint-plugin-typescript","url":"https://github.com/bradzacher/eslint-plugin-typescript/issues/290"}]},{"category":"Headline","title":"Node v11.7.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v11.7.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 11.7.0リリース。\n`zlib`モジュールがbrotliサポート、npm 6.5.0へアップデート、Workerがデフォルトで有効になるなど","relatedLinks":[{"title":"Node.jsの11.7.0からzlibモジュールでBrotli圧縮が使えるようになりました | WEB EGG","url":"https://blog.leko.jp/post/nodejs-is-now-supported-brotli-compression/"}]},{"category":"Headline","title":"Prettier 1.16: HTML improvements and better CRLF handling · Prettier","url":"https://prettier.io/blog/2019/01/20/1.16.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 1.16リリース。\nCRLFの対応改善、babel(js)のパーサをアップデート、テストに利用できる`--check`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Release 4.0.0 (2019-01-16) · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v4.0.0","tags":["Tools","ReleaseNote","browser","performance"],"content":"LightHouse 4.0.0リリース。\nPWAカテゴリを更新しスコア表示ではなくなった。`speed-index`がthrottlingに対応した倍率となるように変更、スコアで満点を取ったときの表示を追加など","relatedLinks":[]},{"category":"Headline","title":"7.3.0 Released: Named capturing groups, private instance accessors and smart pipelines · Babel","url":"https://babeljs.io/blog/2019/01/21/7.3.0","tags":["babel","ReleaseNote"],"content":"Babel 7.3.0リリース。\n`proposal-private-methods`がgetterをサポート、`proposal-pipeline-operator`で変換に対応、Named capturing groupsの対応など。\nTypeScript Parserがimport typeと`bigint`のサポートなど","relatedLinks":[]},{"category":"Article","title":"一休.comホテルページのスマホ版からjQuery依存を取り除くためにやったこと - 一休.com Developers Blog","url":"https://user-first.ikyu.co.jp/entry/goodbye-jquery","tags":["jQuery","JavaScript","refacoring"],"content":"jQuery依存を外すためのリファクタリング方法について。\njQueryと同等の機能の実装方法や外すことでのパフォーマンスの差異などについて。","relatedLinks":[]},{"category":"Article","title":"Web Page Usability Matters - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/addyosmani/web-page-usability-matters-3aok","tags":["browser","performance","article"],"content":"ウェブページのパフォーマンスを計測することにおける指標についての記事。\n多く4つのステップにわけ、その中で利用するメトリクスについて紹介している","relatedLinks":[]},{"category":"Article","title":"Porting 30K lines of code from Flow to TypeScript","url":"https://davidgom.es/porting-30k-lines-of-code-from-flow-to-typescript/","tags":["flowtype","TypeScript","article"],"content":"3万行のFlowのコードをTypeScriptへ移行した話。\n元々tcombによるRuntime CheckからFlowへ移行し、Babel 7 + TypeScript presetへ移行した話。\n`tsc`を型チェッカーとして利用し、どのようにFlowからTypeScriptへ移行していったかについて。\nまた移行した結果サードパーティの型定義の改善などから、型のカバレッジが向上した話など","relatedLinks":[{"title":"What I wish I had known before starting to use Flow","url":"https://davidgom.es/what-i-wish-i-had-known-before-starting-to-use-flow/"}]},{"category":"Article","title":"Callback を撲滅せよ - Yahoo! JAPAN Tech Blog","url":"https://techblog.yahoo.co.jp/javascript/nodejs/callback-to-promise/","tags":["node.js","JavaScript","Promises","article"],"content":"コールバックスタイルの非同期コードをPromiseのインターフェースに変更する際のスタイルについて。","relatedLinks":[]},{"category":"Article","title":"How to start a Node.js project | Phil Nash","url":"https://philna.sh/blog/2019/01/10/how-to-start-a-node-js-project/","tags":["node.js","npm","article"],"content":"npmで公開されているコマンドラインツールを使って、Node.jsプロジェクトのセットアップを簡単に行う話。 ライセンス、gitinore、CoCファイルの作成、pacakge.jsonの作成を行うコマンドの紹介","relatedLinks":[]},{"category":"SlideVideo","title":"雰囲気でやってる人向けの Redux 再入門 - Speaker Deck","url":"https://speakerdeck.com/jmblog/fen-wei-qi-deyatuteruren-xiang-kefalse-redux-zai-ru-men","tags":["JavaScript","redux","slide"],"content":"Reduxでのステート管理についてのスライド。\nStore/State、Actionとdispatch、Reducer、Middlewareのそれぞれの役割や動作の流れについて解説している。","relatedLinks":[]},{"category":"WebsiteDocument","title":"CSS Feature Toggles - Chrome ウェブストア","url":"https://chrome.google.com/webstore/detail/css-feature-toggles/aeinmfddnniiloadoappmdnffcbffnjg","tags":["CSS","Chrome","Extension"],"content":"CSSの特定の機能を無効化するブラウザ拡張機能。\nGrid、Flexbox、Sticky、Transform、Shapes、`@supports`などを無効化できる","relatedLinks":[{"title":"keithclark/css-feature-toggle-devtools-extension: A devtools extension for toggling CSS features allowing developers to see how pages/apps render in browsers that don't support modern CSS features","url":"https://github.com/keithclark/css-feature-toggle-devtools-extension"}]},{"category":"SoftwareLibrary","title":"npm/libnpm: programmatic npm API","url":"https://github.com/npm/libnpm","tags":["npm","library"],"content":"npm APIを操作できるライブラリ。\nパッケージやRegistry周りのAPI操作などが行える","relatedLinks":[]},{"category":"SoftwareLibrary","title":"wpk-cli/wpk: a friendly, intuitive, intelligent, and unofficial CLI for webpack","url":"https://github.com/wpk-cli/wpk","tags":["webpack","console","Tools"],"content":"webpackをラップしたCLI。\nwebpackの設定ファイルの作成や変更、ビルド、開発サーバの立ち上げ、`webpack-bundle-analyzer`を使ったbundleの解析などのコマンドを提供する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lukeed/sockette: The cutest little WebSocket wrapper! 🧦","url":"https://github.com/lukeed/sockette","tags":["WebSocket","library","JavaScript"],"content":"`WebSocket`を扱う小さなライブラリ。\n自動再接続やイベントハンドリングのAPIを提供しているライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"crubier/code-to-graph: Transforms JS code 🙈into mermaid flowchart 🐵","url":"https://github.com/crubier/code-to-graph","tags":["JavaScript","library","Tools","graphic"],"content":"JavaScriptのコードから制御フローをgraphviz, mermaid flowchartなどの作図へ変換するツール","relatedLinks":[]},{"category":"Book","title":"JavaScript コードレシピ集 | 池田 泰延, 鹿野 壮 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4297103680/","tags":["JavaScript","book"],"content":"2019年1月25日発売\nJavaScriptを使ったコード例を扱うレシピ本","relatedLinks":[]}]},{"meta":{"title":"2019-01-29のJS: Node.js 11.8.0(Policy機能)、Nuxt.js 2.4.0(TSサポート)、Yarn v2のロードマップ","author":"azu","layout":"post","date":"2019-01-29T01:47:59.820Z","category":"JSer","tags":["Node.js","Nuxt.js","Yarn"],"url":"https://jser.info/2019/01/29/node.js-11.8.0policynuxt.js-2.4.0tsyarn-v2/"},"items":[{"category":"Headline","title":"Announcing TypeScript 3.3 RC | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2019/01/23/announcing-typescript-3-3-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.3 RCリリース。\n関数呼び出しにおけるUnion Typesの扱いを改善、`--build --watch`でのインクリメンタルビルドを改善しビルド時間の改善など","relatedLinks":[]},{"category":"Headline","title":"GitLab NPM Registry | GitLab","url":"https://docs.gitlab.com/ee/user/project/packages/npm_registry.html","tags":["npm","webservice","news"],"content":"GitLab　Premiumがnpm registryをサポート","relatedLinks":[{"title":"GitLab 11.7 shipped with Releases, Multi-level Child Epics, and NPM Registry | GitLab","url":"https://about.gitlab.com/2019/01/22/gitlab-11-7-released/#support-for-private-go-packages-in-subgroups"}]},{"category":"Headline","title":"Release v4.0.0 · karma-runner/karma","url":"https://github.com/karma-runner/karma/releases/tag/v4.0.0","tags":["node.js","testing","ReleaseNote"],"content":"Karma v4.0.0リリース。\nコードベースでネイティブのasync/awaitを利用するために、Node 6のサポートを終了など","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0 · redux-saga/redux-saga","url":"https://github.com/redux-saga/redux-saga/releases/tag/v1.0.0","tags":["redux","library","ReleaseNote"],"content":"redux-saga v1.0.0リリース。\n破壊的な変更としてDeprecatedなAPIを削除、APIのデフォルト値の変更やオプションの変更など。\nまた、`babel-plugin-redux-saga`でスタックトレースの改善や不適切な使い方に対する警告表示の追加など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 74 | WebKit","url":"https://webkit.org/blog/8566/release-notes-for-safari-technology-preview-74/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 74リリース。\nFetch APIでabortするための`AbortController`のサポート、Visual Viewport APIの有効化、U2F HID Authenticationのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Yarn's Future - v2 and beyond · Issue #6953 · yarnpkg/yarn","url":"https://github.com/yarnpkg/yarn/issues/6953","tags":["yarn","issue","news"],"content":"Yarn 2.0のロードマップについて。\nlockファイルのフォーマット変更、PnPを新規インストール時にデフォルト化、コードベースをTypeScriptでの書き直し、プラグインのサポート、ワークスペース対応の改善、`yarn constraints`の追加など","relatedLinks":[]},{"category":"Headline","title":"Node v11.8.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v11.8.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 11.8.0リリース。\nSubresource IntegrityのようなPolicy機能が試験的に実装、node-reportモジュールを本体に取り込み`process.report`を試験的に実装など","relatedLinks":[{"title":"Policies | Node.js v11.8.0 Documentation","url":"https://nodejs.org/api/policy.html"},{"title":"Process | Node.js v11.8.0 Documentation","url":"https://nodejs.org/api/process.html#process_process_report"},{"title":"nodejs/node-report: Delivers a human-readable diagnostic summary, written to file.","url":"https://github.com/nodejs/node-report"}]},{"category":"Headline","title":"Jest 24: 💅 Refreshing, Polished, TypeScript-friendly · Jest","url":"https://jestjs.io/blog/2019/01/25/jest-24-refreshing-polished-typescript-friendly","tags":["JavaScript","testing","ReleaseNote"],"content":"Jest 24リリース。\n`@babel/preset-typescript`を使ってTypeScriptをサポート、`test.todo`の追加、エラー表示の改善など","relatedLinks":[]},{"category":"Headline","title":"Introducing Ionic 4: Ionic for Everyone | The Ionic Blog","url":"https://blog.ionicframework.com/introducing-ionic-4-ionic-for-everyone/","tags":["Angular","Vue","React","library","ReleaseNote"],"content":"Ionic 4リリース。\nAngular以外のフレームワークとしてReactとVueをサポート","relatedLinks":[]},{"category":"Headline","title":"Release 1.2.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v1.2.0","tags":["JavaScript","testing","ReleaseNote"],"content":"AVA 1.2.0リリース。\nテストケースごとにtimeoutを設定できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v2.4.0 · nuxt/nuxt.js","url":"https://github.com/nuxt/nuxt.js/releases/tag/v2.4.0","tags":["Vue","library","ReleaseNote","node.js"],"content":"Nuxt.js 2.4.0リリース。\nminor、major、EOLなどのリリース方針の決定。\n`nuxt-ts`によるTypeScriptサポート、`<nuxt-link>`がviewport内のprefetchをデフォルトで行うように、`bin`スクリプトの対応など","relatedLinks":[{"title":"Nuxt.js and TypeScript as of Jan 2019 – Hai-iro – Medium","url":"https://medium.com/haiiro-io/nuxt-js-and-typescript-as-of-jan-2019-4d8674a91815"},{"title":"nuxt.js/RELEASE","url":"https://github.com/nuxt/nuxt.js/blob/dev/RELEASE_PLAN.md"}]},{"category":"Headline","title":"Parsing of \\`import()\\` fails in 4.29.0 (Compilation issue, related to dynamic import) · Issue #8656 · webpack/webpack","url":"https://github.com/webpack/webpack/issues/8656","tags":["webpack","npm","issue"],"content":"webpack 4.29.0 + npmで`import()`が失敗する問題について。\nnpmがacorn + acorn-dynamic-importのpeerDependencyの関係を無視したhoistを行うバグにより、`import()`がパースできなくなる。yarnでは発生していない、npmに修正のPull Requestがでている。","relatedLinks":[{"title":"install/dedupe: fix hoisting of packages with peerDeps by sokra · Pull Request #147 · npm/cli","url":"https://github.com/npm/cli/pull/147"}]},{"category":"Article","title":"What's New In DevTools (Chrome 73)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/01/devtools","tags":["Chrome","debug","article"],"content":"Chrome 73のDevToolsの更新点について。\nLogpointsの追加、コードカバレッジをJSONとして出力できるように、コンソールパネルでキーボードナビゲーションに対応、Geolocationを設定できるようになるなど。\nまたWebSocketsの\"Frames\"を\"Messages\"にリネームなど","relatedLinks":[]},{"category":"Article","title":"lernaでのmonorepoにおけるリリースフロー(Fixed/Independent) | Web Scratch","url":"https://efcl.info/2019/01/26/monorepo-release-flow/","tags":["JavaScript","monorepo","article"],"content":"lernaを使ったmonorepoにおけるパッケージのリリースフローについて。\nlernaのmode(Fixed/Independent)のち外、monorepoでのpublishまでの流れ、Yarn Workspacesなどの利用についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"ericclemmons/polydev: Faster, route-centric development for Node.js apps with built-in Hot Module Replacement.","url":"https://github.com/ericclemmons/polydev","tags":["node.js","library","Development","yarn"],"content":"Next.jsのようなディレクトリとルーティングの対応構造をもつNode.jsフレームワーク。\nリクエストがくるまで必要ないPartは読み込まない、HMRに対応してファイルの変更をすぐに反映するなどイテレーションのしやすさを目的に作られている","relatedLinks":[]},{"category":"WebsiteDocument","title":"nuxt.js/RELEASE\\_PLAN.md at dev · nuxt/nuxt.js","url":"https://github.com/nuxt/nuxt.js/blob/dev/RELEASE_PLAN.md","tags":["Vue","library","document"],"content":"Nuxt.jsのリリース方針について。\nminorは4週ごと、majorは6ヶ月ごと、各majorバージョンにセキュリティアップデートがでなくなりEOLとなるのは1年と2週間後となる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"LiquidPlayer/LiquidCore: Node.js virtual machine for Android and iOS","url":"https://github.com/LiquidPlayer/LiquidCore","tags":["node.js","ios","Android","library"],"content":"AndroidとiOSアプリでNode.jsライムタイムを動かすライブラリ。\niOS向けにはV82JSC(JavaScript Core)のレイヤーを実装している","relatedLinks":[{"title":"LiquidCore/LiquidCoreiOS/LiquidCore/node-8.9.3 at master · LiquidPlayer/LiquidCore","url":"https://github.com/LiquidPlayer/LiquidCore/tree/master/LiquidCoreiOS/LiquidCore/node-8.9.3"}]},{"category":"SoftwareLibrary","title":"reduxjs/redux-starter-kit: A simple set of tools to make using Redux easier","url":"https://github.com/reduxjs/redux-starter-kit","tags":["redux","JavaScript","library"],"content":"Redux上に作られたフレームワーク。\nboilerplate codeを減らし、Reduxにおける一般的なユースケースをサポートするが目的。\nimmerを組み込んだReducerやActionの作成、selectorのサポートなど。","relatedLinks":[{"title":"Discussion: Roadmap to 1.0 · Issue #82 · reduxjs/redux-starter-kit","url":"https://github.com/reduxjs/redux-starter-kit/issues/82#issuecomment-456261368"}]},{"category":"SoftwareLibrary","title":"egoist/import-http: Import modules from URL instead of local node\\_modules","url":"https://github.com/egoist/import-http","tags":["webpack","JavaScript","plugin","module"],"content":"ブラウザやdenoのようにmoduleを`import m from \"https://\"`のように指定するためのwebpack, rollupプラグイン。\nモジュールのダウンロード、キャッシュ、import先の書き換えを行う。","relatedLinks":[]}]},{"meta":{"title":"2019-02-05のJS: Firefox 65(WebP)、Safari 12.1(リリース候補)、ECMAScript 2019の機能決定","author":"azu","layout":"post","date":"2019-02-05T00:35:02.073Z","category":"JSer","tags":["firefox","safari","ECMAScript"],"url":"https://jser.info/2019/02/05/firefox-65webpsafari-12.1ecmascript-2019/"},"items":[{"category":"Headline","title":"Firefox 65.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/65.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 65.0リリース。\nCSS `env()`のサポート、`Intl.RelativeTimeFormat`/`globalThis`の実装、Storage Access API/Readable Streamsをデフォルトで有効化。\nWebSocketsのHTTP/2対応、WebP画像のサポートなど","relatedLinks":[{"title":"Firefox 65 for developers | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/65"},{"title":"Firefox 65 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/versions/65/"},{"title":"Firefox 65: WebP support, Flexbox Inspector, new tooling & platform updates - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2019/01/firefox-65-webp-flexbox-inspector-new-tooling/"}]},{"category":"Headline","title":"Release v2.0.0 · facebook/relay","url":"https://github.com/facebook/relay/releases/tag/v2.0.0","tags":["GraphQL","React","ReleaseNote","library"],"content":"GraphQL + ReactライブラリのRepay v2.0.0リリース。\nReactの新しいContext APIに対応、依存の更新、`replay-compiler`がPersisted Queriesのサポートなど","relatedLinks":[{"title":"Persisted Queries · Relay","url":"https://facebook.github.io/relay/docs/en/persisted-queries.html"}]},{"category":"Headline","title":"New in Chrome 72  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/01/nic72","tags":["Chrome","ReleaseNote"],"content":"Chrome 72リリース。\nPublic class fields、User Activation API、`Intl.format`のサポートなど。\nまたHPKPの削除、TLS 1.0と1.1を非推奨化など","relatedLinks":[{"title":"Chromium Blog: Chrome 72 Beta: Public class fields, user activation and more","url":"https://blog.chromium.org/2018/12/chrome-72-beta-public-class-fields-user.html"},{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features#browsers.chrome.desktop%3D72"},{"title":"Deprecations and removals in Chrome 72  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/12/chrome-72-deps-rems"}]},{"category":"Headline","title":"Safari 12.1 Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safari_release_notes/safari_12_1_release_notes","tags":["safari","ReleaseNote"],"content":"Safari 12.1のリリースノート(iOS 12.2/macOS 10.14.4の予定)。\nITPの強化、color schemeのサポート、Intersection Observer API、Web Share API、`<datalist>`のサポート。\nWebRTC Unified PlanとVP8サポートなど","relatedLinks":[{"title":"Ricky Mondelloによる解説","url":"https://twitter.com/rmondello/status/1091073294202269696"}]},{"category":"Headline","title":"Announcing TypeScript 3.3 | TypeScript","url":"https://blogs.msdn.microsoft.com/typescript/2019/01/31/announcing-typescript-3-3/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.3リリース。\n関数呼び出しにおけるUnion Typeの扱いを改善、`--build`の`--watch`でインクリメンタルビルドをサポートなど","relatedLinks":[{"title":"TypeScript v3.3.0-rc 変更点 - Qiita","url":"https://qiita.com/vvakame/items/dadc91f0be6fc00085ae"}]},{"category":"Headline","title":"Type Safe JavaScript with JSDoc – TruckJS – Medium","url":"https://medium.com/@trukrs/type-safe-javascript-with-jsdoc-7a2a63209b76","tags":["JavaScript","JSDoc","TypeScript","VSCode"],"content":"JSDocと`jsconfig.json`での型チェックについて。\n`tsc`の`checkJS`機能を使ってJavaScriptのままJSDocの型チェック行う話","relatedLinks":[]},{"category":"Headline","title":"\\[ES2019\\] ECMAScript proposal updates @ 2019-01 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2019/02/03/ecmascript-proposal-updates","tags":["ECMAScript","proposal","news"],"content":"2019年1月のTC39ミーティングでのECMAScript Proposalの更新まとめ。\n今回のミーティングまでにStage 4となったものがES2019となる。","relatedLinks":[{"title":"proposals/finished-proposals.md at master · tc39/proposals","url":"https://github.com/tc39/proposals/blob/master/finished-proposals.md"},{"title":"ECMAScript 2019: the final feature set","url":"http://2ality.com/2018/02/ecmascript-2019.html"}]},{"category":"Article","title":"Code-splitting for libraries—bundling for npm with Rollup 1.0","url":"https://levelup.gitconnected.com/code-splitting-for-libraries-bundling-for-npm-with-rollup-1-0-2522c7437697","tags":["JavaScript","npm","article"],"content":"Rollupを使ってどのようにライブラリをbundleするかやnpmに公開するかについて。\numd、esm、cjs形式での配布について","relatedLinks":[]},{"category":"Article","title":"ECMAScript 2019: the final feature set","url":"http://2ality.com/2018/02/ecmascript-2019.html","tags":["ECMAScript","proposal","article"],"content":"ECMAScript 2019の入る機能が1月のTC39ミーティングで最終決定された。","relatedLinks":[{"title":"proposals/finished-proposals.md at master · tc39/proposals","url":"https://github.com/tc39/proposals/blob/master/finished-proposals.md"}]},{"category":"Article","title":"RTCQuicTransport Coming to an Origin Trial Near You (Chrome 73)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/01/rtcquictransport-api","tags":["WebRTC","QUIC","Chrome","article"],"content":"Chrome 73でQUICでの接続してデータのやりとりをするAPIである`RTCQuicTransport`のOrigin Trialが開始された。\nWebRTC NV(Next Version)への取り組みとして、UDP上のQUICを使ったLow Level APIの策定が目的。","relatedLinks":[{"title":"shampson/RTCQuicTransport-Origin-Trial-Documentation: Documentation and demos for developers using the RTCQuicTransport in Chrome's origin trial.","url":"https://github.com/shampson/RTCQuicTransport-Origin-Trial-Documentation"},{"title":"WebRTC over QUIC – V – Medium","url":"https://medium.com/@voluntas/webrtc-over-quic-d65425230ef"}]},{"category":"Article","title":"Severe Security Vulnerability in Bower’s Zip Archive Extraction | Snyk","url":"https://snyk.io/blog/severe-security-vulnerability-in-bowers-zip-archive-extraction/","tags":["JavaScript","security","article","ReleaseNote"],"content":"Bowerのzip/tarの解凍処理に脆弱性があり修正バージョンとしてBower 1.8.8がリリースされた。","relatedLinks":[{"title":"Release v1.8.8 · bower/bower","url":"https://github.com/bower/bower/releases/tag/v1.8.8"}]},{"category":"SlideVideo","title":"Chrome University 2018 - YouTube","url":"https://www.youtube.com/playlist?list=PL9ioqAuyl6UIFAdsM5KU6P-hRJdh-BPmm","tags":["Chrome","video"],"content":"ChromeとChrome OSのアーキテクチャについての発表動画まとめ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ungap","url":"https://ungap.github.io/","tags":["JavaScript","polyfill","library"],"content":"ECMAScriptやDOM APIに関するES5互換なPolyfillをまとめるプロジェクト。\nそれぞれのpolyfillがモジュールとして利用でき、1つのOrganizationとして管理するのが目的","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nextapps-de/flexsearch: Next-Generation full text search library for Browser and Node.js","url":"https://github.com/nextapps-de/flexsearch","tags":["JavaScript","search ","library"],"content":"ブラウザとNode.jsで動く全文検索エンジンライブラリ。\nWebWorkerの対応や検索モードのオプションが用意されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lukeed/httpie: A Node.js HTTP client as easy as pie! 🥧","url":"https://github.com/lukeed/httpie","tags":["node.js","JavaScript","library"],"content":"Node.js向けのシンプルなPromise HTTPライブラリ。\nNodeコアモジュールのみを利用している。","relatedLinks":[]},{"category":"Book","title":"Chrome Developer Tools 入門 | 電子書籍とプリントオンデマンド（POD） | NextPublishing（ネクストパブリッシング）","url":"https://nextpublishing.jp/book/10430.html","tags":["Chrome","debug","book"],"content":"2019年2月1日発売\nChrome Developer Toolsについての書籍","relatedLinks":[]}]},{"meta":{"title":"2019-02-12のJS: Vue 2.6(v-slot)、React 16.8(Hooks)、Next.js 8(serverless)","author":"azu","layout":"post","date":"2019-02-12T00:10:22.571Z","category":"JSer","tags":["Vue","React","next.js"],"url":"https://jser.info/2019/02/12/vue-2.6v-slotreact-16.8hooksnext.js-8serverless/"},"items":[{"category":"Headline","title":"Lightning-fast templates & Web Components: lit-html & LitElement - Polymer Project","url":"https://www.polymer-project.org/blog/2019-02-05-lit-element-and-lit-html-release","tags":["WebComponents","JavaScript","library","ReleaseNote"],"content":"lit-html 1.0とLitElement 2.0リリース。\nlit-htmlはTagged Templateを使ったHTMLテンプレート、LitElementはWeb Componentベースのクラスライブラリ","relatedLinks":[{"title":"Lightning-fast templates & Web Components: lit-html & LitElement  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/02/lit-element-and-lit-html"}]},{"category":"Headline","title":"Vue 2.6 released! – The Vue Point – Medium","url":"https://medium.com/the-vue-point/vue-2-6-released-66aa6c8e785e","tags":["Vue","ReleaseNote"],"content":"Vue 2.6リリース。\n`v-slot`ディレクティブの追加、Dynamic Directive Argumentsのサポート。\nライフサイクルhookがRejectedなPromiseを返した場合にエラーハンドリングできるように、コンパイルエラー表示の改善。\nまたes module版がパッケージに含まれるように","relatedLinks":[]},{"category":"Headline","title":"React v16.8: The One With Hooks – React Blog","url":"https://reactjs.org/blog/2019/02/06/react-v16.8.0.html","tags":["React","ReleaseNote"],"content":"React 16.8リリース。\nHooksがデフォルトで有効化された。\nまたHooksのテスト向けに`ReactTestUtils.act()`が追加された。","relatedLinks":[]},{"category":"Headline","title":"New Release: 2.10.0","url":"https://jshint.com/blog/2019-02-05/release-2-10-0/","tags":["JavaScript","Tools","ReleaseNote"],"content":"JSHint 2.10.0リリース。\n`esversion`オプションを追加し`7`,`8`,`9`を指定できるように。\nasync functionなどの構文をサポート","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 73 Beta: Constructable stylesheets, a new RegExp function, and passive mouse events","url":"https://blog.chromium.org/2019/02/chrome-73-beta-constructable.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 73 Betaリリース。\nCSSOMを操作するConstructable Stylesheet Objectsのサポート、String#matchAllのサポート、`::part`のサポート。\n`wheel`イベントがデフォルトで`passive`となるように変更など","relatedLinks":[{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features#milestone%3D73"},{"title":"WICG/construct-stylesheets: API for constructing CSS stylesheet objects","url":"https://github.com/WICG/construct-stylesheets"}]},{"category":"Headline","title":"Release v7.0.0 · h5bp/html5-boilerplate","url":"https://github.com/h5bp/html5-boilerplate/releases/tag/v7.0.0","tags":["HTML5","template","ReleaseNote"],"content":"ウェブページのテンプレートプロジェクトのhtml5-boilerplate 7.0.0リリース。\nIE9/10に関する記述を削除、`theme-color`のmetaタグを追加、`secutiry.txt`についてを追加など","relatedLinks":[{"title":"v7.0 Docs Update by coliff · Pull Request #2074 · h5bp/html5-boilerplate","url":"https://github.com/h5bp/html5-boilerplate/pull/2074"}]},{"category":"Headline","title":"TestCafe v1.0.0 Released | TestCafe","url":"https://devexpress.github.io/testcafe/blog/testcafe-v1-0-0-released.html","tags":["testing","JavaScript","library","ReleaseNote"],"content":"TestCafe 1.0.0リリース。\nテストの実行を動画として録画できるように、`.testcaferc.json`の設定ファイルを追加、Live modeの統合、型定義ファイルの追加など","relatedLinks":[{"title":"Migration from TestCafe v0.x.y to v1.0.0 | TestCafe","url":"https://devexpress.github.io/testcafe/blog/migration-from-testcafe-v0-x-y-to-v1-0-0.html"}]},{"category":"Headline","title":"Blog - Next.js 8 | Next.js","url":"https://nextjs.org/blog/next-8","tags":["React","library","ReleaseNote"],"content":"Next.js 8リリース。\nServerlessモードの追加、ビルド時のメモリ使用量改善、`env`で環境変数を定義できるように、出力するHTMLファイルサイズの改善。\n`<Head>`コンポーネントの重複の解決、`crossOrigin`オプションの追加、CSP対応など","relatedLinks":[]},{"category":"Headline","title":"Introducing swc 1.0 · swc","url":"https://swc-project.github.io/blog/2019/02/08/Introducing-swc-1.0","tags":["Rust","bundler","ReleaseNote","JavaScript"],"content":"Rust製のJavaScript Transpiler/Compilerのswc 1.0リリース。\nECMAScript 2019、JSX、TypeScriptサポートなど","relatedLinks":[{"title":"swc-project/swc: Super-fast javascript to javascript compiler written in rust","url":"https://github.com/swc-project/swc"}]},{"category":"Headline","title":"What’s next for SemVer","url":"https://words.steveklabnik.com/what-s-next-for-semver","tags":["news"],"content":"SemVerプロジェクトにnpmやCargoなどのパッケージ管理ツールの人中心のGitHub Teamが作成され、RFCプロセスでの運用が開始されたという話","relatedLinks":[{"title":"SemVer’s New Maintainers | You’ve Been Haacked","url":"https://haacked.com/archive/2019/02/11/semver-collective/"}]},{"category":"Article","title":"Making wheel scrolling fast by default  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/02/scrolling-intervention","tags":["Chrome","JavaScript","article"],"content":"Chrome 73から`wheel`イベントがデフォルトで`{ passive: true }`となる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Webpack bundle analysis, for every commit","url":"https://packtracker.io/","tags":["webpack","webservice","github","CI"],"content":"webpackのbundleサイズの分析を行うウェブサービス。\nGitHub Checkに対応してコミットごとのbundleサイズやハッシュの変更によるキャッシュヒットの有無などをビジュアライズできる。\nOSSプロジェクトでは無料で利用できる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"pikapkg/pack: 📦⚡️ npm package building, reimagined. https://www.pikapkg.com/blog/introducing-pika-pack/","url":"https://github.com/pikapkg/pack","tags":["npm","bundler","Tools"],"content":"npmパッケージ公開向けにNodeやブラウザ、moduleなど様々な種類に向けたライブラリのビルドを行うbundleツール。\nそれぞれのビルド設定はプラグインになっており、必要なものをパイプラインに定義してまとめてビルドできる。","relatedLinks":[{"title":"Pika | Introducing: @pika/pack","url":"https://www.pikapkg.com/blog/introducing-pika-pack/"}]},{"category":"SoftwareLibrary","title":"notion-cli/notion: Notion: the hassle-free JavaScript toolchain manager","url":"https://github.com/notion-cli/notion","tags":["Rust","node.js","npm","yarn","console","Tools"],"content":"Rust製のNode.jsバージョン管理ツール。\nプロジェクトごとにNodeバージョンを切り替える仕組みやnpmで公開されているコマンドラインツールをインストールして利用する仕組みなどを持っている","relatedLinks":[]}]},{"meta":{"title":"2019-02-19のJS: Mocha 6.0.0、Fly(Edge Applications)、サードパーティJavaScriptの実行コスト","author":"azu","layout":"post","date":"2019-02-19T00:34:08.205Z","category":"JSer","tags":["mocha","cdn","JavaScript"],"url":"https://jser.info/2019/02/19/mocha-6.0.0flyedge-applicationsjavascript/"},"items":[{"category":"Headline","title":"Bootstrap 4.3.0 | Bootstrap Blog","url":"https://blog.getbootstrap.com/2019/02/11/bootstrap-4-3-0/","tags":["CSS","ReleaseNote"],"content":"Bootstrap 4.3.0リリース。\n`.stretched-link`、`.text-break`、`.rounded-sm`、`.modal-dialog-scrollable`、`.list-group-horizontal`のクラスの追加など","relatedLinks":[]},{"category":"Headline","title":"Release: npm@6.8.0 - 📣 announcements - npm forum","url":"https://npm.community/t/release-npm-6-8-0/5352","tags":["npm","ReleaseNote"],"content":"npm 6.8.0リリース。\nmonorepo対応として`repository`フィールドの`directory`プロパティでのパッケージディレクトリの指定についてのドキュメントを追加など","relatedLinks":[]},{"category":"Headline","title":"Node v11.10.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v11.10.0/","tags":["node.js","ReleaseNote"],"content":"Node v11.10.0リリース。\nnpm 6.7.0を同梱するように、`perf_hooks`にhistogramベースのAPIを追加、`tls`モジュールのクライアントに`session`イベントを追加など","relatedLinks":[]},{"category":"Headline","title":"Release v1.2.0 · rollup/rollup","url":"https://github.com/rollup/rollup/releases/tag/v1.2.0","tags":["JavaScript","bundler","ReleaseNote"],"content":"Rollup 1.2.0リリース。\nHoisting時に変数名を衝突しないようにするためのリネームロジックを再実装、configファイルをCJSとしてexportしてもエラーとならないように修正など","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0 · mochajs/mocha","url":"https://github.com/mochajs/mocha/releases/tag/v6.0.0","tags":["node.js","testing","ReleaseNote"],"content":"Mocha 6.0.0リリース。\nNode.js 4のサポート終了、非推奨のコマンドラインオプションを削除、`Mocha.unloadFile`の追加、RCファイルでの設定をサポートなど","relatedLinks":[]},{"category":"Article","title":"Replacing a hot path in your app's JavaScript with WebAssembly  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/02/hotpath-with-wasm","tags":["WebAssembly","article","JavaScript"],"content":"処理速度が重要な部分だけをwasmで書くという話。\nJavaScript、C、AssemblyScript、Rustの比較","relatedLinks":[]},{"category":"Article","title":"Trusted Types help prevent Cross-Site Scripting  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/02/trusted-types","tags":["Chrome","XSS","HTML","JavaScript","article"],"content":"Chrome 73でTrusted Typesがフラグ付きで実装され、76までOrigin Trialとして試せる。\nTrustTypesはXSSのsinkとなる部分をポリシーでチェックする。\nポリシーに一致しない場合はエラーに落とすことで回避するAPIと仕組み","relatedLinks":[]},{"category":"Article","title":"Constructable Stylesheets: seamless reusable styles  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/02/constructable-stylesheets","tags":["CSS","JavaScript","article"],"content":"Chrome 73で実装されたConstructable Stylesheetsについて。\n共有できるCSSオブジェクトを作成して複数のShadow RootsやDocumentに対して当てられるAPI。","relatedLinks":[]},{"category":"Article","title":"Rendering on the Web  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/02/rendering-on-the-web","tags":["JavaScript","browser","performance","article","ServiceWorker"],"content":"CSR(クライアントサイドレンダリング)からSSR(サーバサイドレンダリング)などのウェブサイトのレンダリング手法やそれぞれの利点や欠点などをまとめた記事。\nまたService Workerを前提としたTrisomorphic Renderingについてなど","relatedLinks":[]},{"category":"SlideVideo","title":"cerebral/overmind: Overmind - Frictionless state management","url":"https://github.com/cerebral/overmind","tags":["JavaScript","library","React","Vue","Angular","TypeScript"],"content":"ステート管理ライブラリ。\n副作用をeffectsとして実装し、actionを発行して、Proxyを使ったStateの変更検知してViewの更新を行う。\nReact、Vue、Angularに対応したバインディングと開発者ツールが用意されている。","relatedLinks":[{"title":"Overmind - Frictionless state management","url":"https://overmindjs.org"},{"title":"Overmind introduction - YouTube","url":"https://www.youtube.com/watch?v=82Aq_ujnBQw"}]},{"category":"WebsiteDocument","title":"patrickhulce/third-party-web: Summary of which third party scripts are most responsible for excessive JavaScript execution on the web.","url":"https://github.com/patrickhulce/third-party-web","tags":["performance","browser","JavaScript"],"content":"HTTP Archiveのデータを元にしたウェブサイトにおけるサードパーティスクリプトの実行コストについての調査結果。\n広告、アクセス解析、SNS、動画などの項目別に利用数や実行にかかった平均の時間などのまとめ。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Fly · Edge Applications","url":"https://fly.io/","tags":["JavaScript","cdn","webservice","V8"],"content":"Edge ApplicationをJavaScriptで書けるCDNサービス。\nOSSで公開されているfly runtimeを使いLB、Cache、TLS、Networkに関する処理をEdgeで行える。\nService Worker互換のAPIも用意されていて、ローカルでもserverを立ててテストできるようになっている。","relatedLinks":[{"title":"superfly/fly: Fly is an edge application runtime that makes it easy to build CDNs","url":"https://github.com/superfly/fly"}]},{"category":"SoftwareLibrary","title":"postlight/mercury-parser: 📜 Extracting content from the chaos of the web.","url":"https://github.com/postlight/mercury-parser","tags":["JavaScript","library"],"content":"ウェブサイトからメタデータやメインコンテンツを抽出するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"transloadit/uppy: The next open source file uploader for web browsers","url":"https://github.com/transloadit/uppy","tags":["JavaScript","library"],"content":"プラグインで拡張できるファイルアップロードライブラリ。\nUI、ローカルやリモートからのリソースの取得やアップロード先などをプラグインで指定できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"modernserf/zebu: A compiler for little languages in tagged template strings","url":"https://github.com/modernserf/zebu","tags":["JavaScript","library","document"],"content":"tagged template literalを使いミニ言語を作成するライブラリ。 構文を定義して、それを扱うtagged funcitonを作成する。","relatedLinks":[]}]},{"meta":{"title":"2019-02-26のJS: yarn v2候補(berry)、Fastify v2、TSLintの今後","author":"azu","layout":"post","date":"2019-02-26T02:02:23.716Z","category":"JSer","tags":["yarn","node","typescript","eslint","tslint"],"url":"https://jser.info/2019/02/26/yarn-v2berryfastify-v2tslint/"},"items":[{"category":"Headline","title":"Release Version 3.5.0 · knockout/knockout","url":"https://github.com/knockout/knockout/releases/tag/v3.5.0","tags":["JavaScript","library","ReleaseNote"],"content":"Knockout 3.5.0リリース。\n`foreach`バインディングの挙動の変更とパフォーマンスの改善、`ko.when`がPromiseを返すようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release: npm@6.9.0-next.0 - 📣 announcements - npm forum","url":"https://npm.community/t/release-npm-6-9-0-next-0/5553","tags":["npm","ReleaseNote"],"content":"npm 6.9.0-next.0リリース。\nパッケージに別名をつけることができるpackage alias機能をサポート、`--before`オプションをサポートなど","relatedLinks":[{"title":"install: add support for package aliases by zkat · Pull Request #3 · npm/cli","url":"https://github.com/npm/cli/pull/3"}]},{"category":"Headline","title":"The npm Blog — Managing JavaScript in the Enterprise","url":"https://blog.npmjs.org/post/182958759735/managing-javascript-in-the-enterprise","tags":["npm","news"],"content":"npm Enterpriseの正式リリース。\nSSO認証の対応やprivate registryのサポートなど","relatedLinks":[{"title":"npm | Enterprise","url":"https://www.npmjs.com/products/enterprise"}]},{"category":"Headline","title":"dsherret/conditional-type-checks: Types for testing TypeScript types.","url":"https://github.com/dsherret/conditional-type-checks","tags":["TypeScript","library","testing"],"content":"Conditional Typeを使いTypeScriptの型Assertionを行うライブラリ","relatedLinks":[]},{"category":"Headline","title":"Fastify v2.0.0 is here – Fastify – Medium","url":"https://medium.com/@fastifyjs/fastify-v2-0-0-is-here-8275d613fba4","tags":["node.js","ReleaseNote","server"],"content":"Node.jsフレームワークのFastify 2.0.0リリース。\n`onError`、`preParsing`、`preSerialization`、`preValidation` hookの追加。\npluginのロードのタイムアウトを設定、シグネチャの一貫性の修正など","relatedLinks":[{"title":"Release v2.0.0 · fastify/fastify","url":"https://github.com/fastify/fastify/releases/tag/v2.0.0"}]},{"category":"Headline","title":"yarnpkg/berry: 📦🐈 A modern, fast, reliable, package manager; part of the Yarn organization","url":"https://github.com/yarnpkg/berry","tags":["yarn","news"],"content":"yarn v2となるソースコードのリポジトリが公開された。\nv1のリポジトリと分けているのは、issueをハンドリングしやすくするため。\n現在はロードマップに予定した機能はある程度実装された状態で、一部の機能やドキュメントが足りていない状況。","relatedLinks":[{"title":"Yarn's Future - v2 and beyond · Issue #6953 · yarnpkg/yarn","url":"https://github.com/yarnpkg/yarn/issues/6953#issuecomment-466589196"},{"title":"👑 Say hello to Yarn v2 · Issue #1 · yarnpkg/berry","url":"https://github.com/yarnpkg/berry/issues/1"}]},{"category":"Article","title":"AddyOsmani.com - JavaScript Loading Priorities in Chrome","url":"https://addyosmani.com/blog/script-priorities/","tags":["JavaScript","performance","browser","article"],"content":"link rel=preloadとscript要素の defer/async属性を組み合わせ際のLoadingやExecution Priorityについてまとめた記事","relatedLinks":[]},{"category":"Article","title":"How @supports Works | CSS-Tricks","url":"https://css-tricks.com/how-supports-works/","tags":["CSS","article"],"content":"CSSの`@supports`の使い方やユースケースについて。\nまた、JavaScriptからのCSS Supportsを使ったFeature Detectについて","relatedLinks":[]},{"category":"Article","title":"Intelligent Tracking Prevention 2.1 | WebKit","url":"https://webkit.org/blog/8613/intelligent-tracking-prevention-2-1/","tags":["safari","security","article"],"content":"Safari 12.1で導入されるITP 2.1について。 Partitioned Cookiesのサポート終了、document.cookieで作成したクッキーは生存期間が7日間のcapがつくように、DNTの削除など","relatedLinks":[]},{"category":"Article","title":"TSLint in 2019 – Palantir Blog – Medium","url":"https://medium.com/palantir/tslint-in-2019-1a144c2317a9","tags":["TypeScript","article","Tools"],"content":"TSLintの今後について。\n今後TSLintは非推奨となり、TSLintからESLintへの移行パスを整備していくという話","relatedLinks":[]},{"category":"WebsiteDocument","title":"React – A JavaScript library for building user interfaces","url":"https://ja.reactjs.org/","tags":["React","翻訳"],"content":"Reactサイトの日本語訳","relatedLinks":[{"title":"Is React Translated Yet? ¡Sí! Sim! はい！ – React Blog","url":"https://reactjs.org/blog/2019/02/23/is-react-translated-yet.html"}]},{"category":"SoftwareLibrary","title":"patr0nus/DeskGap: A cross-platform desktop app framework based on Node.js and the system webview","url":"https://github.com/patr0nus/DeskGap/","tags":["node.js","mac","windows","Electron"],"content":"OSのWebViewの仕組みを利用したElectronライクなデスクトップアプリ作成フレームワーク。\nChromiumなどをbundleしないが、Node.jsをbundleしている。\nフレームワーク上では制限されたElectronライクなAPIとNode.jsの機能が利用できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"klaussinani/qoa: 💬 Minimal interactive command-line prompts","url":"https://github.com/klaussinani/qoa","tags":["node.js","library","console","UI"],"content":"ターミナルで対話的なインタフェースを提供するNode.jsライブラリ。\nConfirm、Quiz、Secure Promptなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jariazavalverde/tau-prolog: An open source Prolog interpreter in JavaScript","url":"https://github.com/jariazavalverde/tau-prolog","tags":["JavaScript","program","library"],"content":"PrologインタプリタのJavaScript実装","relatedLinks":[]},{"category":"SoftwareLibrary","title":"fagbokforlaget/simple-fs: Handles files on indexeddb like you would do in node.js (promise)","url":"https://github.com/fagbokforlaget/simple-fs","tags":["browser","JavaScript","library"],"content":"IndexedDBを使ったファイルシステムライクなAPIを持ったブラウザ向けライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"namics/webpack-config-plugins: Provide best practices for webpack loader configurations","url":"https://github.com/namics/webpack-config-plugins","tags":["webpack","設定"],"content":"webpackのloader設定をまとめたプラグイン。\nBabel、TypeScript、Sass、Font、Imageなどのビルドを行うプラグインが用意されている","relatedLinks":[]}]},{"meta":{"title":"2019-03-05のJS:Storybook 5.0.0、Preact X(αリリース)、ウェブサイトのサイズ(パーセンタイル) ","author":"azu","layout":"post","date":"2019-03-05T15:43:44.582Z","category":"JSer","tags":["storybook","preact","HTTPArchive"],"url":"https://jser.info/2019/03/06/storybook-5.0.0preact-xa/"},"items":[{"category":"Headline","title":"February 2019 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/february-2019-security-releases/","tags":["node.js","security","ReleaseNote"],"content":"Node.jsのセキュリティ修正リリース。Node.js LTS全部に対して修正がででている。\nkeep-alive系のDoSが2種(どちらもimpactはlow)とOpenSSL脆弱性(Node 10+は影響なし)の修正がされている。","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember 3.8 Released","url":"https://emberjs.com/blog/2019/02/27/ember-3-8-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember 3.8リリース。\nElement Modifier Managerの追加、Array helperの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · storybooks/storybook","url":"https://github.com/storybooks/storybook/releases/tag/v5.0.0","tags":["JavaScript","ReleaseNote","UI"],"content":"Storybook 5.0.0リリース。\nデザインとURL構造の変更、ショートカットの変更、webpackのカスタム設定の引数を変更など","relatedLinks":[{"title":"Storybook 5 Migration Guide – Storybook – Medium","url":"https://medium.com/storybookjs/storybook-5-migration-guide-d804b38c739d"},{"title":"Meet Storybook 5.0's new design – Storybook – Medium","url":"https://medium.com/storybookjs/meet-storybook-5-0s-new-design-fb5735bc2a81"},{"title":"Storybook 5.0 – Storybook – Medium","url":"https://medium.com/storybookjs/storybook-5-0-db1d0f9c83b8"}]},{"category":"Headline","title":"Release Preact X is here 🎉 · developit/preact","url":"https://github.com/developit/preact/releases/tag/10.0.0-alpha.0","tags":["React","library","ReleaseNote"],"content":"Preact X α版リリース。\n`Fragment`、`componentDidCatch`、Hooks、`createContext`、CSS Custom Propertiesに対応など。\nまた`preact-compat`を別パッケージではなく`preact/compat`として同梱するようになるなど","relatedLinks":[{"title":"This.JavaScript - State of Frameworks & Libraries - YouTube","url":"https://youtu.be/DFF9eOlTWzY?t=3988"}]},{"category":"Headline","title":"TestCafe v1.1.0 Released | TestCafe","url":"https://devexpress.github.io/testcafe/blog/testcafe-v1-1-0-released.html","tags":["testing","JavaScript","E2E","ReleaseNote"],"content":"TestCafe 1.1.0リリース。\nTypeScript 3.3サポート、TypeScriptの型改善など","relatedLinks":[]},{"category":"Article","title":"HTML Snapshot Testing with Node","url":"https://spin.atomicobject.com/2019/02/13/html-snapshot-testing-with-node/","tags":["JavaScript","article","testing"],"content":"HTMLのスナップショットを比較するスナップショットテストについての記事。\nスナップショットテストをどのように実装するかについて","relatedLinks":[]},{"category":"Article","title":"Progressive React","url":"https://houssein.me/progressive-react","tags":["React","article","performance"],"content":"Reactを中心にしたウェブアプリの改善についての話。\nReactレベルとアプリレベルでのパフォーマンスについて。\n`shouldComponentUpdate`での無駄なレンダリングの最小化、バンドルサイズとCode Splitting、キャッシュやSSRによる初期表示の改善、クリティカルパスの最適化などについて","relatedLinks":[]},{"category":"Article","title":"webpackとBabelの基本を理解する(1) ―webpack編― - Qiita","url":"https://qiita.com/koedamon/items/3e64612d22f3473f36a4","tags":["webpack","babel","tutorial"],"content":"webpack、Babelの役割とその設定方法のチュートリアル","relatedLinks":[]},{"category":"WebsiteDocument","title":"Package Diff","url":"https://diff.intrinsic.com/","tags":["npm","webservice","library"],"content":"npmパッケージのバージョン同士のDiffを表示できるサービス","relatedLinks":[{"title":"Introducing Package Diff (for npm) – intrinsic – Medium","url":"https://medium.com/intrinsic/introducing-package-diff-for-npm-e6487cc9b434"}]},{"category":"SoftwareLibrary","title":"dyatko/arkit: Visualises JavaScript, TypeScript and Flow codebases as meaningful and committable architecture diagrams","url":"https://github.com/dyatko/arkit","tags":["JavaScript","Tools","SVG","UML"],"content":"アーキテクチャのダイアグラムをファイルから生成するツール。。\nコードベースのファイルを指定して、その構造をPlant UMLやSVGなどの図に変換してくれるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"autoNumeric/autoNumeric: autoNumeric is a standalone library that provides live as-you-type formatting for international numbers and currencies.","url":"https://github.com/autoNumeric/autoNumeric/","tags":["JavaScript","DOM","library"],"content":"通貨の入力を扱うライブラリ。\n既存の入力要素へバインディングして、通貨の入力に対するバリデーションや表示のフォーマットなどを行う","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pikapkg/web: Install npm dependencies that run directly in the browser. No Browserify, Webpack or import maps required.","url":"https://github.com/pikapkg/web","tags":["JavaScript","module","Development","Tools"],"content":"Rollupを使って既存モジュールをES Modulesに変換するツール。\n変換済みのmoduleはブラウザからES moduleとしてimportできる","relatedLinks":[]}]},{"meta":{"title":"2019-03-12のJS: TensorFlow.js 1.0、詳細Cache-Control、`JSON.stringify(-0)`","author":"azu","layout":"post","date":"2019-03-12T00:20:50.340Z","category":"JSer","tags":["TensorFlow","HTTP","JSON"],"url":"https://jser.info/2019/03/12/tensorflow.js-1.0cache-controljson.stringify-0/"},"items":[{"category":"Headline","title":"Release 1.0.0 · tensorflow/tfjs","url":"https://github.com/tensorflow/tfjs/releases/tag/v1.0.0","tags":["MachineLearning","library","JavaScript"],"content":"TensorFlow.js 1.0リリース。\nパフォーマンスの改善、`Tensor.array()`と `Tensor.arraySync()`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release: npm@6.9.0 - 📣 announcements - npm forum","url":"https://npm.community/t/release-npm-6-9-0/5911","tags":["npm","ReleaseNote"],"content":"npm 6.9.0リリース。\n指定した日付より前のバージョンをインストールする`--before`オプションの追加、パッケージ名をaliasしてインストールするpackage aliasのサポートなど","relatedLinks":[]},{"category":"Headline","title":"rmdm/rmgr: Release resources gracefully","url":"https://github.com/rmdm/rmgr","tags":["JavaScript","library"],"content":"リソースを管理するライブラリ。\nリソースごとにinitializeとdispose時の処理を定義し、リソースの解放などを行うヘルパーライブラリ","relatedLinks":[]},{"category":"Headline","title":"Marble.js 2.0 🔥 — reactive, better, functional, stronger","url":"https://medium.com/@jflakus/marble-2-reactive-better-functional-stronger-5924119d3098","tags":["JavaScript","library","ReleaseNote"],"content":"RxJSを使ったNode.js向けのHTTPフレームワークであるMarble.js 2.0リリース。 WebSocketsの対応、Contextを使ったDIの対応、io-tsを使ったバリデーションの対応など","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at master · jsdom/jsdom","url":"https://github.com/jsdom/jsdom/blob/master/Changelog.md#1400","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"JSDOM 14.0.0リリース。\n`JSDOM.fragment()`がbrowsing contextを持たないframentsを作成するように変更、`element.blur()`のリグレッションの修正など","relatedLinks":[]},{"category":"Article","title":"Cache-Control for Civilians – CSS Wizardry – CSS Architecture, Web Performance Optimisation, and more, by Harry Roberts","url":"https://csswizardry.com/2019/03/cache-control-for-civilians/","tags":["HTTP","article"],"content":"`Cache-Control` HTTPヘッダについての解説記事。\n`public`、`private`、`max-age`、`no-store`、`no-cache`、`immutable`、`stale-while-revalidate`などそれぞれの項目の解説。\nまたCache Bustingの手法などについても書かれている","relatedLinks":[]},{"category":"Article","title":"JavaScript loose comparison (==) step by step","url":"https://felix-kling.de/js-loose-comparison/","tags":["ECMAScript","JavaScript","spec"],"content":"`==`がどのように値を比較するかをECMAScript仕様に定義されているアルゴリズムのステップごとにチェックするツール。","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 74)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/03/devtools","tags":["Chrome","debug","article"],"content":"Chrome 74の開発者ツールの変更点について。 CSS propertyの影響をハイライト、Lighthouse v4へアップデート、WebSocketのバイナリメッセージの表示対応。パフォーマンスパネルでLong taskを記録できるようになるなど。","relatedLinks":[]},{"category":"Article","title":"A Complete Guide to useEffect — Overreacted","url":"https://overreacted.io/a-complete-guide-to-useeffect/","tags":["React","article"],"content":"React Hooksの`useEffect`の動作や使い方、よくある質問について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Request Map Generator","url":"http://requestmap.webperf.tools/","tags":["webservice","performance","Tools"],"content":"指定したURLのリクエストの関係をマップ表示して可視化するツール。\nWebPageTestの結果を利用している","relatedLinks":[]},{"category":"WebsiteDocument","title":"twbs/rfs: Automated responsive font sizes","url":"https://github.com/twbs/rfs","tags":["CSS","library","PostCSS"],"content":"レスポンシブなフォントサイズを指定するCSS。\nSass、PostCSS、less、stylus版が用意されている","relatedLinks":[]},{"category":"WebsiteDocument","title":"Feature policy","url":"https://featurepolicy.info/","tags":["JavaScript","browser","example","document"],"content":"Feature Policyのデモサイト。 それぞれのポリシーのサポート状況やドキュメント、サンプルなどがまとめられている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Introduction · AnyProxy","url":"http://anyproxy.io/en/","tags":["node.js","proxy","Tools"],"content":"HTTPSやWebSocketなどに対応したローカルProxyツール。\nProxyしたログを閲覧するGUIもついている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jaames/iro.js: 🎨 Color wheel widget for JavaScript - with zero dependencies and a lovely SVG-based UI","url":"https://github.com/jaames/iro.js","tags":["SVG","color","library"],"content":"依存がないカラーピッカーライブラリ。SVGをベースにしたカラーピッカーUIを作成するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vladocar/femtoJS: femtoJS - Really small JavaScript (ES6) library for DOM manipulation.","url":"https://github.com/vladocar/femtoJS","tags":["JavaScript","jQuery","library"],"content":"一部のjQueryライクなDOM APIを提供するライブラリ。\nES2015+に対応したブラウザのみを対象にしている。","relatedLinks":[{"title":"vladocar/nanoJS: Minimal standalone JS library for DOM manipulation","url":"https://github.com/vladocar/nanoJS"}]}]},{"meta":{"title":"2019-03-18のJS: TypeScript 3.4 RC(readonly)、Node.js 11.12.0(`--frozen-intrinsic`)と実験的機能まとめ","author":"azu","layout":"post","date":"2019-03-18T23:34:25.280Z","category":"JSer","tags":["TypeScript","Node.js"],"url":"https://jser.info/2019/03/19/typescript-3.4-rcreadonlynode.js-11.12.0-frozen-intrinsic/"},"items":[{"category":"Headline","title":"New in Chrome 73  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/03/nic73","tags":["Chrome","ReleaseNote"],"content":"Chrome 73リリース。\nデスクトップ版でもPWAインストールの対応、Signed HTTP Exchanges、Constructable style sheetsのサポート、`String#matchAll`のサポート。\n`wheel`がデフォルトでPassiveに変更など","relatedLinks":[{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features#browsers.chrome.desktop%3D73"}]},{"category":"Headline","title":"TypeScript | Announcing TypeScript 3.4 RC","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-4-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.4 RCリリース。\nビルドの情報をファイルに保存して、次回の起動時にその情報で続けてビルドできる`--incremental`フラグの追加。\n`readonly`修飾子を配列とtupleに対して適応できるように、`const` assertionの追加、高階関数の型推論改善など","relatedLinks":[{"title":"Roadmap · Microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/Roadmap#34-march-2019"},{"title":"Breaking Changes · Microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/Breaking-Changes#typescript-34"},{"title":"TypeScript v3.4.0-rc 変更点 - Qiita","url":"https://qiita.com/vvakame/items/7f4a55fe15fc9bbe1a63"}]},{"category":"Headline","title":"Node v11.12.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v11.12.0/","tags":["node.js","JavaScript","ReleaseNote"],"content":"Node.js 11.12.0リリース。\n`Array`などのビルトインオブジェクトをデフォルトでfreezeする`--frozen-intrinsics`フラグを実験的に追加など","relatedLinks":[]},{"category":"Headline","title":"CKEditor 5 v12.0.0 with inline widgets and distraction free editor released","url":"https://ckeditor.com/blog/CKEditor-5-v12.0.0-with-inline-widgets-and-distraction-free-editor-released/","tags":["JavaScript","editor","library","ReleaseNote"],"content":"CKEditor 5 v12.0.0リリース。\nInline widgets、placeholderの対応、TableにMediaを埋め込めるように、inspector機能を持つデバッグモジュールの公開など","relatedLinks":[]},{"category":"Headline","title":"Releasing React Native 0.59 · React Native","url":"https://facebook.github.io/react-native/blog/2019/03/12/releasing-react-native-059","tags":["React","ios","andoi","ReleaseNote"],"content":"React Native 0.59リリース。\nHooksの対応、JavaScriptCoreをアップデートし、64 bitサポートなど。一部のコアコンポーネントを外部ライブラリ化など","relatedLinks":[]},{"category":"Article","title":"手元のコードのパフォーマンスを計測するperformance.markのスニペット | Web Scratch","url":"https://efcl.info/2019/03/14/performance-snnipet/","tags":["JavaScript","performance","article"],"content":"`performance.mark`を使った特定のコードの処理時間や関連データを記録するスニペットについて。\n記録の計測とデータの収集を分けて行うことについて","relatedLinks":[]},{"category":"Article","title":"A Complete React Redux Tutorial for 2019","url":"https://daveceddia.com/redux-tutorial/","tags":["redux","JavaScript","tutorial"],"content":"Reduxについてのチュートリアル。\nステートの管理方法、ActionのDispatch方法やその動き、Reactと一緒に使う方法などについて","relatedLinks":[]},{"category":"Article","title":"Node.js and Express Tutorial: Building and Securing RESTful APIs","url":"https://auth0.com/blog/node-js-and-express-tutorial-building-and-securing-restful-apis/","tags":["node.js","tutorial","API","article"],"content":"Node.jsとExpressを使ってRest APIを作成するチュートリアル。\nAuth0を使ったjwt対応など","relatedLinks":[]},{"category":"Article","title":"On the Road to WebRTC 1.0, Including VP8 | WebKit","url":"https://webkit.org/blog/8672/on-the-road-to-webrtc-1-0-including-vp8/","tags":["WebRTC","article","safari"],"content":"Safari 12.1のWebRTC対応更新について。\nVP8コーデック、Simulcast、Unified Planの対応など。\nScreen capture APIの実験的サポート、古いWebRTC APIの非推奨化など","relatedLinks":[]},{"category":"Article","title":"Update on Experimental Features in Node.js - NodeSource","url":"https://nodesource.com/blog/experimental-features-in-node.js","tags":["node.js","article"],"content":"Node.jsの実験的な機能についての紹介記事。\nWorker Threads、Performance Hooks、Diagnostic Report、Policy、ECMAScript Modulesについて","relatedLinks":[]},{"category":"Article","title":"自社運営のWebアプリをPWA化した際にハマった話（OAuthなど） - APC 技術ブログ","url":"https://techblog.ap-com.co.jp/entry/2019/03/13/201027","tags":["safari","article","PWA","Android","Chrome"],"content":"AndroidとiOSでのPWA対応についての記事。\nホームスクリーンアプリにすると動かなくなった機能とその対処法などについて","relatedLinks":[]},{"category":"SlideVideo","title":"Yahoo!ニュースにおけるBFFパフォーマンスチューニング事例","url":"https://www.slideshare.net/techblogyahoo/yahoobff","tags":["node.js","performance","slide"],"content":"Node.jsのサーバアプリ処理のボトルネックの調査方法やベンチマークのとり方、アプローチなどについてのスライド","relatedLinks":[]},{"category":"SoftwareLibrary","title":"aruneko/WebUSB-MyNumberCard","url":"https://github.com/aruneko/WebUSB-MyNumberCard","tags":["JavaScript","library"],"content":"WebUSBを使ったマイナンバーカードのドライバ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sindresorhus/type-fest: A collection of essential TypeScript types","url":"https://github.com/sindresorhus/type-fest","tags":["TypeScript","library"],"content":"TypeScriptの型コレクションライブラリ","relatedLinks":[]}]},{"meta":{"title":"2019-03-26のJS: Babel 7.4.0とcore-js 3.0.0リリース、Chrome 74 beta、GAS入門","author":"azu","layout":"post","date":"2019-03-26T02:18:18.720Z","category":"JSer","tags":["Babel","core-js","Chrome","GAS"],"url":"https://jser.info/2019/03/26/babel-7.4.0core-js-3.0.0chrome-74-betagas/"},"items":[{"category":"Headline","title":"Release v7.4.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v7.4.0","tags":["babel","JavaScript","ReleaseNote"],"content":"Babel v7.4.0リリース。\ncore-js v3にアップデート、Partial application Proposal、Private Static Class Methods Proposalのサポートなど","relatedLinks":[{"title":"Release 3.0.0 - 2019.03.19 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.0.0"}]},{"category":"Headline","title":"Release 3.0.0 - 2019.03.19 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.0.0","tags":["JavaScript","polyfill","library","ReleaseNote"],"content":"core-js 3.0.0リリース。\nECMAScript仕様への追従、Proposalの対応、DropされたProposalなどの機能を削除。\nまたパッケージを3つに分類(core-js,pure,bundle)、LiveScriptをJavaScriptに書き換えなど","relatedLinks":[{"title":"core-js@3, babel and a look into the future","url":"https://github.com/zloirock/core-js/blob/master/docs/2019-03-19-core-js-3-babel-and-a-look-into-the-future.md"},{"title":"core-js/CHANGELOG.md at master · zloirock/core-js","url":"https://github.com/zloirock/core-js/blob/master/CHANGELOG.md#300---20190319"}]},{"category":"Headline","title":"Firefox 66.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/66.0/releasenotes/","tags":["firefox","ReleaseNote"],"content":"Firefox 66.0リリース。\nメディアの自動再生がデフォルトでブロックされるように、Windows Helloの対応、AV1の有効化など。\nスクリーンシェアをする`getDisplayMedia` APIの対応、CSS Scroll Anchoringの対応、属性セレクタで大文字小文字を無視する`i`フラグをサポートなど","relatedLinks":[{"title":"Today’s Firefox Aims to Reduce Your Online Annoyances - The Mozilla Blog","url":"https://blog.mozilla.org/blog/2019/03/19/todays-firefox-aims-to-reduce-your-online-annoyances/#block-autoplay"},{"title":"Passwordless Web Authentication Support via Windows Hello | Mozilla Security Blog","url":"https://blog.mozilla.org/security/2019/03/19/passwordless-web-authentication-support-via-windows-hello/"},{"title":"AV1 is a royalty-free video compression format for the web","url":"https://research.mozilla.org/av1-media-codecs/"},{"title":"Firefox 66: The Sound of Silence – Mozilla Hacks – the Web developer blog","url":"https://hacks.mozilla.org/2019/03/firefox-66-the-sound-of-silence/"},{"title":"Firefox 66 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/docs/Mozilla/Firefox/Releases/66"}]},{"category":"Headline","title":"LLVM 8.0.0 Release Notes — LLVM 8 documentation","url":"http://releases.llvm.org/8.0.0/docs/ReleaseNotes.html#changes-to-the-webassembly-target","tags":["LLVM","WebAssembly","ReleaseNote"],"content":"LLVM 8.0.0リリース。\nWebAssembly Targetが\"experimental\"ではなくなり、デフォルトのTargetとしてサポートされた","relatedLinks":[]},{"category":"Headline","title":"Release v2.5.0 · nuxt/nuxt.js","url":"https://github.com/nuxt/nuxt.js/releases/tag/v2.5.0","tags":["Vue","JavaScript","library","ReleaseNote"],"content":"Nuxt.js 2.5.0リリース。\n`nuxt-ts`をインストールしなくてもよくなり、Nuxt.js本体でTypeScriptをサポート。\nBabel 7.4とcore-js 3へのアップデート、`.nuxtignore`のサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 78 | WebKit","url":"https://webkit.org/blog/8676/release-notes-for-safari-technology-preview-78/","tags":["safari","webkit","ReleaseNote"],"content":"Safari Technology Preview 78リリース。\nPointer Eventsの有効化、開発者ツールでCPU使用率やエネルギー影響率を見られるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 74 beta: reducing unwanted motion, private class fields, and feature policy API","url":"https://blog.chromium.org/2019/03/chrome-74-beta-reducing-unwanted-motion.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 74 betaリリース。\nCSS `prefers-reduced-motion: reduce`、private class field、Feature PolicyのJS API、\n`Intl.Locale`のサポート。\n`window.open`をunload中に呼び出せなくなるなど","relatedLinks":[{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features#browsers.chrome.desktop%3D74"}]},{"category":"Headline","title":"V8 release v7.4 · V8","url":"https://v8.dev/blog/v8-release-74","tags":["V8","ReleaseNote"],"content":"V8 v7.4リリース。\nJIT-lessオプションを追加、WebAssembly Threads、Private class fields、`Intl.Locale`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v7.0.0-beta.0 · reduxjs/react-redux","url":"https://github.com/reduxjs/react-redux/releases/tag/v7.0.0-beta.0","tags":["React","redux","ReleaseNote"],"content":"React-Redux 7βリリース。\n`useRedux()`のHooks APIをサポート、Batched Updatesの対応、`store`をPropsとして渡せる機能をテストのために再実装など","relatedLinks":[{"title":"React-Redux Roadmap: v6, Context, Subscriptions, and Hooks · Issue #1177 · reduxjs/react-redux","url":"https://github.com/reduxjs/react-redux/issues/1177"}]},{"category":"Headline","title":"React Training: React Router v5","url":"https://reacttraining.com/blog/react-router-v5/","tags":["React","library","ReleaseNote"],"content":"React Router 5リリース。\nReact 16との互換性改善、bundle済みファイルを配布するように`<Route path>`が配列を受け取れるように。\nminorアップデートだが、react-router-domとバージョンを合わせるためにmajorアップデートとしてリリースされた。","relatedLinks":[{"title":"Release v5.0.0 · ReactTraining/react-router","url":"https://github.com/ReactTraining/react-router/releases/tag/v5.0.0"}]},{"category":"Article","title":"ES5 to ESNext — here’s every feature added to JavaScript since 2015","url":"https://medium.freecodecamp.org/es5-to-esnext-heres-every-feature-added-to-javascript-since-2015-d0c255e13c6e","tags":["ECMAScript","JavaScript","article"],"content":"ES5からES.nextまでに増えた機能を紹介している記事。\nES2015, 201, 2017, 2018, 2019(候補)についてそれぞれ追加された構文や機能を紹介している","relatedLinks":[]},{"category":"Article","title":"A complete guide to threads in Node.js – LogRocket","url":"https://blog.logrocket.com/a-complete-guide-to-threads-in-node-js-4fa3898fe74f","tags":["node.js","article"],"content":"Node.jsの`worker_threads`モジュールについて。\n基本的な使い方やイベント、threads間でのメモリ共有、`MessageChannel`を使ってのportでのメッセージング、メインスレッドかの判定などについて","relatedLinks":[]},{"category":"SlideVideo","title":"ノンプログラマ向けGASレクチャ - Google スライド","url":"https://docs.google.com/presentation/d/1nHxLlNwNg23j_bp0JBgRhjUQpnm0E_S5OK4VAXiS2y8/edit#slide=id.g54702a7210_0_0","tags":["JavaScript","google","slide"],"content":"Google Apps Script(GAS)についてのスライド。\n基本的なJavaScriptの書き方や解説、スプレッドシートで動かすスクリプトや外部連携などのGASの使い方について","relatedLinks":[{"title":"ノンプログラマ向けのGASレクチャ資料を公開します。 - Qiita","url":"https://qiita.com/sakaimo/items/4eee96ed254f42ba88c1"}]},{"category":"SoftwareLibrary","title":"q-nick/npm-gui: Graphic tool for managing javascript project dependencies - in a friendly way.","url":"https://github.com/q-nick/npm-gui","tags":["npm","GUI","software"],"content":"npmのGUIツール。\n依存のインストール、更新、scriptの実行を行う。\nnpm、yarnなどに対応している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"francisrstokes/hexnut: 🔩 Hexnut is a middleware based, express/koa like framework for web sockets","url":"https://github.com/francisrstokes/hexnut","tags":["WebSocket","node.js","library"],"content":"WebSocketsをベースにしたExpress/Koaライクなサーバフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jakearchibald/idb: IndexedDB, but with promises","url":"https://github.com/jakearchibald/idb","tags":["JavaScript","IndexedDB","library"],"content":"IndexedDBのPromiseラッパーライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tomi/fromfrom: A JS library written in TS to transform sequences of data from format to another","url":"https://github.com/tomi/fromfrom/","tags":["JavaScript","TypeScript","library"],"content":"LINQインスパイアなデータ変換を扱うライブラリ。\nデータ変換処理をメソッドチェーンでパイプライン処理できる。\nIteratorをベースにした実装となっていて、遅延実行ができる。","relatedLinks":[{"title":"Announcing fromfrom - a LINQ inspired library to transform sequences of data in JS. — Futurice","url":"https://www.futurice.com/blog/announcing-fromfrom/"}]}]},{"meta":{"title":"2019-04-02のJS: Node.js 11.13.0(once)、WebAssembly System Interface(WASI)","author":"azu","layout":"post","date":"2019-04-02T02:04:56.332Z","category":"JSer","tags":["Node.js","WebAssembly"],"url":"https://jser.info/2019/04/02/node.js-11.13.0oncewebassembly-system-interfacewasi/"},"items":[{"category":"Headline","title":"Node v11.13.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v11.13.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 11.13.0リリース。\n`events`モジュールにPromiseを返す`once`を追加、`node-heapdump`モジュールを`v8.heapdump` APIとしてコアに統合。\n`worker.moveMessagePortToContext`の追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 3.4 | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-4/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.4リリース。\nビルドの情報をファイルに保存して、次回の起動時にその情報で続けてビルドできる`--incremental`フラグの追加。\nreadonly修飾子を配列とtupleに対して適応できるように、const assertionの追加、高階関数の型推論改善。\n`globalThis`のサポートとTop-level `this`の型のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · vuejs/vue-devtools","url":"https://github.com/vuejs/vue-devtools/releases/tag/v5.0.0","tags":["Vue","debug","Tools","browser","Extension","ReleaseNote"],"content":"vue-devtools 5.0.0リリース。\nルーティングタブ、パフォーマンスタブ、設定タブの追加、\npropsやvuexのstateを編集できるようになるなど","relatedLinks":[]},{"category":"Article","title":"Vue.observable & TypeScriptで手早く安心できる状態管理を手に入れる - Qiita","url":"https://qiita.com/mugi_uno/items/cb48e5d3178891f94fa7","tags":["Vue","article","TypeScript"],"content":"Vue 2.6で追加された`Vue.observable`について","relatedLinks":[]},{"category":"Article","title":"Expo CLI and SDK web support beta – Exposition","url":"https://blog.expo.io/expo-cli-and-sdk-web-support-beta-d0c588221375","tags":["React","article","JavaScript"],"content":"Expoがreact-native-webを使ったブラウザサポート。`platforms`に`web`が追加された。\nいくつかのexpoモジュールもweb対応している。","relatedLinks":[{"title":"necolas/react-native-web: React Native for Web","url":"https://github.com/necolas/react-native-web"},{"title":"expo/web-examples: Examples of using Expo in the browser.","url":"https://github.com/expo/web-examples"},{"title":"web-examples/FEATURES.md at master · expo/web-examples","url":"https://github.com/expo/web-examples/blob/master/docs/FEATURES.md"}]},{"category":"Article","title":"Standardizing WASI: A system interface to run WebAssembly outside the web - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2019/03/standardizing-wasi-a-webassembly-system-interface/","tags":["WebAssembly","article"],"content":"ブラウザ以外でもWebAssemblyを実行するための標準化を行うWASIについて。\n各プラットフォームでも動くポータブルなバイナリとプラグラムごとのサンドボックスセキュリティを原則にしたデザイン。\nCloudABIのCapability-based securityを元にしたセキュリティモデルをもつ。","relatedLinks":[{"title":"Announcing Lucet: Fastly’s native WebAssembly compiler and runtime","url":"https://www.fastly.com/blog/announcing-lucet-fastly-native-webassembly-compiler-runtime"},{"title":"WASI","url":"https://wasi.dev/"},{"title":"CraneStation/wasmtime: Standalone JIT-style runtime for WebAsssembly, using Cranelift","url":"https://github.com/CraneStation/wasmtime"},{"title":"Introducing CloudABI","url":"https://cloudabi.org/"}]},{"category":"Article","title":"Introducing experimental integrity policies to Node.js | Snyk","url":"https://snyk.io/blog/introducing-experimental-integrity-policies-to-node-js/","tags":["node.js","article","security"],"content":"Node.js 11.8.0で試験的に導入されたPolicy機能について。\nウェブブラザにおけるSubresource Integrity相当の機能をNode.jsのモジュールロードに対して行う","relatedLinks":[]},{"category":"Article","title":"ECMAScript proposal updates @ 2019-03 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2019/04/01/ecmascript-proposal-updates","tags":["ECMAScript","proposal","article"],"content":"2019年3月のTC39ミーティングでのECMAScript Proposal Stageの変更点をまとめたもの。\n`String.prototype.matchAll`がStage 4になった","relatedLinks":[]},{"category":"Article","title":"Understanding Event Emitters | CSS-Tricks","url":"https://css-tricks.com/understanding-event-emitters/","tags":["JavaScript","article"],"content":"Event Emitterを実装しながらEvent Emitterを学ぶ話","relatedLinks":[]},{"category":"Article","title":"An Overview of JavaScript Testing in 2019 – Welldone Software – Medium","url":"https://medium.com/welldone-software/an-overview-of-javascript-testing-in-2019-264e19514d0a","tags":["JavaScript","article","testing"],"content":"JavaScriptのテスト周りについてまとめた記事。\nテストの種類、ツール、フレームワークなどを紹介している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bluebill1049/react-hook-form: 📋 React hook for form validation without the hassle","url":"https://github.com/bluebill1049/react-hook-form","tags":["React","library"],"content":"React Hooksでフォームを扱うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ilearnio/module-alias: Register aliases of directories and custom module paths in Node","url":"https://github.com/ilearnio/module-alias","tags":["node.js","library"],"content":"webpackのaliasのように読み込むモジュールをマッピングで切り替えるNode.jsライブラリ。\n`Module._resolveFilename`を上書きすることで実現している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Raathigesh/majestic: ⚡ Zero config GUI for Jest","url":"https://github.com/Raathigesh/majestic/","tags":["JavaScript","testing","GUI","Tools"],"content":"JestのGUIツール。","relatedLinks":[]}]},{"meta":{"title":"2019-04-09のJS: ChromiumベースのMicrosoft Edge プレビュー版公開、`request`モジュールがメンテンスモードに移行の予定","author":"azu","layout":"post","date":"2019-04-09T00:14:01.804Z","category":"JSer","tags":["Chrome","MSEdge","Node.js","HTTP"],"url":"https://jser.info/2019/04/09/chromiummicrosoft-edge-request/"},"items":[{"category":"Headline","title":"Release v2.6.0 · nuxt/nuxt.js","url":"https://github.com/nuxt/nuxt.js/releases/tag/v2.6.0","tags":["Vue","library","ReleaseNote"],"content":"Nuxt.js v2.6.0リリース。\ncore-js 2と3の両方をサポート、2.5で入った`ready()`に関するBreaking Changeをrevertなど","relatedLinks":[]},{"category":"Headline","title":"Release 3.13.1 · nodeca/js-yaml","url":"https://github.com/nodeca/js-yaml/releases/tag/3.13.1","tags":["JavaScript","library","security","ReleaseNote"],"content":"js-yaml 3.13.1リリース。\n`load()`で悪意のあるyamlファイルを読むと任意のコードを実行できる脆弱性の修正。","relatedLinks":[{"title":"Arbitrary Code Execution in js-yaml | Snyk","url":"https://snyk.io/vuln/SNYK-JS-JSYAML-174129"},{"title":"Fix possible code execution in (already unsafe) load() by rlidwka · Pull Request #480 · nodeca/js-yaml","url":"https://github.com/nodeca/js-yaml/pull/480"}]},{"category":"Headline","title":"Request’s Past, Present and Future · Issue #3142 · request/request","url":"https://github.com/request/request/issues/3142","tags":["node.js","HTTP","library","issue","news"],"content":"Node.jsのHTTPライブラリである`request`モジュールがメンテンスモードとなる。\n新しい機能追加やBreaking Changesを入れないメンテンスモードとなる予定について書かれている。","relatedLinks":[{"title":"Alternative libraries to request · Issue #3143 · request/request","url":"https://github.com/request/request/issues/3143"}]},{"category":"Headline","title":"Microsoft Edge preview builds: The next step in our OSS journey | Windows Experience Blog","url":"https://blogs.windows.com/windowsexperience/2019/04/08/microsoft-edge-preview-builds-the-next-step-in-our-oss-journey/","tags":["MSEdge","Chrome","browser","ReleaseNote"],"content":"Chromiumを使ったMicrosoft Edgeのプレビュー版がリリースされた。 Beta、Dev、Canaryビルドを用意し、今後はmacOSの対応なども行う。","relatedLinks":[{"title":"What to expect in the new Microsoft Edge Insider Channels - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2019/04/08/microsoft-edge-preview-channel-details/#veEezTt4cKDiSZ0P.97"}]},{"category":"Article","title":"アメブロ2019: こえのブログでのPWA","url":"https://developers.cyberagent.co.jp/blog/archives/20506/","tags":["PWA","article","JavaScript","browser","performance"],"content":"こえのブログでのフロント周りの設計について。\nFastly CDN前提のURL構造、Cloud Speech-to-Textを使った文字起こし、vmsgを使ったクライアントでエンコードしてからのアップロード、Web Componentsの利用。\n初回訪問と再訪問の最適化、performance budgetの設定など","relatedLinks":[]},{"category":"Article","title":"New WebKit Features in Safari 12.1 | WebKit","url":"https://webkit.org/blog/8718/new-webkit-features-in-safari-12-1/","tags":["safari","article"],"content":"Safari 12.1のWebKit周りの変更点について。\nダークモードの対応、ITP 2.1へのアップデート、Payment Request API、WebRTCの改善、EME API/MSEの対応。\nIntersection Observer、Web Share APIの対応、Web Inspectorの改善など","relatedLinks":[]},{"category":"Article","title":"Scroll Anchoring in Firefox 66 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2019/03/scroll-anchoring-in-firefox-66/","tags":["CSS","article"],"content":"CSS Scroll Anchoringについて。\nどのように動作するかの解説","relatedLinks":[]},{"category":"Article","title":"Managing Z-Index In A Component-Based Web Application — Smashing Magazine","url":"https://www.smashingmagazine.com/2019/04/z-index-component-based-web-application/","tags":["CSS","article"],"content":"コンポーネントベースにおけるz-indexの管理方法について。\nStacking Context、z-indexの管理、オーバーレイについて","relatedLinks":[]},{"category":"Article","title":"docker-node/BestPractices.md at master · nodejs/docker-node","url":"https://github.com/nodejs/docker-node/blob/master/docs/BestPractices.md","tags":["Docker","node.js","document"],"content":"DockerにおけるNode.jsのベストプラクティスについて書かれたドキュメント。\n環境変数、Ctrl + Cのシグナルが送れない問題、yarnのアップデート、root周りの設定、`CMD`でnpm run-script経由ではなく直接実行することについてなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jeffijoe/typesync: Install missing TypeScript typings for dependencies in your package.json.","url":"https://github.com/jeffijoe/typesync","tags":["npm","node.js","TypeScript","console","toll"],"content":"`package.json`から関連する@typesのパッケージをインストールしてくれるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"typeless-js/typeless: A complete toolkit for building scalable React apps with Typescript.","url":"https://github.com/typeless-js/typeless","tags":["React","redux","TypeScript","library"],"content":"Reduxの典型的なケースをビルトインで持つ、React+Redux+Rxjsを前提としたステート管理ライブラリ。\nReact Hooksに対応し、Reactに合わせたライフサイクルアクションをもつ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"codex-team/editor.js: A block-styled editor with clean JSON output","url":"https://github.com/codex-team/editor.js","tags":["JavaScript","editor","library"],"content":"ブロックスタイルのエディタライブラリ。\nブロックごとの記述をJSONとして出力できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mgechev/codelyzer: Static analysis for Angular projects.","url":"https://github.com/mgechev/codelyzer","tags":["Angular","TypeScript","Tools"],"content":"TSLintを使ったAngularコンポーネント向けのLintルールセット","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Home | PreVue","url":"https://prevue.io/","tags":["Vue","Tools","design"],"content":"Vue.jsを使ったUIプロトタイピングツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kognise/water.css: A just-add-css collection of styles to make simple websites just a little nicer","url":"https://github.com/kognise/water.css","tags":["CSS","library"],"content":"HTML要素のベーススタイルを定義したライブラリ。\n要素に対するスタイルを提供するため、特別なクラスを提供していない。","relatedLinks":[]}]},{"meta":{"title":"2019-04-15のJS: jQuery 3.4.0(Sizzle)、ESLint 6.0.0 α、react-redux 7.0(Hooks)","author":"azu","layout":"post","date":"2019-04-15T00:37:33.536Z","category":"JSer","tags":["jquery","ESLint","redux"],"url":"https://jser.info/2019/04/15/jquery-3.4.0sizzleeslint-6.0.0-areact-redux-7.0hooks/"},"items":[{"category":"Headline","title":"jQuery 3.4.0 Released | Official jQuery Blog","url":"http://blog.jquery.com/2019/04/10/jquery-3-4-0-released/","tags":["jQuery","ReleaseNote"],"content":"jQuery 3.4.0リリース。\nscriptタグの`nomodule`と`nonce`をサポート、`Object.prototype` pollutionの脆弱性を修正、Sizzleが提供するCSSセレクタを非推奨に。","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember 3.9 Released","url":"https://blog.emberjs.com/2019/04/10/ember-3-9-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember 3.9リリース。\njQueryをデフォルトで外すために`Ember.$()`など非推奨化、`.volatile()`と`.property()`ではなくネイティブのgetter/setterを利用を推奨するようになるなど","relatedLinks":[{"title":"Release v3.9.0 · emberjs/ember.js","url":"https://github.com/emberjs/ember.js/releases/tag/v3.9.0"},{"title":"Ember.js - Deprecations","url":"https://deprecations.emberjs.com/v3.x/"}]},{"category":"Headline","title":"ESLint v6.0.0-alpha.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2019/04/eslint-v6.0.0-alpha.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 6.0.0アルファリリース。\nインストールしたプラグインの読み込み方法の変更、`eslint:recommended`の更新、ルールのデフォルトの挙動を一部変更など","relatedLinks":[{"title":"ESLint v6.0.0 の変更点まとめ - Qiita","url":"https://qiita.com/mysticatea/items/274347ff9473b26b575a"}]},{"category":"Headline","title":"Node v11.14.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v11.14.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 11.14.0リリース。\n`fs.promises`がStableに、`readline`の`Symbol.asyncIterator`対応がStableになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v7.0.1 · reduxjs/react-redux","url":"https://github.com/reduxjs/react-redux/releases/tag/v7.0.1","tags":["React","redux","ReleaseNote"],"content":"React-Redux 7.0リリース。 `connect`が`React.memo`とHooks　APIを使うように、Subscriptionの動作を変更、`batch`APIの追加、`store`をPropsとして渡せる機能をテストのために再実装など","relatedLinks":[]},{"category":"Headline","title":"Prettier 1.17: More quotes options and support for shared configs · Prettier","url":"https://prettier.io/blog/2019/04/12/1.17.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 1.17リリース。\nオブジェクトのquote設定をする`--quote-props`の追加、shared configのサポート、TypeScript 3.4の`readonly`修飾子をサポートなど","relatedLinks":[]},{"category":"Article","title":"Form Validation in Under an Hour with Vuelidate | CSS-Tricks","url":"https://css-tricks.com/form-validation-in-under-an-hour-with-vuelidate/","tags":["Vue","library","article"],"content":"VueのフォームバリデーターライブラリのVuelidateについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"CatSnake11/Webpack-Ops: 📁 Webpack bundle visualization // optimization // config tool","url":"https://github.com/CatSnake11/Webpack-Ops","tags":["webpack","Tools"],"content":"webpackダッシュボードツール。\nbundle結果のビジュアライズ、最適化設定をテストして設定ファイルの生成などを行える","relatedLinks":[]},{"category":"SoftwareLibrary","title":"commenthol/date-holidays: worldwide holidays","url":"https://github.com/commenthol/date-holidays","tags":["JavaScript","library"],"content":"祝日判定ライブラリ。\n各国ごとの祝日の定義を持っている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"niklasvh/html2canvas: Screenshots with JavaScript","url":"https://github.com/niklasvh/html2canvas","tags":["JavaScript","HTML","canvas","library","browser"],"content":"HTMLをCanvasに描画してHTMLのスクリーンショットを撮るJavaScriptライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"seek-oss/playroom: Design with JSX, powered by your own component library.","url":"https://github.com/seek-oss/playroom","tags":["React","Tools","UI"],"content":"JSX/Reactのコンポーネントプレイグラウンドツール。\nさまざまなViewportでプレビューしながらコンポーネントのプロトタイピングができる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"packem/packem: 📦⚡ A precompiled JavaScript module bundler","url":"https://github.com/packem/packem","tags":["JavaScript","Rust","Tools","bundler"],"content":"Rust製のJavaScriptモジュールBundler。\nJavaScriptプラグインを書いて拡張もできる。","relatedLinks":[]}]},{"meta":{"title":"2019-04-23のJS: Svelte 3(Change Everything)、GoogleでのCSP(Content Security Policy)導入ステップ","author":"azu","layout":"post","date":"2019-04-23T01:35:41.198Z","category":"JSer","tags":["Svelte","CSP","security"],"url":"https://jser.info/2019/04/23/svelte-3change-everythinggooglecspcontent-security-policy/"},"items":[{"category":"Headline","title":"alibaba/rax: \\[ v1.0 released\\] The fastest way to build universal application.","url":"https://github.com/alibaba/rax","tags":["React","library","JavaScript","ReleaseNote"],"content":"ReactライクなAPIを持つUniversalなViewライブラリであるRax 1.0.0リリース。\nHooks APIにも対応している。","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · sindresorhus/np","url":"https://github.com/sindresorhus/np/releases/tag/v5.0.0","tags":["npm","ReleaseNote"],"content":"npm publishするnp 5.0.0リリース。\n2要素認証を新しく公開するパッケージに関しては自動で有効化、公開に失敗したときのロールバック処理の改善など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 80 | WebKit","url":"https://webkit.org/blog/8825/release-notes-for-safari-technology-preview-80/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 80リリース。\nResizeObserverのサポート、`window.open`の第二引数で`noreferrer`のサポート、`contentWindow`のサポートなど。\nまたLegacy Safari Extensionsのサポート終了など","relatedLinks":[]},{"category":"Headline","title":"Blog - Next.js 8.1 | Next.js","url":"https://nextjs.org/blog/next-8-1","tags":["React","AMP","ReleaseNote"],"content":"Next.js 8.1リリース。\nAMPサポートが追加された。\nコンポーネント内でAMPとの処理分岐でのhybrid対応、`next export`でAMPでの出力とバリデーション","relatedLinks":[]},{"category":"Headline","title":"Release 10.0.0-beta.0 Reconcilertron · developit/preact","url":"https://github.com/developit/preact/releases/tag/10.0.0-beta.0","tags":["React","library","JavaScript","ReleaseNote"],"content":"Preact 10.0.0-beta.0リリース。\n`Fragments`の安定化、条件分岐を含む描画のパフォーマンス改善、コンポーネントの上下関係を考慮した更新処理を行うように修正など","relatedLinks":[]},{"category":"Headline","title":"Svelte 3: Rethinking reactivity","url":"https://svelte.dev/blog/svelte-3-rethinking-reactivity","tags":["JavaScript","library","ReleaseNote"],"content":"コンパイル前提のUIフレームワークであるSvelte 3リリース。\n今までの仕組みを書き直したため、テンプレート構文、API、ウェブサイトが変更されている。\n変更検知の仕組みが大きく変わり、`set` APIではなく、reactiveな変数を`$:`で宣言しコンパイル時に変更を追跡するコードを生成する方法に変更された","relatedLinks":[]},{"category":"Article","title":"TypeScript再入門「がんばらないTypeScript」で、JavaScriptを“柔らかい”静的型付き言語に（gfx執筆） - エンジニアHub｜若手Webエンジニアのキャリアを考える！","url":"https://employment.en-japan.com/engineerhub/entry/2019/04/16/103000","tags":["TypeScript","article"],"content":"ゆるい型付けの設定で始めるTypeScriptについて。","relatedLinks":[]},{"category":"Article","title":"A horrifying globalThis polyfill in universal JavaScript · Mathias Bynens","url":"https://mathiasbynens.be/notes/globalthis","tags":["ECMAScript","JavaScript","polyfill","article"],"content":"`globalThis`のpolyfillとその動作原理についての解説。","relatedLinks":[]},{"category":"Article","title":"Experimental Node.js: testing the new performance hooks","url":"https://blog.logrocket.com/experimental-node-js-testing-the-new-performance-hooks-31fcdd2a747e","tags":["node.js","performance","article"],"content":"Node.jsの`perf_hooks`の使い方についての記事。\nモジュールのロード時間やURLへのリクエスト時間を計測を例に紹介している","relatedLinks":[]},{"category":"Article","title":"The perfect unit test","url":"https://javascriptplayground.com/the-perfect-javascript-unit-test/","tags":["JavaScript","testing","article"],"content":"Unit Testの書き方について。\nテストケース名の書き方、テストをSetup、コード実行、Assertの3つのステップに分解して書くことについて","relatedLinks":[]},{"category":"Article","title":"A RealWorld Comparison of Front-End Frameworks with Benchmarks (2019 update)","url":"https://medium.freecodecamp.org/a-realworld-comparison-of-front-end-frameworks-with-benchmarks-2019-update-4be0d3c78075","tags":["JavaScript","library","article","benchmark"],"content":"\"RealWorld\"というベンチマークアプリの各JavaScriptフレームワークなどの実装を比較した記事。\nパフォーマンス、出力されたコードのファイルサイズ、Line of Code(LOC)でそれぞれを比較した結果をまとめている","relatedLinks":[{"title":"gothinkster/realworld: ","url":"https://github.com/gothinkster/realworld"}]},{"category":"SlideVideo","title":"Content Security Policy: A successful mess between hardening and mitigation - Speaker Deck","url":"https://speakerdeck.com/mikispag/content-security-policy-a-successful-mess-between-hardening-and-mitigation","tags":["CSP","browser","security","slide"],"content":"GoogleにおけるCSPについてのスライド。Google domainのCSPのカバレッジや60%以上のXSSはCSPでブロックできている。\nCSP導入の4つのLevelと導入ステップ、ホワイリストの問題とnonce-based CSP、CSPとデプロイのトレードオフについてなど。\nCSP対応のリファクタリング手法などについて","relatedLinks":[{"title":"Content Security Policy Level 3におけるXSS対策 - pixiv inside","url":"https://inside.pixiv.blog/kobo/5137"}]},{"category":"WebsiteDocument","title":"isInputPending: Facebook's first browser API contribution - Facebook Code","url":"https://code.fb.com/developer-tools/isinputpending-api/","tags":["JavaScript","performance","browser"],"content":"`navigator.scheduling.isInputPending()`を使いユーザーの操作中は、キューにためた処理を実行しないように制御する方法について。\nロード処理が完了するまでユーザーが操作できない時間であるFirst Input Delay (FID) を軽減する手法について","relatedLinks":[{"title":"First Input Delay  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2018/05/first-input-delay"}]},{"category":"SoftwareLibrary","title":"Do you really know how a lockfile works for yarn and npm packages? | Snyk","url":"https://snyk.io/blog/making-sense-of-package-lock-files-in-the-npm-ecosystem/","tags":["npm","yarn","JavaScript","node.js","library"],"content":"yarnの`yarn.lock`、npmの`package-lock.json`が実際にどのように動いているのかについて。\nアプリケーションとライブラリのロックファイルについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"stryker-mutator/stryker: Mutation testing for JavaScript and friends","url":"https://github.com/stryker-mutator/stryker","tags":["testing","library","JavaScript","C#","scala"],"content":"Mutation testingライブラリ。\nテストコードをテストするためのフレームワーク。\nmochaやjestなど各種テストフレームワークと連携して動作する。","relatedLinks":[{"title":"stryker-mutator/stryker-handbook: A comprehensive guide to the stryker ecosystem","url":"https://github.com/stryker-mutator/stryker-handbook#readme"},{"title":"stryker/packages/core at master · stryker-mutator/stryker","url":"https://github.com/stryker-mutator/stryker/tree/master/packages/core#readme"},{"title":"Blog - Stryker Mutator","url":"https://stryker-mutator.io/blog/2017-01-17/introduction-to-mutation-testing"}]},{"category":"SoftwareLibrary","title":"lancedikson/bowser: a browser detector","url":"https://github.com/lancedikson/bowser","tags":["JavaScript","browser","library"],"content":"User-Agentを元にブラウザ名やバージョンなどを構造的なデータとして取得できるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sindresorhus/file-type: Detect the file type of a Buffer/Uint8Array/ArrayBuffer","url":"https://github.com/sindresorhus/file-type","tags":["node.js","JavaScript","library"],"content":"Content sniffingをしてファイルの種類を判定するNode.jsライブラリ","relatedLinks":[]},{"category":"Book","title":"Front-end Developer Handbook 2019 - Learn the entire JavaScript, CSS and HTML development practice!","url":"https://frontendmasters.com/books/front-end-handbook/2019/","tags":["JavaScript","book","links"],"content":"フロントエンド開発についての概要や技術項目ごとのリソースをまとめた電子書籍の2019年版","relatedLinks":[]}]},{"meta":{"title":"2019-04-30のJS: Node.js 12.0.0(Node.js 6.xはEOL)、Electron 5.0.0、Pixi.js 5.0.0(WebGL by default)","author":"azu","layout":"post","date":"2019-04-30T03:33:48.110Z","category":"JSer","tags":["Node.js","Electron","Canvas","WebGL"],"url":"https://jser.info/2019/04/30/node.js-12.0.0node.js-6.xeolelectron-5.0.0pixi.js-5.0.0webgl-by-default/"},"items":[{"category":"Headline","title":"Release v3.0.0 · facebook/create-react-app","url":"https://github.com/facebook/create-react-app/releases/tag/v3.0.0","tags":["React","Tools","ReleaseNote"],"content":"create-react-app v3.0.0リリース。\nJest 24、React Hooks、ESLintでTypeScriptをLintするように、`tsconfig.json`の`baseUrl`をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release electron v5.0.0 · electron/electron","url":"https://github.com/electron/electron/releases/tag/v5.0.0","tags":["Electron","ReleaseNote"],"content":"Electron v5.0.0リリース。\nChromium 73、Node 12.0.0にアップデート。\n`ELECTRON_DISABLE_SANDBOX`でsandboxの無効化に対応。\nCookies APIのPromise対応、BrowserWindowで複数のBrowserViewをサポート、iframeに対してnode integrationの設定ができるようになるなど","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 74  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/04/nic74","tags":["Chrome","ReleaseNote"],"content":"Chrome 74の変更点について。\nprivate class fieldsの対応、`prefers-reduced-motion`のサポート、feature policy apiのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node v12.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v12.0.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 12.0.0リリース。\nV8 7.4へアップデート、TLS 1.3のサポート、http parserが`llhttp`に変更、`os.type()`の追加など。\n試験的な機能としてWorker Threads、Diagnostic Reports、Heap Dumps、ES Modulesのサポートなど","relatedLinks":[{"title":"Introducing Node.js 12 – Node.js Foundation – Medium","url":"https://medium.com/@nodejs/introducing-node-js-12-76c41a1b3f3f"},{"title":"The new ECMAScript module support in Node.js 12","url":"http://2ality.com/2019/04/nodejs-esm-impl.html"}]},{"category":"Headline","title":"Release v1.15.0 · GoogleChrome/puppeteer","url":"https://github.com/GoogleChrome/puppeteer/releases/tag/v1.15.0","tags":["Chrome","node.js","library","ReleaseNote"],"content":"Puppeteer 1.15.0リリース。\nChromium 75.0.3765.0へアップデート、`puppeteer.devices`と`puppeteer.errors`の追加、リクエストInterceptionの問題を修正など","relatedLinks":[]},{"category":"Headline","title":"documentation/CHANGELOG.md at master · documentationjs/documentation","url":"https://github.com/documentationjs/documentation/blob/master/CHANGELOG.md#1010-2019-04-25","tags":["document","JavaScript","TypeScript","ReleaseNote"],"content":"コードからドキュメントを生成するツールであるdocumentationjs 10.1.0リリース。\nTypeScriptをサポート","relatedLinks":[]},{"category":"Article","title":"Color accessibility: tools and resources to help you design inclusive products, by Stéphanie Walter - UX designer & Mobile Expert.","url":"https://stephaniewalter.design/blog/color-accessibility-tools-resources-to-design-inclusive-products/","tags":["color","accessibility","article"],"content":"アクセシビリティとカラー、コントラスト関係のツールやリソースのまとめ","relatedLinks":[]},{"category":"Article","title":"Comparing JVM alternatives to JavaScript","url":"https://renato.athaydes.com/posts/comparing-jvm-alternatives-to-js.html","tags":["JavaScript","Java","article"],"content":"JavaからJavaScriptに変換するツールの比較記事。\nパフォーマンス、コードファイルサイズ、コード行数について","relatedLinks":[]},{"category":"Article","title":"AddyOsmani.com - Native image lazy-loading for the web!","url":"https://addyosmani.com/blog/lazy-loading/","tags":["Chrome","WebPlatformAPI","HTML","article"],"content":"画像やiframeの遅延ロードなどを行う`loading`属性について。\n属性値として`lazy`、`eager`、`auto`が設定できることやFeature Detection、Fallbackの書き方についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"faast.js · Serverless batch computing made simple","url":"https://faastjs.org/","tags":["serverless","library","JavaScript","TypeScript"],"content":"serverlessを使ったバッチ処理を行うフレームワーク。\nバッチの各処理を関数としてローカル、AWS lambda、Google Cloud Functionsで実行できる。またデプロイやクリーンアップのワークフローを管理できる。","relatedLinks":[{"title":"faast.js vs other · faast.js","url":"https://faastjs.org/docs/comparison"}]},{"category":"WebsiteDocument","title":"PixiJS v5 lands – Goodboy Digital – Medium","url":"https://medium.com/goodboy-digital/pixijs-v5-lands-5e112d84e510","tags":["JavaScript","WebGL","canvas","library","game"],"content":"PixiJS 5.0.0リリース。\nWebGLがデフォルトとなり、Cnavas版は`pixi.js-legacy`として提供されるように。\nglobalに`PIXI`オブジェクトを追加しないでimportできるように。\nRendererのシグネチャの変更、`PIXI.Mesh`の追加、Graphics Holesの対応改善など","relatedLinks":[{"title":"Release v5.0.0 · pixijs/pixi.js","url":"https://github.com/pixijs/pixi.js/releases/tag/v5.0.0"},{"title":"v5 Migration Guide · pixijs/pixi.js Wiki","url":"https://github.com/pixijs/pixi.js/wiki/v5-Migration-Guide"}]},{"category":"SoftwareLibrary","title":"TypeScript AST Viewer","url":"https://ts-ast-viewer.com/","tags":["TypeScript","AST","Tools"],"content":"TypeScriptのコードのASTビューアツール。\nコードを生成するASTのコードも出力される","relatedLinks":[]},{"category":"SoftwareLibrary","title":"infinitered/gluegun: A delightful toolkit for building Node-powered CLIs.","url":"https://github.com/infinitered/gluegun","tags":["node.js","console","library"],"content":"Node.jsのコマンドラインツール向けのフレームワーク。\nコマンドのテンプレート、コマンドライン引数のパースやハンドリング、Util処理などを含んでいる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gkozlenko/node-video-lib: Node.js Video Library / MP4 & FLV parser / HLS muxer","url":"https://github.com/gkozlenko/node-video-lib","tags":["node.js","JavaScript","video","HLS","library"],"content":"依存がないMP4とFLVのパーサ、HLS muxerライブラリ","relatedLinks":[]},{"category":"Book","title":"O'Reilly Japan - Node.jsデザインパターン 第2版","url":"https://www.oreilly.co.jp/books/9784873118734/","tags":["node.js","JavaScript","book"],"content":"2019年05月18日発売\nNode.jsのデザインパターンについての書籍","relatedLinks":[{"title":"Node.jsデザインパターン 第2版 サポートページ — マーリンアームズ株式会社","url":"https://www.marlin-arms.com/support/nodejs-design-patterns/"}]},{"category":"Book","title":"Programming TypeScript - O'Reilly Media","url":"http://shop.oreilly.com/product/0636920158059.do","tags":["TypeScript","book"],"content":"TypeScriptについての入門書","relatedLinks":[]}]},{"meta":{"title":"2019-05-07のJS: Chrome 75 Beta(Low Latency Canvas)、Babylon.js 4.0(WebGL)","author":"azu","layout":"post","date":"2019-05-07T01:19:40.127Z","category":"JSer","tags":["Chrome","WebGL","gulp"],"url":"https://jser.info/2019/05/07/chrome-75-betalow-latency-canvasbabylon.js-4.0webgl/"},"items":[{"category":"Headline","title":"jQuery 3.4.1: triggering focus events in IE and finding root elements in iOS 10 | Official jQuery Blog","url":"http://blog.jquery.com/2019/05/01/jquery-3-4-1-triggering-focus-events-in-ie-and-finding-root-elements-in-ios-10/","tags":["jQuery","ReleaseNote"],"content":"jQuery 3.4.1リリース。\nIE10-IE11で`trigger`の問題を修正、iOS 10.0-10.2でのclickの問題を修正、AMDとしてロードしたときの問題を修正など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 81 | WebKit","url":"https://webkit.org/blog/8834/release-notes-for-safari-technology-preview-81/","tags":["webkit","safari","ReleaseNote"],"content":"Safari Technology Preview 81リリース。\n印刷時のスタイルで`@page`によるmarginのサポート、`frame-ancestors` CSPを`X-Frame-Options`ヘッダより優先するように。\n`requestAnimationFrame`の実行タイミングの問題を修正など","relatedLinks":[{"title":"177484 – requestAnimationFrame should execute before the next frame","url":"https://bugs.webkit.org/show_bug.cgi?id=177484"}]},{"category":"Headline","title":"Chromium Blog: Chrome 75 Beta: low latency canvas contexts, sharing files, and numeric separators","url":"https://blog.chromium.org/2019/05/chrome-75-beta-low-latency-canvas.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 75 Betaリリース。\nCanvasに低遅延レンダリングのための`desynchronized`オプションを追加、Web Shareでファイルをサポート、ES ProposalのNumeric separatorsをサポート。\nCSPの`script-src-attr`ディレクティブのサポート、Cache-Controlの`stale-while-revalidate`のサポートなど","relatedLinks":[{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features#milestone%3D75"},{"title":"Low-latency rendering with the desynchronized hint  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/05/desynchronized"}]},{"category":"Headline","title":"Release 7.0.0 · websockets/ws","url":"https://github.com/websockets/ws/releases/tag/7.0.0","tags":["WebSocket","node.js","library","ReleaseNote"],"content":"WebSocketクライアント & サーバの`ws` 7.0.0リリース。\nNode.js 6のサポート終了、コンストラクタでNode.jsの`url`オブジェクトではなく`URL`オブジェクトを受け取るように変更。\n`readyState`が`OPEN`ではないときの`ping`、`pong`の挙動変更など","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · facebook/relay","url":"https://github.com/facebook/relay/releases/tag/v4.0.0","tags":["GraphQL","library","ReleaseNote"],"content":"GraphQLとReact向けのフレームワークであるRelay 4.0.0リリース。\nContainerの引数に`graphql` tagを渡すのではなくオブジェクトを受け付けるように変更、client schema extensionsのフルサポートなど","relatedLinks":[{"title":"Building the New facebook.com with React, GraphQL and Relay","url":"https://developers.facebook.com/videos/2019/building-the-new-facebookcom-with-react-graphql-and-relay/"}]},{"category":"Headline","title":"Microsoft Edge – All the news from Build 2019 - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2019/05/06/edge-chromium-build-2019-pwa-ie-mode-devtools/","tags":["MSEdge","Chrome","IE","news"],"content":"ChromiumベースのMSEdgeにはサードパーティトラッキングのブロックができるPrivacy Tools、表示しているサイトをIE互換するIE modeが搭載される予定","relatedLinks":[]},{"category":"Headline","title":"Babylon.js 4.0 Is Here! – Babylon.js – Medium","url":"https://medium.com/@babylonjs/babylon-js-4-0-is-here-d725b5b02e9b","tags":["WebGL","library","ReleaseNote"],"content":"WebGLベースの3Dゲーム向けフレームワークのBabylon.js 4.0.0リリース。 Visual Scene Inspectorの導入、ファイルサイズやパフォーマンスの改善、物理エンジンとしてAmmo.jsをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Hyper Blog","url":"https://hyper.is/blog","tags":["Electron","console","software","ReleaseNote"],"content":"Electron製のターミナルであるHyper 3リリース。 `hterm`から`xterm.js`に変更してWebGL Rendererを使うように、IPCのバッチ処理でパフォーマンス改善など","relatedLinks":[]},{"category":"Article","title":"Stub navigator API in end-to-end tests | Better world by better software","url":"https://glebbahmutov.com/blog/stub-navigator-api/","tags":["E2E","browser","testing","article"],"content":"Cypressを使いBattery status APIのStubをしながらテストをするチュートリアル。\n`navigator`をどのようにstubしてテストするかについて","relatedLinks":[]},{"category":"Article","title":"The CSS Handbook: a handy guide to CSS for developers","url":"https://medium.freecodecamp.org/the-css-handbook-a-handy-guide-to-css-for-developers-b56695917d11","tags":["CSS","article"],"content":"CSSについてのガイド。\n基本的なCSSのプロパティの解説からunit、レイアウト、アニメーションなど幅広く書かれている","relatedLinks":[]},{"category":"Article","title":"Revisiting prefers-reduced-motion, the reduced motion media query | CSS-Tricks","url":"https://css-tricks.com/revisiting-prefers-reduced-motion-the-reduced-motion-media-query/","tags":["CSS","animation","article","accessibility"],"content":"CSSの`prefers-reduced-motion`の解説と使い方についての記事。\nアクセシビリティ、プログレッシブ・エンハンスメントの考え、CSS Variablesと組み合わせた実装について","relatedLinks":[]},{"category":"Article","title":"Optimizing Performance With Resource Hints — Smashing Magazine","url":"https://www.smashingmagazine.com/2019/04/optimization-performance-resource-hints/","tags":["browser","performance"],"content":"Resource Hintsについての記事。\n`dns-prefetch`、`preconnect`、`prefetch`、`prerender`をそれぞれどのような場合に利用するかについて。`as`属性についてなど","relatedLinks":[]},{"category":"Article","title":"gulp4再入門 gulpfileの分割とnodeモジュールの利用 - Qiita","url":"https://qiita.com/masato_makino/items/ad11058e1a8a009abbdf","tags":["gulp","article"],"content":"gulp4ベースの入門記事。\ngulp taskの定義方法、タスクファイルの分割、gulpプラグインとNodeモジュールについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"oclif/cli-ux: CLI IO utilities","url":"https://github.com/oclif/cli-ux","tags":["node.js","library"],"content":"ターミナルのCLIを提供するNode.jsライブラリ。\npromptやconfirmなどの対話操作、URLのリンク表示、spinner、アノテーション、table表示など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Laconia · Create well-crafted serverless applications, effortlessly","url":"https://laconiajs.io/","tags":["node.js","server","library"],"content":"Node.jsのserverlsssフレームワーク。Hexagonal Architectureで依存を外から渡せるような構造にしてテストしやすくしている。\nLong Task向けのbatch処理を行うモジュールも提供されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"microsoft/react-native-windows: A framework for building native Windows apps with React.","url":"https://github.com/Microsoft/react-native-windows","tags":["React","windows","library"],"content":"React Native for Windows。\nReact NativeでネイティブなWindowsアプリ(UWP)を作成するフレームワーク。","relatedLinks":[]}]},{"meta":{"title":"2019-05-14のJS: Google I/O 2019、GitHub Package Registry(npm, Docker, etc)","author":"azu","layout":"post","date":"2019-05-14T01:14:26.660Z","category":"JSer","tags":["Google","Chrome","GitHub","npm"],"url":"https://jser.info/2019/05/14/google-io-2019github-package-registrynpm-docker-etc/"},"items":[{"category":"Headline","title":"Release v5.0.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v5.0.0","tags":["browser","performance","Tools","ReleaseNote"],"content":"Lighthouse 5.0.0リリース。\nWordpressなど特定のスタックに対するレポートを表示するStack Packsの追加、Performance budgetsの対応、Lighthouse plugins","relatedLinks":[{"title":"GoogleChrome/lighthouse-stack-packs: Lighthouse Stack Packs","url":"https://github.com/GoogleChrome/lighthouse-stack-packs"},{"title":"Performance Budgets (Keep Request Counts Low And File Sizes Small)  |  Tools for Web Developers  |  Google Developers","url":"https://developers.google.com/web/tools/lighthouse/audits/budgets"},{"title":"lighthouse/plugins.md at master · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/blob/master/docs/plugins.md#plugin-config"}]},{"category":"Headline","title":"Official Google Webmaster Central Blog: The new evergreen Googlebot","url":"https://webmasters.googleblog.com/2019/05/the-new-evergreen-googlebot.html","tags":["google","search","news","browser","Chrome"],"content":"Google検索botが最新版のChromiumレンダリングエンジンを使うように変更された","relatedLinks":[{"title":"Fix Search-related JavaScript problems  |  Search  |  Google Developers","url":"https://developers.google.com/search/docs/guides/fix-search-javascript"}]},{"category":"Headline","title":"Node v12.2.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v12.2.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 12.2.0リリース。\n`--trace-tls`オプションの追加、`Module.createRequireFromPath()`を非推奨化し、`URL`でのパスも受け取れるようにした`module.createRequire`を追加など","relatedLinks":[]},{"category":"Headline","title":"comlink/CHANGELOG.md at master · GoogleChromeLabs/comlink","url":"https://github.com/GoogleChromeLabs/comlink/blob/master/CHANGELOG.md#v3---v4","tags":["JavaScript","webworker","library","ReleaseNote"],"content":"ES Proxyを使ったWorkerライブラリのComlink 4.0.0リリース。\nNode.jsの`worker_thread`をサポート、APIのリネーム、パフォーマンスの改善など","relatedLinks":[{"title":"Surma on Twitter: ","url":"https://twitter.com/DasSurma/status/1127266398185484288"}]},{"category":"Headline","title":"Release v1.16.0 · GoogleChrome/puppeteer","url":"https://github.com/GoogleChrome/puppeteer/releases/tag/v1.16.0","tags":["Chrome","library","ReleaseNote"],"content":"Puppeteer 1.16.0リリース。\n`browser.isConnected()`、`target.worker()`のサポート。\n`accessibility.snapshot()`が`root`オプションをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Introducing GitHub Package Registry - The GitHub Blog","url":"https://github.blog/2019-05-10-introducing-github-package-registry/","tags":["github","news","npm"],"content":"GitHubのパッケージレジストリサービスのベータ公開がされた。\nnpm、gem、dockerなどに対応していて、GitHubのTeamパーミッションに紐付いて管理できるprivate registry。\nGitHubのReleaseや検索にも表示されるようになる","relatedLinks":[{"title":"GitHub Package Registry: Your packages, at home with their code","url":"https://github.com/features/package-registry"}]},{"category":"Headline","title":"AWS Lambda adds support for Node.js v10","url":"https://aws.amazon.com/jp/about-aws/whats-new/2019/05/aws_lambda_adds_support_for_node_js_v10/","tags":["aws","Lambda","node.js","news"],"content":"AWS LambdaがNode.js 10をサポート。","relatedLinks":[]},{"category":"Article","title":"SameSite cookies explained  |  web.dev","url":"https://web.dev/samesite-cookies-explained/","tags":["security","browser","Chrome","article"],"content":"`SameSite` Cookieについての解説。`SameSite`の設定値である`Strict`、`Lax`、`None`の動作の解説。\nChrome 76で`SameSite`が未指定の場合に`SameSite=Lax`をデフォルトとする試験的フラグが追加されるなど","relatedLinks":[{"title":"HTTP クッキーをより安全にする SameSite 属性について (Same-site Cookies) | ラボラジアン","url":"https://laboradian.com/same-site-cookies/"}]},{"category":"Article","title":"React  |  web.dev","url":"https://web.dev/react","tags":["React","tutorial"],"content":"web.dev のReactウェブアプリの最適化についてのチュートリアル。\nBundle size、無限リスト、Service Worker、プリレンダリング、アクセシビリティについて","relatedLinks":[]},{"category":"Article","title":"A Guide to Node.js Logging - Twilio","url":"https://www.twilio.com/blog/guide-node-js-logging","tags":["node.js","article"],"content":"Node.jsでログ出力についての記事。\nConsole API、pinoを使ったログ出力、ライブラリのログ、chalkなどで装飾されているログをプレーンな出力にする方法などについて","relatedLinks":[]},{"category":"SlideVideo","title":"Web at Google I/O 2019 - YouTube","url":"https://www.youtube.com/playlist?list=PLNYkxOF6rcIATmAmz7HcCzongGvQEtx8i","tags":["google","video","イベント"],"content":"Google I/O 2019のウェブセッションの動画まとめ","relatedLinks":[]},{"category":"SlideVideo","title":"ng-conf 2019 - YouTube","url":"https://www.youtube.com/playlist?list=PLOETEcp3DkCpimylVKTDe968yNmNIajlR","tags":["Angular","video","イベント"],"content":"Angularのカンファレンスであるng-confg 2019の動画一覧。","relatedLinks":[{"title":"Angular - All Talks from ng-conf 2019","url":"https://nitayneeman.com/posts/all-talks-from-ng-conf-2019/"},{"title":"ng-conf 2019 Note","url":"https://www.notion.so/ng-conf-2019-Note-10b9443262a54fb9bd8586cc25a449c7"}]},{"category":"SlideVideo","title":"Node.js v12の気になる変更点 / #kng6 - Speaker Deck","url":"https://speakerdeck.com/masashi/number-kng6","tags":["node.js","slide"],"content":"Node.js 12の変更点についてまとめたスライド","relatedLinks":[]},{"category":"WebsiteDocument","title":"wapm | WebAssembly Package Manager","url":"https://wapm.io/","tags":["WebAssembly","webservice"],"content":"WebAssemblyのパッケージマネージャとレジストリ","relatedLinks":[]},{"category":"WebsiteDocument","title":"microsoft/frontend-bootcamp: Frontend Workshop from HTML/CSS/JS to TypeScript/React/Redux","url":"https://github.com/Microsoft/frontend-bootcamp","tags":["MS","HTML","CSS","JavaScript","tutorial"],"content":"Microsoftのフロントエンドワークショップ教材。\nHTML、CSS、JavaScript、TypeScriptについて扱う2日分のコンテンツ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Data | Third-Party Web","url":"https://www.thirdpartyweb.today/","tags":["performance","webservice","Tools"],"content":"HTTP Archiveのクロールデータを元にした、サードパーティスクリプトの影響度を可視化したサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"manzinello/mailgo: 💌 mailgo, a different mailto (WIP)","url":"https://github.com/manzinello/mailgo","tags":["JavaScript","library","mail"],"content":"`mailto:`なリンクをクリックした時にメニューを表示してくれるライブラリ。\nGmailやOutlookで開くやコピーなどを選択できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"victorvoid/dinoql: A customizable GraphQL style query language for interacting with JavaScript objects.","url":"https://github.com/victorvoid/dinoql","tags":["GraphQL","JavaScript","library"],"content":"GraphQL構文でオブジェクトからデータを取得できるクエリライブラリ。\nAlias、Cache、Fragmentsなどをサポートしている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"msgpack/msgpack-javascript: MessagePack for JavaScript/ECMA-262","url":"https://github.com/msgpack/msgpack-javascript","tags":["JavaScript","library","TypeScript"],"content":"MessagePackのJavaScript実装。\nブラウザとNode.jsどちらでも動作し、Async Iteratorを使いストリーム処理ができるようになっている。","relatedLinks":[{"title":"TypeScriptで MessagePack encoder/decoder を実装した - Islands in the byte stream","url":"https://gfx.hatenablog.com/entry/2019/05/07/102341"}]}]},{"meta":{"title":"2019-05-21のJS: TypeScript 3.5 RC、Firefox DevTools改善、Accessibility Insights(アクセシビリティテスト) ","author":"azu","layout":"post","date":"2019-05-21T02:19:30.305Z","category":"JSer","tags":["TypeScript","Firefox","Accessibility"],"url":"https://jser.info/2019/05/21/typescript-3.5-rcfirefox-devtoolsaccessibility-insights/"},"items":[{"category":"Headline","title":"Release v3.14.0 · lerna/lerna","url":"https://github.com/lerna/lerna/releases/tag/v3.14.0","tags":["monorepo","Tools","JavaScript","ReleaseNote"],"content":"monorepo管理ツールのlerna 3.14.0リリース。\nnpm publish時の2要素認証(OTP)のサポート、`--conventional-prerelease`と`--conventional-graduate`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v2.7.0 · nuxt/nuxt.js","url":"https://github.com/nuxt/nuxt.js/releases/tag/v2.7.0","tags":["Vue","ReleaseNote"],"content":"Nuxt.js 2.7.0リリース。\nサーバサイドのログもブラウザコンソールに表示されるように、`store/`ディレクトリのファイル監視の改善など","relatedLinks":[{"title":"Nuxt.js v2.7.0 の変更点と注目のポイントまとめ - Qiita","url":"https://qiita.com/potato4d/items/43b4f17c73aebc7a2154"}]},{"category":"Headline","title":"Announcing TypeScript 3.5 RC | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-5-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.5 RCリリース。\n型チェックとビルドのパフォーマンス改善、`Omit`ヘルパー型を追加、Union型の改善など。\n破壊的な変更としてGeneric type parameterのデフォルトが`{}`から`unknown`へと変更、`target:es5`時に`Object.keys`がプリミティブ型を受け取らないように変更など","relatedLinks":[]},{"category":"Headline","title":"V8 release v7.5 · V8","url":"https://v8.dev/blog/v8-release-75","tags":["V8","ReleaseNote"],"content":"V8 v7.5リリース。\nWebAssemblyのコンパイル結果を暗黙的にキャッシュする変更、ECMAScript ProposalのNumeric separatorsを実装。\nネットワークからスクリプトを読み込みながらパースする際に、メインスレッドによってブロックされる問題を解消など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 82 | WebKit","url":"https://webkit.org/blog/8921/release-notes-for-safari-technology-preview-82/","tags":["safari","webkit","ReleaseNote"],"content":"Safari Technology Preview 82リリース。\nFetch APIの`keepAlive`オプションのサポート、Web GPU APIを`navigator.gpu`に移動など","relatedLinks":[]},{"category":"Headline","title":"Introducing the first Microsoft Edge preview builds for macOS - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2019/05/20/microsoft-edge-macos-canary-preview/","tags":["MSEdge","mac ","ReleaseNote"],"content":"MSEdgeのmacOS対応版がInsider Previewでリリースされた","relatedLinks":[]},{"category":"Article","title":"TypeScript 3.0: The unknown Type — Marius Schulz","url":"https://mariusschulz.com/blog/typescript-3-0-the-unknown-type","tags":["TypeScript","article"],"content":"TypeScript 3.0で導入された`unknown` typeについての解説。\n`any` typeとの違い、`unknown` typeに対して任意の操作ができない点、`unknown` typeは型を絞り込んでから使う点について","relatedLinks":[]},{"category":"Article","title":"Faster smarter JavaScript debugging in Firefox DevTools - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2019/05/faster-smarter-javascript-debugging-in-firefox/","tags":["firefox","debug","performance","article"],"content":"Firefox 67の開発者ツールの改善点について。\nロードパフォーマンスの改善、Break Pointの改善やLog Pointの対応、Web Workerスクリプトとの切り替えを改善、Source Mapを使った細かい表示の改善など","relatedLinks":[]},{"category":"Article","title":"const assertions are the killer new TypeScript feature","url":"https://blog.logrocket.com/const-assertions-are-the-killer-new-typescript-feature-b73451f35802","tags":["TypeScript","article"],"content":"TypeScript 3.4で導入されたconst assertionについて。\nリテラルの型拡大を防いだり、オブジェクトのプロパティを`readonly`にできるなど","relatedLinks":[]},{"category":"Article","title":"Google Fonts is Adding font-display 🎉—zachleat.com","url":"https://www.zachleat.com/web/google-fonts-display/","tags":["google","fonts","article"],"content":"Google Fontsが`display`パラメータで`font-display`プロパティの指定をサポートしたことについて。","relatedLinks":[{"title":"display=swapとはなにか - MOL","url":"https://t32k.me/mol/log/font-display-swap/"}]},{"category":"Article","title":"\\[Web フロントエンド\\] 状態更新ロジックをフレームワークから独立させる | Kabuku Developers Blog","url":"https://www.kabuku.co.jp/developers/framework-agnostic-state-modification","tags":["JavaScript","article"],"content":"immerを使ったステート更新ロジックに分け、Angular、Vue、Reactなどのフレームワーク内に組み込む方法について。","relatedLinks":[]},{"category":"SlideVideo","title":"JSでDoSる/ Shibuya.XSS techtalk #11 - Speaker Deck","url":"https://speakerdeck.com/masatokinugawa/shibuya-dot-xss-techtalk-number-11","tags":["JavaScript","node.js","slide","security"],"content":"JavaScriptで例外が発生するパターンやNode.jsでクラッシュするケーススタディについてのスライド","relatedLinks":[]},{"category":"WebsiteDocument","title":"DasSur.ma – Raw WebAssembly","url":"https://dassur.ma/things/raw-wasm/","tags":["WebAssembly","JavaScript","browser"],"content":"WebAssemblyがstack-based VMであるとはどういうことかを見ていく記事。\nWebAssembly text形式であるwatを手書きして、WebAssemblyでのモジュールの定義、関数の定義と呼び出し、メモリの確保、wasmの読み込みについて。","relatedLinks":[{"title":"Understanding WebAssembly text format - WebAssembly | MDN","url":"https://developer.mozilla.org/en-US/docs/WebAssembly/Understanding_the_text_format"}]},{"category":"WebsiteDocument","title":"Accessibility Insights","url":"https://accessibilityinsights.io/","tags":["accessibility","Chrome","windows","Extension"],"content":"アクセシビリティのチェックを補助するブラウザ拡張。\nアクセシビリティのチェック項目を可視化したり、FastPassとAssessmentの2つのシナリオでのテストをサポートしている。","relatedLinks":[{"title":"microsoft/accessibility-insights-web: Accessibility Insights for Web","url":"https://github.com/Microsoft/accessibility-insights-web"},{"title":"Introduction to Accessibility Insights for Web - YouTube","url":"https://www.youtube.com/watch?v=U6NY8Cxym5g"}]},{"category":"WebsiteDocument","title":"Inside Microsoft’s surprise decision to work with Google on its Edge browser - The Verge","url":"https://www.theverge.com/2019/5/6/18527550/microsoft-chromium-edge-google-history-collaboration","tags":["MSEdge","Chrome","インタビュー","OSS","google","MS"],"content":"MSEdgeがChromiumベースになった背景について。\n最初はEdgeの利用率、最新の機能の実装遅れなどの問題を解決する選択肢の一つだったが、組織改編、Septagonというプロトタイプ、切り替えの公表から実際の作業に入った話など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Reakit","url":"https://reakit.io/","tags":["React","accessibility","library"],"content":"アクセシビリティを考慮したReactコンポーネントライブラリ。\nReact Hooksへの対応や基礎的なコンポーネントを提供し、コンポーネントを組み合わせ利用できるようにすることを目的にしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"esxjs/esx: Like JSX, but native and fast","url":"https://github.com/esxjs/esx","tags":["jsx","React","node.js","library"],"content":"JSXライクな構文をサポートしたTagged Templateライブラリ。\nまたReactをesxの構文に変換するBabelプラグインもあり、ReactのSSRテンプレートエンジンとしても利用できる","relatedLinks":[]}]},{"meta":{"title":"2019-05-28のJS: express 4.17.0、Firefox 67.0、TypeScriptのstrictNullCheckを有効化するステップ","author":"azu","layout":"post","date":"2019-05-28T01:02:25.539Z","category":"JSer","tags":["express","node.js","firefox","TypeScript"],"url":"https://jser.info/2019/05/28/express-4.17.0firefox-67.0typescriptstrictnullcheck/"},"items":[{"category":"Headline","title":"Node v12.3.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v12.3.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v12.3.0リリース。\n`wasm`ファイルをimportできる`--experimental-wasm-modules`オプションの追加、`Readable.from`の追加など","relatedLinks":[]},{"category":"Headline","title":"Ember.js - Ember 3.10 Released","url":"https://blog.emberjs.com/2019/05/21/ember-3-10-released.html","tags":["JavaScript","library","ReleaseNote"],"content":"Ember 3.10リリース。\nネストしたコンポーネントやビルトインコンポーネントを`<Input />`のようにAngle bracketで記述できるように、Decoratorのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 4.17.0 · expressjs/express","url":"https://github.com/expressjs/express/releases/tag/4.17.0","tags":["node.js","server","ReleaseNote"],"content":"express 4.17.0リリース。 middlewareとしてBodyをBufferへパースする`express.raw`、Bodyをテキストにパースする`express.text`の追加。\n`X-Forwarded-Host`でカンマ区切りの複数Hostに対応など","relatedLinks":[]},{"category":"Headline","title":"Firefox 67.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/67.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 67.0リリース。\nパフォーマンスや開発者ツールの改善、`Cross-Origin-Opener-Policy`の実装。\n開発者ツールからCanvas debugger、Web Audio Editor、Shader editorを削除など","relatedLinks":[{"title":"Firefox 67 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/docs/Mozilla/Firefox/Releases/67"},{"title":"Deprecated tools - Firefox Developer Tools | MDN","url":"https://developer.mozilla.org/ja/docs/Tools/Deprecated_tools"},{"title":"Firefox 67 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.com/ja/versions/67/"}]},{"category":"Article","title":"Folding the DOM - Josh W. Comeau's Blog","url":"https://www.joshwcomeau.com/posts/folding-the-dom/","tags":["CSS","JavaScript","React","article","tutorial"],"content":"CSSを使って画像の折りたたみ表現を実装していくチュートリアル。\nPosition、Transform、Perspectiveを組み合わせて折りたたみのアニメーションを実装していく話","relatedLinks":[]},{"category":"Article","title":"Strict null checking the Visual Studio Code codebase","url":"https://code.visualstudio.com/blogs/2019/05/23/strict-null","tags":["VSCode","TypeScript","article"],"content":"VSCodeのコードベースでTypeScriptのstrict null checkを有効化した話。\n`strictNullCheck`が`false`のときによく起きていた問題と1800ファイルあるコードをどのように修正していったかについて。\n`strictNullCheck`を有効化した`tsconfig.json`を作り、`files`に追加しながら修正していった","relatedLinks":[]},{"category":"Article","title":"Graphics Team ships WebRender MVP! – Mozilla Gfx Team Blog","url":"https://mozillagfx.wordpress.com/2019/05/21/graphics-team-ships-webrender-mvp/","tags":["firefox","article"],"content":"Firefox 67でNVIDIAのグラフィックカードを利用してるユーザー(4%)向けて、GPUベースのレンダラであるWebRenderをロールアウトしていくリリーススケジュールについて","relatedLinks":[]},{"category":"Article","title":"Handling Errors in Vue.js","url":"https://www.raymondcamden.com/2019/05/01/handling-errors-in-vuejs","tags":["Vue","article"],"content":"Vueでのエラーハンドリングについての記事。\n`Vue.config.errorHandler`、`Vue.config.warnHandler`、`renderError`、`errorCaptured`について","relatedLinks":[]},{"category":"Article","title":"Paint Holding - reducing the flash of white on same-origin navigations  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/05/paint-holding","tags":["Chrome","article","browser","dart"],"content":"Chrome 76でページ遷移時にページを真っ白にするのではなく、最後の描画を維持した状態で切り替わるようにするPaint Holdingという仕組みが入るという話","relatedLinks":[]},{"category":"Article","title":"SPAにおける状態管理: 関数型のアプローチも取り入れるフロントエンド系アーキテクチャの変遷 - エンジニアHub｜若手Webエンジニアのキャリアを考える！","url":"https://employment.en-japan.com/engineerhub/entry/2019/05/23/103000","tags":["JavaScript","article"],"content":"SPAにおける状態管理の変化について。\nBackbone.jsでのModel/View/Controller、Two Way Data-Binding、Fluxなどの状態管理の問題と解決したことについて","relatedLinks":[]},{"category":"Article","title":"WebAssembly at eBay: A Real-World Use Case","url":"https://www.ebayinc.com/stories/blogs/tech/webassembly-at-ebay-a-real-world-use-case/","tags":["WebAssembly","JavaScript","article"],"content":"WebAssemblyのユースケースとしてバーコードリーダを実装した話。\nC++からemscriptenでコンパイルしたwasmを使うことで、JavaScriptの実装よりもFPSが上がった。\nしかし、カメラの特性により認識率がいまいち上がらず、C++の実装2つとJavaScriptの実装を組み合わせて利用した話","relatedLinks":[]},{"category":"WebsiteDocument","title":"wagerfield/parallax: Parallax Engine that reacts to the orientation of a smart device","url":"https://github.com/wagerfield/parallax","tags":["JavaScript","library","browser"],"content":"ブラウザのViewportのサイズやスクロール、マウスの動きなどの変化を監視できるライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"projectfluent/fluent.js: JavaScript implementation of Project Fluent","url":"https://github.com/projectfluent/fluent.js","tags":["i18n","library"],"content":"ローカライズフレームワーク。\nFTLという構文で記述し、`Intl`オブジェクトをベースにしたローカライズを行う。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"yankouskia/hurried: ⚡️ JavaScript library for parallel code execution","url":"https://github.com/yankouskia/hurried","tags":["node.js","JavaScript","library"],"content":"`worker_thread`モジュールを使ったNode.js向けのThreadライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"azu/exponential-backoff-generator: Exponential backoff generator. Provide robust retry function.","url":"https://github.com/azu/exponential-backoff-generator","tags":["JavaScript","library"],"content":"Generatorを使ったExponential backoffライブラリ。\nasync/awaitと組み合わせて非同期処理のリトライを`for...of`で記述できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sghall/react-vertex: React Vertex | Hooks-based WebGL library for React","url":"https://github.com/sghall/react-vertex","tags":["WebGL","React","library"],"content":"HooksベースなWebGLを扱うReactコンポーネント","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Rocketseat/unform: ReactJS form library to create uncontrolled form structures with nested fields, validations and much more!","url":"https://github.com/Rocketseat/unform","tags":["React","library"],"content":"Uncontrolledなフォームを扱うReactコンポーネント。\nバリデーション、構造的なデータ、リセットなどの機能を提供している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vitalets/await-timeout: A Promise-based API for setTimeout / clearTimeout","url":"https://github.com/vitalets/await-timeout","tags":["Promises","JavaScript","library"],"content":"Promiseベースの`setTimeout`、`clearTimeout`のラッパーライブラリ。\n既存のPromiseオブジェクトてもタイムアウトを設定できる","relatedLinks":[]}]},{"meta":{"title":"2019-06-04のJS: async.js 3.0.0(async/await対応)、AVA 2.0.0、Verdaccio 4(npm registry)","author":"azu","layout":"post","date":"2019-06-04T00:22:44.527Z","category":"JSer","tags":["node.js","testing","npm","registry"],"url":"https://jser.info/2019/06/04/async.js-3.0.0asyncawaitava-2.0.0verdaccio-4npm-registry/"},"items":[{"category":"Headline","title":"async/CHANGELOG.md at master · caolan/async","url":"https://github.com/caolan/async/blob/master/CHANGELOG.md#v300","tags":["JavaScript","library","ReleaseNote"],"content":"async 3.0.0リリース。\n`async`モジュールのメソッドがcallbackを指定していない場合に、Promiseを返すように、コレクションメソッドでAsync Generatorのサポート、`cargoQueue`の追加など。\nまた、ES2015のコードベースになったため、古いブラウザやNode 4以下のサポート終了。","relatedLinks":[]},{"category":"Headline","title":"Node v10.16.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v10.16.0/","tags":["node.js","ReleaseNote"],"content":"Node v10.16.0(LTS)リリース。\nnpm 6.9.0への更新、`zlib`モジュールのbrotliサポートのバックポート、`events`モジュールの`once`メソッドのバックポートなど","relatedLinks":[]},{"category":"Headline","title":"W3C and WHATWG to work together to advance the open Web platform | W3C Blog","url":"https://www.w3.org/blog/2019/05/w3c-and-whatwg-to-work-together-to-advance-the-open-web-platform/","tags":["W3C","WHATWG","news"],"content":"W3CはHTMLとDOMに関する標準策定をやめ、WHATWGが策定しているLiving Standardを共同で策定していくことに合意した。\nまた、WHATWGはレビュードラフトと呼ばれる定期的なスナップショットをだし、これをW3Cプロセスに従う形で勧告まで進めるなどのプロセスの変更について書かれている。","relatedLinks":[]},{"category":"Headline","title":"Version 8 of Angular — Smaller bundles, CLI APIs, and alignment with the ecosystem","url":"https://blog.angular.io/version-8-of-angular-smaller-bundles-cli-apis-and-alignment-with-the-ecosystem-af0261112a27","tags":["Angular","ReleaseNote"],"content":"Angular 8.0.0リリース。\nmodern build(es2015)とlegacy build(es5)を出し分けロードするDifferential Loadingの有効化。\nRoute ConfigでDynamic Importsを使うように、CLI向けにBuilders APIの追加。\nIvyを`enableIvy`で試せるようになるなど","relatedLinks":[{"title":"Introducing CLI Builders – Angular Blog","url":"https://blog.angular.io/introducing-cli-builders-d012d4489f1b"},{"title":"angular/CHANGELOG.md at master · angular/angular","url":"https://github.com/angular/angular/blob/master/CHANGELOG.md#800-2019-05-28"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 83 | WebKit","url":"https://webkit.org/blog/8967/release-notes-for-safari-technology-preview-83/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 83リリース。\nWebAuthNのデフォルト有効化、CSSの`line-break: anywhere`、`display: flow-root`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v0.19.0 · axios/axios","url":"https://github.com/axios/axios/releases/tag/v0.19.0","tags":["JavaScript","library","ReleaseNote"],"content":"axios 0.19.0リリース。\nNode.jsでレスポンスがgzipなどでかつ204の場合に例外が発生する問題を修正、`maxContentLength`の設定を無視してリクエストを継続するDosにつながる問題を修正など。","relatedLinks":[{"title":"Release v0.18.1 · axios/axios","url":"https://github.com/axios/axios/releases/tag/v0.18.1"},{"title":"Destroy stream on exceeding maxContentLength (fixes #1098) by resure · Pull Request #1485 · axios/axios","url":"https://github.com/axios/axios/pull/1485"}]},{"category":"Headline","title":"Announcing TypeScript 3.5 | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-5/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.5リリース。\n型チェックのパフォーマンス改善、`--incremental`ビルドのパフォーマンス改善、`Omit`ヘルパー型の追加など。\n破壊的な変更として型パラメータの型が不明な場合の型が`{}`から`unknown`へ変更など","relatedLinks":[{"title":"What's new in TypeScript · microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/What's-new-in-TypeScript#typescript-35"},{"title":"Breaking Changes · microsoft/TypeScript Wiki","url":"https://github.com/Microsoft/TypeScript/wiki/Breaking-Changes#typescript-35"},{"title":"TypeScript v3.5.1 変更点 - Qiita","url":"https://qiita.com/vvakame/items/e7bbaff54db8fbf986bb"}]},{"category":"Headline","title":"Release v2.8.0 · nuxt/nuxt.js","url":"https://github.com/nuxt/nuxt.js/releases/tag/v2.8.0","tags":["Vue","library","ReleaseNote"],"content":"Nuxt.js 2.8.0リリース。\nSSRログの表示を改善、ビルド中のインジケータ表示の改善など","relatedLinks":[]},{"category":"Headline","title":"Release 2.0.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v2.0.0","tags":["JavaScript","testing","node.js","ReleaseNote"],"content":"AVA 2.0.0リリース。\nNode.js 8.9.4以降のサポート、snapshotが作られていない場合はCIで失敗するように、assertionメッセージが文字列ではない場合は例外を投げるようになるなど。","relatedLinks":[]},{"category":"Headline","title":"Verdaccio 4 released !!! · Verdaccio","url":"https://verdaccio.org/blog/2019/05/19/15-verdaccio-4-release.html","tags":["npm","Tools","ReleaseNote"],"content":"npm registry serverのOSS実装であるVerdaccio 4リリース。\nUIの刷新、`npm star`/`npm profile`のサポート、JWTサポート、Pluginsサポートの改善など","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 76)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/05/devtools","tags":["Chrome","article"],"content":"Chrome 76の開発者ツールの変更点について。\nネットワークパネル設定のUIの変更、WebSocketメッセージをHARファイルとしてエクスポートできるように、合計メモリ消費量のリアルタイム表示、Background Fetchのデバッグ機能など。","relatedLinks":[]},{"category":"Article","title":"イメージで伝われ！図解JavaScriptの非同期処理 - メモを揉め","url":"http://memowomome.hatenablog.com/entry/js_async_viz","tags":["JavaScript","article"],"content":"JavaScriptの同期処理と非同期処理の動作の違い、非同期処理の実装方法や考え方について","relatedLinks":[]},{"category":"SlideVideo","title":"JSConf EU 2019 - YouTube","url":"https://www.youtube.com/playlist?list=PL37ZVnwpeshHwJPVBqEnZild7QHWhdufu","tags":["JavaScript","イベント","video"],"content":"JSConf EU 2019の動画まとめ","relatedLinks":[{"title":"JSConf EU 2019","url":"https://2019.jsconf.eu/"}]},{"category":"SoftwareLibrary","title":"Zdog · Round, flat, designer-friendly pseudo-3D engine for canvas and SVG","url":"https://zzz.dog/","tags":["SVG","canvas","library"],"content":"擬似的な3D描画を行うCanvas、SVGライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"atomicojs/atomico: Small library for the creation of interfaces based on web-components, only using functions and hooks.","url":"https://github.com/atomicojs/atomico","tags":["WebComponents","library"],"content":"Web ComponentsベースのJSXでのDOM定義とReact HooksライクなAPIを提供するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mholt/PapaParse: Fast and powerful CSV (delimited text) parser that gracefully handles large files and malformed input","url":"https://github.com/mholt/PapaParse","tags":["JavaScript","library"],"content":"CSVパーサライブラリ","relatedLinks":[]}]},{"meta":{"title":"2019-06-10のJS: mathjs v6、Modern JavaScriptパッケージの配布、Audits in Web Inspector","author":"azu","layout":"post","date":"2019-06-10T16:21:33.839Z","category":"JSer","tags":["mathjs","Safari","npm"],"url":"https://jser.info/2019/06/11/mathjs-v6modern-javascriptaudits-in-web-inspector/"},"items":[{"category":"Headline","title":"Node v12.4.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v12.4.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 12.4.0リリース。\n`import`文でJSONを読み込める` --experimental-json-modules`フラグの削除、V8 heap profilerを扱う`--heap-prof`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"mathjs v6: a monolith turned modular - Jos de Jong","url":"https://josdejong.com/blog/2019/06/08/mathjs-v6-a-monolith-turned-modular/","tags":["JavaScript","library","ReleaseNote"],"content":"matchjs v6リリース。\nモジューラーなアプローチで利用できるように変更。\nグローバルな設定ではなく`create`関数で依存と設定から特定の機能を作れるように、ES moduleでimportした際にtree-shakingができるように。\nまた`number`のみをサポートしたバージョンも同梱されている。","relatedLinks":[{"title":"mathjs/HISTORY.md at develop · josdejong/mathjs","url":"https://github.com/josdejong/mathjs/blob/develop/HISTORY.md#2019-06-08-version-600"}]},{"category":"Headline","title":"Storybook 5.1","url":"https://medium.com/storybookjs/storybook-5-1-50afd02b5bbb","tags":["開発環境","UI","Tools","ReleaseNote"],"content":"Stroybook 5.1リリース。\nReact Nativeの再対応、A11y addonの改善、Context addonの追加、TypeScrip向けのpresetを追加など","relatedLinks":[{"title":"Real-time accessibility testing with Storybook","url":"https://medium.com/storybookjs/instant-accessibility-qa-linting-in-storybook-4a474b0f5347"},{"title":"Intro to Presets","url":"https://storybook.js.org/docs/presets/introduction/"}]},{"category":"Headline","title":"Release v3.0.0 · mqttjs/MQTT.js","url":"https://github.com/mqttjs/MQTT.js/releases/tag/v3.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"MQTT.js 3.0.0リリース。\nMQTT 5.0をサポート。","relatedLinks":[]},{"category":"Article","title":"Audits in Web Inspector | WebKit","url":"https://webkit.org/blog/8935/audits-in-web-inspector/","tags":["safari","debug","article"],"content":"Safariの開発者ツールに追加されたAudit Tabについて。\nデフォルトではアクセシビリティについてのAuditが含まれていて、自分でAuditのルールを定義して追加できるようになっている。\n例としてESLintを`*.js`に対して実行するAuditルールが挙げられている。","relatedLinks":[{"title":"Creating Web Inspector Audits | WebKit","url":"https://webkit.org/blog/8937/creating-web-inspector-audits/"}]},{"category":"Article","title":"An introduction to the MediaRecorder API - Twilio","url":"https://www.twilio.com/blog/mediastream-recording-api","tags":["JavaScript","audio","tutorial","article"],"content":"MediaRecorder APIで音声の録音とダウンロードを行うチュートリアル","relatedLinks":[]},{"category":"Article","title":"ECMAScript proposal updates @ 2019-06 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2019/06/09/ecmascript-proposal-updates","tags":["ECMAScript","proposal","article"],"content":"2019年6月のTC39ミーティングでStage変更があったECMAScript Proposalのまとめ。\nDynamic ImportがついにStage 4となった。","relatedLinks":[]},{"category":"Article","title":"Dive into IndexedDB","url":"https://flaviocopes.com/indexeddb/","tags":["JavaScript","article"],"content":"PromiseベースのIndexedDBラッパーである`idb`を使ったIndexedDBについてのチュートリアル。\nデータの追加、削除、マイグレーションについて","relatedLinks":[{"title":"jakearchibald/idb: IndexedDB, but with promises","url":"https://github.com/jakearchibald/idb"}]},{"category":"Article","title":"Enabling Modern JavaScript on npm","url":"https://jasonformat.com/enabling-modern-js-on-npm/","tags":["JavaScript","article","npm"],"content":"npmにパッケージとして公開するモジュールについて。\nBundleツールなどの変化によって、Transpile済みのファイルのみを配布すると利用者は最適化ができない問題について。\n`package.json`の`\"main\"`、`\"module\"`、`\"unpkg\"`フィールドと配布するモジュールの形式やパッケージ作者が配布時に気をつける点。\nまたmicrobundleや`@pika/pack`などのパッケージ配布の補助ツールについてなど","relatedLinks":[]},{"category":"Article","title":"CSS Grid Level 2 - subgrid is coming to Firefox - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2019/06/css-grid-level-2-subgrid-is-coming-to-firefox/","tags":["CSS","article"],"content":"CSS Grid Level 2のサブグリッドについて","relatedLinks":[]},{"category":"SlideVideo","title":"Inside Frontend #3 - YouTube","url":"https://www.youtube.com/playlist?list=PLZFhK-XSlb82hef6Sxyqcc-6e8xVTbaIE&app=desktop","tags":["HTML","CSS","JavaScript","node.js","video","イベント"],"content":"Inside Frontend #3 の動画一覧","relatedLinks":[{"title":"Inside Frontend | 2019年5月18日 Frontendカンファレンスを渋谷Abema Towersで開催","url":"https://inside-frontend.com/"}]},{"category":"WebsiteDocument","title":"npmfs - home","url":"https://npmfs.com/","tags":["npm","webservice"],"content":"npmに公開されているパッケージのソースコードビューアサービス。\n特定のバージョンのコードを参照したり、バージョン間のDiffを見られるようになっている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"urql","url":"https://formidable.com/open-source/urql/","tags":["GraphQL","React","library"],"content":"React Hooksに対応したGraphQLを扱うReact向けライブラリ。\nQueryの取得状態や取得結果を使ったコンポーネントを扱える","relatedLinks":[{"title":"Urql, Grown Up","url":"https://formidable.com/open-source/urql/"}]},{"category":"SoftwareLibrary","title":"lukeed/tinydate: A tiny (340B) reusable date formatter. Extremely fast!","url":"https://github.com/lukeed/tinydate","tags":["JavaScript","library"],"content":"ファイルサイズが小さなDate Formatterライブラリ。","relatedLinks":[]},{"category":"Book","title":"実践TypeScript ~ BFFとNext.js&Nuxt.jsの型定義~ | 吉井 健文 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/483996937X/","tags":["TypeScript","book"],"content":"2019年6月26日発売\nTypeSctiptとNext.js、Nuxt.jsについての書籍","relatedLinks":[]}]},{"meta":{"title":"2019-06-17のJS: react-redux 7.1.0(Hooksサポート)、Pika CDN、State of CSS 2019","author":"azu","layout":"post","date":"2019-06-17T01:22:37.368Z","category":"JSer","tags":["Redux","React","ESModules","CSS"],"url":"https://jser.info/2019/06/17/react-redux-7.1.0hookspika-cdnstate-of-css-2019/"},"items":[{"category":"Headline","title":"Release v2.5.0 · fastify/fastify","url":"https://github.com/fastify/fastify/releases/tag/v2.5.0","tags":["node.js","server","library"],"content":"Node.jsウェブフレームワークのfastify 2.5.0リリース。\nレスポンスタイムを取得できる`Reply#getResponseTime`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v7.1.0 · reduxjs/react-redux","url":"https://github.com/reduxjs/react-redux/releases/tag/v7.1.0","tags":["React","redux","library","ReleaseNote"],"content":"React-Redux 7.1.0リリース。\nReact Hooksに正式対応、`useSelector`の第2引数に`deps`オプションの追加など","relatedLinks":[{"title":"Hooks · React Redux","url":"https://react-redux.js.org/next/api/hooks"}]},{"category":"Headline","title":"Release v0.101.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.101.0","tags":["JavaScript","flowtype","ReleaseNote"],"content":"FlowType v0.101.0リリース。\ninexact object syntaxである`...`のlintに対応、関数の型パラメータのデフォルト型を指定可能になるなど","relatedLinks":[{"title":"On the Roadmap: Exact Objects by Default – Flow – Medium","url":"https://medium.com/flow-type/on-the-roadmap-exact-objects-by-default-16b72933c5cf"},{"title":"flow - allow type parameter defaults in function declarations by tanhauhau · Pull Request #10084 · babel/babel","url":"https://github.com/babel/babel/pull/10084"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 85 | WebKit","url":"https://webkit.org/blog/9281/release-notes-for-safari-technology-preview-85/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 85リリース。\nPointer Eventsの対応改善、`Promise.allSettled`の実装、ES PropoaslのNumeric Separatorを実装など","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 75  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/06/nic75","tags":["Chrome","ReleaseNote"],"content":"Chrome 75リリース。\n低遅延Canvasを利用できる`desynchronized`オプションのサポート、Web Share APIがファイルをサポート、ES ProposalのNumeric separatorのサポート。\nまた、`playsInline`のサポート、HTTPヘッダの`stale-while-revalidate`レスポンスディレティブのサポート、CSPで`script-src-attr`ディレクティブなどを追加など","relatedLinks":[{"title":"Google Developers Japan: Chrome 75: 低遅延キャンバス コンテキスト、ファイル共有、数値セパレータ","url":"https://developers-jp.googleblog.com/2019/06/chrome-75.html"}]},{"category":"Headline","title":"TypeScript Playground | The unofficial playground for advanced TypeScript users","url":"https://playground.type-puzzle.org/","tags":["TypeScript","Tools"],"content":"`@types/*`モジュールの型も解決できるTypeScript  Playground","relatedLinks":[{"title":"「外部パッケージの型定義もインストールし推論できるTypeScript playgroundを作った」という題で登壇してきました＋スライドの補足 | WEB EGG","url":"https://blog.leko.jp/post/introduce-the-new-typescript-playground-for-advanced-use/"}]},{"category":"Article","title":"How to Use the Web Share API | CSS-Tricks","url":"https://css-tricks.com/how-to-use-the-web-share-api/","tags":["WebPlatformAPI","JavaScript","article"],"content":"Web Share APIの使い方についての記事。サポートブラウザやFeature Detect、APIの使い方について。\nまたサポートしていない場合のFallbackについて","relatedLinks":[]},{"category":"Article","title":"Unpacking hoisting","url":"http://2ality.com/2019/05/unpacking-hoisting.html","tags":["JavaScript","article"],"content":"`var`や`function`などのHoistingの動作を別の角度から解説した記事。\nES2015からはスコープのTopに移動するという説明になっているという話。","relatedLinks":[]},{"category":"SlideVideo","title":"The modern PWA Cheat Sheet by Maximiliano Firtman | JSConf EU 2019 - YouTube","url":"https://www.youtube.com/watch?v=cybhV88KLfI","tags":["PWA","video"],"content":"PWAについての発表動画。\nライフサイクル、Web API、iOS、Web APKsやアプリとしての配布についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"Pika CDN - Pika","url":"https://www.pika.dev/cdn","tags":["JavaScript","module","webservice"],"content":"ES Moduleに対応したnpmモジュールCDNサービス。\nUA別に最適化したビルド結果のパッケージを返すことができる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"The State of CSS 2019","url":"https://2019.stateofcss.com/","tags":["CSS","アンケート"],"content":"State of CSS 2019のアンケート結果。\nFlexboxやGridなどのレイアウト、単位、Pre & Post Processors、エディタやツールなどの利用についてのアンケート結果","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tradingview/lightweight-charts: Financial lightweight charts built with HTML5 canvas","url":"https://github.com/tradingview/lightweight-charts","tags":["グラフ","library"],"content":"Financial Chartライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nikersify/jay: 😎 Supercharged JavaScript REPL","url":"https://github.com/nikersify/jay","tags":["node.js","Tools"],"content":"`require`で外部npmモジュールの自動インストール、`require`キャッシュの破棄などの機能を含んだNode REPL。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"josdejong/workerpool: Offload tasks to a pool of workers on node.js and in the browser","url":"https://github.com/josdejong/workerpool","tags":["node.js","JavaScript","library"],"content":"ブラウザのWeb WorkerやNode.jsの`worker_threads`に対応したWorker Poolライブラリ。","relatedLinks":[]},{"category":"Book","title":"仕事ですぐに使えるTypeScript — 仕事ですぐに使えるTypeScript ドキュメント","url":"https://future-architect.github.io/typescript-guide/index.html","tags":["TypeScript","book","tutorial"],"content":"TypeScriptについて学ぶためのドキュメント。\n基本的なJavaScriptの書き方、型の書き方、アプリケーションの作成についてなど","relatedLinks":[{"title":"TypeScript教育用コンテンツ公開のお知らせ | Future Tech Blog - フューチャーアーキテクト","url":"https://future-architect.github.io/articles/20190612/"}]}]},{"meta":{"title":"2019-06-25のJS: ESLint 6.0.0、Vue Function API、Google検索とService Worker","author":"azu","layout":"post","date":"2019-06-25T00:42:03.152Z","category":"JSer","tags":["ESLint","Vue","ServiceWorker"],"url":"https://jser.info/2019/06/25/eslint-6.0.0vue-function-apigoogleservice-worker/"},"items":[{"category":"Headline","title":"V8 release v7.6 · V8","url":"https://v8.dev/blog/v8-release-76","tags":["V8","ReleaseNote"],"content":"V8 7.6リリース。\n`JSON.parse`、`Object.freeze`された配列のパフォーマンス改善。\nES Proposalの`Promise.allSettled`の実装、`BigInt`と`Intl.DateTimeFormat`の対応改善など","relatedLinks":[]},{"category":"Headline","title":"The npm Blog — Protecting Package Publishers: npm Token Security...","url":"https://blog.npmjs.org/post/185680936500/protecting-package-publishers-npm-token-security","tags":["npm","Github","security"],"content":"GitHubにnpmのtokenが誤って公開された場合に自動的にrevokeされるようになった。","relatedLinks":[]},{"category":"Headline","title":"Introducing Microsoft Edge preview builds for Windows 7, Windows 8, and Windows 8.1 - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2019/06/19/introducing-microsoft-edge-preview-builds-for-windows-7-windows-8-and-windows-8-1/","tags":["MSEdge","ReleaseNote"],"content":"Chromium版MSEdgeのプレビュービルドがWindows 7、8、8.1に対応した。","relatedLinks":[]},{"category":"Headline","title":"ESLint v6.0.0 released -","url":"https://eslint.org/blog/2019/06/eslint-v6.0.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 6.0.0リリース。\n`eslint:recommended`のルール更新、プラグインの読み込み時の動作変更、不正な設定値のチェックの厳密化、正規表現をオプション値として受け付ける場合に`u`フラグをデフォルトとするように変更など","relatedLinks":[{"title":"Migrating to v6.0.0 -","url":"https://eslint.org/docs/user-guide/migrating-to-6.0.0"},{"title":"ESLint v6.0.0 の変更点まとめ - Qiita","url":"https://qiita.com/mysticatea/items/274347ff9473b26b575a"}]},{"category":"Headline","title":"\\[Release News\\] TOAST UI Grid 4.0 is Finally Here! - TOAST UI - Medium","url":"https://medium.com/@toastui/release-news-toast-ui-grid-4-0-is-finally-here-585934ddf091","tags":["JavaScript","library","ReleaseNote"],"content":"Preactを使ったグリッドUIライブラリのTOASTUI Grid 4.0リリース。\nファイルサイズの削減、TypeScriptに書き換え、Column Virtual Scrollの対応など","relatedLinks":[{"title":"nhn/tui.grid: 🍞🔡 The Powerful Component to Display and Edit Data. Experience the Ultimate Data Transformer!","url":"https://github.com/nhn/tui.grid#features"}]},{"category":"Headline","title":"rfcs/0000-function-api.md at function-apis · vuejs/rfcs","url":"https://github.com/vuejs/rfcs/blob/function-apis/active-rfcs/0000-function-api.md","tags":["Vue","proposal","issue"],"content":"VueにReact HooksのようなFunction-basedコンポーネントを導入するRFCが公開された。\nVue 2.x、3.xを対象に後方互換性を保った新しい機能として追加するProposal。","relatedLinks":[{"title":"Function-based Component API by yyx990803 · Pull Request #42 · vuejs/rfcs","url":"https://github.com/vuejs/rfcs/pull/42"},{"title":"Function-based component API (extended discussion) · Issue #55 · vuejs/rfcs","url":"https://github.com/vuejs/rfcs/issues/55"}]},{"category":"Article","title":"Why we prefer CSS Custom Properties to SASS variables | CodyHouse","url":"https://codyhouse.co/blog/post/css-custom-properties-vs-sass-variables","tags":["CSS","article"],"content":"Sassの変数とCSS Custom Propertiesの役割の違いについて。\nCSS Custom Propertiesを使った場合の利点についてなど","relatedLinks":[]},{"category":"Article","title":"React-axe で React アプリケーションのアクセシビリティを向上させる - Mercari Engineering Blog","url":"https://tech.mercari.com/entry/2019/06/18/190000","tags":["React","article","accessibility"],"content":"React-axeでReactアプリケーションのアクセシビリティについてをチェックすることについて。\nReact-axeで自動的にチェックできる項目とできない項目についてなど","relatedLinks":[]},{"category":"Article","title":"Bringing service workers to Google Search  |  web.dev","url":"https://web.dev/google-search-sw/","tags":["JavaScript","ServiceWorker","article"],"content":"Google検索でのService Worker利用と工夫について。\nNavigation Preloadでのオーバーヘッドの対応、SWのScopeの問題とルーティング、SWでクッキーが扱えない問題の対応、ユーザー毎にSWスクリプトの動的作成。\nSWスクリプトの`Cache-Control`の設定、アプリに合わせたSWの設定についてなど","relatedLinks":[]},{"category":"Article","title":"Array.prototype.flat and Array.prototype.flatMap · V8","url":"https://v8.dev/features/array-flat-flatmap","tags":["JavaScript","ECMAScript","article"],"content":"ES2019で入る予定のArray#flatとArray#flatMapの使い方について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"yankouskia/get-browser: 💻 Lightweight tool to identify the browser (+ mobile/desktop detection)📱","url":"https://github.com/yankouskia/get-browser/","tags":["JavaScript","library"],"content":"UserAgentベースのブラウザ判定ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pirix-gh/ts-toolbelt: 👷 Higher type safety for TypeScript","url":"https://github.com/pirix-gh/ts-toolbelt","tags":["TypeScript","library"],"content":"TypeScriptの型ユーティリティライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"daybrush/scenejs: 🎬 Scene.js is JavaScript & CSS timeline-based animation library","url":"https://github.com/daybrush/scenejs","tags":["JavaScript","animation","library"],"content":"CSS Animationベースのアニメーションライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"microsoft/just: The task library that just works","url":"https://github.com/microsoft/just","tags":["JavaScript","Tools"],"content":"Task Runner/Build library。\n`just-task`ではgulpのようにタスクを定義して実行できる。`just-scripts`というTypeScript/Jest/webpackなどを簡単に扱えるビルドライブラリが用意されている。","relatedLinks":[{"title":"Just ","url":"https://microsoft.github.io/just/"}]}]},{"meta":{"title":"2019-07-04のJS: npm 6.9.2、ECMAScript 2019リリース、Dark Mode","author":"azu","layout":"post","date":"2019-07-04T00:58:09.567Z","category":"JSer","tags":["npm","ECMAScript","Chrome","DarkMode"],"url":"https://jser.info/2019/07/04/npm-6.9.2ecmascript-2019dark-mode/"},"items":[{"category":"Headline","title":"Release: npm@6.9.1 - 📣 announcements - npm forum","url":"https://npm.community/t/release-npm-6-9-1/8435","tags":["npm","ReleaseNote"],"content":"npm 6.9.1リリース。\n`npm token create`のバグ修正、`npm --global outdated`が動かない問題の修正など\n\n6.9.1には問題があったため、[npm@6.9.2](https://npm.community/t/release-npm-6-9-2/8464)もリリースされている。","relatedLinks":[]},{"category":"Headline","title":"Node v12.5.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v12.5.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 12.5.0リリース。\nV8スナップショットをデフォルトで有効化し起動時間の削減、V8とOpenSSLのアップデート、`worker.terminate()`がPromiseを返すように変更など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 86 | WebKit","url":"https://webkit.org/blog/9375/release-notes-for-safari-technology-preview-86/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 86リリース。\n`String.prototype.matchAll`のサポート、CSSの`tab-size`プロパティのサポート、Web Shading Language(WHLSL)の試験的実装など","relatedLinks":[{"title":"Web High Level Shading Language | WebKit","url":"https://webkit.org/blog/8482/web-high-level-shading-language/"}]},{"category":"Headline","title":"Yarn support for security alerts - The GitHub Blog","url":"https://github.blog/2019-07-02-yarn-support-for-security-alerts/","tags":["Github","security","news","yarn"],"content":"GitHub Security Alertがyarn.lockをサポート","relatedLinks":[]},{"category":"Headline","title":"Ecma latest news","url":"https://www.ecma-international.org/news/index.html","tags":["ECMAScript","news"],"content":"ECMAScript 2019リリース。\nECMAScript 2019がEcma総会で承認された。","relatedLinks":[{"title":"Standard ECMA-262","url":"https://www.ecma-international.org/publications/standards/Ecma-262.htm"}]},{"category":"Article","title":"The Secret of Good Electron Apps","url":"https://jlongster.com/secret-of-good-electron-apps","tags":["Electron","article","debug"],"content":"Electronアプリのパターンについての記事。\nメモリの消費を抑えるために、バックグラウンドサーバを作り必要なデータを都度読み込んで返すようにする。\nまた開発時はバックグラウンドサーバの代わりに別のウィンドウを使うことでデバッグがしやすくなることについてなど","relatedLinks":[{"title":"jlongster/electron-with-server-example: An example Electron app with a backend server all wired up via IPC","url":"https://github.com/jlongster/electron-with-server-example"}]},{"category":"Article","title":"The Layout Instability API  |  web.dev","url":"https://web.dev/layout-instability-api","tags":["Chrome","WebPlatformAPI","article"],"content":"Chrome 74で試験的に実装されているレイアウトの意図しない変化を監視するLayout Instability APIについて。\nロード後に非同期なタイミングで要素の位置が変化するといった現象を検知できるAPI","relatedLinks":[{"title":"WICG/layout-instability: A proposal for a Layout Instability specification","url":"https://github.com/WICG/layout-instability"}]},{"category":"Article","title":"Hello Darkness, My Old Friend  |  web.dev","url":"https://web.dev/prefers-color-scheme","tags":["Chrome","browser","article"],"content":"Dark Modeについての記事。\nアクセシビリティツールとしての効果、バッテリー消費を削減する事があることについて。\nまたOSでのDark Modeの設定方法、ウェブサイド側のMedia Queryを使った判定や`prefers-color-scheme`でのDark Mode対応についてなど","relatedLinks":[]},{"category":"Article","title":"Object.fromEntries · V8","url":"https://v8.dev/features/object-fromentries","tags":["ECMAScript","article","JavaScript"],"content":"ES2019で入った`Object.fromEntries`についての解説。\nIterableからObjectを作成して返すAPI。\nMapとObject間のやり取りに利用できる","relatedLinks":[]},{"category":"Article","title":"The cost of JavaScript in 2019 · V8","url":"https://v8.dev/blog/cost-of-javascript-2019","tags":["JavaScript","article","performance"],"content":"V8におけるJavaScriptのパースコストについての記事。\nMain ThreadとWorker Thread、JSONのパースコストについてなど","relatedLinks":[]},{"category":"Article","title":"Reinventing Firefox for Android: a Preview - Future Releases","url":"https://blog.mozilla.org/futurereleases/2019/06/27/reinventing-firefox-for-android-a-preview/","tags":["Firefox","Android","article"],"content":"GeckoViewを搭載したAndroid向けのFirefox Previewが公開された。\nFirefox for Androidに比べてパフォーマンスの改善、Tracking Protectionがデフォルトで有効といった違いがある。","relatedLinks":[{"title":"GeckoView in 2019 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2019/06/geckoview-in-2019/"}]},{"category":"SlideVideo","title":"Analysis of an Exploited NPM Package || Jarrod Overson - YouTube","url":"https://www.youtube.com/watch?v=2cyib2MgvdM","tags":["npm","node.js","video"],"content":"`event-stream@3.3.6`と`flatmap-stream`などnpmパッケージに悪意あるコードが含まれていた事件についての解説をしてる発表動画。\nどのような攻撃コードが含まれていたのかや時系列、影響範囲などについて","relatedLinks":[{"title":"event-stream vulnerability explained - Zach Schneider","url":"https://schneider.dev/blog/event-stream-vulnerability-explained/"},{"title":"The npm Blog — Details about the event-stream incident","url":"https://blog.npmjs.org/post/180565383195/details-about-the-event-stream-incident"}]},{"category":"SlideVideo","title":"AbemaTVにおけるCSS is too fragile問題に対する解 / Solution of \"CSS is too fragile\" by AbemaTV - Speaker Deck","url":"https://speakerdeck.com/kubosho/solution-of-css-is-too-fragile-by-abematv","tags":["CSS","slide"],"content":"CSS Modulesにおいてディレクトリ変更で問題が発生したケースについてのスライド。\n読み込み順を明示的定義する方法に変更することで、読み込み順によってスタイルが変わってしまう問題を解決する話","relatedLinks":[]},{"category":"WebsiteDocument","title":"mixer/webpack-bundle-compare: A tool for comparing webpack bundle stats","url":"https://github.com/mixer/webpack-bundle-compare","tags":["webpack","Tools"],"content":"webpackのbundleファイルを分析するツール。\nwebpack pluginとしてstatsファイルを出力し、それを読みんで分析結果を表示するDashboardツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"adobe/ferrum: Features from the rust language in javascript: Provides Traits/Type classes & an advanced library for working with sequences/iterators in js","url":"https://github.com/adobe/ferrum","tags":["JavaScript","library","Rust"],"content":"オブジェクトのIteratate、\nSymbolをつかったRustインスパイアなTraits/Typeclassesなどを提供するライブラリ","relatedLinks":[]}]},{"meta":{"title":"2019-07-09のJS: Babel 7.5.0(Dynamic Import)、Next.js 9(Dynamic routing)、React Native 0.60","author":"azu","layout":"post","date":"2019-07-09T03:28:23.759Z","category":"JSer","tags":["Babel","Next.js","ReactNative"],"url":"https://jser.info/2019/07/09/babel-7.5.0dynamic-importnext.js-9dynamic-routingreact-native-0.60/"},"items":[{"category":"Headline","title":"Release v7.5.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v7.5.0","tags":["babel","ReleaseNote"],"content":"Babel 7.5.0リリース。\ndynamic importのサポートを`@babel/preset-env`に追加、\n`babel-plugin-transform-typescript`がnamespaceをサポートなど","relatedLinks":[{"title":"7.5.0 Released: dynamic import and F# pipelines · Babel","url":"https://babeljs.io/blog/2019/07/03/7.5.0"}]},{"category":"Headline","title":"Release 0.7.0 · markedjs/marked","url":"https://github.com/markedjs/marked/releases/tag/v0.7.0","tags":["JavaScript","Markdown","security","ReleaseNote"],"content":"marked 0.7.0リリース。\nXSS脆弱性を修正、`sanitize`と`sanitizer`オプションを非推奨化しDOMPurifyなどの外部ライブラリの利用を推奨するように変更。\nTableサポートをGFMオプションに移動など","relatedLinks":[]},{"category":"Headline","title":"Announcing React Native 0.60 · React Native","url":"https://facebook.github.io/react-native/blog/2019/07/03/version-60","tags":["React","iOS","Android","ReleaseNote"],"content":"React Native 0.60リリース。\nアクセシビリティの改善、スタート画面の変更、AndroidXのサポート、CocoaPodsの対応改善、コアからコミュニティに移動した`NetInfo`、`WebView`、`Geolocation`を削除など","relatedLinks":[{"title":"releases/CHANGELOG.md at master · react-native-community/releases","url":"https://github.com/react-native-community/releases/blob/master/CHANGELOG.md#060"}]},{"category":"Headline","title":"Blog - Next.js 9 | Next.js","url":"https://nextjs.org/blog/next-9","tags":["React","JavaScript","library","ReleaseNote"],"content":"Next.js 9リリース。\nTypeScriptのビルトインサポート、Next.jsのコアをTypeScriptで書き直し、Dynamically Routingのサポート、`api/`でAPI Routesのサポート。\nまた、ページごとのconfigをサポート、ビルドの最適化など","relatedLinks":[]},{"category":"Headline","title":"Node v12.6.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v12.6.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 12.6.0リリース。\n`child_process.exec`/`execFile`の返すPromiseオブジェクトが`child`プロパティを持つように、`process.resourceUsage()`の追加など","relatedLinks":[]},{"category":"Article","title":"Automatically detect memory leaks with Puppeteer - Article by Christoph Guttandin - Media Codings","url":"https://media-codings.com/articles/automatically-detect-memory-leaks-with-puppeteer","tags":["JavaScript","browser","testing"],"content":"Puppeteerを使ってウェブページのメモリリークテストを書く方法について。\n`page.queryObjects`を使って処理前後のHeapにあるオブジェクトの数を比較することでテストする方法について","relatedLinks":[{"title":"page.evaluateHandle(pageFunction","url":"https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pageevaluatehandlepagefunction-args"},{"title":"page.queryObjects(prototypeHandle)","url":"https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pagequeryobjectsprototypehandle"},{"title":"standardized-audio-context/memory.js at master · chrisguttandin/standardized-audio-context","url":"https://github.com/chrisguttandin/standardized-audio-context/blob/master/test/integration/memory.js"}]},{"category":"Article","title":"Request.destinationでリソースの種類別にキャッシュ戦略 | フロントエンドBlog | ミツエーリンクス","url":"https://www.mitsue.co.jp/knowledge/blog/frontend/201907/05_0944.html","tags":["Fetch","article"],"content":"Fetch APIの`Request.destination`について。\nService Workerで取得先のリソースの種類に応じたキャッシュの切り分けなどについて","relatedLinks":[]},{"category":"Article","title":"Using Slots In Vue.js — Smashing Magazine","url":"https://www.smashingmagazine.com/2019/07/using-slots-vue-js/","tags":["Vue","article"],"content":"VueのSlotについての記事。\n`<slot>`の使い方、`v-slot`ディレクトティブ、Scoped Slotについて。\nまた再利用可能なコンポーネントの書き方についてなど","relatedLinks":[]},{"category":"Article","title":"Fetch API: Building a Fetch Polyfill From Scratch (For Fun and Promise)","url":"https://www.valentinog.com/blog/fetch-api/","tags":["Fetch","article"],"content":"Fetch APIの簡単なPolyfillを書きながら、Fetch APIとPromiseについて学ぶ記事。","relatedLinks":[]},{"category":"Article","title":"CSS Custom Properties In The Cascade — Smashing Magazine","url":"https://www.smashingmagazine.com/2019/07/css-custom-properties-cascade/","tags":["CSS","article"],"content":"CSS Custom Propertiesについての記事。\nコンポーネント側の変数の定義とカスケーディング、コンポーネントとCSS Custom Propertiesなど応用的な内容","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tilk/digitaljs: Teaching-focused digital circuit simulator","url":"https://github.com/tilk/digitaljs","tags":["JavaScript","Tools"],"content":"ブラウザで動作する教育用の電子回路シミュレータ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jsdoctypeparser/jsdoctypeparser: Parser module for JsDoc or Closure Compiler format type-annotation.","url":"https://github.com/jsdoctypeparser/jsdoctypeparser","tags":["JavaScript","JSDoc","library"],"content":"JSDocパーサライブラリ。\nClosure Compiler形式、TypeScript形式などに対応していて、JSDocをパースしてASTを出力する。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"greggman/twgl.js: A Tiny WebGL helper Library","url":"https://github.com/greggman/twgl.js","tags":["WebGL","JavaScript","library"],"content":"WebGLヘルパーライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"frenic/csstype: Strict TypeScript and Flow types for style based on MDN data","url":"https://github.com/frenic/csstype","tags":["TypeScript","CSS","library"],"content":"MDNのデータをつかいCSSプロパティのTypeScript型定義を生成したライブラリ","relatedLinks":[]}]},{"meta":{"title":"2019-07-16のJS: Firefox 68.0、Hermes(JS Engine for React Native)、PageSpeed Insights 5","author":"azu","layout":"post","date":"2019-07-16T00:08:12.013Z","category":"JSer","tags":["Firefox","JavaScript","ReactNavtive","Performance","Google"],"url":"https://jser.info/2019/07/16/firefox-68.0hermesjs-engine-for-react-nativepagespeed-insights-5/"},"items":[{"category":"Headline","title":"Firefox 68.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/68.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 68.0リリース。\nFirefox ESRとなるバージョン。\n開発者ツールのネットワークパネルで特定のURLをブロックできるように、Android版でVisual Viewport APIの有効化、CSS Scroll Snapの仕様追従など","relatedLinks":[{"title":"Firefox 68: BigInts, Contrast Checks, and the QuantumBar - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2019/07/firefox-68-bigints-contrast-checks-and-the-quantumbar/"},{"title":"Firefox 68 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/68"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 87 | WebKit","url":"https://webkit.org/blog/9414/release-notes-for-safari-technology-preview-87/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 87リリース。\n`console.countReset`、`console.timeLog`の実装など","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0 · quasarframework/quasar","url":"https://github.com/quasarframework/quasar/releases/tag/v1.0.0","tags":["Vue","UI","library"],"content":"Vueを使ったUIフレームワークのQuasar 1.0.0リリース。","relatedLinks":[{"title":"Quasar 1.0","url":"https://medium.com/quasar-framework/quasar-1-0-4bc696d60c1b"}]},{"category":"Article","title":"WebDriver is Coming to Safari in iOS 13 | WebKit","url":"https://webkit.org/blog/9395/webdriver-is-coming-to-safari-in-ios-13/","tags":["safari","webdriver","article"],"content":"iOS 13でSafariにWebDriverサポートが追加されたことについて。\niOS SafariでのWebDriver対応について","relatedLinks":[]},{"category":"Article","title":"Snyk research team discovers severe prototype pollution security vulnerabilities affecting all versions of lodash | Snyk","url":"https://snyk.io/blog/snyk-research-team-discovers-severe-prototype-pollution-security-vulnerabilities-affecting-all-versions-of-lodash/","tags":["JavaScript","library","security","article"],"content":"lodash 4.17.12で修正されたPrototype Pollutionの脆弱性についての解説。","relatedLinks":[{"title":"Node.jsにおけるプロトタイプ汚染攻撃とは何か - ぼちぼち日記","url":"https://jovi0608.hatenablog.com/entry/2018/10/19/083725"},{"title":"Changelog · lodash/lodash Wiki","url":"https://github.com/lodash/lodash/wiki/Changelog#v41712"}]},{"category":"Article","title":"Web Components update: more time to upgrade to v1 APIs  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/07/web-components-time-to-upgrade","tags":["WebComponents","article"],"content":"ChromeのWeb Components v0 APIの廃止のスケジュールについて。\nChrome 80で削除予定、コマンドラインフラグでのテスト方法、Polyfillについてなど","relatedLinks":[]},{"category":"Article","title":"Yomguithereal's Shenanigans - Implementing an efficient LRU cache in JavaScript","url":"https://yomguithereal.github.io/posts/lru-cache","tags":["JavaScript","article","algorithm"],"content":"JavaScriptでのLRUの実装について。\nDouble Linked Listの仕組み、Mapを使った実装。\nLRUの更新コストの大部分は削除にあることなどについて","relatedLinks":[]},{"category":"Article","title":"Normalize CSS or CSS Reset?! - Elad Shechter - Medium","url":"https://medium.com/@elad/normalize-css-or-css-reset-9d75175c5d1e","tags":["CSS","article"],"content":"CSSのアーキテクチャに関する連載記事。\nCSS ResetとNormalizeのアプローチの比較、ファイル構成、複数サイト向けのレイヤー構成についてなど","relatedLinks":[]},{"category":"Article","title":"lesnitsky/webgl-month: 🎓 Daily WebGL tutorials","url":"https://github.com/lesnitsky/webgl-month","tags":["WebGL","tutorial","article"],"content":"WebGLチュートリアル","relatedLinks":[]},{"category":"Article","title":"How Google Pagespeed works: Improve Your Score and Search Engine Ranking","url":"https://calibreapp.com/blog/how-pagespeed-works/","tags":["google","performance","browser","article"],"content":"GoogleのPageSpeed Insights(PSI) 5.0について。\nPSI 5.0のスコアはLighthouseと同じになったことやLighthouseのスコア計算の仕組み、TTIの影響についてなど","relatedLinks":[{"title":"Release Notes  |  PageSpeed Insights  |  Google Developers","url":"https://developers.google.com/speed/docs/insights/release_notes"}]},{"category":"WebsiteDocument","title":"EasyGraphQL","url":"https://easygraphql.com/","tags":["GraphQL","library"],"content":"GraphQLツールキット。\nGraphQLのパーサ、モック、テストツール、トレーシングライブラリなど。\nまたFirebaseやnowでGraphQLサーバを動かすツールなどを公開している。","relatedLinks":[]},{"category":"WebsiteDocument","title":"QuickJS Javascript Engine","url":"https://bellard.org/quickjs/","tags":["JavaScript","software","C言語"],"content":"ES2019の仕様を実装したJavaScriptエンジン。\nCで実装されていて、外部依存を持たない。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"paulrosen/abcjs: javascript for rendering abc music notation","url":"https://github.com/paulrosen/abcjs","tags":["JavaScript","library"],"content":"ブラウザで楽譜をレンダリングするライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"facebook/hermes: Hermes is a small and lightweight JavaScript engine optimized for running React Native on Android.","url":"https://github.com/facebook/hermes","tags":["JavaScript","Android","React"],"content":"React NativeのAndroid向けのJavaScriptエンジン。\nJavaScriptをレジスターベースのバイトコードにコンパイルし、モバイルでも高速に起動することが目的。","relatedLinks":[]}]},{"meta":{"title":"2019-07-23のJS: TypeScript 3.6 Beta、postMessageとパフォーマンス、Node.js 12の変更点","author":"azu","layout":"post","date":"2019-07-23T01:11:39.658Z","category":"JSer","tags":["TypeScript","performance","Node.js"],"url":"https://jser.info/2019/07/23/typescript-3.6-betapostmessagenode.js-12/"},"items":[{"category":"Headline","title":"Ember.js - Ember 3.11 Released","url":"https://blog.emberjs.com/2019/07/15/ember-3-11-released.html","tags":["JavaScript","ReleaseNote"],"content":"Ember 3.11リリース。\n`...attributes`構文のサポート、`{{fn}}` helper、`{{on}}` modifierの追加。\n`Function.prototype.observes`の非推奨化など","relatedLinks":[]},{"category":"Headline","title":"Recommended security update | Yarn Blog","url":"https://yarnpkg.com/blog/2019/07/12/recommended-security-update/","tags":["yarn","ReleaseNote","security"],"content":"Yarn 1.17.3リリース。\n`*.yarnpkg.com`、`*.npmjs.org`, `*.npmjs.com`のレジストリに対する通信は自動的にhttpsで通信するようにする修正","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 3.6 Beta | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-6-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.6 ベータリリース。\nGenerator/Iteratorの型改善、 Array Spreadの変換の改善、Promiseの`await`忘れなどのエラー表示改善など","relatedLinks":[]},{"category":"Headline","title":"laverdet/isolated-vm: Secure & isolated JS environments for nodejs","url":"https://github.com/laverdet/isolated-vm","tags":["node.js","library","V8","JavaScript"],"content":"V8 Isolateを使ってNode.jsからJavaScriptを隔離した環境で実行するライブラリ","relatedLinks":[]},{"category":"Article","title":"Use React.memo() wisely","url":"https://dmitripavlutin.com/use-react-memo-wisely/","tags":["React","performance","article"],"content":"`React.memo()`の役割と使い方について","relatedLinks":[]},{"category":"Article","title":"Google deprecates XSS Auditor for Chrome | The Daily Swig","url":"https://portswigger.net/daily-swig/google-deprecates-xss-auditor-for-chrome","tags":["Chrome","XSS","article"],"content":"MSEdgeに続いてChromeのXSS Auditorも非推奨となることについて。","relatedLinks":[]},{"category":"Article","title":"ES proposal: private class fields","url":"https://2ality.com/2019/07/private-class-fields.html","tags":["ECMAScript","proposal","article"],"content":"ECMAScript Proposalのprivate class fieldsについて","relatedLinks":[]},{"category":"Article","title":"Is postMessage slow? — DasSur.ma","url":"https://dassur.ma/things/is-postmessage-slow/","tags":["JavaScript","browser","performance","article"],"content":"`postMessage`のパフォーマンスについての記事。Structured Clone algorithmとJSONシリアライズでのパフォーマンス比較。\nImmerJSを使った送信するオブジェクトの最小化、ArrayBufferのtransferableなバイナリフォーマットのパフォーマンス。\n100kbまではオブジェクト、それ以上のサイズならバイナリを検討することについて。","relatedLinks":[]},{"category":"Article","title":"Datadog と Lighthouse を利用した WebPerf の継続的計測 | mediba Creator × Engineer Blog","url":"https://ceblog.mediba.jp/post/186341145447/webperf-measuring-with-lighthouse-and-datadog","tags":["browser","performance","article"],"content":"Lighthouseで計測した値をDatadogに保存してメトリクスの可視化を行う方法について","relatedLinks":[]},{"category":"Article","title":"Weak references and finalizers · V8","url":"https://v8.dev/features/weak-references","tags":["JavaScript","ECMAScript","proposal","article"],"content":"`WeakMap`、`WeakSet`のweakの動作について。\nまたECMAScript Proposalである`WeakRef`と`FinalizationGroup`について。","relatedLinks":[{"title":"tc39/proposal-weakrefs: WeakRefs","url":"https://github.com/tc39/proposal-weakrefs"}]},{"category":"Article","title":"Node.js 12: The future of server-side JavaScript - LogRocket Blog","url":"https://blog.logrocket.com/node-js-12/","tags":["node.js","article"],"content":"Node.js 12の主な変更点について。\nV8の更新によるパフォーマンス改善、TLS 1.3の対応、ヒープサイズがメモリサイズによって決まるように、HTTPパーサの改善、Diagnostic reportsやheap dumpの同梱など。\nまた`worker_thread`のexperimentalフラグが外れ、試験的な機能としてES modulesの対応など","relatedLinks":[]},{"category":"SlideVideo","title":"Introduction - Content Security Policy","url":"https://csp.withgoogle.com/docs/index.html","tags":["CSP","security","browser","XSS"],"content":"CSP(Content Security Policy)についての解説サイト。\nCSPとはどのようにXSSを防ぐのか、使う理由/使わない理由、CSPの設定、FAQなどが書かれている","relatedLinks":[]},{"category":"WebsiteDocument","title":"IntrinsicLabs/osgood: Osgood is a secure, fast, and simple platform for running JavaScript HTTP servers.","url":"https://github.com/IntrinsicLabs/osgood","tags":["V8","server","Rust"],"content":"Rustで書かれたV8ベースのHTTPサーバ。ルーティングのハンドラはWorkerとして実行され、リクエストに対するレスポンスを返す","relatedLinks":[{"title":"Introducing Osgood - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/tlhunter/introducing-osgood-4k1m"}]},{"category":"SoftwareLibrary","title":"zerobias/effector: The state manager ☄️","url":"https://github.com/zerobias/effector","tags":["JavaScript","library"],"content":"ステート管理ライブラリ。\nEventsやEffectsを使い、StoreのStateを更新という一連の流れの名前空間を管理するDomainのAPIを提供しています。\nVueやReactなどUIフレームワーク向けのアダプターも提供しています。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gajus/lightship: Abstracts readiness/ liveness checks and graceful shutdown of Node.js services running in Kubernetes.","url":"https://github.com/gajus/lightship","tags":["Kubernetes","node.js"],"content":"Kubernetesのヘルスチェックなどに対する抽象層を提供するNode.jsライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ehmicky/test-each: 🤖 Repeat tests. Repeat tests. Repeat tests.","url":"https://github.com/ehmicky/test-each","tags":["JavaScript","library","testing"],"content":"Data Driven Testingを行うためのヘルパーライブラリ。\nデータからテストケースを作成するためのイテレートやSeed値を元にしたランダムな値を生成してテストできる","relatedLinks":[]}]},{"meta":{"title":"2019-07-30のJS: mithril.js 2、Electron 6、React入門ガイド","author":"azu","layout":"post","date":"2019-07-30T00:18:44.885Z","category":"JSer","tags":["mithril","Electron","React"],"url":"https://jser.info/2019/07/30/mithril.js-2electron-6react/"},"items":[{"category":"Headline","title":"Release v2.0.1 · MithrilJS/mithril.js","url":"https://github.com/MithrilJS/mithril.js/releases/tag/v2.0.1","tags":["JavaScript","library","ReleaseNote"],"content":"mithril.js 2.0リリース。\n破壊的変更として`m.redraw()`がデフォルトで非同期となり`m.redraw.sync()`の追加、`m.withAttr`の削除など。\nまた、`m.request`が`timeout`や`responseType`のサポート、IE10以下のサポート終了など","relatedLinks":[]},{"category":"Headline","title":"Node v12.7.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v12.7.0/","tags":["node.js","ReleaseNote"],"content":"Node v12.7.0リリース。\nnpm 6.10.0へアップデート、`pkg-exports` Proposalの試験的サポート、Policyのチェックを行う`--policy-integrity=sri`オプションの追加。\nまた、DockerのMemory制限(linux cgroupsでの設定)を正しく取得するように修正など","relatedLinks":[]},{"category":"Headline","title":"Release v5.2.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v5.2.0","tags":["Chrome","performance","ReleaseNote"],"content":"Lighthouse 5.2.0リリース。\nChrome 77に搭載予定。サードパーティスクリプトのパフォーマンスへの影響を表示できるように、メインスレッドの合計ブロック時間の計測など","relatedLinks":[{"title":"patrickhulce/third-party-web: Data on third party entities and their impact on the web.","url":"https://github.com/patrickhulce/third-party-web"}]},{"category":"Headline","title":"Release v4.38.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v4.38.0","tags":["webpack","ReleaseNote"],"content":"webpack v4.38.0 リリース。\nProgressPluginのパフォーマンス改善、chunk graphを生成時に親子関係を追跡することでインクリメントビルド時のchunk生成パフォーマンスを改善など","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · vuetifyjs/vuetify","url":"https://github.com/vuetifyjs/vuetify/releases/tag/v2.0.0","tags":["Vue","UI","library","ReleaseNote"],"content":"VueでMaterial Designを行うUIライブラリのVuetify 2.0リリース。\nMaterial Design 2に対応、新しいコンポーネントの追加など。\n1.5からのマイグレーションガイドも併せて公開されている","relatedLinks":[]},{"category":"Headline","title":"Release electron v6.0.0 · electron/electron","url":"https://github.com/electron/electron/releases/tag/v6.0.0","tags":["Electron","ReleaseNote"],"content":"Electron 6.0.0リリース。\nChromium 76へのアップデート、Cookies APIでPromiseのサポート、macOSでTouch IDでの認証を行う`promptTouchID()`の追加など。\nsandboxed renderersで非推奨となっていた`require('fs')`などでrequireできる挙動の削除など。代わりに明示的な `remote.require` を使う必要がある。","relatedLinks":[{"title":"Chromium Blog: Chrome 76 Beta: dark mode, payments, new PWA features and more","url":"https://blog.chromium.org/2019/06/chrome-76-beta-dark-mode-payments-new.html"}]},{"category":"Article","title":"What's New In DevTools (Chrome 77)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/07/devtools","tags":["Chrome","debug","article"],"content":"Chrome 77の開発者ツールの更新点について。\n要素のスタイルをコピーできるよう、Layout Instabilityの可視化、Lighthouse 5.1へのアップデート、ネットワークパネルにPrefetch cacheの表示が出るように。\nまた、Push通知などがApplicationパネルで確認できるようになるなど","relatedLinks":[]},{"category":"Article","title":"Understanding service worker life cycle - Vipul Nema - Medium","url":"https://medium.com/@vipulnema2610/understanding-service-worker-life-cycle-b6580aa4eb50","tags":["ServiceWorker","article"],"content":"Service Workerのライフサイクルの解説","relatedLinks":[]},{"category":"Article","title":"Keeping things fresh with stale-while-revalidate  |  web.dev","url":"https://web.dev/stale-while-revalidate/","tags":["browser","HTTP","article","performance"],"content":"Chrome 75とFirefox 68でサポートされた`stale-while-revalidate` HTTPヘッダサポートについて。\n一定時間はキャッシュを利用するが、同時にバックグラウンドでキャッシュを更新する。\n`Cache-Control: max-age=1, stale-while-revalidate=59`の挙動解説やユースケースなどについて","relatedLinks":[]},{"category":"Article","title":"Modern Script Loading","url":"https://jasonformat.com/modern-script-loading/","tags":["JavaScript","article"],"content":"scirpt要素でES Moduleに対応したモダンビルドとlegacyビルドの読み分けについて。","relatedLinks":[]},{"category":"Article","title":"The npm Blog — Monorepos and npm","url":"https://blog.npmjs.org/post/186494959890/monorepos-and-npm","tags":["npm","article"],"content":"npmを使ったmonorepoについて。\nlernaを使ったmonorepoの管理について紹介されている","relatedLinks":[{"title":"lerna/lerna: A tool for managing JavaScript projects with multiple packages.","url":"https://github.com/lerna/lerna"}]},{"category":"Article","title":"The Complete Introduction to React","url":"https://jscomplete.com/learn/complete-intro-react","tags":["React","document","tutorial"],"content":"React初心者向けに書かれたガイド。\nReactの基本的な書き方、JSX、コンポーネント、Hooks API、ユーザー入力の扱い方、副作用の管理についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"ScrapboxでのServiceWorkerとCacheの活用 - daiiz","url":"https://scrapbox.io/daiiz/Scrapbox%E3%81%A7%E3%81%AEServiceWorker%E3%81%A8Cache%E3%81%AE%E6%B4%BB%E7%94%A8","tags":["ServiceWorker","slide","browser","JavaScript"],"content":"Service Workerを使ったキャッシュ戦略についてのスライド。\n`request.destination`を使ったリクエスト判定、Quotaの容量と使用量、`X-Serviceworker-Cache`のレスポンスヘッダでのキャッシュ判定、キャッシュの更新についてなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cube-js/cube.js: 📊 Cube.js - Open Source Analytics Framework","url":"https://github.com/cube-js/cube.js","tags":["JavaScript","データベース","library"],"content":"Analyticsフレームワーク。\n分析データを保存、解析するためのバックエンドと分析したデータをグラフ表示、検索するためのフロントエンドを持つフレームワーク。\nデータベースはMySQL、Postgres、BigQuery、redshiftなどの各種データベースに対応している。","relatedLinks":[]},{"category":"Book","title":"入門Node.jsプログラミング（JonathanWexler 吉川邦夫 吉川邦夫）｜翔泳社の本","url":"https://www.shoeisha.co.jp/book/detail/9784798158624","tags":["node.js","book","JavaScript","翻訳"],"content":"2019年09月25日発売\nGet Programming with Node.jsの翻訳本。\nES2015をベースにしたNode.js入門本","relatedLinks":[]}]},{"meta":{"title":"2019-08-06のJS: Chrome 76、React 16.9、Slack Desktopのリファクタリング","author":"azu","layout":"post","date":"2019-08-06T01:52:28.429Z","category":"JSer","tags":["Chrome","React","Slack"],"url":"https://jser.info/2019/08/06/chrome-76react-16.9slack-desktop/"},"items":[{"category":"Headline","title":"New in Chrome 76  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/07/nic76","tags":["Chrome","ReleaseNote"],"content":"Chrome 76リリース。\nStage 4となった`Promise.allSettled()`の実装、`Blob#text()`/`Blob#arrayBuffer()`/`Blob#stream()`の追加。\nFetch Metadataリクエストヘッダ(`Sec-Fetch-*`)の実装、フラグ付きでCookieのデフォルトが`SameSite=Lax`となる変更が入るなど","relatedLinks":[{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features#milestone%3D76"},{"title":"Deprecations and removals in Chrome 76  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/06/chrome-76-deps-rems"},{"title":"w3c/webappsec-fetch-metadata: WebAppSec has adopted sec-metadata as fetch-metadata","url":"https://github.com/w3c/webappsec-fetch-metadata"}]},{"category":"Headline","title":"Release Workbox v5.0.0-alpha.0 · GoogleChrome/workbox","url":"https://github.com/GoogleChrome/workbox/releases/tag/v5.0.0-alpha.0","tags":["ServiceWorker","ReleaseNote","JavaScript"],"content":"Service WorkerフレームワークのWorkbox 5αリリース。\nService WorkerのRuntimeをCDNからではなく、ローカルを生成したものを使うように。\n`injectManifest`で置換されるプレースホルダが`[]`から`self.__WB_MANIFEST`に変更など","relatedLinks":[]},{"category":"Headline","title":"Release 10.0.0-rc.1 Biggus Fixus · preactjs/preact","url":"https://github.com/preactjs/preact/releases/tag/10.0.0-rc.1","tags":["React","JavaScript","library","ReleaseNote"],"content":"Preact 10.0.0 RC1リリース。\nPreact 8.xから10へのマイグレーションガイドが公開された。\nまたメンテナンスリリースとして8.5.0も公開された","relatedLinks":[{"title":"Release v8.5.0 · preactjs/preact","url":"https://github.com/preactjs/preact/releases/tag/v8.5.0"}]},{"category":"Headline","title":"Changelog for 16.9 (TODO: add date) by gaearon · Pull Request #16254 · facebook/react","url":"https://github.com/facebook/react/pull/16254","tags":["React","ReleaseNote","issue"],"content":"React 16.9 RC.0リリース。\n`<React.Profiler>`の追加、非推奨となっていた`UNSAFE_*`のライフサイクルメソッドに対する警告の表示、`<a href=\"javascript:\">`に対して警告を出すように。\nまた、DevToolsで`useState`の編集、Suspenseのトグル表示に対応、テスト用の`act`がAsync対応など","relatedLinks":[{"title":"Warn for javascript: URLs in DOM sinks by sebmarkbage · Pull Request #15047 · facebook/react","url":"http://example.com/"}]},{"category":"Article","title":"When a rewrite isn’t: rebuilding Slack on the desktop","url":"https://slack.engineering/rebuilding-slack-on-the-desktop-308d6fe94ae4","tags":["slack","JavaScript","refacoring","article"],"content":"Slack Desktopのアーキテクチャをどのようにリファクタリングしたかについて。\njQuery+SignalからReact+Reduxへの移行。\n既存のコードベースを維持しつつ、徐々にモダンへ移行していく戦略について。\n名前空間オブジェクトとモジュールの混在時における相互運用性。古いコードは新しいコードを直接importできず、新しいコードは古いコードを直接importできないという`legacy-interop`の概念の導入。\nMulti workspaceを意識した書き換えによってメモリ使用量の削減の効果などがあったことについてなど","relatedLinks":[]},{"category":"Article","title":"プロダクト間共通の React コンポーネントライブラリを運用する話 - SmartHR Tech Blog","url":"https://tech.smarthr.jp/entry/2019/08/01/151100","tags":["React","UI","library","TypeScript","article"],"content":"アプリケーション間の共通UIをライブラリ化することについて。\nReact + TypeScript + Styled Componentsでの実装、Storybookでのプレビューやreg-suitでの回帰テストについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"WebMemex/freeze-dry: Snapshots a web page to get it as a static, self-contained HTML document.","url":"https://github.com/WebMemex/freeze-dry","tags":["JavaScript","library","DOM"],"content":"ウェブサイトのDOMとリソースのスナップショットを取るライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"harttle/liquidjs: A shopify compatible Liquid template engine in pure JavaScript.","url":"https://github.com/harttle/liquidjs","tags":["JavaScript","library","template","TypeScript"],"content":"Liquid互換のテンプレートエンジンのJavaScript実装","relatedLinks":[]},{"category":"SoftwareLibrary","title":"unshiftio/url-parse: Small footprint URL parser that works seamlessly across Node.js and browser environments.","url":"https://github.com/unshiftio/url-parse","tags":["JavaScript","library","browser","node.js"],"content":"Browser、Node.js、Workerで動くURLパースライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Arkweid/lefthook: Fast and powerful Git hooks manager for any type of projects.","url":"https://github.com/Arkweid/lefthook","tags":["git","node.js","ruby","Tools"],"content":"Git Hooksをymlで管理できるツール。\nNode.jsやRubyなどパッケージマネージャーでインストールできる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"daybrush/moveable: ↔️ ↕️ 🔄 Moveable! Draggable! Resizable! Scalable! Rotatable! Warpable!","url":"https://github.com/daybrush/moveable","tags":["JavaScript","library","DOM"],"content":"要素のドラッグ、リサイズなどのイベントハンドリングを扱うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"@Databases · Database libraries for Node.js that protect you from SQL Injection","url":"https://www.atdatabases.org/","tags":["JavaScript","TypeScript","SQL","library","security"],"content":"Tagged Template LiteralベースのSQLクエリエスケープライブラリ。\nTagged Template Literalで書いたSQL文からクエリとパラメータを分解して取り出し、その結果をデータベースエンジンにわたすことで安全なSQLエスケープを行う目的。\nPostgres、MySQL、SQLiteなどに対応してる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kerimdzhanov/dotenv-flow: Loads environment variables from .env.\\[development|test|production\\]\\[.local\\] files for Node.js® projects.","url":"https://github.com/kerimdzhanov/dotenv-flow","tags":["node.js","library"],"content":"`.env`や`.env.development`ファイルなどを環境によって読み分けるライブラリ。","relatedLinks":[]},{"category":"Book","title":"JavaScript for impatient programmers","url":"https://exploringjs.com/impatient-js/index.html","tags":["JavaScript","book"],"content":"Dr.AxelのJavaScript入門本","relatedLinks":[]}]},{"meta":{"title":"2019-08-13のJS: React 16.9.0正式リリース、Image lazy-loading、Web API in Node.js","author":"azu","layout":"post","date":"2019-08-13T01:50:05.217Z","category":"JSer","tags":["React","WebPlatformAPI","Node.js"],"url":"https://jser.info/2019/08/13/react-16.9.0image-lazy-loadingweb-api-in-node.js/"},"items":[{"category":"Headline","title":"Changelog for 16.9 (TODO: add date) by gaearon · Pull Request #16254 · facebook/react","url":"https://github.com/facebook/react/pull/16254","tags":["React","ReleaseNote","issue"],"content":"React 16.9 RC.0リリース。\n`<React.Profiler>`の追加、非推奨となっていた`UNSAFE_*`のライフサイクルメソッドに対する警告を表示、`<a href=\"javascript:\">`に対して警告を出すように。\nまた、DevToolsで`useState`の編集、Suspenseのトグル表示に対応、テスト用の`act`がAsync対応など","relatedLinks":[{"title":"Warn for javascript: URLs in DOM sinks by sebmarkbage · Pull Request #15047 · facebook/react","url":"http://example.com/"}]},{"category":"Headline","title":"TestCafe v1.4.0 Released | TestCafe","url":"https://devexpress.github.io/testcafe/blog/testcafe-v1-4-0-released.html","tags":["testing","E2E","library","ReleaseNote"],"content":"TestCafe v1.4.0リリース。\nTestページに対してスクリプトファイルを追加できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 89 | WebKit","url":"https://webkit.org/blog/9497/release-notes-for-safari-technology-preview-89/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 89リリース。\n`<script>`の`referrerpolicy`属性をサポート、`console.screenshot`で`ImageData`などをコンソールへの出力をサポートなど","relatedLinks":[]},{"category":"Headline","title":"React v16.9.0 and the Roadmap Update – React Blog","url":"https://reactjs.org/blog/2019/08/08/react-v16.9.0.html","tags":["React","ReleaseNote"],"content":"React 16.9.0リリース。\n非推奨となっていたコンポーネントのライフサイクルメソッドに警告を表示するように、`<a href>`に`javascript:`スキームのURLを指定した場合に警告を表示するように。\nコンポーネントのテストを行う`act()`関数がAsync Functionwをサポート、`<React.Profiler>`コンポーネントの追加など","relatedLinks":[{"title":"Update on Async Rendering – React Blog","url":"https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html"}]},{"category":"Headline","title":"Release v3.1.0 · facebook/create-react-app","url":"https://github.com/facebook/create-react-app/releases/tag/v3.1.0","tags":["React","ReleaseNote","Tools"],"content":"create-react-app 3.1.0リリース。\nESLint 6のサポート、ESLintの設定カスタマイズの対応、`IMAGE_INLINE_SIZE_LIMIT`の環境変数対応など","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0 · webpack-contrib/style-loader","url":"https://github.com/webpack-contrib/style-loader/releases/tag/v1.0.0","tags":["webpack","plugin","CSS","ReleaseNote"],"content":"webpackのCSSを扱うloaderであるstyle-loader 1.0.0リリース。\n`injectType`オプションのサポート、`convertToAbsoluteUrls`や`transform`オプションの削除、`attrs`を`attributes`にリネームなど","relatedLinks":[]},{"category":"Article","title":"ES proposal: \\`globalThis\\`","url":"https://2ality.com/2019/08/global-this.html","tags":["ECMAScript","JavaScript","article"],"content":"ECMAScript Proposalの`globalThis`の解説。\nグローバルスコープを参照するための仕様で、`this`との動きの違い、各実行環境で`globalThis`が参照するオブジェクトについてなど。","relatedLinks":[]},{"category":"Article","title":"Native lazy-loading for the web  |  web.dev","url":"https://web.dev/native-lazy-loading/","tags":["WebPlatformAPI","HTML","article","Chrome"],"content":"`<img>`や`<iframe>`の`loading`属性での遅延ロードについて。\n`loading`属性のFeature Detect、Polyfill、Chrome for AndroidのLite mode(Data Saver)の対応についてなど","relatedLinks":[]},{"category":"Article","title":"Getting More Out of Vue Async Components - Abdelrahman' Blog","url":"https://logaretm.com/blog/getting-more-out-of-vue-async-components/","tags":["Vue","article","JavaScript"],"content":"Vueでのコンポーネントの非同期ロードの活用方法について。\n非同期コンポーネントを使ってコンテンツに必要なコンポーネントだけをロードする方法について","relatedLinks":[]},{"category":"Article","title":"Interesting use cases for JavaScript bitwise operators - LogRocket Blog","url":"https://blog.logrocket.com/interesting-use-cases-for-javascript-bitwise-operators/","tags":["JavaScript","article"],"content":"JavaScriptのビット演算子について。\nビット演算を利用したフラグ管理の実装についてなど","relatedLinks":[]},{"category":"Article","title":"How to Reduce Your Vue.JS Bundle Size With Webpack - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/ratracegrad/how-to-reduce-your-vue-js-bundle-size-with-webpack-4gpf","tags":["webpack","Vue","performance","article"],"content":"Webpackを使ったVue.jsで書いたアプリケーションのbundleサイズの最適化についての記事。\nwebpack-bundle-analyzerを使っての分析、不要なものをbundleから外すようにする方法などについて","relatedLinks":[]},{"category":"SlideVideo","title":"クライアントサイドからサーバサイドまで破壊するテンプレートエンジンを利用した攻撃と対策","url":"https://azu.github.io/slide/2019/template-engine/template-engine-security.html","tags":["JavaScript","template","security","slide","node.js"],"content":"テンプレートとセキュリティについてのスライド。\nテンプレートエンジンの種類、クライアントサイド/サーバサイドのテンプレートを使った脆弱性、テンプレートを機能として提供する場合の問題についてなど。\n古典的なサーバサイドレンダリングとVue等テンプレートを持つのクライアントサイドレンダリングを組み合わせたときの発生しやすい問題についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Joyee Cheung: Web APIs in Node.js Core: Past, Present, and Future","url":"https://2019.jsconf.eu/joyee-cheung/web-apis-in-nodejs-core-past-present-and-future.html","tags":["node.js","video","slide"],"content":"Node.js CoreとWeb標準のAPIについての発表の動画と書き起こし。\nNode.js Coreに`URL`やPerformance APIなどのWeb API互換の実装がされていることや、なぜそのような互換実装が行われているのかについて。\nまた、どのように実装するものを決めているかについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"Pika CI/CD","url":"https://www.pika.dev/cicd/","tags":["npm","webservice","ci"],"content":"Pull Requestごとにnpmパッケージを作成できるPikaのGitHub App。\nPull Requestごとに固有のパッケージを作成してテストできる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"epicmaxco/vuestic-admin: Free and Beautiful Vue.js Admin Template","url":"https://github.com/epicmaxco/vuestic-admin","tags":["Vue","library"],"content":"Vueを使った管理画面テンプレート","relatedLinks":[]},{"category":"Book","title":"JavaScript for impatient programmers","url":"https://exploringjs.com/impatient-js/index.html","tags":["JavaScript","book"],"content":"Dr.AxelのJavaScript入門本","relatedLinks":[]}]},{"meta":{"title":"2019-08-20のJS: Parcel 2.0.0 α、npmのロードマップ、新しいReact DevTools","author":"azu","layout":"post","date":"2019-08-20T01:27:49.990Z","category":"JSer","tags":["Parcel","npm","React"],"url":"https://jser.info/2019/08/20/parcel-2.0.0-anpmreact-devtools/"},"items":[{"category":"Headline","title":"V8 release v7.7 · V8","url":"https://v8.dev/blog/v8-release-77","tags":["V8","ReleaseNote"],"content":"V8 v7.7リリース。\nメモリ使用量の削減、WebAssemblyのバックグラウンドコンパイルの並列化の改善、`Error#stack`作成のパフォーマンス改善。\n`Intl.NumberFormat` APIのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · typescript-eslint/typescript-eslint","url":"https://github.com/typescript-eslint/typescript-eslint/releases/tag/v2.0.0","tags":["TypeScript","ESLint","ReleaseNote"],"content":"typescript-eslint v2.0.0リリース。\nNode.js 6のサポート終了、非推奨となっていた`prefer-interface`や`no-triple-slash-reference`の削除、recommended設定の更新など","relatedLinks":[]},{"category":"Headline","title":"🚀 Parcel 2.0.0-alpha.1 is here! 📦 - devongovett - Medium","url":"https://medium.com/@devongovett/parcel-2-0-0-alpha-1-is-here-8b160c6e3f7e","tags":["bundler","ReleaseNote"],"content":"Parcel 2.0.0-alpha.1リリース。\n`.parcelrc`でプラグインのオプションを設定できるように、multiple targetsとbundle splittingのサポート。\nまたブラウザでの実行などを考えてファイルシステムの抽象レイヤーを追加など","relatedLinks":[]},{"category":"Headline","title":"August 2019 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/aug-2019-security-releases/","tags":["node.js","ReleaseNote"],"content":"HTTP/2の実装に関するDoS攻撃手法に対応するアップデートが各Node.jsバージョン向けにリリースされた","relatedLinks":[{"title":"Node v8.16.1 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v8.16.1/"},{"title":"Node v10.16.3 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v10.16.3/"},{"title":"Node v12.8.1 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v12.8.1/"},{"title":"security-bulletins/2019-002.md at master · Netflix/security-bulletins","url":"https://github.com/Netflix/security-bulletins/blob/master/advisories/third-party/2019-002.md"},{"title":"JVNVU#98433488: HTTP/2 の実装に対するサービス運用妨害 (DoS) 攻撃手法","url":"https://jvn.jp/vu/JVNVU98433488/"}]},{"category":"Headline","title":"Announcing TypeScript 3.6 RC | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-6-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.6 RCリリース。\nGeneratorsの型改善、Array Spreadの仕様に合わせた変換の改善、Promiseの型エラーの改善。\n`--target es2015`でUnicodeの変数名をサポート、Ambient ClassesとFunctionがマージできるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release 2.3.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v2.3.0","tags":["JavaScript","testing","node.js","ReleaseNote"],"content":"AVA 2.3.0リリース。\nECMAScript ProposalのStage 3と4の構文を含んだコードを扱えるように、TypeScript型定義のGenerics型パラメータの初期値を`{}`から`unknown`に変更など","relatedLinks":[]},{"category":"Headline","title":"ESLint v6.2.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2019/08/eslint-v6.2.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v6.2.0リリース。\nECMAScript 2020に入る予定のDynamic Import、`BigInt`のサポート、`function-call-argument-newline`のルールを追加など","relatedLinks":[]},{"category":"Article","title":"The npm Blog — npm CLI Roadmap - Summer 2019","url":"https://blog.npmjs.org/post/186983646370/npm-cli-roadmap-summer-2019","tags":["npm","article"],"content":"npm cliのロードマップについて。\nv6では細かなバグ修正が中心、v7ではインストールのロジックを大きく変更する予定。\nv7ではyarnのようなworkspacesサポートや`peerDependencies`をインストールするように変更、resolutionsのサポート、`yarn.lock`も読めるようになる予定。\nv8では[tink](https://github.com/npm/tink)との統合を検討していく。","relatedLinks":[]},{"category":"Article","title":"Nullish Coalescing と Optional Chaining | blog.jxck.io","url":"https://blog.jxck.io/entries/2019-08-14/nullish-coalescing-optional-chaining.html","tags":["ECMAScript","JavaScript","article"],"content":"ECMAScript Proposal Stage 3のNullish Coalescing と Optional Chainingについての解説。","relatedLinks":[]},{"category":"Article","title":"Largest Contentful Paint  |  web.dev","url":"https://web.dev/largest-contentful-paint/","tags":["Chrome","performance","article"],"content":"Chrome77で利用できるようになるLargest Contentful Paint (LCP) APIについて。Viewport内で大きなコンテンツが表示されるまでの時間を表す指標。\nPerformanceObserverやElement Timing APIを使った値の取得方法について","relatedLinks":[]},{"category":"Article","title":"Introducing the New React DevTools – React Blog","url":"https://reactjs.org/blog/2019/08/15/new-react-devtools.html","tags":["React","article","debug"],"content":"Reactの新しい開発者ツールについての紹介とチュートリアルについて。\nReact DevTools 4.0.0では、パフォーマンスの改善、コンポーネントスタック、フィルター、レンダリング関係の可視化、Hooksサポートの改善。\nまたSuspenseのサポートや\"Why did this render?\"機能の追加など","relatedLinks":[{"title":"React DevTools tutorial","url":"https://react-devtools-tutorial.now.sh/"},{"title":"react/CHANGELOG.md at master · facebook/react","url":"https://github.com/facebook/react/blob/master/packages/react-devtools/CHANGELOG.md#400-august-15-2019"}]},{"category":"Article","title":"Introduction to Svelte","url":"https://daveceddia.com/svelte-intro/","tags":["JavaScript","UI","library","article"],"content":"UIフレームワークであるSvelteについて。\nSvelteの特徴について紹介している。\nコンパイル、リアクティブな変更、イベントハンドラの書き方、未使用なCSSに関する警告表示などの機能について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Divjoy - The React Codebase Generator","url":"https://divjoy.com/","tags":["CSS","JavaScript","Tools","webservice"],"content":"CSSフレームワーク、JavaScriptフレームワーク、認証基盤、Mail、フォーム、アクセス解析を組み合わせを選択してウェブサイトのテンプレートを生成してくれるジェネレータツール。","relatedLinks":[]},{"category":"WebsiteDocument","title":"goldbergyoni/javascript-testing-best-practices: 📗🌐 🚢 Comprehensive and exhaustive JavaScript & Node.js testing best practices (August 2019)","url":"https://github.com/goldbergyoni/javascript-testing-best-practices","tags":["JavaScript","testing","document"],"content":"JavaScriptのテストについてのドキュメント。\nテストの構造、バックエンド、フロントエンド、CIなどについて書かれている","relatedLinks":[]},{"category":"WebsiteDocument","title":"ai/size-limit: Calculate the real cost to run your JS app or lib to keep good performance. Show error in pull request if the cost exceeds the limit.","url":"https://github.com/ai/size-limit/","tags":["JavaScript","Tools","library"],"content":"ファイルサイズの閾値を指定して、そのサイズを超えてないかをテストできるツール。\nアプリケーション、大きなライブラリ、小さなライブラリ向けのプリセットが用意されている。\nファイルサイズやロードにかかる時間をテストできる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ehmicky/nve: Run any Node.js version","url":"https://github.com/ehmicky/nve","tags":["node.js","Tools"],"content":"Node.jsのバージョンを指定してスクリプトを実行するコマンドラインツール","relatedLinks":[]},{"category":"Book","title":"<Now Go Bang!> Announcing meSpeak.js 2.0","url":"https://www.masswerk.at/nowgobang/2019/mespeak_2_0","tags":["audio","JavaScript","library","C++"],"content":"Text to SpeechライブラリのmeSpeak.js 2.0リリース。\nEmscriptenを使ってC++からJavaScriptにコンパイルしたspeak.jsをベースに、モジュラーな設計にしている。\nWebWorkerの対応や音声/言語定義のロード機能などが行われている","relatedLinks":[{"title":"kripken/speak.js: Text-to-Speech in JavaScript using eSpeak","url":"https://github.com/kripken/speak.js"}]}]},{"meta":{"title":"2019-08-27のJS: Nuxt.js 2.9.0(TypeScript)、ChromiumベースのMSEdge βリリース、data-fns 2.0.0","author":"azu","layout":"post","date":"2019-08-27T02:24:00.877Z","category":"JSer","tags":["Nuxt.js","MSEdge","date"],"url":"https://jser.info/2019/08/27/nuxt.js-2.9.0typescriptchromiummsedge-bdata-fns-2.0.0/"},"items":[{"category":"Headline","title":"Release v2.9.0 · nuxt/nuxt.js","url":"https://github.com/nuxt/nuxt.js/releases/tag/v2.9.0","tags":["Vue","TypeScript","library","ReleaseNote"],"content":"Nuxt.js 2.9.0リリース。\nNode.js 8.9.0未満のサポート終了、TypeScriptサポートをコアから分離、vue-meta 2.0.0にアップデートなど","relatedLinks":[{"title":"Nuxt TypeScript","url":"https://typescript.nuxtjs.org/"},{"title":"Migration from Nuxt 2.8 | Nuxt TypeScript","url":"https://typescript.nuxtjs.org/migration.html"}]},{"category":"Headline","title":"Node v12.9.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v12.9.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 12.9.0リリース。\nV8 7.6へアップデート、`stream`のReadbleStreamに`readableEnded`、WritableStreaに`writableEnded`プロパティの追加など","relatedLinks":[]},{"category":"Headline","title":"Microsoft Edge Insider Channels","url":"https://www.microsoftedgeinsider.com/en-us/download","tags":["MSEdge","news"],"content":"ChromiumのMicrosoft Edgeのベータ版がリリースされた","relatedLinks":[]},{"category":"Headline","title":"Announcing styled-components v5: Beast Mode 💪🔥 - 💅 styled-components - Medium","url":"https://medium.com/styled-components/announcing-styled-components-v5-beast-mode-389747abd987","tags":["React","CSS","library","ReleaseNote"],"content":"styled-components v5 ベータリリース。\n破壊的な変更はなし。パフォーマンスの改善、React DevToolsの対応改善、RTLのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release: 6.11.0 - 📣 announcements - npm forum","url":"https://npm.community/t/release-6-11-0/9572","tags":["npm","ReleaseNote"],"content":"npm 6.11.0リリース。\npeerDependenciesをOptionalと明示できる`peerDependenciesMeta`フィールドの追加。インストール時の警告を抑制できる","relatedLinks":[{"title":"Implements peerDependenciesMeta by arcanis · Pull Request #224 · npm/cli","url":"https://github.com/npm/cli/pull/224"},{"title":"Optional Peer Dependencies by arcanis · Pull Request #105 · yarnpkg/rfcs","url":"https://github.com/yarnpkg/rfcs/pull/105"}]},{"category":"Headline","title":"Release v2.0.0 · date-fns/date-fns","url":"https://github.com/date-fns/date-fns/releases/tag/v2.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"date-fns 2.0.0リリース。\n日付文字列の代わりに`parseISO`などでパースしたオブジェクトを受け取るように変更、`format`関数を仕様変更、モジュール名をcamelCaseに変更、関数名や引数の順番の変更など","relatedLinks":[{"title":"date-fns v2 pre-releases change log","url":"https://gist.github.com/kossnocorp/a307a464760b405bb78ef5020a4ab136#v200"},{"title":"date-fns/CHANGELOG.md at master · date-fns/date-fns","url":"http://example.com/"}]},{"category":"Article","title":"Learning CSS by reading specs","url":"https://www.chenhuijing.com/blog/learning-css-by-reading-specifications/","tags":["CSS","spec","article"],"content":"CSSの仕様でCSSを学ぶ話","relatedLinks":[]},{"category":"Article","title":"Promise.allSettled と Promise.any | blog.jxck.io","url":"https://blog.jxck.io/entries/2019-08-20/promise-allsettled-any.html","tags":["Promises","JavaScript","ECMAScript","article"],"content":"ECMAScript Proposalの`Promise.allSettled`と`Promise.any`を含めたPromiseの状態に対するハンドリングについてのまとめ","relatedLinks":[]},{"category":"Article","title":"Progressive Web Apps in multi-origin sites  |  web.dev","url":"https://web.dev/multi-origin-pwas/","tags":["ServiceWorker","article","PWA"],"content":"クロスオリジンなサイト間でのPWAについて。\nService Worker、キャッシュ、Promptなどについて。\n複数のoriginでのPWAは難しい問題について","relatedLinks":[]},{"category":"Article","title":"Puppeteerで不要なCSSを消す - Cybozu Inside Out | サイボウズエンジニアのブログ","url":"https://blog.cybozu.io/entry/2019/08/20/170000","tags":["CSS","JavaScript","AST","article"],"content":"PuppeteerでCSSカバレッジを取り、PostCSSでCSSを編集して使われてないCSSを削除する話","relatedLinks":[]},{"category":"Article","title":"Using Native JavaScript Modules in Production Today — Philip Walton","url":"https://philipwalton.com/articles/using-native-javascript-modules-in-production-today/","tags":["JavaScript","module","article"],"content":"ES moduleをそのまま使うためのテクニックについての話。\nRollupをつかってnpmモジュールごとにES moduleのchunkを作成し、`<script module>`でのロード、`modulepreload`でのpreload。\nDynamic Importでの動的ロードとpolyfill、ES moduleをサポートしてない環境への`<script nomodule>`での読み込みについてなど。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"clean-code-typescript | TypeScriptの為のクリーンコード","url":"https://msakamaki.github.io/clean-code-typescript/","tags":["TypeScript","document","翻訳"],"content":"clean-code-typescriptの翻訳","relatedLinks":[{"title":"labs42io/clean-code-typescript: Clean Code concepts adapted for TypeScript","url":"https://github.com/labs42io/clean-code-typescript"}]},{"category":"SoftwareLibrary","title":"nodegui/nodegui: A library for building cross-platform native desktop applications with JavaScript and CSS like styling.","url":"https://github.com/nodegui/nodegui","tags":["JavaScript","node.js","GUI","library"],"content":"Node.jsのQtバインディングライブラリ。\nQtを使ったGUIをNode.jsから作成できる。","relatedLinks":[{"title":"🐕 Announcing NodeGUI and React NodeGUI - Build native desktop apps with Javascript and CSS 🎉 | Blog","url":"https://blog.atulr.com/nodegui-intro/"}]},{"category":"SoftwareLibrary","title":"pagemap · mini map for web pages · larsjung.de","url":"https://larsjung.de/pagemap/","tags":["JavaScript","library","canvas"],"content":"Canvasを使ってウェブサイトのminimapを描画するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"parcel-bundler/watcher: 👀 A native C++ Node module for querying and subscribing to filesystem events","url":"https://github.com/parcel-bundler/watcher","tags":["node.js","C++","library"],"content":"C++で書かれたファイル監視のNode.jsライブラリ。Parcelで利用されている。\n監視しているファイルの状態をsnapshotで保存でき、watcherが起動してないときの差分も検出できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"GoogleChromeLabs/dynamic-import-polyfill: A fast, tiny polyfill for dynamic import() that works in all module-supporting browsers","url":"https://github.com/GoogleChromeLabs/dynamic-import-polyfill","tags":["JavaScript","library","polyfill"],"content":"Dynamic `import()`のpolyfillライブラリ。","relatedLinks":[]}]},{"meta":{"title":"2019-09-03のJS: TypeScript 3.6、Feathers 4(Node.jsフレームワーク)、ES ModulesをProductionで使う方法","author":"azu","layout":"post","date":"2019-09-03T02:36:40.240Z","category":"JSer","tags":["TypeScript","Feathers","ESModule"],"url":"https://jser.info/2019/09/03/typescript-3.6feathers-4node.jses-modulesproduction/"},"items":[{"category":"Headline","title":"Announcing TypeScript 3.6 | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-6/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.6リリース。\n Generatorsの型チェック改善、`--downlevelIteration`フラグでArray Spreadの仕様に合わせた変換の改善、Promiseの型エラーの改善。 `--target es2015`でUnicodeの変数名をサポート、Ambient ClassesとFunctionがマージできるようになるなど。\nまた、Playgroundが https://typescript-play.js.org ベースに更新されるなど","relatedLinks":[]},{"category":"Headline","title":"Dojo","url":"https://dojo.io/blog/version-6-dojo","tags":["JavaScript","library","ReleaseNote"],"content":"Dojo 6リリース。","relatedLinks":[]},{"category":"Headline","title":"ESLint v6.3.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2019/08/eslint-v6.3.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v6.3.0リリース。\n`eslint --init`でTypeScriptの設定のサポート、設定ファイルに`reportUnusedDisableDirectives`を指定できるように","relatedLinks":[]},{"category":"Headline","title":"Introducing Feathers 4: A framework for real-time apps and REST APIs","url":"https://blog.feathersjs.com/introducing-feathers-4-a-framework-for-real-time-apps-and-rest-apis-afff3819055b","tags":["node.js","ReleaseNote","library"],"content":"Node.jsフレームワークのFeathers 4リリース。\nコアライブラリがTypeScriptで書き直され型定義ファイルを同梱するように、認証の仕組みを作り直しプラグインで拡張できるようになるなど。\n認証周りの仕組みの変更に伴うマイグレーションガイドも公開されている。","relatedLinks":[{"title":"Feathers | A framework for real-time applications and REST APIs","url":"https://feathersjs.com/"},{"title":"Authentication | FeathersJS","url":"https://docs.feathersjs.com/guides/basics/authentication.html#registering-a-user"},{"title":"Migrating | FeathersJS","url":"https://docs.feathersjs.com/guides/migrating.html"},{"title":"Authentication next · Issue #1045 · feathersjs/feathers","url":"https://github.com/feathersjs/feathers/issues/1045"}]},{"category":"Headline","title":"Release 6.0.0 · systemjs/systemjs","url":"https://github.com/systemjs/systemjs/releases/tag/6.0.0","tags":["JavaScript","library","module","ReleaseNote"],"content":"systemjs 6.0.0 リリース。\n`System.onload`のhookを追加、`systemjs-importmap`でのImportMap定義の合成をサポート、`System.resolve`が同期処理に変更など","relatedLinks":[]},{"category":"Article","title":"Using Native JavaScript Modules in Production Today — Philip Walton","url":"https://philipwalton.com/articles/using-native-javascript-modules-in-production-today/","tags":["JavaScript","module","article"],"content":"ES moduleをそのまま使うためのテクニックについての話。\nRollupをつかってnpmモジュールごとにES moduleのchunkを作成し、`<script module>`でのロード、`modulepreload`でのpreload。\nDynamic Importでの動的ロードとpolyfill、ES moduleをサポートしてない環境への`<script nonmodule>`での読み込みについてなど。","relatedLinks":[]},{"category":"Article","title":"Optional chaining · V8","url":"https://v8.dev/features/optional-chaining","tags":["ECMAScript","article","JavaScript"],"content":"ECMAScript Proposal Stage 3であるOptional Chain(`?.`)とnullish coalescing `??` operatorについて。\n`lodash.get`をどのように置き換えられるかの例など","relatedLinks":[]},{"category":"Article","title":"MarkdownやAsciidoc中に書いたJavaScriptのサンプルコードをdoctestするツールを書いた | Web Scratch","url":"https://efcl.info/2019/09/02/power-doctest-markdown-asciidoc/","tags":["JavaScript","testing","document","article","node.js"],"content":"MarkdownやAsciidocのコードブロック内のJavaScriptコードをdoctestするツールやライブラリについて。\nコメントで式の期待する評価結果を書くと、assertに変換してテストできる。","relatedLinks":[{"title":"azu/power-doctest: JavaScript Doctest for JavaScript, Markdown and Asciidoc.","url":"https://github.com/azu/power-doctest"}]},{"category":"Article","title":"Creating an Object Validator in JavaScript the Test-Driven Development Way | Nick Scialli","url":"https://nick.scialli.me/creating-an-object-validator-the-tdd-way/","tags":["JavaScript","testing","article"],"content":"オブジェクトのvalidatorをTDDで実装していく話。\nテスト、実装、リファクタリングの流れについて","relatedLinks":[]},{"category":"Article","title":"The Baseline Interpreter: a faster JS interpreter in Firefox 70 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2019/08/the-baseline-interpreter-a-faster-js-interpreter-in-firefox-70/","tags":["Firefox","JavaScript"],"content":"Firefox 70に入るJavaScriptのBaseline Interpreterについて。\n既存のベースラインJITのコードと上手く共有し、jitScriptと呼ばれる新しくバイトコードインタプリタを追加することでパフォーマンスの改善につながったという話","relatedLinks":[]},{"category":"SlideVideo","title":"現代フロントエンドに欠かせないwebpackとBabelを理解しよう - Speaker Deck","url":"https://speakerdeck.com/mukai21/xian-dai-hurontoendoniqian-kasenaiwebpacktobabelwoli-jie-siyou","tags":["babel","webpack","slide"],"content":"Babelやwebpackが何をやっているのかについてのスライド。\nBabelがどのようにコードを変換しているのかやwebpackがどのようにモジュールを扱っているのかについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Using with puppeteer · Jest","url":"https://jestjs.io/docs/puppeteer","tags":["JavaScript","Chrome","testing","document"],"content":"Jest内でpuppeteerを使う方法についてのドキュメント","relatedLinks":[]},{"category":"SoftwareLibrary","title":"finom/check-imports: Check imports in JS files and update package.json dependencies","url":"https://github.com/finom/check-imports","tags":["JavaScript","Tools"],"content":"コードに書かれている`import`文や`require`関数などを分析して、`package.json`の依存関係を更新するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"antoinechalifour/memento: Memento is a development-only tool that caches HTTP calls once they have been executed.","url":"https://github.com/antoinechalifour/memento","tags":["node.js","JavaScript","Tools"],"content":"開発時にAPIへのリクエストをキャッシュして、モックサーバとして利用できるようにするツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"CONNECT-platform/connective: agent-based reactive programming library for typescript","url":"https://github.com/connect-platform/connective","tags":["JavaScript","library","TypeScript"],"content":"RxJSを使って作られたデータコントールフローライブラリ","relatedLinks":[]}]},{"meta":{"title":"2019-09-10のJS: Firefox 69、Babel 7.6.0(class private)、 Full Stackコースの教材","author":"azu","layout":"post","date":"2019-09-10T02:39:56.538Z","category":"JSer","tags":["Firefox","Babel","Node.js"],"url":"https://jser.info/2019/09/10/firefox-69babel-7.6.0class-private-full-stack/"},"items":[{"category":"Headline","title":"Firefox 69.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/69.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 69.0リリース。\nEnhanced Tracking Protection (ETP)の有効化。\nCSSの`@supports`がセレクタをサポート.\nまたECMAScript ProposalのPublic class fieldのサポート、Resize Observerのサポート、`queueMicrotask`のサポートなど。\n`<keygen>`要素の削除やCSS `user-select`のprefixなしに対応、ネットワークパネルにCSPやMixed-Contentなどのブロック理由を追加など","relatedLinks":[{"title":"Firefox 69 — a tale of Resize Observer, microtasks, CSS, and DevTools - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2019/09/firefox-69-a-tale-of-resize-observer-microtasks-css-and-devtools/"},{"title":"Firefox 69 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/69"},{"title":"Firefox 69 Site Compatibility | Firefox Site Compatibility","url":"https://www.fxsitecompat.dev/versions/69/"}]},{"category":"Headline","title":"Node v12.10.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v12.10.0/","tags":["node.js","ReleaseNote"],"content":"Node.ja 12.10.0リリース。\n`fs.rmdir`に`recursive`オプションの追加、`fs.createWriteStrea`に`emitClose`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 91 | WebKit","url":"https://webkit.org/blog/9526/release-notes-for-safari-technology-preview-91/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 91リリース。\nTLS 1.0、1.1の無効化、`unhandledrejection`のサポート。\nES Proposalのhashbang、Optional Chainingのサポート","relatedLinks":[]},{"category":"Headline","title":"7.6.0 Released: Private static accessors and V8 intrinsic syntax · Babel","url":"https://babeljs.io/blog/2019/09/05/7.6.0","tags":["babel","ReleaseNote","JavaScript"],"content":"Babel 7.6.0リリース。\nPrivate static Accessorsのサポート、Nullish coalescing operator (`??`)。\nまたV8の内部処理を呼び出すintrinsic runtime functions(`%`)のパースをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v0.6.1 · pikapkg/web","url":"https://github.com/pikapkg/web/releases/tag/v0.6.1","tags":["npm","node.js","Tools","module","bundler","ReleaseNote"],"content":"Module Bundlerの@pika/web 0.6リリース。\nJavaScriptではない静的なアセットのサポート、monorepoサポート、Babelを使った最適化のサポートなど","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 78)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/09/devtools","tags":["Chrome","debug","article"],"content":"Chrome 78の開発者ツールの変更点について。\nAuditがRequest Blockingなどと連携するように、Lighthouse 5.2へアップデートしLargest Contentful Paintのサポートなど","relatedLinks":[]},{"category":"Article","title":"Debugging WebAssembly Outside of the Browser - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2019/09/debugging-webassembly-outside-of-the-browser/","tags":["WebAssembly","debug","article","video"],"content":"wasmtimeとGDB/LLDBを使ったWebAssemblyのデバッグ方法について。\nLLDBでブレークポイントを貼ったり、変数をinspectしたりするデモ","relatedLinks":[]},{"category":"Article","title":"An Introduction to D3.js","url":"https://wattenberger.com/blog/d3","tags":["d3.js","JavaScript","tutorial"],"content":"D3.jsのモジュールについての紹介記事。\nモジュールごとの機能や使い方について","relatedLinks":[]},{"category":"Article","title":"A simple homemade JavaScript obfuscator","url":"https://antoinevastel.com/javascript/2019/09/04/home-made-obfuscator.html","tags":["JavaScript","AST","article"],"content":"Shift-ASTを使ったコードの難読化スクリプトの作り方について。\nASTを使ったコード変換、terserを使った圧縮と変数名のリネーム、難読化したコードのテストについてなど","relatedLinks":[]},{"category":"Article","title":"5 Handy Applications of JavaScript Array.from()","url":"https://dmitripavlutin.com/javascript-array-from-applications/","tags":["JavaScript","article"],"content":"`Array.from`の使い方やユースケースについて。\n配列のコピー、指定要素でfillした配列の作成、配列の要素のユニーク化など","relatedLinks":[]},{"category":"WebsiteDocument","title":"Full Stack Open 2019","url":"https://fullstackopen.com/en/","tags":["node.js","JavaScript","React","tutorial"],"content":"React, Redux, Node.js, MongoDB, GraphQLを使ってウェブアプリを作成しながら学べるコース。\nヘルシンキ大学の教材。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jhwohlgemuth/tomo-cli: A friendly command line tool designed to help create sustainable software using web technology","url":"https://github.com/jhwohlgemuth/tomo-cli","tags":["node.js","Tools"],"content":"開発環境のジェネレータツール。\n特定のライブラリやツールに対するセットアップをコマンドでインストール、アンインストールできる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"malijs/mali: A minimalistic gRPC microservice framework for Node.js","url":"https://github.com/malijs/mali","tags":["node.js","library"],"content":"gRPCを使ったNode.jsフレームワーク。\nkoaライクなmiddlewareのサポートや、gRPCのMetadataサポートなどをしている。","relatedLinks":[]},{"category":"Book","title":"これからはじめるVue.js実践入門 | 山田 祥寛 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4815601828/","tags":["Vue","book"],"content":"2019年8月22日発売\nVue.jsの入門書","relatedLinks":[]}]},{"meta":{"title":"2019-09-17のJS: Chrome 77、TypeScript 3.7のロードマップ、Can I use and MDN","author":"azu","layout":"post","date":"2019-09-17T00:03:38.654Z","category":"JSer","tags":["Chrome","TypeScript","MDN"],"url":"https://jser.info/2019/09/17/chrome-77typescript-3.7can-i-use-and-mdn/"},"items":[{"category":"Headline","title":"TypeScript 3.7 Iteration Plan · Issue #33352 · microsoft/TypeScript","url":"https://github.com/microsoft/TypeScript/issues/33352","tags":["TypeScript","issue"],"content":"TypeScript 3.7のロードマップ。\nECMAScript Private Fields、Optional Chaining、Nullish Coalescingへの対応、`--declaration`と`--allowJs`の組合せに対応など。\nまた`typescript`パッケージサイズの削減、`@types`パッケージをGitHub Package Registryにもpublishするようにし、ハンドブックの更新なども予定されている。","relatedLinks":[]},{"category":"Headline","title":"Release DOMPurify 2.0.0 · cure53/DOMPurify","url":"https://github.com/cure53/DOMPurify/releases/tag/2.0.0","tags":["DOM","security","library","ReleaseNote"],"content":"DOMpurify 2.0.0リリース。\nTrusted Typesが利用できる場合でも`RETURN_TRUSTED_TYPE`オプションを渡したときのみ、Trusted Typesを使うように変更","relatedLinks":[]},{"category":"Headline","title":"Google Developers Blog: Flutter news from GDD China: uniting Flutter on web and mobile, and introducing Flutter 1.9","url":"https://developers.googleblog.com/2019/09/flutter-news-from-gdd-china-flutter1.9.html?m=1","tags":["Flutter","ReleaseNote"],"content":"Flutter 1.9 リリース。\nWebサポートがメインリポジトリにマージされた。","relatedLinks":[]},{"category":"Headline","title":"ESLint v6.4.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2019/09/eslint-v6.4.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 6.4.0リリース。\n`no-import-assign`、`prefer-regex-literals`、`default-param-last`のルールを追加。\n一部ルールが`enforceForClassMembers`オプションでクラス構文をサポートするようになるなど","relatedLinks":[{"title":"ESLint v6.4.0 - Qiita","url":"https://qiita.com/mysticatea/items/4164b162fb37dcc443a1"}]},{"category":"Headline","title":"Release v4.0.0 · immerjs/immer","url":"https://github.com/immerjs/immer/releases/tag/v4.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"Immer 4.0.0リリース。\ndevelopment modeでは、すべての値はdeep frozenされた状態で保存されるようになった。\nまたウェブサイトのドキュメント更新など","relatedLinks":[{"title":"Introduction to Immer · Immer","url":"https://immerjs.github.io/immer/docs/introduction"}]},{"category":"Headline","title":"Release 2.4.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v2.4.0","tags":["node.js","JavaScript","testing","library","ReleaseNote"],"content":"AVA 2.4.0リリース。\n`t.try()`をフラグ付きでサポートなど","relatedLinks":[]},{"category":"Article","title":"How to build a plugin system on the web and also sleep well at night","url":"https://www.figma.com/blog/how-we-built-the-figma-plugin-system/","tags":["JavaScript","security","article","plugin"],"content":"プラグインとして追加されるサードパーティコードを安全にウェブブラウザで実行するための仕組みについて。\n`<inline-iframe>`、JavaScriptインタプリタの利用、ProposalのRealms(shim)を使ったサンドボックスについて","relatedLinks":[{"title":"tc39/proposal-realms: ECMAScript Proposal, specs, and reference implementation for Realms","url":"https://github.com/tc39/proposal-realms"},{"title":"Agoric/realms-shim: Spec-compliant shim for Realms TC39 Proposal","url":"https://github.com/Agoric/realms-shim"}]},{"category":"Article","title":"Caniuse and MDN compatibility data collaboration - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2019/09/caniuse-and-mdn-compat-data-collaboration/","tags":["WebPlatformAPI","article"],"content":"MDN Compat DataをCan I Useのウェブサイトにマージ。\nCan I Use上でMDNのデータを元にした機能やサポートブラウザが見られるようになった。","relatedLinks":[]},{"category":"Article","title":"A lighter V8 · V8","url":"https://v8.dev/blog/v8-lite","tags":["V8","article"],"content":"V8のLite modeについて。\nメモリが少ないデバイス向けのモードで、消費メモリの削減を目的としている。","relatedLinks":[]},{"category":"Article","title":"WebGPU and WSL in Safari | WebKit","url":"https://webkit.org/blog/9528/webgpu-and-wsl-in-safari/","tags":["safari","article"],"content":"Safari Technology Preview 91からベータサポートされているWebGPU APIとWSLについて。\nWebGPUのパイプライン処理の最適化、ランタイムのパフォーマンス、Web Shading Language(WSL)について紹介されている","relatedLinks":[]},{"category":"Article","title":"X3D: Declarative 3D for the Modern Web","url":"https://blog.scottlogic.com/2019/08/27/declarative-3d-for-the-modern-web.html","tags":["3D","HTML","article","JavaScript"],"content":"宣言的な3D表現を行うX3Dという仕様とX3DOMという実装について。\nSVGのようにHTML中にタグを書くことで3D表示を行う","relatedLinks":[]},{"category":"Article","title":"New in Chrome 77  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/09/nic77","tags":["Chrome","ReleaseNote"],"content":"Chrome 77リリース。\nLargest Contentful Paint(LCP)、`formdata`イベント、`formAssociated`プロパティのサポートなど","relatedLinks":[{"title":"More capable form controls  |  web.dev","url":"https://web.dev/more-capable-form-controls/"}]},{"category":"WebsiteDocument","title":"Can I email… Support tables for HTML and CSS in emails","url":"https://www.caniemail.com/","tags":["mail","HTML","webservice"],"content":"メール内で特定のHTMLタグやCSSが利用できるかをメールクライアントのサポート状態を検索できるサービス。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nanoSQL 2","url":"https://nanosql.io/","tags":["SQL","library","TypeScript","JavaScript","browser"],"content":"SQL builderライブラリ。\nインメモリ、ブラウザのIndexedDBやLocalstorage、Node.jsからMySQLやRedixなどさまざまなデータべースに対して動作する","relatedLinks":[]},{"category":"Book","title":"Web Development with Node and Express, 2nd Edition - O'Reilly Media","url":"http://shop.oreilly.com/product/0636920261216.do","tags":["JavaScript","node.js","book"],"content":"2019年10月発売\nNode.jsとExpressについての書籍","relatedLinks":[]},{"category":"Book","title":"daumann/ECMAScript-new-features-list: A comprehensive list of new ES features, including ES2015 (ES6), ES2016 (ES7), ES2017 (ES8), ES2018 (ES9), ES2019 (ES10)","url":"https://github.com/daumann/ECMAScript-new-features-list","tags":["ECMAScript","JavaScript","document"],"content":"ECMAScriptのバージョンごとに追加された機能/構文とサンプルコードをまとめたリポジトリ","relatedLinks":[]}]},{"meta":{"title":"2019-09-24のJS: Safari 13、Chrome 78 Beta(Native File System trial)、Storybook 5.2(CSF)","author":"azu","layout":"post","date":"2019-09-24T00:15:41.639Z","category":"JSer","tags":["Safari","Chrome","Storybook"],"url":"https://jser.info/2019/09/24/safari-13-chrome-78-betanative-file-system-trial-storybook-5.2csf/"},"items":[{"category":"Headline","title":"Moving Firefox to a faster 4-week release cycle - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2019/09/moving-firefox-to-a-faster-4-week-release-cycle/","tags":["Firefox","news"],"content":"Firefoxのリリースサイクルが7週ごとから4週ごとへと変更される予定について。\n一方でFirefox ESRのリリースサイクルは変更されない。","relatedLinks":[]},{"category":"Headline","title":"Safari 13 Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safari_release_notes/safari_13_release_notes","tags":["safari","ReleaseNote"],"content":"Safari 13の変更点について。\nFIDO2のセキュリティキー、`__Secure-`と`__Host-`のクッキーprefix、Pointer Events、Visual Viewport APIのサポートなど。\niOS 13のSafariでWebDriverのサポート、WebSQLの削除など","relatedLinks":[{"title":"WebDriver is Coming to Safari in iOS 13 | WebKit","url":"https://webkit.org/blog/9395/webdriver-is-coming-to-safari-in-ios-13/"}]},{"category":"Headline","title":"jasmine/3.5.0.md at master · jasmine/jasmine","url":"https://github.com/jasmine/jasmine/blob/master/release_notes/3.5.0.md","tags":["JavaScript","library","ReleaseNote","testing"],"content":"Jasmine 3.5リリース。\n`toHaveBeenCalledWith`のエラー結果の出力の改善、`resolveTo`と`rejectWith`の追加、カスタム非同期Matcherを定義する`addAsyncMatchers`の追加など","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 78 Beta: a new Houdini API, native file system access and more","url":"https://blog.chromium.org/2019/09/chrome-78-beta-new-houdini-api-native.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 78 Betaリリース。\nCSS Custom Propertiesを使ったアニメーションのサポート、Native File System APIとSMS Receiver APIのorigin trialの開始など。\nWebSocketsにおけるArrayBufferのダウンロード速度の改善、User Timing API Level 3のサポート。\nまた、Sync HXRがunload時などには禁止、XSS Auditorの削除など","relatedLinks":[{"title":"Smarter custom properties with Houdini’s new API  |  web.dev","url":"https://web.dev/css-props-and-vals/"}]},{"category":"Headline","title":"Storybook 5.2 - Storybook - Medium","url":"https://medium.com/storybookjs/storybook-5-2-794958b9b111","tags":["JavaScript","Tools","ReleaseNote"],"content":"Storybook 5.2リリース。\nMDXを使ったドキュメントを書けるDocsPageの追加、Storyをモジュールとして作れるCSFのサポート。\nTypeScriptのサポート、React Hooksのサポート、 Standalone modeなど","relatedLinks":[{"title":"Storybook DocsPage - Storybook - Medium","url":"https://medium.com/storybookjs/storybook-docspage-e185bc3622bf"},{"title":"Component Story Format - Storybook - Medium","url":"https://medium.com/storybookjs/component-story-format-66f4c32366df"}]},{"category":"Article","title":"Fresher service workers, by default  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/09/fresher-sw","tags":["Chrome","ServiceWorker","article"],"content":"Chrome 78では`importScript`で読み込むファイルも変更があればHTTP Cacheはデフォルトで無視されるようになった。\nChrome 68で追加された`updateViaCache`オプションを使ってHTTP Cache-Controlを見るかを制御できる。","relatedLinks":[]},{"category":"Article","title":"Practical Ways to Write Better JavaScript - Stack Overflow Blog","url":"https://stackoverflow.blog/2019/09/12/practical-ways-to-write-better-javascript/","tags":["JavaScript","TypeScript","article"],"content":"より良いJavaScriptを書くためにどうするかという記事。\nTypeScriptを使う、ES2015+の機能を活用する、分散を考える。\nLint、テストを行うなどについて","relatedLinks":[]},{"category":"Article","title":"✩ Wikipedia's JavaScript initialisation on a budget","url":"https://phabricator.wikimedia.org/phame/live/7/post/175/wikipedia_s_javascript_initialisation_on_a_budget/","tags":["JavaScript","refacoring","performance","article"],"content":"Wikipediaの初期表示に読み込むJavaScriptのファイルサイズを削減した話。\n目標のbudgeを28KBと設定してどのように初期ロードのJavaScriptサイズを減らしていったかについて","relatedLinks":[]},{"category":"Article","title":"Intelligent Tracking Prevention 2.3 | WebKit","url":"https://webkit.org/blog/9521/intelligent-tracking-prevention-2-3/","tags":["safari","privacy","article"],"content":"Safari 13(iOS 13/macOS Catalina)に実装されたITP 2.3について。\nCookieからLocalStorageに保存場所を移行したサードパーティトラッカーに対する制限の追加、`document.referrer`にもeTLD+1の制限を追加、デバッグモードの改善など","relatedLinks":[]},{"category":"Article","title":"Techniques to make a web app load fast, even on a feature phone","url":"https://web.dev/load-faster-like-proxx/","tags":["JavaScript","performance","article"],"content":"PROXXのローディングパフォーマンスに利用したテクニックの紹介記事。\nWebPageTestを使ったリソースロードのwaterfall分析、コネクション数の削減、preload、prerendering、CSSのインライン化、Code Splittingなどについて","relatedLinks":[]},{"category":"SlideVideo","title":"Backbone.Model に 型をつけて剥がす - Typing to destroy Backbone.Model - Speaker Deck","url":"https://speakerdeck.com/fsubal/backbone-dot-model-ni-xing-wotuketebo-gasu-typing-to-destroy-backbone-dot-model?slide=34","tags":["backbone.js","TypeScript","JavaScript","slide","refacoring"],"content":"Backbone.Modelに型をつけてリファクタリングしていく話。\nBackbone.ModelをただのJSONとして扱い、JSONのスナップショットに対してテスト行う","relatedLinks":[]},{"category":"SoftwareLibrary","title":"faboulaws/fakingoose: An automatic fixture generator for mongoose using the schema definition","url":"https://github.com/faboulaws/fakingoose","tags":["JavaScript","testing","library"],"content":"データスキーマからダミデータを生成してくれるライブラリ","relatedLinks":[]}]},{"meta":{"title":"2019-09-30のJS: React 16.10.0、Node.js 12.11.0(worker_thread)、ネットワークリクエストとUI更新の競合","author":"azu","layout":"post","date":"2019-09-30T00:47:47.448Z","category":"JSer","tags":["React","Node","API"],"url":"https://jser.info/2019/09/30/455draft/"},"items":[{"category":"Headline","title":"React Training: React Router v5.1","url":"https://reacttraining.com/blog/react-router-v5-1/","tags":["React","library","ReleaseNote"],"content":"React Router 5.1リリース。\nHooks APIの追加サポート。\n`useParams`、`useLocation`、`useHistory`などのAPIが追加されている。","relatedLinks":[]},{"category":"Headline","title":"Announcing React Native 0.61 with Fast Refresh · React Native","url":"https://facebook.github.io/react-native/blog/2019/09/18/version-0.61","tags":["React","iOS","Android","ReleaseNote"],"content":"React Native 0.61リリース。\nFast Refresh = live reload + hot reloading。\n`use_frameworks!`を使った場合のCocoapodの問題を修正、React 16.9へアップデート、`useWindowDimensions` Hook APIの追加など。","relatedLinks":[]},{"category":"Headline","title":"Release 16.10.0 (September 27, 2019) · facebook/react","url":"https://github.com/facebook/react/releases/tag/v16.10.0","tags":["React","ReleaseNote"],"content":"React 16.10.0リリース。\nExperimentalなSchedulerのメモリ消費の改善、`requestAnimationFrame`ではなく`postMessage`を使ったより短いインターバルでのチェックの実装。\n`useSubscription`のバグ修正など","relatedLinks":[]},{"category":"Headline","title":"V8 release v7.8 · V8","url":"https://v8.dev/blog/v8-release-78","tags":["V8","ReleaseNote"],"content":"V8 v7.8リリース。\nScript StreamingによるJavaScriptのロードパフォーマンスの改善、オブジェクトのDestructuringのパフォーマンス改善。\nまたV8 APIとしてWebAssembly C/C++ APIを公式にサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node v12.11.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v12.11.0/","tags":["node.js","ReleaseNote"],"content":"Node v12.11.0リリース。\nV8 7.7へアップデート、`worker_thread`モジュールがStableになるなど。","relatedLinks":[]},{"category":"Headline","title":"Release v2 Cosmic Jellyfish · gpujs/gpu.js","url":"https://github.com/gpujs/gpu.js/releases/tag/2.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"gpu.js 2.0.0リリース。\nVideo inputのサポート、`gpu.setInjectedNative()`の追加、`mode`オプションに`dev`を追加など","relatedLinks":[]},{"category":"Article","title":"Handling API request race conditions in React","url":"https://sebastienlorber.com/handling-api-request-race-conditions-in-react","tags":["JavaScript","React","article"],"content":"ネットワークの遅延などにより複数のリクエストが送信され、リクエストが成功タイミングとUIの状態が一致しなくなる問題について。\nReactを例に、リクエストに問題があった場合にどのように問題を回避するかについて書かれている。\n不要なレスポンスを無視、リクエストをキャンセルなどの実装方法について","relatedLinks":[]},{"category":"Article","title":"TypeScript Tutorial for Beginners: The Missing Guide (2019)","url":"https://www.valentinog.com/blog/typescript/","tags":["TypeScript","tutorial","article"],"content":"初心者向けのTypeScriptチュートリアル。","relatedLinks":[]},{"category":"Article","title":"Working with GitHub Actions | Jeff Rafter","url":"https://jeffrafter.com/working-with-github-actions/","tags":["node.js","Github","Actions","article","testing"],"content":"Node.js + TypeScriptでGitHub Actionsを作成するチュートリアル。\n`@actions/core`の使い方やGitHub APIへのリクエスト、デバッグ方法、テスト方法などについて","relatedLinks":[]},{"category":"Article","title":"Why Your Angular App Is Not Working: 7 Common Mistakes - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/valeriopisapia/why-your-angular-app-is-not-working-7-common-mistakes-2ba1","tags":["Angular","article"],"content":"Angularアプリでよくある間違いとその修正方法について","relatedLinks":[]},{"category":"Article","title":"swyx Writing | Why JavaScript Tooling Sucks","url":"https://www.swyx.io/writing/js-tooling/","tags":["JavaScript","community","Tools","opinion","article"],"content":"JavaScriptのツールがなぜ難しいのかについての話。\nJavaScriptの始まり、巨大なコミュニティ、ターゲットの変遷、ボトムアップ、オーナーシップやsemver、ツールを作る人と使う人、Fundingの問題、良い所なども含めて書かれている。\nJavaScriptアプリケーションの97%はnpmから来ているため、OSSの問題はJavaScriptの問題と見られることについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"Webtest.app - Testing websites with and without adblocker","url":"https://webtest.app","tags":["webservice","Tools","performance"],"content":"ウェブサイトにuBlock OriginなどのAdblockを経由した場合のブロックされたリクエストやCookie、ページサイズ、パフォーマンスメトリクスの比較結果を計測するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"chroventer/endb: Simple key-value database with multi adapter support","url":"https://github.com/chroventer/endb","tags":["node.js","JavaScript","library"],"content":"MySQLやRedisなどをバックエンドにできるKVSライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"oframe/ogl: Minimal WebGL framework","url":"https://github.com/oframe/ogl","tags":["WebGL","library"],"content":"WebGLフレームワーク。\n抽象度は低めで、Math/Core/Extrasのモジュールから構成される","relatedLinks":[]},{"category":"Book","title":"valentinogagliardi/Little-JavaScript-Book: The Little JavaScript Book","url":"https://github.com/valentinogagliardi/Little-JavaScript-Book","tags":["JavaScript","book"],"content":"JavaScriptについての書籍","relatedLinks":[]}]},{"meta":{"title":"2019-10-09のJS: Preact X(10)、webhint browser extension v1、TypeScript 3.7β","author":"azu","layout":"post","date":"2019-10-09T00:17:09.603Z","category":"JSer","tags":["Preact","webhint","typescript"],"url":"https://jser.info/2019/10/09/preact-x10-webhint-browser-extension-v1-typescript-3.7b/"},"items":[{"category":"Headline","title":"Release Preact X - Virtuous DOM and the Fragments of Suspense · preactjs/preact","url":"https://github.com/preactjs/preact/releases/tag/10.0.0","tags":["React","library","ReleaseNote"],"content":"Preact X(10.0.0)リリース。\n`Fragments`、`componentDidCatch`、`createContext`のサポート、Hooks APIのサポートなど","relatedLinks":[{"title":"What's new in Preact X | Preact: Fast 3kb React alternative with the same ES6 API. Components & Virtual DOM.","url":"https://preactjs.com/guide/v10/whats-new/"},{"title":"Upgrading from Preact 8.x | Preact: Fast 3kb React alternative with the same ES6 API. Components & Virtual DOM.","url":"https://preactjs.com/guide/v10/upgrade-guide/"}]},{"category":"Headline","title":"Release v3.2.0 · facebook/create-react-app","url":"https://github.com/facebook/create-react-app/releases/tag/v3.2.0","tags":["React","Tools","ReleaseNote"],"content":"create-react-app 3.2.0リリース。\n`yarn build --profile`でproduction buildでのプロファイル対応、`TSC_COMPILE_ON_ERROR`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"vuejs/vue-next","url":"https://github.com/vuejs/vue-next","tags":["Vue","Github","news"],"content":"Vue 3候補のソースコードが公開された","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 3.7 Beta | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-7-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.7 Betaリリース。\nOptional Chaining、Nullish Coalescing、Assertion Functionsのサポート。\n`--declaration`と`--allowJs`の組み合わせのサポート、TypeScriptファイル内で`// @ts-nocheck`の追加など","relatedLinks":[{"title":"TypeScript 3.7 Iteration Plan · Issue #33352 · microsoft/TypeScript","url":"https://github.com/microsoft/TypeScript/issues/33352"}]},{"category":"Headline","title":"Release v5.5.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v5.5.0","tags":["Tools","ReleaseNote","Chrome"],"content":"Lighthouse 5.5.0リリース。\nLargest Contentful Paint(LCP)のサポート","relatedLinks":[]},{"category":"Headline","title":"Version 1.0 released : Node-RED","url":"https://nodered.org/blog/2019/09/30/version-1-0-released","tags":["node.js","IoT","ReleaseNote"],"content":"フローベースのビジュアルエディタを使って、Node.jsで動くプログラムを作成できるツールキットであるNode-RED 1.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Announcing the webhint v1 browser extension for Microsoft Edge - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2019/09/30/announcing-the-webhint-v1-browser-extension-for-microsoft-edge/","tags":["browser","Tools","ReleaseNote","Extension","accessibility"],"content":"webhint browser extension 1.0.0リリース。\nプラグインでカスタマイズできるウェブサイト向けのLintツールのブラウザ拡張版。\nMDN browser compat dataを使ったクロスブラウザの互換情報の表示、カラーコントラストについてのHintの追加など","relatedLinks":[{"title":"webhint, the hinting engine for web best practices","url":"https://webhint.io/"},{"title":"webhint browser extension","url":"https://medium.com/webhint/the-webhint-browser-extension-v1-release-df9044ddaf69"}]},{"category":"Article","title":"I created the exact same app in React and Vue. Here are the differences. \\[2019 Edition\\]","url":"https://medium.com/javascript-in-plain-english/i-created-the-exact-same-app-in-react-and-vue-here-are-the-differences-2019-edition-42ba2cab9e56","tags":["React","Vue","JavaScript","article"],"content":"ReactとVueでのTodoアプリを例にした比較。\nReact Hooksに対応したバージョン","relatedLinks":[]},{"category":"Article","title":"Fixing layout instability  |  web.dev","url":"https://web.dev/fixing-layout-instability/","tags":["Chrome","performance","JavaScript","article"],"content":"`PerformanceObserver`でCumulative Layout Shift (CLS)を計測し、どのようなレイアウトの変化が起きてるのかをWebPageTestで確認する方法について。\nまた、実際にプレースホルダーデータを使ってlayout instabilityを修正する方法について。","relatedLinks":[{"title":"Measuring Cumulative Layout Shift (CLS) in WebPageTest - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/chromiumdev/measuring-cumulative-layout-shift-cls-in-webpagetest-5cle"}]},{"category":"Article","title":"How to read a Web Page Test waterfall chart - Frontend Web Developer, Oxfordshire, UK - Matt Hobbs","url":"https://nooshu.github.io/blog/2019/10/02/how-to-read-a-wpt-waterfall-chart/","tags":["webservice","performance","browser","article"],"content":"WebPageTestのウォーターフォールチャートの読み方について。\n図の要素ごとに解説やHTTP/1.1とHTTP/2での流れの違いなどについて書かれている","relatedLinks":[]},{"category":"WebsiteDocument","title":"Accessibility Support","url":"https://a11ysupport.io/","tags":["accessibility","webservice","WAI-ARIA"],"content":"スクリーンリーダごとのWAI-ARIAなどのアクセシビリティサポート状況についてまとめているサイト。\nCan I Use...のアクセシビリティ版","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cevek/ttypescript: Over TypeScript tool to use custom transformers in the tsconfig.json","url":"https://github.com/cevek/ttypescript","tags":["TypeScript","Tools","plugin"],"content":"TypeScriptでのコンパイル処理に対して、プラグインで変換処理を追加できるコンパイラーの実装","relatedLinks":[]},{"category":"SoftwareLibrary","title":"algolia/shipjs: Take control of what is going to be your next release.","url":"https://github.com/algolia/shipjs","tags":["JavaScript","npm","Tools","CI "],"content":"リリースの準備とリリースを行うツール。\nsemantic-releaseとは異なりすべてを自動で行うのではなく、Pull Requestを作成して、手動で確認やCHANGELOGの更新をしてからリリースを行うといったプロセスが取れる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"fengyuanchen/cropperjs: JavaScript image cropper.","url":"https://github.com/fengyuanchen/cropperjs","tags":["JavaScript","library"],"content":"Image Cropperライブラリ。\n画像の切り抜き、回転、移動などができる画像加工を行うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Bin-Huang/prray: \"Promisified\" Array, comes with async method supports(such as mapAsync). And it is compatible with normal array.","url":"https://github.com/Bin-Huang/prray","tags":["JavaScript","Promises","library"],"content":"コールバック関数にAsync Functionを取るArrayの実装ライブラリ","relatedLinks":[]}]},{"meta":{"title":"2019-10-15のJS: webpack 5β、Next.js(create-next-app)、Same-Site Cookies","author":"azu","layout":"post","date":"2019-10-15T00:48:55.247Z","category":"JSer","tags":["webpack","Next.js","Cookie"],"url":"https://jser.info/2019/10/15/webpack-5bnext.jscreate-next-appsame-site-cookies/"},"items":[{"category":"Headline","title":"The new evergreen Bingbot simplifying SEO by leveraging Microsoft Edge | Webmaster Blog","url":"https://blogs.bing.com/webmaster/october-2019/The-new-evergreen-Bingbot-simplifying-SEO-by-leveraging-Microsoft-Edge","tags":["MSEdge","Chrome","SEO","news"],"content":"BingがChromiumベースのMSEdgeを採用。\nクロールするBingbotがChrome相当になり、定期的に最新のStableにアップデートされる。","relatedLinks":[]},{"category":"Headline","title":"Release v9.1.0 · zeit/next.js","url":"https://github.com/zeit/next.js/releases/tag/v9.1.0","tags":["node.js","React","ReleaseNote"],"content":"Next.js 9.1.0リリース。\n`src/pages`ディレクトリのサポート、`next export`で`public/`ディレクトリへ出力できるように","relatedLinks":[]},{"category":"Headline","title":"webpack 5 beta feedback · Issue #9802 · webpack/webpack","url":"https://github.com/webpack/webpack/issues/9802","tags":["webpack","ReleaseNote"],"content":"webpack 5βリリース。\nNode.jsコアモジュールの自動Polyfillの削除、Long TermキャッシュのためにChunkとModule Idのハッシュアルゴリズムの変更、オプション名の変更など。\nファイルシステムキャッシュ設定の追加、Tree Shakingの改善、`output.ecmaVersion`オプションの追加。\nまた試験的な機能として、`asset` module typeの追加、Top Level `await`のサポートなど","relatedLinks":[{"title":"changelog-v5/MIGRATION GUIDE.md at master · webpack/changelog-v5","url":"https://github.com/webpack/changelog-v5/blob/master/MIGRATION%20GUIDE.md"},{"title":"changelog-v5/README.md at master · webpack/changelog-v5","url":"https://github.com/webpack/changelog-v5/blob/master/README.md"}]},{"category":"Headline","title":"Node v12.12.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v12.12.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 12.12.0リリース。\n`fs.opendir()`、`fs.Dir`の追加、`--enable-source-maps`でのスタックトレースのSource Mapサポートなど","relatedLinks":[]},{"category":"Headline","title":"Blog - Introducing Create Next App | Next.js","url":"https://nextjs.org/blog/create-next-app","tags":["JavaScript","React","Tools","ReleaseNote"],"content":"`create-next-app`がNext.jsの公式プロジェクトになった。","relatedLinks":[]},{"category":"Article","title":"Top-level await · V8","url":"https://v8.dev/features/top-level-await","tags":["JavaScript","article"],"content":"Top-level `await`について。\nTop-level `await`のユースケースや実行順序などの挙動についてなど","relatedLinks":[]},{"category":"Article","title":"Same-Site Cookies By Default | text/plain","url":"https://textslashplain.com/2019/09/30/same-site-cookies-by-default/","tags":["Chrome","security","article"],"content":"Chrome 80でされるSameSite=Laxのデフォルト化について。\nCookieのSecurityとPrivacyの問題、Same-Site Cookiesの目的、CSRF攻撃からの保護、HTTPOnly属性やSecure属性について。\nまたSame-Siteがデフォルトとなった場合の実際の影響や他のブラウザの対応、2分間の緩和についてなど","relatedLinks":[]},{"category":"Article","title":"What's new in Chrome 78 - LogRocket Blog","url":"https://blog.logrocket.com/whats-new-in-chrome-78/","tags":["Chrome","article"],"content":"Chrome 78の変更点について。\nCSS opacityの`%`サポート、ES ProposalのOptional Chaining、`unload`時の制限、User Timing Lv3、WebSocketStreamのサポートなど。\n\nOrigin TrialとしてサポートされたNative File System APIやSMS Receiver APIについてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Vue.js Performance Tips / #v\\_kansai 11 - Speaker Deck","url":"https://speakerdeck.com/masashi/number-v-kansai-11","tags":["Vue","performance","slide"],"content":"Vue.jsアプリのパフォーマンス改善についてのスライド。\nIntersectionObserverを使った表示されたことの検知、画像の遅延ロード、Hydrationの遅延実行などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"lirantal/is-website-vulnerable: finds publicly known security vulnerabilities in a website's frontend JavaScript libraries","url":"https://github.com/lirantal/is-website-vulnerable","tags":["JavaScript","security","Tools"],"content":"指定したURLに脆弱性のあるライブラリが使われているかを判定するツール。\nSynxベースの脆弱性判定をしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"leeoniya/uPlot: An exceptionally fast, tiny time series chart","url":"https://github.com/leeoniya/uPlot","tags":["JavaScript","chart","library"],"content":"ファイルサイズが小さな時系列グラフライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"devforth/painterro: Painterro - JavaScript painting plugin","url":"https://github.com/devforth/painterro","tags":["Image","JavaScript","library"],"content":"画像エディタライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"luwes/sinuous: Small, fast, reactive UI library","url":"https://github.com/luwes/sinuous","tags":["JavaScript","UI","library","jsx"],"content":"`htm`構文、Hyperscript、JSXに対応したUIライブラリ。\nobservableな値監視の仕組みも提供し、小さなファイルサイズでUIを作成できるようにすることが目的","relatedLinks":[{"title":"developit/htm: Hyperscript Tagged Markup: JSX alternative using standard tagged templates, with compiler support.","url":"https://github.com/developit/htm"}]}]},{"meta":{"title":"2019-10-22のJS: Node v12.13.0 (LTS)、Chrome 79の開発者ツールの変更点、WSL 2でNode.js入門","author":"azu","layout":"post","date":"2019-10-22T02:50:26.465Z","category":"JSer","tags":["Node.js","Chrome","Windows"],"url":"https://jser.info/2019/10/22/node-v12.13.0-ltschrome-79wsl-2node.js/"},"items":[{"category":"Headline","title":"Release v4.0.0 · vuejs/vue-cli","url":"https://github.com/vuejs/vue-cli/releases/tag/v4.0.0","tags":["Vue","console","Tools","ReleaseNote"],"content":"Vue CLI 4.0.0リリース。\nNightwatch、Jest、PWAサポートの改善、依存のメジャーアップデートなどが含まれる","relatedLinks":[{"title":"Migrating from v3 | Vue CLI","url":"https://cli.vuejs.org/migrating-from-v3/"}]},{"category":"Headline","title":"Release v5.6.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v5.6.0","tags":["Chrome","performance","Tools","ReleaseNote"],"content":"lighthouse v5.6.0リリース。\nStack packでAngular、React、AMP、Magentoのサポートし、フレームワーク固有のメトリクスの追加など","relatedLinks":[{"title":"GoogleChrome/lighthouse-stack-packs: Lighthouse Stack Packs","url":"https://github.com/GoogleChrome/lighthouse-stack-packs"}]},{"category":"Headline","title":"TestCafe v1.6.0 Released | TestCafe","url":"https://devexpress.github.io/testcafe/blog/testcafe-v1-6-0-released.html","tags":["browser","testing","library","ReleaseNote"],"content":"TestCafe 1.6.0リリース。\nフルページスクリーンショットのサポート、スクリーンショットオプションの変更など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 94 | WebKit","url":"https://webkit.org/blog/9609/release-notes-for-safari-technology-preview-94/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 94リリース。\nCSS Shadow Partsの`::part()`の疑似要素をサポート、httpsで`Cache-Control: no-store`のHTTPヘッダで配信されたページもBFCacheに入るように変更など","relatedLinks":[]},{"category":"Headline","title":"Node v12.13.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v12.13.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 12.13.0リリース。\nNode.js 12.xのLTS(Long Term Support)となるバージョンで、2022年4月までメンテナンスされる。\nnpm 6.12.0へのアップデートなど","relatedLinks":[{"title":"nodejs/Release: Node.js Foundation Release Working Group","url":"https://github.com/nodejs/Release"}]},{"category":"Headline","title":"Release electron v7.0.0 · electron/electron","url":"https://github.com/electron/electron/releases/tag/v7.0.0","tags":["Electron","ReleaseNote"],"content":"Electron v7.0.0リリース。","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 79)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/10/devtools","tags":["Chrome","debug","article"],"content":"Chrome 79の開発者ツールについて。\nブロックされてるCookieの理由表示、コードカバレッジ機能の改善、ネットワークリクエストのコールスタックの表示など","relatedLinks":[]},{"category":"Article","title":"Vanilla JavaScript and HTML - No frameworks. No libraries. No problem. - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/pluralsight/vanilla-javascript-and-html-no-frameworks-no-libraries-no-problem-2n99","tags":["JavaScript","DOM","article"],"content":"フレームワークを使わずにDOM APIを使ってウェブページを作成するチュートリアル。\n`<template>`タグを使ったコンポーネントの作成、レンダリングなどについて","relatedLinks":[]},{"category":"Article","title":"Firefox's New WebSocket Inspector - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2019/10/firefoxs-new-websocket-inspector/","tags":["Firefox","debug","WebSocket","article"],"content":"Firefox 71の開発者ツールでWebSockets Inspectorが新しくなる。\nWS protocolのデータがJSON、Socket.IO、SockJS等の場合にデータをInspectできるように、またWSトラフィックの停止と再開ボタンの追加など","relatedLinks":[]},{"category":"SlideVideo","title":"SameSite Cookie - Speaker Deck","url":"https://speakerdeck.com/masashi/samesite-cookie","tags":["browser","slide","security"],"content":"SameSite Cookieについてのスライド。\nSameSite CookieとCSRF、Cookieの属性、SameSite Cookieの動作とオプション(Strict, Lax, None)、ウェブサイトへの影響について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Developing with Node.js on Windows | Microsoft Docs","url":"https://docs.microsoft.com/en-us/windows/nodejs/index","tags":["node.js","tutorial","windows"],"content":"WSL 2を使ったWindows向けのNode.js開発のチュートリアル","relatedLinks":[]},{"category":"SoftwareLibrary","title":"middyjs/middy: 🛵 The stylish Node.js middleware engine for AWS Lambda","url":"https://github.com/middyjs/middy","tags":["node.js","aws","Lambda","library"],"content":"aws lambdaのhandlerに対して前後に処理を加えられるmiddlewareライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"meriyah/meriyah: A 100% compliant, self-hosted javascript parser - https://meriyah.github.io/meriyah","url":"https://github.com/meriyah/meriyah","tags":["JavaScript","AST","library"],"content":"JavaScriptのコードをESTree ASTフォーマットにパースできるJavaScriptパーサライブラリ","relatedLinks":[{"title":"buntis/buntis: A 100% compliant, self-hosted typescript parser that emits an ESTree-compatible AST","url":"https://github.com/buntis/buntis"}]},{"category":"SoftwareLibrary","title":"vega/vega-lite: A concise grammar of interactive graphics, built on Vega.","url":"https://github.com/vega/vega-lite","tags":["JavaScript","library","graphic"],"content":"宣言的なデータでインタラクティブなグラフを作成できるライブラリ","relatedLinks":[]}]},{"meta":{"title":"2019-10-29のJS: Node.js 13.0.0、Firefox 70.0、Electron 7.0.0","author":"azu","layout":"post","date":"2019-10-29T01:35:22.139Z","category":"JSer","tags":["Node.js","Firefox","Electron"],"url":"https://jser.info/2019/10/29/node.js-13.0.0firefox-70.0electron-7.0.0/"},"items":[{"category":"Headline","title":"Node v13.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v13.0.0/","tags":["node.js","ReleaseNote"],"content":"開発版となるNode.js 13リリース。\nV8 7.8へのアップデート、Full ICUがデフォルト化、Node.js自体のビルド環境の変更など","relatedLinks":[{"title":"Node.js 12 to LTS and Node.js 13 is here! - Node.js Foundation - Medium","url":"https://medium.com/@nodejs/node-js-12-to-lts-and-node-js-13-is-here-e28d6a4a2bd"}]},{"category":"Headline","title":"Release v1.0 Final! · reduxjs/redux-starter-kit","url":"https://github.com/reduxjs/redux-starter-kit/releases/tag/v1.0.0","tags":["React","redux","ReleaseNote","library"],"content":"Redux Starter Kit 1.0リリース。\nReduxのラッパーでboilerplate codeを減らしたり、簡単に利用できることを目的にしたツールセット。\n作者は現在のReduxのメンテナーの一人である3markerikson。","relatedLinks":[{"title":"Idiomatic Redux: Redux Starter Kit 1.0 · Mark's Dev Blog","url":"https://blog.isquaredsoftware.com/2019/10/redux-starter-kit-1.0/"}]},{"category":"Headline","title":"New in Chrome 78  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/10/nic78","tags":["Chrome","ReleaseNote"],"content":"Chrome 78リリース。\n`CSS.registerProperty`のサポート、`importScripts()`でロードしたService Workerスクリプトもバイト単位で更新チェックが行われるように。\nOrigin TrialとしてNative File System、SMS Receiverのサポートなど。\nその他としてXSS Auditorの削除など","relatedLinks":[{"title":"What's New In DevTools (Chrome 78)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/09/devtools"},{"title":"current deprecations","url":"https://www.chromestatus.com/features#browsers.chrome.status%3A%22Deprecated%22"},{"title":"V8 release v7.8 · V8","url":"https://v8.dev/blog/v8-release-78"},{"title":"Deprecations and removals in Chrome 78  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/09/chrome-78-deps-rems"},{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features/5640265926705152"}]},{"category":"Headline","title":"Announcing TypeScript 3.7 RC | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-7-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.7RCリリース。\nOptional Chaining、Nullish Coalescing、Assertion Functionsのサポート。 \n`never`を返す関数を呼び出した場合の型推論の改善、`--declaration`と`--allowJs`の組み合わせのサポート、`// @ts-nocheck`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · GoogleChrome/puppeteer","url":"https://github.com/GoogleChrome/puppeteer/releases/tag/v2.0.0","tags":["Chrome","ReleaseNote","library"],"content":"Puppeteer 2.0.0リリース\nChromium 79へのアップデート、Node 6以下のサポート終了、`page.screenshot`をViewportに合わせる変更など。\nまた、`page.emulateTimezone`、`page.emulateMediaType`、`page.emulateMediaFeatures`の追加など","relatedLinks":[]},{"category":"Headline","title":"Electron 7.0.0 | Electron Blog","url":"https://electronjs.org/blog/electron-7-0","tags":["Electron","ReleaseNote"],"content":"Electron 7.0.0リリース。\nWindows on Arg(64bit)の対応、非同期IPCの`ipcRenderer.invoke()`と`ipcMain.handle()`の追加、`nativeTheme` APIの追加など。\nElectron 4.xはサポート終了となる。","relatedLinks":[]},{"category":"Headline","title":"Firefox 70.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/70.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 70リリース。\nEnhanced Tracking Protection (ETP)の有効化、開発者ツールの改善やWebSocket Inspectorの改善など。\nES ProposalのNumeric separatorsに対応、Workerスクリプトの読み込み時にMIME typeを確認するように、Web Audio APIの仕様追従など","relatedLinks":[{"title":"Firefox 70 — a bountiful release for all - Mozilla Hacks - the Web developer blog","url":"http://example.com/"},{"title":"Firefox's New WebSocket Inspector - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2019/10/firefoxs-new-websocket-inspector/"},{"title":"Firefox 70 for developers - Mozilla | MDN","url":"http://example.com/"}]},{"category":"Article","title":"Preparing for the Future with React Prereleases – React Blog","url":"https://reactjs.org/blog/2019/10/22/react-release-channels.html","tags":["React","article"],"content":"Reactのリリースチャンネルについて。\nLatest(Stable)、Next(リポジトリのmasterと同等)、Experimental(masterに加えて実験的な機能)の3つのチャンネルがあることについて。\nそれぞれの利用方法や目的、またRFCとExperimentalについて","relatedLinks":[]},{"category":"Article","title":"Time to First Byte: What It Is and Why It Matters – CSS Wizardry – CSS Architecture, Web Performance Optimisation, and more, by Harry Roberts","url":"https://csswizardry.com/2019/08/time-to-first-byte-what-it-is-and-why-it-matters/","tags":["browser","performance","article"],"content":"Time to First Byte (TTFB)についての解説。\nTTFBに含まれるであろう処理の種類、それを明示できるServer-Timingヘッダについて","relatedLinks":[]},{"category":"SlideVideo","title":"Prototype Pollution in Kibana","url":"https://slides.com/securitymb/prototype-pollution-in-kibana","tags":["JavaScript","security","slide"],"content":"KibanaにあったPrototype pollutionの脆弱性を使ったRCEについての解説スライド。\n`__proto__.env`で任意の環境変数を読み込ませてspawnするのを見つけ、`NODE_OPTIONS`と`/proc/self/environ`を使い環境変数にコードを仕込み実行させる手法の解説","relatedLinks":[]},{"category":"SlideVideo","title":"WebAuthN 実際導入してどうだったか","url":"https://kasecato.github.io/web-study-webauthn-nulab/","tags":["WebAuthentication","slide"],"content":"Web Authentication APIについてのスライド。\nセキュリティデバイスの登録における設計、ChromeやmacOSのTouch IDにおけるハマりどころ(プロファイルに紐づくなど)などについて","relatedLinks":[]},{"category":"Book","title":"Functional Design Patterns for Express.js by Jonathan Lee Martin | The Pragmatic Bookshelf","url":"https://pragprog.com/book/d-jmexpress/functional-design-patterns-for-express-js","tags":["node.js","book","関数型プログラミング"],"content":"関数型プログラミングのパターンとExpressについての書籍","relatedLinks":[]},{"category":"Book","title":"JavaScript Promiseの本 v2リリース、ES2015+に対応、Async Functionの章を追加 | Web Scratch","url":"https://efcl.info/2019/10/23/promises-book-v2/","tags":["JavaScript","book"],"content":"JavaScript Promise本 v2リリース。\nサンプルコードをES2015ベースに変更、Async Functionの章の追加、`Promise#finally`の解説を追加など","relatedLinks":[{"title":"JavaScript Promiseの本","url":"https://azu.github.io/promises-book/"}]},{"category":"Book","title":"JavaScript: The Definitive Guide, 7th Edition - O'Reilly Media","url":"http://shop.oreilly.com/product/0636920048633.do","tags":["JavaScript","book"],"content":"2019年7月発売\nOreillyのJavaScript本(通称サイ本)の第7版","relatedLinks":[]}]},{"meta":{"title":"2019-11-05のJS: MSEdge on Chromium RC、Immer 5.0.0、Speed Report on Search Console","author":"azu","layout":"post","date":"2019-11-05T00:09:40.841Z","category":"JSer","tags":["MSEdge","Google","Library"],"url":"https://jser.info/2019/11/05/msedge-on-chromium-rcimmer-5.0.0speed-report-on-search-console/"},"items":[{"category":"Headline","title":"OpenJS Foundation launches new professional certification program to support the future of Node.js development - OpenJS Foundation","url":"https://openjsf.org/blog/2019/10/22/openjs-foundation-launches-new-professional-certification-program-to-support-the-future-of-node-js-development/","tags":["node.js","news"],"content":"OpenJS Foundation(Node.js Foundation)がNode.jsのアプリケーション開発とサービス開発における2種類の認定プログラムを開始した","relatedLinks":[]},{"category":"Headline","title":"Release v0.111.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.111.0","tags":["flowtype","ReleaseNote"],"content":"FlowType 0.111.0リリース。\nObject spread構文によるオブジェクトのマージにおける型推論の改善。\nパフォーマンス改善に向けた試験的なフラグとして`experimental.minimal_merge`の追加など","relatedLinks":[{"title":"Now you can spread disjoint unions without getting errors!","url":"https://medium.com/flow-type/spreads-common-errors-fixes-9701012e9d58"}]},{"category":"Headline","title":"The npm Blog — Release: 6.12.1","url":"https://blog.npmjs.org/post/188679949625/release-6121","tags":["npm","ReleaseNote"],"content":"npm 6.12.1リリース。\nNode.js 13のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · immerjs/immer","url":"https://github.com/immerjs/immer/releases/tag/v5.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"Immer 5.0.0リリース。\nMapとSetのサポート","relatedLinks":[]},{"category":"Headline","title":"Getting your sites ready for the new Microsoft Edge - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2019/11/04/edge-chromium-release-candidate-get-ready/","tags":["MSEdge","ReleaseNote"],"content":"MSEdge on ChromiumのRCリリース。\nWebDriverの対応、Puppeteerの対応、IEDriverServer使ったMSEdgeのIEモードでの起動方法についてなど","relatedLinks":[]},{"category":"Article","title":"Hands-on guide: developing & deploying Node.js apps in Kubernetes","url":"https://learnk8s.io/nodejs-kubernetes-guide/","tags":["node.js","Docker","kubernetes","article","tutorial"],"content":"Express+MongoなNode.jsアプリをDockerで動かして、それをminikubeを使ってローカルのKubernatesクラスタで動かし、スケーリングをテストするチュートリアル記事","relatedLinks":[]},{"category":"Article","title":"5 TypeScript tips to improve your applications","url":"https://nehalist.io/5-typescript-tips-to-improve-your-architecture/","tags":["TypeScript","article"],"content":"TypeScriptの型Tips。\nUtility types、`unknown`型の利用、Lookup Types、ライブラリの型の拡張、ビルトインオブジェクトの型についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"React Conf 2019 - YouTube","url":"https://www.youtube.com/playlist?list=PLPxbbTqCLbGHPxZpw4xj_Wwg8-fdNxJRh","tags":["React","video"],"content":"React Conf 2019の動画一覧","relatedLinks":[{"title":"React Conf 2019 - Fall 2019 in Lake Las Vegas, Nevada","url":"https://conf.reactjs.org/"}]},{"category":"SlideVideo","title":"ReactHooksでvideoを乗りこなす - Speaker Deck","url":"https://speakerdeck.com/narirou/reacthookstevideowocheng-rikonasu","tags":["React","video","slide"],"content":"React Hooksを使ってVideoプレイヤーを作成することについてのスライド。\n`<video>`要素の持つ複雑なステート管理、更新頻度に合わせたステートの分離、React Hooksの利用についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Building (And Re-Building) the Airbnb Design System | Maja Wichrowska & Tae Kim - YouTube","url":"https://www.youtube.com/watch?v=fHQ1WSx41CA&list=PLPxbbTqCLbGHPxZpw4xj_Wwg8-fdNxJRh&index=10&t=0s","tags":["Design","React","video"],"content":"Airbnbのデザインシステムの過去、現在、未来についての発表。\n最初はフラグメンテーションが問題になり、CSS-in-JSを使ってデザインをDSLに寄せたら複雑化しパフォーマンスが問題になった。\n柔軟性とパフォーマンスをちょうどよく取れるモジューラなアーキテクチャを目指し再構築しているという話","relatedLinks":[]},{"category":"WebsiteDocument","title":"SameSite cookie recipes","url":"https://web.dev/samesite-cookie-recipes/","tags":["browser","security"],"content":"SameSite Cookiesへの対応方法について。\nSameSite=Noneに対応していないUAの対策として、LegacyなCookieとSameSite属性をつけたCookieを両方渡すパターンについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"Official Google Webmaster Central Blog \\[EN\\]: Get faster with the new Speed report in Search Console","url":"https://webmasters.googleblog.com/2019/11/search-console-speed-report.html","tags":["google","SEO","performance"],"content":"Google Search ConsoleにChrome UX Reportを使った速度に関するレポートが一般公開された。\nPC、モバイルごとに速度がLow、Middle、Fastの分類をして、その原因や改善方法の情報を提供する画面が追加された","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mciastek/sal: 🚀 Performance focused, lightweight scroll animation library 🚀","url":"https://github.com/mciastek/sal","tags":["JavaScript","library","animation"],"content":"Intersection Observerを使ったスクロールアニメーションライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mikro-orm/mikro-orm: TypeScript ORM for Node.js based on Data Mapper, Unit of Work and Identity Map patterns. Supports MongoDB, MySQL, MariaDB, PostgreSQL and SQLite databases.","url":"https://github.com/mikro-orm/mikro-orm","tags":["TypeScript","rnode","library","MySQL","MongoDB"],"content":"TypeScriptで書かれたMongoDB、MySQL、PostgreSQLなどのORMマッパーライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kroitor/asciichart: Nice-looking lightweight console ASCII line charts ╭┈╯ for NodeJS, browsers and terminal, no dependencies","url":"https://github.com/kroitor/asciichart","tags":["JavaScript","graphic","library","console"],"content":"コンソールでAscii線グラフを描画するライブラリ","relatedLinks":[]}]},{"meta":{"title":"2019-11-12のJS: TypeScript 3.7正式リリース、Babel 7.7.0、npmロードマップ、Web Almanac","author":"azu","layout":"post","date":"2019-11-12T02:09:19.069Z","category":"JSer","tags":["TypeScript","Babel","npm","book"],"url":"https://jser.info/2019/11/12/typescript-3.7babel-7.7.0npmweb-almanac/"},"items":[{"category":"Headline","title":"Announcing TypeScript 3.7 | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-7/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.7リリース。\nPlaygroundで更新内容を確認できるようになった。\nOptional Chainig、Nullish Coalescing、Assertion Functionsのサポート、エラーレポートの改善、`@ts-nockeck`をtsファイルでサポートなど。\n`never`型のコントールフロー改善、`--declaration`と`--allowJs`を組みあせて利用できるように.\n`useDefineForClassFields`のフラグ付きでクラスフィールドに`declare`を利用できるように、","relatedLinks":[]},{"category":"Headline","title":"Prettier 1.19: Long awaited Vue option, TypeScript 3.7 and new JavaScript features · Prettier","url":"https://prettier.io/blog/2019/11/09/1.19.0.html","tags":["JavaScript","Tools","Vue","ReleaseNote"],"content":"Prettier 1.19リリース。\n`--vue-indent-script-and-style`オプションの追加、TypeScript 3.7のサポート、ES Proposalのpartial application構文のサポートなど。","relatedLinks":[]},{"category":"Headline","title":"7.7.0 Released: Error recovery and TypeScript 3.7 · Babel","url":"https://babeljs.io/blog/2019/11/05/7.7.0","tags":["babel","ReleaseNote"],"content":"Babel 7.7.0リリース。\nTop-Level `await`のサポート、TypeScript 3.7サポート。\nパースエラーでも結果のASTとエラーを返せる`errorRecovery`オプションの追加、`.babelrc.cjs`を設定ファイルとして認識するように、メモリ消費量の改善など","relatedLinks":[]},{"category":"Headline","title":"Release v6.13.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v6.13.0","tags":["npm","ReleaseNote"],"content":"npm 6.13.0リリース。\n`npm fund`で依存パッケージの`funding`フィールドをリスト表示できるように、`npm help <command> --viewer browser`で表示するヘルプをgatsbyベースに変更など","relatedLinks":[]},{"category":"Headline","title":"Announcing Dart 2.6 with dart2native: Compile Dart to self-contained, native executables","url":"https://medium.com/dartlang/dart2native-a76c815e6baf","tags":["dart","ReleaseNote"],"content":"Dart 2.6リリース。\n`dart2native` compilerでmacOSやWindows、Linux向けのネイティブコードの出力をサポート、`dart:ffi`の改善など","relatedLinks":[]},{"category":"Article","title":"Client-Side SQL Query Parsing with ANTLR | Rockset","url":"https://rockset.com/blog/client-side-sql-query-parsing-with-antlr/","tags":["JavaScript","SQL","article"],"content":"ANTLRを使ったSQL構文のパーサをJavaScriptで書く方法についての記事","relatedLinks":[]},{"category":"Article","title":"Rethinking frontend APM - LogRocket Blog","url":"https://blog.logrocket.com/rethinking-frontend-apm/","tags":["webservice","performance","article"],"content":"LogRocketにLogRocket MetricsというFrontend向けのパフォーマンスモニタリング機能が追加された。\nAPM(Application Performance Management)機能で、フロントエンドに関するいろいろなメトリクスを計測し、モニタリングやアラートを設定できる","relatedLinks":[]},{"category":"Article","title":"The npm Blog — Updates to Community, Docs & more...","url":"https://blog.npmjs.org/post/188841555980/updates-to-community-docs-more","tags":["npm","article","news"],"content":"npmの最近の変更と今後について。\nnpmのフォーラム( https://npm.community/ )はアーカイブ化しバグ関係の管理はGitHub Issuesに再び移動、npm 6.13で`npm fund`のサポートなど。\nまたnpm v7の変更予定としてパフォーマンスの改善、GitHubのPRからのインストール、Node 6と8のサポート終了、peerDepsをデフォルトでインストールするように変更など","relatedLinks":[{"title":"Release v6.13.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v6.13.0"}]},{"category":"WebsiteDocument","title":"GoogleChrome/lighthouse-ci: Automate running Lighthouse for every commit, viewing the changes, and preventing regressions","url":"https://github.com/GoogleChrome/lighthouse-ci","tags":["browser","performance","CI ","testing"],"content":"継続的にlighthouseの結果を計測し、設定したbudgetに対するassertionを行うためのCIツール。\nlighthouseの結果を記録して、項目ごとにAssertionsを設定でき、コミットごとにそのパフォーマンスのリグレッションが発生してないかを継続的にチェックできるツール。","relatedLinks":[{"title":"treosh/lighthouse-ci-action: Run Lighthouse in CI using Github Actions","url":"https://github.com/treosh/lighthouse-ci-action"}]},{"category":"SoftwareLibrary","title":"GoogleChromeLabs/native-url: Node's url module implemented using the built-in URL API.","url":"https://github.com/GoogleChromeLabs/native-url","tags":["JavaScript","URL","library","node.js"],"content":"Node.jsの`url`モジュールを`URL`オブジェクトを使って実装したpolyfillライブラリ。\nネイティブのURL APIを使うことで、ファイルサイズが小さくなる。webpackなどのaliasで差し替える方法についても書かれている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pvdz/tenko: An 100% spec compliant ES2020 JavaScript parser written in JS","url":"https://github.com/pvdz/tenko","tags":["JavaScript","AST","library"],"content":"JavaScriptで書かれたJavaScriptパーサライブラリ。\nES2015+の構文のパースをサポート、またESTree、Acorn、Babel形式のAST出力に対応している。","relatedLinks":[{"title":"pvdz/zeparser2: Next version of my JS (ES5) parser","url":"https://github.com/pvdz/zeparser2"},{"title":"pvdz/zeparser3: ZeParser3 was renamed to Tenko -> https://github.com/pvdz/tenko","url":"https://github.com/pvdz/zeparser3"}]},{"category":"SoftwareLibrary","title":"manuelbieh/geolib: Zero dependency library to provide some basic geo functions","url":"https://github.com/manuelbieh/geolib","tags":["JavaScript","library"],"content":"地理座標系の計算を行うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lirantal/lockfile-lint: Lint an npm or yarn lockfile to analyze and detect security issues","url":"https://github.com/lirantal/lockfile-lint","tags":["npm","yarn","security","Tools","testing"],"content":"`pacage-lock.json`や`yarn.lock`のチェックツール。\nポリシーに反する依存がロックファイル含まれていないかチェックするLintツール。","relatedLinks":[{"title":"Why npm lockfiles can be a security blindspot for injecting malicious modules | Snyk","url":"https://snyk.io/blog/why-npm-lockfiles-can-be-a-security-blindspot-for-injecting-malicious-modules/"}]},{"category":"Book","title":"The 2019 Web Almanac","url":"https://almanac.httparchive.org/en/2019/","tags":["browser","HTTP","book"],"content":"HTTP Archiveのレポートと解説を合わせた書籍。\nページコンテンツ、UX、Publishing,\nDistributingについて","relatedLinks":[]}]},{"meta":{"title":"2019-11-19のJS: Front-End Tooling Survey 2019、Reactの作り方","author":"azu","layout":"post","date":"2019-11-19T02:08:57.501Z","category":"JSer","tags":["Survey","React"],"url":"https://jser.info/2019/11/19/front-end-tooling-survey-2019react/"},"items":[{"category":"Headline","title":"Bytecode Alliance","url":"https://bytecodealliance.org/articles/announcing-the-bytecode-alliance","tags":["WebAssembly","news"],"content":"Mozilla、Fastly、Intel、Red Hatが中心となってWebAssemblyのセキュアなエコシステムを作ることが目的のBytecode Allianceという団体が発足した。\nnpmを例にした現在のエコシステムでの攻撃事例、Nanoprocessと呼ばれるSandboxの仕組みについても書かれている。","relatedLinks":[]},{"category":"Article","title":"Upcoming notification permission changes in Firefox 72 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2019/11/upcoming-notification-permission-changes-in-firefox-72/","tags":["Firefox","security","article"],"content":"Firefox 72で通知の許可ポップアップはユーザーインタラクション起因じゃないと表示されなくなる件について","relatedLinks":[]},{"category":"Article","title":"Build your own React","url":"https://pomb.us/build-your-own-react/","tags":["React","JavaScript","tutorial","article"],"content":"Reactのようなコンポーネントのレンダリングの仕組み、Hooksの仕組みを実装しながら見ていく記事","relatedLinks":[]},{"category":"Article","title":"Handling Errors in Express | Zell Liew","url":"https://zellwk.com/blog/express-errors/","tags":["node.js","article"],"content":"Expressのエラーハンドリングについての記事。\n`express-async-handler`を使ったasyncのエラーハンドリング、`http-errors`を使ったエラーオブジェクトの作成、カスタムエラーハンドリングやFallbackについてなど","relatedLinks":[]},{"category":"Article","title":"The Front-End Tooling Survey 2019 - Results - AshleyNolan.co.uk - Blog and Portfolio for Ashley Watson-Nolan","url":"https://ashleynolan.co.uk/blog/frontend-tooling-survey-2019-results","tags":["JavaScript","CSS","アンケート","article"],"content":"JavaScriptやCSSのツールに関するアンケートをするThe Front-End Tooling Survey 2019の結果が公開された。\nプリプロセッサ、フレームワーク、Lint、Bundler、Testing、Performance、Accessiblityなどについてのアンケート","relatedLinks":[]},{"category":"Article","title":"Building a native add-on for Node.js in 2019 - Sqreen Blog","url":"https://blog.sqreen.com/building-a-native-add-on-for-node-js-in-2019/","tags":["node.js","article"],"content":"Node.jsのネイティブアドオンの作り方。\nN-APIのバージョンとNode.jsの対応表、NANを使ったネイティブアドオンの書き方について","relatedLinks":[]},{"category":"Article","title":"Publishing Typings to DefinitelyTyped - Level Up Coding","url":"https://levelup.gitconnected.com/publishing-typings-to-definitelytyped-d4e0777e40f5","tags":["TypeScript","npm","article"],"content":"`@types`パッケージの作成方法、削除方法、DefinitelyTypedへのPull Requestの出し方、テストについてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Chrome Dev Summit 2019 - All Sessions - YouTube","url":"https://www.youtube.com/playlist?list=PLNYkxOF6rcIDA1uGhqy45bqlul0VcvKMr","tags":["Chrome","video","イベント"],"content":"Chrome Dev Summmit 2019の動画一覧","relatedLinks":[]},{"category":"SlideVideo","title":"フロントエンドエンジニアのためのセキュリティ対策 ~XSS編~ / #frontkansai 2019 - Speaker Deck","url":"https://speakerdeck.com/masashi/number-frontkansai-2019","tags":["XSS","JavaScript","slide"],"content":"XSSについてのスライド。\nXSSの種類(Reflected、Stored、DOM Based)の紹介とそれぞれの典型的な対策。\nまた、CSPやTruested Typesなどの予防策についてなど","relatedLinks":[{"title":"これからのフロントエンドセキュリティ - Speaker Deck","url":"https://speakerdeck.com/hasegawayosuke/korekarafalsehurontoendosekiyuritei"}]},{"category":"WebsiteDocument","title":"Integrate your data, APIs, and cloud services in minutes - Pipedream","url":"https://pipedream.com/","tags":["node.js","webservice","API"],"content":"Node.jsでコードとして書けるIFTTT的なウェブサービス。\nSlackやGitHubなどからイベントを受け取り、コードで処理して、別のサービスにデータを送ることができる","relatedLinks":[]},{"category":"WebsiteDocument","title":"Metrics","url":"https://web.dev/metrics/","tags":["Chrome","performance","tutorial","browser"],"content":"ウェブサイトのパフォーマンスメトリクスについての解説。\nFCP、LCP、FID、TTI、TBT、CLSについてそれぞれの解説、計測方法、改善方法が書かれている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"NodeBB/NodeBB: Node.js based forum software built for the modern web","url":"https://github.com/NodeBB/NodeBB","tags":["node.js","BBS"],"content":"Node.js製のフォーラムウェブアプリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"NeekSandhu/onigasm: Oniguruma regex library on the web using WebAssembly","url":"https://github.com/NeekSandhu/onigasm","tags":["JavaScript","WebAssembly","library"],"content":"正規表現エンジンであるOnigurumaのWebAssembly版","relatedLinks":[]}]},{"meta":{"title":"2019-11-26のJS: Node.js 13.2.0(ES Modules)、jQueryがAMDからES Modulesへ","author":"azu","layout":"post","date":"2019-11-26T02:19:47.092Z","category":"JSer","tags":["Node.js","jQuery","Modules"],"url":"https://jser.info/2019/11/26/node.js-13.2.0es-modulesjqueryamdes-modules/"},"items":[{"category":"Headline","title":"Core: Migrate from AMD to ES modules 🎉 by mgol · Pull Request #4541 · jquery/jquery","url":"https://github.com/jquery/jquery/pull/4541","tags":["jQuery","issue","module","news"],"content":"jQueryのコードベースがAMDからES modulesに書き換えられた","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 96 | WebKit","url":"https://webkit.org/blog/9658/release-notes-for-safari-technology-preview-96/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 96リリース。\nWeb Animations APIをデフォルトで有効化、`navigator.clipboard.read()`の実装など","relatedLinks":[]},{"category":"Headline","title":"Node v13.2.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v13.2.0/","tags":["node.js","ReleaseNote","module"],"content":"Node.js 13.2.0リリース。\n`--experimental-modules`のフラグが外れたため、デフォルトでES Modulesが利用できるように。\n`worker_threads`に`resourceLimits`オプションの追加、`child_process`などに`serialization`オプションの追加など","relatedLinks":[{"title":"ECMAScript Modules | Node.js v13.2.0 Documentation","url":"https://nodejs.org/api/esm.html"},{"title":"Announcing core Node.js support for ECMAScript modules","url":"https://medium.com/@nodejs/announcing-core-node-js-support-for-ecmascript-modules-c5d6dc29b663"}]},{"category":"Headline","title":"Node.js 12.x runtime now available in AWS Lambda | AWS Compute Blog","url":"https://aws.amazon.com/jp/blogs/compute/node-js-12-x-runtime-now-available-in-aws-lambda/","tags":["aws","Lambda","node.js","news"],"content":"AWS LambdaがNode.js 12.xをサポート","relatedLinks":[]},{"category":"Headline","title":"TestCafe v1.7.0 Released | TestCafe","url":"https://devexpress.github.io/testcafe/blog/testcafe-v1-7-0-released.html","tags":["browser","testing","E2E","ReleaseNote"],"content":"TestCafe v1.7.0リリース。\nテストコード内で実行してるブラウザやOSの情報を取得できる`t.browser`オブジェクトのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Web Framework Fastify Joins OpenJS Foundation as an Incubating Project - OpenJS Foundation","url":"https://openjsf.org/blog/2019/11/20/web-framework-fastify-joins-openjs-foundation-as-an-incubating-project/","tags":["node.js","library","news"],"content":"Node.jsのウェブアプリケーションフレームワークであるFastifyがOpenJS FoundationのIncubating Projectとなった。","relatedLinks":[{"title":"Fastify, Fast and low overhead web framework, for Node.js","url":"https://www.fastify.io/"}]},{"category":"Headline","title":"CanJS 6.0","url":"https://www.bitovi.com/blog/canjs-6.0","tags":["JavaScript","library","ReleaseNote"],"content":"CanJS 6.0リリース。\nWebComponentベースになり、コンポーネントのPropsの型システムの刷新、Proxyを使ったObservableObjectの仕組みなどが導入された。\nマイグレーションガイドとツールも公開されている。","relatedLinks":[{"title":"Migrating to CanJS 6 | upgrade | Guides | CanJS — Build CRUD apps in fewer lines of code.","url":"https://canjs.com/doc/migrate-6.html#MigratetoObservableObjectandObservableArrayformodels"},{"title":"Using Codemods | upgrade | Guides | CanJS — Build CRUD apps in fewer lines of code.","url":"https://canjs.com/doc/guides/upgrade/using-codemods.html"}]},{"category":"Headline","title":"ESLint v6.7.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2019/11/eslint-v6.7.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 6.7.0リリース。\nルールからSuggestionの候補を提供するAPIの追加、設定ファイルに`ignorePatterns`を記述できるようになるなど。\nまた`no-constructor-return `などのルールを新規に5つ追加など","relatedLinks":[{"title":"ESLint v6.7.0 - Qiita","url":"https://qiita.com/mysticatea/items/377b6ca6558dc253159b"}]},{"category":"Article","title":"Cropping Images to a specific Aspect Ratio with JavaScript • PQINA","url":"https://pqina.nl/blog/cropping-images-to-an-aspect-ratio-with-javascript/","tags":["JavaScript","canvas","article"],"content":"Canvasを使って画像を切り抜きするチュートリアル。チュートリアルではカバーできてない画像を扱う際の問題についてなど","relatedLinks":[]},{"category":"Article","title":"Regular expressions in JavaScript: lookaround assertions by example","url":"https://2ality.com/2019/10/regexp-lookaround-assertions.html","tags":["JavaScript","RegExp","article"],"content":"JavaScriptの正規表現の先読み/後読みのパターンについて。","relatedLinks":[]},{"category":"SlideVideo","title":"Faster apps with JSON.parse (Chrome Dev Summit 2019) - YouTube","url":"https://www.youtube.com/watch?v=ff4fgQxPaO0","tags":["JavaScript","JSON","performance","video"],"content":"オブジェクトリテラルより`JSON.parse`した方が、パフォーマンスが良い理由についての解説動画。\nJSONには出現するトークンが限定されているためオブジェクトリテラルよりパースが高速にできること、SSRでのユースケースなどについて紹介している。\n10kB以上など大きなデータに関しては`JSON.parse`を使うことを推奨している","relatedLinks":[{"title":"The cost of JavaScript in 2019 · V8","url":"https://v8.dev/blog/cost-of-javascript-2019#json"}]},{"category":"WebsiteDocument","title":"EasyDB","url":"https://easydb.io/","tags":["DB ","webservice"," node","npm","python"],"content":"Node.jsやPythonから24時間使えるKVSなDBを作ってくれるウェブサービス。\nアカウントを作ると72時間使うことができ、永続化したい場合は$5/monthで利用できる。\nハッカソンなどの一時的なイベント向けのデータベースサービス。","relatedLinks":[]},{"category":"WebsiteDocument","title":"liyasthomas/postwoman: 👽 API request builder - A free, fast, and beautiful alternative to Postman https://postwoman.io 🔥","url":"https://github.com/liyasthomas/postwoman","tags":["webservice","API","Tools"],"content":"REST API、WebSockets、GraphQLに対応したAPIへのリクエスト/レスポンスをテストできるツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jeremydaly/lambda-api: Lightweight web framework for your serverless applications","url":"https://github.com/jeremydaly/lambda-api","tags":[" node","aws","Lambda","library"],"content":"AWS Lambda向けのNode.jsフレームワーク。\n依存がなく、HTTPメソッドに対するルーティング、HTTPリクエスト/レスポンスに対する基本的な処理を持っている","relatedLinks":[]},{"category":"Book","title":"Test-Driven React: Find Problems Early, Fix Them Quickly, Code with Confidence by Trevor Burnham | The Pragmatic Bookshelf","url":"https://pragprog.com/book/tbreact/test-driven-react","tags":["React","testing","book"],"content":"テスト駆動でのReactアプリケーション開発についての書籍","relatedLinks":[]}]},{"meta":{"title":"2019-12-03のJS: Got 10(Node.js HTTPクライアント)、FAB(Frontend Application Bundles)","author":"azu","layout":"post","date":"2019-12-03T03:22:10.346Z","category":"JSer","tags":["Node.js","HTTP","bundler"],"url":"https://jser.info/2019/12/03/got-10node.js-httpfabfrontend-application-bundles/"},"items":[{"category":"Headline","title":"Release Workbox v5.0.0-rc.1 · GoogleChrome/workbox","url":"https://github.com/GoogleChrome/workbox/releases/tag/v5.0.0-rc.1","tags":["JavaScript","ServiceWorker","library","ReleaseNote"],"content":"Workbox 5.0.0 RC1リリース","relatedLinks":[]},{"category":"Headline","title":"Release v10.0.0 · sindresorhus/got","url":"https://github.com/sindresorhus/got/releases/tag/v10.0.0","tags":[" node","HTTP","library","ReleaseNote"],"content":"Node.js向けHTTPクライアントのGot 10.0.0リリース。\nTypeScriptで書き直されたバージョン。\nNode.js 10未満のサポート終了、`query`を`searchParams`にリネーム、`encoding`を`responseType`にリネーム、`json`オプションの変更など。\nDNS cacheのサポート、`maxRedirects`オプションの追加など","relatedLinks":[]},{"category":"Article","title":"JavaScript frameworks security report 2019 | Snyk","url":"https://snyk.io/blog/javascript-frameworks-security-report-2019/","tags":["Angular","React","jQuery","security","article"],"content":"Angular(JS)、React、jQueryについてのセキュリティレポート。\n脆弱性の個数や影響範囲、脆弱性報告、セキュリティ機能についてなど","relatedLinks":[]},{"category":"Article","title":"I created the exact same app in Vue and Svelte. Here are the differences.","url":"https://medium.com/javascript-in-plain-english/i-created-the-exact-same-app-in-vue-and-svelte-here-are-the-differences-c649f8d4ce0a","tags":["JavaScript","Vue","article"],"content":"VueとSvelteで同じTodoアプリを作成しての比較記事。","relatedLinks":[]},{"category":"Article","title":"Announcing GraalWasm — a WebAssembly engine in GraalVM","url":"https://medium.com/graalvm/announcing-graalwasm-a-webassembly-engine-in-graalvm-25cd0400a7f2","tags":["WebAssembly","Java","VM","article"],"content":"GraalVMでWebAssemblyのサポート。\nGraalVMのTrufle API使ってWebAssemblyバイナリに対するインタープリタを実装し、Wasmを実行できるようにしている。","relatedLinks":[]},{"category":"SlideVideo","title":"connor4312/cockatiel: A resilience and transient-fault-handling library that allows developers to express policies such as Backoff, Retry, Circuit Breaker, Timeout, Bulkhead Isolation, and Fallback. Inspired by .NET Polly.","url":"https://github.com/connor4312/cockatiel","tags":["JavaScript","TypeScript","library",".net"],"content":".NET Pollyをインスパイアしたエラーハンドリングと復帰処理ライブラリ。\nバックオフアルゴリズム、キャンセル、リトライ、サーキットブレーカー、タイムアウト、同時呼び出しの制限、フォールバックなどを行う","relatedLinks":[{"title":"App-vNext/Polly: Polly is a .NET resilience and transient-fault-handling library that allows developers to express policies such as Retry, Circuit Breaker, Timeout, Bulkhead Isolation, and Fallback in a fluent and thread-safe manner. From version 6.0.1, Polly targets .NET Standard 1.1 and 2.0+.","url":"https://github.com/App-vNext/Polly"}]},{"category":"SlideVideo","title":"GraphQLを用いたサイトに おけるパフォーマンス改善 （ECサイトを題材に）/ Improving online shopping site performance which using the GraphQL - Speaker Deck","url":"https://speakerdeck.com/nobuhikosawai/improving-online-shopping-site-performance-which-using-the-graphql","tags":["GraphQL","performance","slide"],"content":"GraphQLのパフォーマンス改善についてのスライド。\nDatadog APMを使ったサーバサイドのGraphQLのクエリトレースの読み方、フロントエンドの不必要なデータを取得するクエリの改善方法について。\nクエリと画面を紐付けるためにFragmentとColocation","relatedLinks":[{"title":"Using fragments - Client (React) - Apollo GraphQL Docs","url":"https://www.apollographql.com/docs/react/data/fragments/"}]},{"category":"WebsiteDocument","title":"open-source-labs/reactime: Chrome extension for state debugging in React applications","url":"https://github.com/open-source-labs/reactime","tags":["React","debug","Chrome","Extension"],"content":"ReactアプリケーションのStateをデバッグするブラウザ拡張。\nその時点のStateの表示、Stateの変化を記録して、特定の時点のStateを再現できる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Style Guide · Redux","url":"https://redux.js.org/style-guide/style-guide","tags":["redux","document"],"content":"Reduxのスタイルについての公式ドキュメント。\nEssential、Strongly Recommended、Recommendedの3つのカテゴリでスタイルに対するガイドをまとめている","relatedLinks":[]},{"category":"WebsiteDocument","title":"Who Can Use","url":"https://whocanuse.com/","tags":["accessibility","Tools"],"content":"背景色、文字色、文字サイズを指定してプレビューでき、コントラスト比やWCAGグレードを算出してくれるツール","relatedLinks":[]},{"category":"WebsiteDocument","title":"FAB — Frontend Application Bundles","url":"https://fab.dev/","tags":["JavaScript","bundler","Tools","spec","document"],"content":"フロントエンドアプリケーションをホスティングにデプロイする際のパッケージングや配信するNode.jsサーバについて決めた仕様。\nフレームワークごとに出力形式が異なり、ホスティング環境ごとに設定が異なるのを補うための中間フォーマット","relatedLinks":[{"title":"@fab/static","url":"https://github.com/fab-spec/fab/tree/next/packages/fab-static"}]},{"category":"WebsiteDocument","title":"Linc – The Perfect CI/CD Pipeline for your Frontend","url":"https://linc.sh/","tags":["CI ","CD","webservice","JavaScript"],"content":"フロントエンドアプリケーション向けのCI。CDウェブサービス。\nhttps://fab.dev/ のパッケージをサポートしており、コミットごとテスト、アプリケーションのプレビューができる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"KilledByAPixel/JSONCrush: Compress JSON into URL friendly strings","url":"https://github.com/KilledByAPixel/JSONCrush","tags":["JSON","URL","library","JavaScript"],"content":"JSON文字列をURLセーフにエンコード/デコードするライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"grubersjoe/reflow: Babel plugin to transpile Flow code to TypeScript with CLI wrapper","url":"https://github.com/grubersjoe/reflow","tags":["flowtype","TypeScript","console","Tools"],"content":"FlowのコードをTypeScriptのコードに変換するCLI。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"billinghamj/fix-es-imports: Fixes your ES import paths - from Node-style to explicit filenames","url":"https://github.com/billinghamj/fix-es-imports","tags":[" node","ECMAScript","module","Tools"],"content":"`require`では省略可能なモジュールインポートの`index.js`や拡張子を追加するツール。\nECMAScriptでは拡張子などは省略できないため、`import`文を修正する目的のツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"neomjs/neo: The webworkers driven UI framework (BETA version)","url":"https://github.com/neomjs/neo","tags":["JavaScript","webworker","library","UI"],"content":"WebWorkerベースのUIフレームワーク。\nWorker内でコンポーネントの処理を行う","relatedLinks":[{"title":"neomjs/neo: The webworkers driven UI framework (BETA version)","url":"https://github.com/neomjs/neo"},{"title":"neo/VISION.md at dev · neomjs/neo","url":"https://github.com/neomjs/neo/blob/dev/.github/VISION.md"}]},{"category":"Book","title":"子どもから大人までスラスラ読める JavaScriptふりがなKidsプログラミング ゲームを作りながら楽しく学ぼう！ - インプレスブックス","url":"https://book.impress.co.jp/books/1118101174","tags":["JavaScript","book"],"content":"JavaScriptのコードと本文にふりがなをふったプログラミングの書籍\nHTMLとJavaScriptを使ったゲームを作りながらプログラミングについてを学ぶ内容","relatedLinks":[]}]},{"meta":{"title":"2019-12-10のJS: Firefox 71.0、WebAssembly W3C Recommendation、Nullish Coalescing & Optional Chaining(ES2020)","author":"azu","layout":"post","date":"2019-12-10T00:49:12.291Z","category":"JSer","tags":["Firefox","WebAssembly","ECMAScript"],"url":"https://jser.info/2019/12/10/firefox-71.0webassembly-w3c-recommendationnullish-coalescing-and-optional-chaininges2020/"},"items":[{"category":"Headline","title":"Node v13.3.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v13.3.0/","tags":[" node","ReleaseNote"],"content":"Node.js 13.3.0リリース。\nExperimentalな`fs.rmdir`のリトライオプションの変更、HTTPのヘッダサイズを指定する`maxHeaderSize`を`http.Server`ごとに指定できるように、WASIのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v3.3.0 · facebook/create-react-app","url":"https://github.com/facebook/create-react-app/releases/tag/v3.3.0","tags":["React","library","ReleaseNote"],"content":"create-react-app 3.3.0リリース。\nカスタムテンプレートを指定できる`--template`引数のサポート。\nOptional Chaining/Nullish Coalescing Operators/Numeric Separatorsのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Firefox 71.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/71.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 71.0リリース。\n開発者ツールのコンソールがmulti-line modeをサポート、デバッガーがInline variable previewをサポート、ネットワークのRequest Blockingをサポート。\nまた、Web Sockets Inspectorがデフォルトで有効化された。\nMedia Session APIの実装、WindowsでPicture-in-Pictureのサポート、TLS 1.0と1.1がDeprecatedになるなど","relatedLinks":[{"title":"Firefox 71 for Developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/71"},{"title":"Firefox 71 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.dev/ja/versions/71/"},{"title":"News from Firefox on Mobile, Private Network and Desktop - The Mozilla Blog","url":"https://blog.mozilla.org/blog/2019/12/03/news-from-firefox-on-mobile-private-network-and-desktop/#PiP"}]},{"category":"Headline","title":"Release 10.1.0 This suspense is killing me · preactjs/preact","url":"https://github.com/preactjs/preact/releases/tag/10.1.0","tags":["React","library","ReleaseNote"],"content":"Preact 10.1.0リリース。\nPreact DevToolsのサポート、`<SuspenseList>`コンポーネントのサポートなど","relatedLinks":[{"title":"Preact Devtools","url":"https://preactjs.github.io/preact-devtools/"}]},{"category":"Headline","title":"World Wide Web Consortium (W3C) brings a new language to the Web as WebAssembly becomes a W3C Recommendation","url":"https://www.w3.org/2019/12/pressrelease-wasm-rec.html.en","tags":["WebAssembly","W3C","news"],"content":"WebAssemblyがW3C Recommendationになった。","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 80)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2019/12/devtools","tags":["Chrome","debiug","article"],"content":"Chrome 80の開発者ツールの変更点について。\nコンソールで`let`や`class`の再定義が可能に、DWARFをサポートしWebAssemblyのソースデバッグに対応、ネットワークパネルの改善、デフォルトのUAリストの更新など。\nまた、Coverageが関数毎とブロッグ毎を選択できるようになるなど","relatedLinks":[{"title":"Improved WebAssembly debugging in Chrome DevTools  |  Google Developers","url":"https://developers.google.com/web/updates/2019/12/webassembly"}]},{"category":"Article","title":"Improved WebAssembly debugging in Chrome DevTools  |  Google Developers","url":"https://developers.google.com/web/updates/2019/12/webassembly","tags":["Chrome","WebAssembly","article"],"content":"Chrome 80でDWARFのサポートが入った。\nWebAssemblyのデバッグ時に元のソースコードとの対応したブレークポイントの設定やステップ実行が可能になる。\nDWARFはバイナリ向けのSource Mapのような仕様で、バイナリに対してデバッグ用の情報を埋め込むためのデータフォーマット","relatedLinks":[{"title":"Dwarf Home","url":"http://dwarfstd.org/"}]},{"category":"Article","title":"Web Performance Calendar » Reading a WebPageTest Waterfall Chart","url":"https://calendar.perfplanet.com/2019/reading-a-webpagetest-waterfall-chart/","tags":["browser","performance","webservice","article"],"content":"WebPageTestのウォーターフォールチャートの読み方。\nチャートの要素の解説、典型的な問題の解説など","relatedLinks":[{"title":"How to read a WebPageTest waterfall chart - Frontend Web Developer, Oxfordshire, UK - Matt Hobbs","url":"https://nooshu.github.io/blog/2019/10/02/how-to-read-a-wpt-waterfall-chart/"}]},{"category":"Article","title":"Improving Tracking Prevention in Microsoft Edge - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2019/12/03/improving-tracking-prevention-microsoft-edge-79/","tags":["MSEdge","privacy","article"],"content":"MSEdge on ChromiumにTracking Preventionが試験的に実装された。\nFirefoxのETPと似たDisconnectのリストを使ったトラッカーのストレージアクセス、ネットワークアクセスのブロック。\nユーザーのサイトエンゲージメントスコアが `4.1` 以上となっている組織ドメインは対象から除外される。\n保護レベルとしてBasic、Blanced、Strictの設定ができるようになっている。","relatedLinks":[{"title":"Today’s Firefox Blocks Third-Party Tracking Cookies and Cryptomining by Default - The Mozilla Blog","url":"https://blog.mozilla.org/blog/2019/09/03/todays-firefox-blocks-third-party-tracking-cookies-and-cryptomining-by-default/"}]},{"category":"Article","title":"Upcoming Browser Behavior Changes: What Developers Need to Know","url":"https://auth0.com/blog/browser-behavior-changes-what-developers-need-to-know/","tags":["Chrome","browser","security","article"],"content":"SameSite Cookieの仕組みの解説、対応方法について","relatedLinks":[]},{"category":"Article","title":"Web Performance Calendar » The ugly truth about optimising beautiful images","url":"https://calendar.perfplanet.com/2019/the-ugly-truth-about-optimising-beautiful-images/","tags":["Image","performance","browser"],"content":"画像の最適化とパフォーマンスについて。\n単純に画像サイズを削減しただけでは、体験が向上しないケースもあることについて。\nLazy Loading、別のものによって表示されるまでブロックされてるケース。\n画像の最適化前に取り組むべきサイトのボトルネックとなりうる項目について","relatedLinks":[]},{"category":"Article","title":"ECMAScript proposal updates @ 2019-12 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2019/12/07/ecmascript-proposal-update","tags":["ECMAScript","proposal","article"],"content":"2019年12月のTC39ミーティングでステータスの変更があったECMAScript Proposalのまとめ。\nOptional ChainingとNullish coalescing OperatorがStag 4となりES2020に入ることが決まった。","relatedLinks":[{"title":"proposals/finished-proposals.md at master · tc39/proposals","url":"https://github.com/tc39/proposals/blob/master/finished-proposals.md"}]},{"category":"SoftwareLibrary","title":"alyssaxuu/flowy: The minimal javascript library to create flowcharts ✨","url":"https://github.com/alyssaxuu/flowy","tags":["JavaScript","library","graphic"],"content":"フローチャートを作成するライブラリ。\nブロッグをD&Dしてフローチャートを作成できるGUI、フローチャートをJSONとしてインポート/エクスポートできる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Release v6.0.0 · sindresorhus/meow","url":"https://github.com/sindresorhus/meow/releases/v6.0.0","tags":[" node","console","library"],"content":"Node.js CLI向けのライブラリであるmeow 6.0.0リリース。\nNode.js 8未満のサポート終了、TypeScriptの型定義ファイルの同梱、`number`型のサポート、`hardRejection`オプションの追加など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mikeal/reg: Native ESM Package Manager","url":"https://github.com/mikeal/reg","tags":["ECMAScript","JavaScript","module","Tools","node.js"],"content":"ExperimentalなECMAScript Modulesパッケージマネージャー。\nIPLDでデータを定義している。","relatedLinks":[{"title":"IPLD - The data model of the content-addressable web","url":"https://ipld.io/"}]},{"category":"SoftwareLibrary","title":"nodejs/webcrypto: Implementation of WebCrypto API as an npm package","url":"https://github.com/nodejs/webcrypto","tags":["node.js","library"],"content":"WebCrypto APIのNode.js向けの実装","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cristianbote/goober: 🥜 goober, a less than 1KB 🎉css-in-js alternative with a familiar API","url":"https://github.com/cristianbote/goober","tags":["JavaScript","CSS","library"],"content":"ファイルサイズの小さなCSS-in-JSの実装ライブラリ","relatedLinks":[]}]},{"meta":{"title":"2019-12-17のJS: npm v6.13.4(security update)、JSON Parse、WASI on Node.js","author":"azu","layout":"post","date":"2019-12-17T00:19:01.279Z","category":"JSer","tags":["npm","Node.js","WebAssembly"],"url":"https://jser.info/2019/12/17/npm-v6.13.4security-updatejson-parsewasi-on-node.js/"},"items":[{"category":"Headline","title":"The npm Blog — Binary Planting with the npm CLI","url":"https://blog.npmjs.org/post/189618601100/binary-planting-with-the-npm-cli","tags":["npm","yarn","ReleaseNote","security"],"content":"npm 6.13.3以下とyarn 1.12.0以下で、\n悪意あるパッケージをインストールするとシステムのコマンドを書き換えできる脆弱性があった。\nnpm 6.13.4、yarn 1.12.1でそれぞれ修正されている","relatedLinks":[{"title":"Release v1.21.1 · yarnpkg/yarn","url":"https://github.com/yarnpkg/yarn/releases/tag/v1.21.1"}]},{"category":"Headline","title":"Release 10.1.1 · preactjs/preact","url":"https://github.com/preactjs/preact/releases/tag/10.1.1","tags":["React","library","ReleaseNote"],"content":"Preact 10.1.1リリース。\n`preact/debug`を使ってるデバッグ時の警告にコンポーネントのスタックトレースが表示できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"December 2019 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/december-2019-security-releases/","tags":[" node","ReleaseNote"],"content":"npm 6.13.3以下に含まれていた脆弱性の対応のため、npm 6.13.4へのアップデートを含むNode.jsの各バージョンが2019-12-17リリースされる。","relatedLinks":[{"title":"The npm Blog — Binary Planting with the npm CLI","url":"https://blog.npmjs.org/post/189618601100/binary-planting-with-the-npm-cli"},{"title":"Previous Releases | Node.js","url":"https://nodejs.org/en/download/releases/"}]},{"category":"Article","title":"JSON Parser with JavaScript | Tan Li Hau","url":"https://lihautan.com/json-parser-with-javascript/","tags":["JSON","article","JavaScript"],"content":"`JSON.parse`を自作しながら、パーサの作り方について学ぶ記事","relatedLinks":[]},{"category":"Article","title":"Modeling State with TypeScript | Azavea","url":"https://www.azavea.com/blog/2019/12/12/modeling-state-with-typescript/","tags":["TypeScript","article"],"content":"TypeScriptの`interface`でそれぞれのステートの型を定義し、ステートが取れる次のステートを定義する方法について。\nCondictional Typesを使った実装方法、それぞれのステート型に対するエラーメッセージの定義などについて","relatedLinks":[]},{"category":"Article","title":"2019年のWebGLデバッグツール状況 - Qiita","url":"https://qiita.com/naotaro0123/items/0d5fe877354562a6d1d1","tags":["WebGL","debug","JavaScript","article"],"content":"WebGL系のデバッグツールの開発状況のまとめ","relatedLinks":[]},{"category":"Article","title":"Node.js のWASIモジュールについて - kakts-log","url":"http://kakts-tec.hatenablog.com/entry/2019/12/16/221941","tags":[" node","article","WebAssembly"],"content":"Node.js v13.3.0で試験的にサポートされたWASI対応について。\n`wasi`モジュールを使ってWebAssemblyの実行方法について","relatedLinks":[{"title":"Node v13.3.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v13.3.0/"}]},{"category":"SlideVideo","title":"Start TypeScript Leaving JavaScript as JS - Speaker Deck","url":"https://speakerdeck.com/ginpei/start-typescript-leaving-javascript-as-js","tags":["JavaScript","TypeScript","slide"],"content":"`allowJs`と`checkJs`を使ったJavaScriptからのTypeScriptの導入について","relatedLinks":[]},{"category":"WebsiteDocument","title":"theodo/falco: Falco helps you monitor, analyze, and optimize your websites.","url":"https://github.com/theodo/falco","tags":["performance","Tools"],"content":"WebPageTestの実行と結果の管理ダッシュボードを提供するツール。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Mongoose 101 | Zell Liew","url":"https://zellwk.com/blog/mongoose/","tags":["MongoDB"," node","tutorial"],"content":"Mongooseを使ったMongoDBの使い方チュートリアル。\nSchemaの定義、データの追加、更新、検索、削除について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"oatw/luda: A library helps to build cross-framework UI components.","url":"https://github.com/oatw/luda","tags":["JavaScript","UI","library"],"content":"UIコンポーネントを扱うライブラリ。\njQueryのようなAPIでコンポーネントの定義、ライフサイクル、Mixin、組み込みコンポーネントを提供するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"skovy/cooky-cutter: 🍪 Object factories for testing in TypeScript","url":"https://github.com/skovy/cooky-cutter","tags":["TypeScript","JavaScript","library"],"content":"TypeScriptで特定の構造のデータを生成するファクトリライブラリ。\nファクトリに対してGenericsで型を渡し、型に一致するテストデータを生成する。\nランダムな値、連番な値、ファクトリの合成などのヘルパー関数も提供する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nrdobie/superjson: JSON serializer with support for custom Classes and more JavaScript built-in objects.","url":"https://github.com/nrdobie/superjson","tags":["JavaScript","library","TypeScript","JSON"],"content":"クラスのシリアライズやビルトインオブジェクトのサポートを追加したJSON serializers/deserializers。\nDateやMapなどの対応、独自クラスのカスタム定義の追加、`JSON`オブジェクトと入れ替える機能も持っている","relatedLinks":[{"title":"Here comes SuperJSON - One Dead Pixel - Medium","url":"https://medium.com/one-dead-pixel/here-comes-superjson-d7f7776f7e2a"}]},{"category":"Book","title":"Deep JavaScript: Theory and techniques","url":"https://exploringjs.com/deep-js/","tags":["JavaScript","book"],"content":"Dr. AxelによるJavaScriptの実践的なテクニックについて扱う書籍","relatedLinks":[]},{"category":"Book","title":"［モダンJavaScript＆ゲームで2倍楽しい］グラフィックスプログラミング入門 ——リアルタイムに動く画面を描く。開発者直伝の基本 | 杉本 雅広 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4297110857/","tags":["JavaScript","book","game"],"content":"2020年1月18日発売\nJavaScriptを使った2Dゲームでのグラフィックスプログラミングの入門書","relatedLinks":[]}]},{"meta":{"title":"2019-12-25のJS: V8 v8.0、Chrome 80 beta、State of JavaScript(アンケート)","author":"azu","layout":"post","date":"2019-12-25T00:13:25.642Z","category":"JSer","tags":["V8","Chrome","JavaScript"],"url":"https://jser.info/2019/12/25/v8-v8.0chrome-80-betastate-of-javascript/"},"items":[{"category":"Headline","title":"V8 release v8.0 · V8","url":"https://v8.dev/blog/v8-release-80","tags":["V8","ReleaseNote"],"content":"V8 v8.0リリース。\nメモリ消費量の改善、ビルドインの高階関数の最適化、Optional ChainingとNullish coalescingのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 97 | WebKit","url":"https://webkit.org/blog/9672/release-notes-for-safari-technology-preview-97/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 97リリース。\nResize Observerを有効化、`Clipboard.readText``String#replaceAll`、Picture-in-Picture Web APIのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 80, Content Indexing, ES Modules and More","url":"https://blog.chromium.org/2019/12/chrome-80-content-indexing-es-modules.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 80βリリース。\nContent IndexingとContact Picker APIのOrigin Trialサポート、Web Worker中でES Modulesを利用できるように。\nFetch APIが`Sec-Fetch-Dest`ヘッダをサポート、Text URL Fragmentsのサポート。\nWeb Components v0の削除など","relatedLinks":[{"title":"Indexing your offline-capable pages with the Content Indexing API","url":"https://web.dev/content-indexing-api/"},{"title":"A contact picker for the web","url":"https://web.dev/contact-picker/"}]},{"category":"Headline","title":"Release v1.0.0 · aframevr/aframe","url":"https://github.com/aframevr/aframe/releases/tag/v1.0.0","tags":["AR","JavaScript","library","ReleaseNote"],"content":"A-Frame 1.0.0リリース。\nWebXR仕様のサポート、WebXR gamepadsモジュール、WebXR ARモジュール(experimental)のサポート、Three.jsのアップデートなど","relatedLinks":[{"title":"A-Frame v1.0.0 - WebXR Support, AR Mode – A-Frame","url":"https://aframe.io/blog/aframe-v1.0.0/"}]},{"category":"Headline","title":"Node v13.5.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v13.5.0/","tags":[" node","ReleaseNote"],"content":"Node.js v13.5.0リリース。\n終了時にスタックトレースを出力する`--trace-exit`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"sinon/CHANGELOG.md at master · sinonjs/sinon","url":"https://github.com/sinonjs/sinon/blob/master/CHANGELOG.md#800--2019-12-22","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Sinon.js 8.0.0リリース。\nlolexをアップグレードしasync timerメソッドに対応、`sinon.spyCall`と`sinon.sandbox.create`の削除など","relatedLinks":[{"title":"sinonjs/lolex: Fake setTimeout and friends (collectively known as ","url":"https://github.com/sinonjs/lolex"}]},{"category":"Headline","title":"ESLint v6.8.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2019/12/eslint-v6.8.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 6.8.0リリース。\n`.eslintrc.cjs`のサポート、`--no-error-on-unmatched-pattern`フラグの追加など。\nまた誤検知が多かった`require-atomic-updates`ルールは`eslint:recommended`から削除されるなど","relatedLinks":[{"title":"ESLint v6.8.0 - Qiita","url":"https://qiita.com/mysticatea/items/cc40251136ce167a010b"}]},{"category":"Headline","title":"Release v4.0.5 · reduxjs/redux","url":"https://github.com/reduxjs/redux/releases/tag/v4.0.5","tags":["redux","ReleaseNote"],"content":"Redux 4.0.5リリース。\nメモリリークの修正、TypeScriptの型定義改善など","relatedLinks":[]},{"category":"Headline","title":"Release tfjs-backend-wasm-v1.5.1-alpha5: Update tfjs-backend-wasm to 1.5.1-alpha5. (#2610) · tensorflow/tfjs","url":"https://github.com/tensorflow/tfjs/releases/tag/tfjs-backend-wasm-v1.5.1-alpha5","tags":["JavaScript","WebAssembly","library","ReleaseNote"],"content":"TensorFlow.jsのWebAssemblyバックエンドがアルファリリース。","relatedLinks":[{"title":"TensorFlow on Twitter: ","url":"https://twitter.com/TensorFlow/status/1208153137774813187"}]},{"category":"Article","title":"An Update on CDNJS","url":"https://blog.cloudflare.com/an-update-on-cdnjs/","tags":["cdn","JavaScript","article"],"content":"JavaScriptライブラリをCloudflareのCDN経由で配布するCDNJSについて。\nCDNJSの今後について","relatedLinks":[]},{"category":"Article","title":"Feature watch: ECMAScript 2020","url":"https://2ality.com/2019/12/ecmascript-2020.html","tags":["ECMAScript","proposal","article"],"content":"ECMAScript 2020(予定)のProposalまとめ","relatedLinks":[]},{"category":"Article","title":"Server-Sent Events (SSE): A conceptual deep dive | Ably Realtime","url":"https://www.ably.io/concepts/server-sent-events","tags":["JavaScript"," node","article"],"content":"Server-Sent Events (SSE)のコンセプトと使い方について。\nサポートブラウザ、ExpressでのSSEなレスポンスの返し方についてなど","relatedLinks":[]},{"category":"Article","title":"TypeScript で書く React コンポーネントを基礎から理解する - Qiita","url":"https://qiita.com/sangotaro/items/3ea63110517a1b66745b","tags":["React","TypeScript","article"],"content":"ReactのTypeScript型定義の扱い方について。\nコンポーネントの型、Childrenの型、既存のHTML要素のProps拡張などについて","relatedLinks":[{"title":"typescript-cheatsheets/react-typescript-cheatsheet: Cheatsheets for experienced React developers getting started with TypeScript","url":"http://example.com/"}]},{"category":"SlideVideo","title":"The State of JavaScript 2019","url":"https://2019.stateofjs.com/","tags":["JavaScript","アンケート"],"content":"State of JavaScript 2019のアンケート結果が公開された","relatedLinks":[]},{"category":"SoftwareLibrary","title":"alpinejs/alpine: A rugged, minimal framework for composing JavaScript behavior in your markup.","url":"https://github.com/alpinejs/alpine","tags":["JavaScript","DOM","UI","library"],"content":"HTMLの属性にディレクティブを指定することでリアクティブな動作を実装できる小さなフレームワーク。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"anephenix/sarus: A WebSocket JavaScript library","url":"https://github.com/anephenix/sarus","tags":["JavaScript","WebSocket","library"],"content":"WebSocketライブラリ。\nイベントハンドリング、自動再接続、メッセージのQueuing、リトライ、永続化のサポートなど","relatedLinks":[]},{"category":"Book","title":"Structure and Interpretation of Computer Programs, JavaScript Adaptation","url":"https://sicp.comp.nus.edu.sg/","tags":["JavaScript","book"],"content":"SICPのJavaScript版","relatedLinks":[]}]},{"meta":{"title":"2019-12-31のJS: Ember 3.15 Octane、TypeScriptで書いたLibraryを公開する手順","author":"azu","layout":"post","date":"2019-12-31T10:37:44.416Z","category":"JSer","tags":["Ember","TypeScript","npm"],"url":"https://jser.info/2019/12/31/ember-3.15-octanetypescriptlibrary/"},"items":[{"category":"Headline","title":"Ember.js - Ember 3.15 \"Octane\" Released","url":"https://blog.emberjs.com/2019/12/20/ember-3-15-released.html","tags":["Ember","ReleaseNote"],"content":"Ember 3.15リリース。\nEmber Octaneが正式リリースとなり、`ember new`でのデフォルトとなった。\nまた`Component#isVisible`、`partial`、`window.ENV`が非推奨となった。","relatedLinks":[{"title":"Ember.js - Octane is Here","url":"https://blog.emberjs.com/2019/12/20/octane-is-here.html"}]},{"category":"Article","title":"New WebKit Features in Safari 13 | WebKit","url":"https://webkit.org/blog/9674/new-webkit-features-in-safari-13/","tags":["safari","article"],"content":"iOS/iPad/macOSでのSafari 13の変更点についての紹介記事。\nPointer Events、Visual Viewport API、ITP(Intelligent Tracking Prevention)、FIDO2、WebDriverのサポートになどについて","relatedLinks":[]},{"category":"Article","title":"JSMonday - Publishing a TypeScript Library","url":"https://www.jsmonday.dev/articles/18/publishing-a-typescript-library","tags":["TypeScript","library"],"content":"TypeScriptでライブラリを書いて、npm publishするまでのチュートリアル。\nTypeScriptの導入、Jestでのテスト、Codecovでのコードカバレッジ、npm run-scriptの設定など","relatedLinks":[]},{"category":"Article","title":"Making of: Best of 2019 – Johan Ronsse","url":"https://johanronsse.be/2019/12/28/making-of-best-of-2019/","tags":["article","Development"],"content":"Best of 2019というサイトをどのように作ったかについての記事。\nSvelteとCSSフレームワーク Ygdirを使った開発、Figmaを使ったデザイン、Notionを使ったコンテンツ管理などについて","relatedLinks":[{"title":"Ygdir - Documentation","url":"https://ygdir.dev/"}]},{"category":"Article","title":"Discovering Svelte: Adding, Editing and Estimating Tasks In The Pomodoro Technique App | Barbarian Meets Coding","url":"https://www.barbarianmeetscoding.com/blog/2019/12/29/discovering-svelte-adding-some-tasks-and-pomodoros","tags":["Svelte","JavaScript","article"],"content":"TODOアプリを作りながらSvelteについて学ぶ記事。\nSvelteのLifeCyle hook、`$:`のラベルを使ったReactiveな仕組みについて","relatedLinks":[]},{"category":"Article","title":"初学者向けpackage.jsonハンズオン - Qiita","url":"https://qiita.com/segur/items/6eebb70ec2de03016dde","tags":[" node","npm","article"],"content":"`npm`コマンドと`package.json`についての初心者向けチュートリアル記事。\nパッケージのインストール、アンインストール、SemVer、ロックファイルについてなど","relatedLinks":[]},{"category":"Article","title":"Node.jsでのCLIの作り方と便利なライブラリまとめ - Qiita","url":"https://qiita.com/toshi-toma/items/ea76b8894e7771d47e10","tags":[" node","console","Tools","article"],"content":"Node.jsでCLIを作る場合の作り方やCLI向けのライブラリについて","relatedLinks":[]},{"category":"Article","title":"React.memo を使ったパフォーマンス最適化について - 30歳からのプログラミング","url":"https://numb86-tech.hatenablog.com/entry/2019/12/20/222412","tags":["React","article","performance"],"content":"`React.memo`と`useCallback`を使ったメモ化とパフォーマンスの最適化についての記事","relatedLinks":[]},{"category":"Article","title":"Base Web - Visual Regression Testing","url":"https://baseweb.design/blog/visual-regression-testing/","tags":["browser","testing","article"],"content":"Visual Regression Testingについての記事。\nVisual Regression Testingの目的、導入する際の方法、ワークフローについてなど","relatedLinks":[]},{"category":"Article","title":"Ember.js - Octane is Here","url":"https://blog.emberjs.com/2019/12/20/octane-is-here.html","tags":["Ember","article"],"content":"Ember 3.15で導入されたOctaneについて。\nGlimmer Componentsの導入、Element ModifiersでのLifeCyleHooksを使った振る舞いの実装、`@tracked`を使ったReactiveなモデルの実装など。\nその他にはチュートリアルの刷新、Dev Toolsのアップデートなど","relatedLinks":[{"title":"Ember.js Classic vs Octane: a cheat sheet","url":"https://ember-learn.github.io/ember-octane-vs-classic-cheat-sheet/"},{"title":"Glimmer","url":"https://glimmerjs.com/"}]},{"category":"SoftwareLibrary","title":"bbc/peaks.js: JavaScript UI component for interacting with audio waveforms","url":"https://github.com/bbc/peaks.js","tags":["JavaScript","sound","library"],"content":"音声の波形を表示するUIコンポーネント。\nWeb Audioベースの波形生成と`audiowaveform`を使い事前に音声波形を生成したものも利用できる。","relatedLinks":[{"title":"bbc/audiowaveform: C++ program to generate waveform data and render waveform images from audio files","url":"https://github.com/bbc/audiowaveform"}]},{"category":"SoftwareLibrary","title":"ganapativs/react-spectrum: Generate colorful text placeholders 🎨","url":"https://github.com/ganapativs/react-spectrum","tags":["React","library"],"content":"カラフルなテキストプレースホルダを生成するReactコンポーネント","relatedLinks":[]},{"category":"SoftwareLibrary","title":"saitoeku3/use-lazyload-ref: 🖼️Custom hook to use lazy load easily","url":"https://github.com/saitoeku3/use-lazyload-ref","tags":["React","library","JavaScript"],"content":"`src`属性の遅延ロードを`ref`と`data-src`属性の指定することで行うReact Hooksを使ったライブラリ","relatedLinks":[{"title":"React で簡単に遅延読み込みを実装できるライブラリを作りました - 陽気なサイとエクストリーム！","url":"https://sathoeku.hatenablog.com/entry/2019/12/30/225051"}]},{"category":"SoftwareLibrary","title":"Release Tesseract.js v2.0.0 · naptha/tesseract.js","url":"https://github.com/naptha/tesseract.js/releases/tag/v2.0.0","tags":["JavaScript","OCR","library","WebAssembly"],"content":"Emscriptenを使ったOCRライブラリのTesseract.js 2.0リリース。\ntesseract　v４．１へのアップデート、複数の原語の認識をサポート、画像フォーマット(png,jpg,bmpなど)のサポート、WebAssemblyやWebWorkerのサポートでパフォーマンス改善など","relatedLinks":[{"title":"Why I refactor tesseract.js v2? - Jerome Wu - Medium","url":"https://medium.com/@jeromewus/why-i-refactor-tesseract-js-v2-50f750a9cfe2?"}]}]},{"meta":{"title":"2020-01-07のJS: Mocha v7.0.0、Next.js 9.1.7、ペースにあわせたTypeScriptへの移行","author":"azu","layout":"post","date":"2020-01-07T02:10:03.192Z","category":"JSer","tags":["Test","Next.js","TypeScript"],"url":"https://jser.info/2020/01/07/mocha-v7.0.0next.js-9.1.7typescript/"},"items":[{"category":"Headline","title":"mocha/CHANGELOG.md at master · mochajs/mocha","url":"https://github.com/mochajs/mocha/blob/master/CHANGELOG.md#%E2%80%8B700--2020-01-05","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Mocha 7.0.0リリース。\nNode.js v6.xのサポート終了、一部コマンドライン引数のリネーム、`Mocha`コンストラクタのオプションとコマンドラインオプションをあわせるように変更など。\nまた、`mocha.opts`ファイルが非推奨となった。","relatedLinks":[{"title":"Soft deprecate ","url":"https://github.com/mochajs/mocha/issues/3910"}]},{"category":"Headline","title":"Release v0.115.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.115.0","tags":["flowtype","ReleaseNote"],"content":"Flow v0.115.0リリース。\nTypes First modeではexportされたclassやfunctionは再定義できなくなるなど。","relatedLinks":[{"title":"What the Flow team has been up to - Flow - Medium","url":"https://medium.com/flow-type/what-the-flow-team-has-been-up-to-54239c62004f"}]},{"category":"Headline","title":"Blog - Next.js 9.1.7 | Next.js","url":"https://nextjs.org/blog/next-9-1-7","tags":["JavaScript","React","ReleaseNote"],"content":"Next.js 9.1.7リリース。\nクライアントのビルドサイズの削減、ビルド結果表示の変更、ビルドインのpolyfillとしして`fetch`、URL、`Object.assign`の追加、`reactStrictMode`オプションの追加など","relatedLinks":[{"title":"Release v9.1.7 · zeit/next.js","url":"https://github.com/zeit/next.js/releases/tag/v9.1.7"}]},{"category":"Article","title":"Understanding positioning in CSS - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/huijing/understanding-positioning-in-css-7mn","tags":["CSS","article"],"content":"CSSのBox modelとpositionについての記事。","relatedLinks":[]},{"category":"Article","title":"How to move your project to TypeScript - at your own pace - Twilio","url":"https://www.twilio.com/blog/move-to-typescript","tags":["JavaScript","TypeScript","VSCode","article"],"content":"プロジェクトのコードをTypeScriptに移行するポイントについての記事。\nVSCodeの`settings.json`での`checkJs`、`tsconfig.json`を使った`allowJs`と`checkJs`の設定、JSからTSへのリファクタリング、`strict`の設定などについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"machinelearnjs/machinelearnjs: Machine Learning library for the web and Node.","url":"https://github.com/machinelearnjs/machinelearnjs","tags":["TypeScript","MachineLearning","library"],"content":"TypeScriptで書かれたMLライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"hjkcai/typesafe-joi: A fork of joi that produces typed validation results in TypeScript","url":"https://github.com/hjkcai/typesafe-joi","tags":["TypeScript","JavaScript","library"],"content":"データバリデーターであるjoiのTypeScriptフォークライブラリ。\n大部分は互換性のあるAPIだが、一部はType SafeにするためAPIを変更している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"antvis/G6: ♾ A Graph Visualization Framework in JavaScript","url":"https://github.com/antvis/G6","tags":["graphic","JavaScript","library"],"content":"データビジュアライズライブラリ。\nグラフの情報とデータを渡すことでビジュアライズしてくれるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"shellyln/tynder: TypeScript friendly Data validator for JavaScript.","url":"https://github.com/shellyln/tynder","tags":["JavaScript","library","Tools"],"content":"TypeScriptライクなDSLでスキーマを定義し、実行時にデータの型を検証を行うバリデーションライブラリ。","relatedLinks":[{"title":"TypeScriptの型定義を使って、実行時にデータの検証を行う - Shellylのブログ","url":"https://shellyln.hatenablog.com/entry/2020/01/05/161345"}]},{"category":"SoftwareLibrary","title":"mroderick/plete: Vanilla autocomplete component","url":"https://github.com/mroderick/plete","tags":["JavaScript","UI","library","WAI-ARIA"],"content":"依存のないautocomplete UIライブラリ。\nModern browserを対象としている。","relatedLinks":[]},{"category":"Book","title":"BiB/i あらため Bibi v1.0.0 を公開しました | ふらここ、こ","url":"https://fracoco.co/2020/01/03/bibi-v1.html","tags":["epub","JavaScript","ReleaseNote"],"content":"JavaScriptで書かれているEpubリーダのBibi v1.0.0リリース。\nZIPファイルの展開にWasmを使うBibi Zip Loaderによる高速化、UIの改善、epubの対応改善など","relatedLinks":[{"title":"lunascape/bibi-zip-loader","url":"https://github.com/lunascape/bibi-zip-loader"}]}]},{"meta":{"title":"2020-01-13のJS: Firefox 72、Node.js 13.6.0、TypeScript 3.8 Beta(Private Fields)","author":"azu","layout":"post","date":"2020-01-13T02:31:20.234Z","category":"JSer","tags":["Firefox","Node.js","TypeScript"],"url":"https://jser.info/2020/01/13/firefox-72node.js-13.6.0typescript-3.8-betaprivate-fields/"},"items":[{"category":"Headline","title":"Release throw new Preact('10.2.0') · preactjs/preact","url":"https://github.com/preactjs/preact/releases/tag/10.2.0","tags":["JavaScript","React","library","ReleaseNote"],"content":"Preact 10.2.0リリース。\n`useErrorBoundary` hookのサポート、`lazy()`がnamed exportsに対応など","relatedLinks":[]},{"category":"Headline","title":"Firefox 72 — our first song of 2020 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/01/firefox-72-our-first-song-of-2020/","tags":["Firefox","ReleaseNote"],"content":"Firefox 72リリース。\nフラグ付きでコンソールのAsync Stack Traceの対応、CSSのShadow Parts(`::part()`)、CSS Motion Pathの対応。\n通知許可の求めるにはユーザーインタラクションのイベント内で行う必要があるように変更、Nullish coalescing operator、`formdata`イベントの対応など","relatedLinks":[{"title":"Firefox 72 for Developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/72"},{"title":"Firefox 72.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/72.0/releasenotes/"},{"title":"Firefox 72 Site Compatibility | Firefox Site Compatibility","url":"https://www.fxsitecompat.dev/en-CA/versions/72/"}]},{"category":"Headline","title":"Node v12.14.1 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v12.14.1/","tags":[" node","ReleaseNote"],"content":"Node.js 12.14.1リリース。\n`v8.serialize`と`v8.deserialize`がStable APIとなるなど","relatedLinks":[]},{"category":"Headline","title":"Node v13.6.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v13.6.0/","tags":[" node","ReleaseNote"],"content":"Node.js 13.6.0リリース。\n正規表現にマッチするかをテストできる`assert.match()`と`assert.doesNotMatch()`の実装、\n`EventEmitter.on`のAsync Iterator対応。\nStreamに対する`fs`の実装を指定できるオプションの追加、`error`イベントを副作用なしに監視できる`EventEmitter.errorMonitor` Symbolを追加。\n`perf_hooks`モジュールがStable APIになるなど","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 98 | WebKit","url":"https://webkit.org/blog/9689/release-notes-for-safari-technology-preview-98/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 98 リリース。\n`OffscreenCanvas.convertToBlob`のサポート、CSSの`clamp()`のサポート。\n`beforeunload`や`unload`時の同期XHRが禁止される変更など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 3.8 Beta | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-8-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.8 Betaリリース。\n`import type`/`export type`で型定義だけをimport/exportできるように、Stage 3のECMAScript Private Fieldsに対応。\nTop-Level `await`に対応、`target`と`module`が`es2020`をサポート、`watchOptions`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v2.9.0 · date-fns/date-fns","url":"https://github.com/date-fns/date-fns/releases/tag/v2.9.0","tags":["JavaScript","library","ReleaseNote"],"content":"date-fns 2.9.0リリース。\n`eachYearInterval`、`eachMonthInterval`、`isExists`の追加。\nオブジェクトでまとめてDateを操作する`add`と`sub`の追加など","relatedLinks":[]},{"category":"Headline","title":"7.8.0 Released: ECMAScript 2020, .mjs configuration files and @babel/cli improvements · Babel","url":"https://babeljs.io/blog/2020/01/11/7.8.0","tags":["babel","ReleaseNote"],"content":"Babel 7.8.0リリース。\nES2020のサポートをデフォルト化、`babel.config.mjs`など設定ファイルの対応を整理、`--copy-ignored`と`--out-file-extension`のサポートなど。\nまた 8.0.0に向けた準備などについて書かれている","relatedLinks":[{"title":"Babel 8 Release Plan · Issue #10746 · babel/babel","url":"https://github.com/babel/babel/issues/10746"}]},{"category":"Headline","title":"Release Version 16.0.0 · jsdom/jsdom","url":"https://github.com/jsdom/jsdom/releases/tag/16.0.0","tags":["JavaScript","DOM","ReleaseNote","library"],"content":"jsdom 16.0.0リリース。\nNode.js 10未満のサポート終了、`dom.runVMScript()`の廃止、`prototype`使った`Window`間のプロパティ共有の廃止など。`window.getSelection()`のサポート、Timerのメモリリークを修正など","relatedLinks":[]},{"category":"Headline","title":"Release V1 RELEASE! @pika/web is now Snowpack · pikapkg/snowpack","url":"https://github.com/pikapkg/snowpack/releases/tag/v1.0.1","tags":["JavaScript","bundler","Tools"],"content":"Snowpack 1.0.0リリース。\nインストール時にES Modulesとして読み込めるモジュールを配置することで、変更ごとにビルドしないでアプリケーション開発できることを目的にしている。\n`@pika/web`からSnowpackにリネーム、`--optimize`でのtree-shakingサポート等。","relatedLinks":[{"title":"Snowpack","url":"https://www.snowpack.dev/"}]},{"category":"Article","title":"Guide to Web Authentication","url":"https://webauthn.guide/","tags":["WebAuthentication","article"],"content":"Web Authenticationの基本的な目的や使い方について書かれた記事","relatedLinks":[]},{"category":"Article","title":"Chromium Blog: Introducing quieter permission UI for notifications","url":"https://blog.chromium.org/2020/01/introducing-quieter-permission-ui-for.html","tags":["Chrome","article"],"content":"Chrome 80で入る通知などのパーミッションデザインの変更について。\nQuiet UIと呼ばれる新しい許可UIの追加と設定方法について。\nまたChrome UX Reportのデータをもとに、通知の受け入れ率が低いサイトは自動的にquieter promptsにする変更などが追加される予定。","relatedLinks":[]},{"category":"Article","title":"Advancing the web framework ecosystem","url":"https://web.dev/advancing-framework-ecosystem-cds-2019/","tags":["Chrome","google","JavaScript","library","article"],"content":"Chromeチームが最近取り組んでいるいウェブフレームワークの最適化ついて。\nAngular、Next.js、Nuxt.js、Babelについてのパフォーマンス最適化などの取り組みを紹介している","relatedLinks":[]},{"category":"Article","title":"Raw WebGPU","url":"https://alain.xyz/blog/raw-webgpu","tags":["article","Chrome","safari","WebGL","WebPlatformAPI"],"content":"WebKitやChromiumに試験的に実装されているWebGPUについてのチュートリアル。Vulkan、DirectX 12、Metalを扱うことを目的としたWeb API、基本的な使い方について解説している","relatedLinks":[{"title":"WebGPU","url":"https://gpuweb.github.io/gpuweb/"}]},{"category":"SoftwareLibrary","title":"qawolf/qawolf: 🐺Create browser tests 10x faster","url":"https://github.com/qawolf/qawolf","tags":["Chrome","testing","library","TypeScript"],"content":"PupeteerとJestを使ったテストフレームワーク。\n操作を記憶してテストケースとSelectorを作成でき、CIに実行結果の動画をアップロードのサポートなどをしている。\nAutomatic waiting、Keyboard eventsなどをサポートしている","relatedLinks":[{"title":"QA Wolf","url":"https://docs.qawolf.com/"}]},{"category":"SoftwareLibrary","title":"babel/preset-modules: A Babel preset that targets modern browsers by fixing engine bugs (will be merged into preset-env eventually)","url":"https://github.com/babel/preset-modules","tags":["babel","library","JavaScript"],"content":"@babel/preset-envにマージされる予定の、Modern Browser向けの最適化を目的にしたBabel Preset。\nMSEdgeなどのES Modulesをサポートしているが一部構文にバグがあるケースなどにも対応している。","relatedLinks":[]}]},{"meta":{"title":"2020-01-21のJS: 新しいMicrosoft Edge(Chromium-based)、AVA 3.0リリース","author":"azu","layout":"post","date":"2020-01-21T02:07:39.513Z","category":"JSer","tags":["MSEdge","AVA","Testing"],"url":"https://jser.info/2020/01/21/microsoft-edgechromium-basedava-3.0/"},"items":[{"category":"Headline","title":"Release v7.0.0-esm1 (experimental) · mochajs/mocha","url":"https://github.com/mochajs/mocha/releases/tag/v7.0.0-esm1","tags":[" node","testing","library","ReleaseNote"],"content":"MochaのES Modules対応のExperimental版がリリースされた","relatedLinks":[]},{"category":"Headline","title":"New year, new browser - The new Microsoft Edge is out of preview and now available for download | Windows Experience Blog","url":"https://blogs.windows.com/windowsexperience/2020/01/15/new-year-new-browser-the-new-microsoft-edge-is-out-of-preview-and-now-available-for-download/","tags":["MSEdge","Chrome","ReleaseNote"],"content":"ChromiumベースのMicrosoft Edgeが公開された。\nWindows 7+、macOSに対応したバージョンが配布されている。","relatedLinks":[{"title":"Upgrading to the new Microsoft Edge - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2020/01/15/upgrading-new-microsoft-edge-79-chromium/"},{"title":"Download New Microsoft Edge Browser | Microsoft","url":"https://www.microsoft.com/en-us/edge"}]},{"category":"Headline","title":"mustache.js/CHANGELOG.md at master · janl/mustache.js","url":"https://github.com/janl/mustache.js/blob/master/CHANGELOG.md#400--16-january-2020","tags":["JavaScript","library","ReleaseNote"],"content":"テンプレートエンジンであるmustache 4.0.0リリース。\n`.to_html()`メソッドの削除、テンプレートのキャッシュの仕組みをカスタマイズできるようになるなど。","relatedLinks":[]},{"category":"Headline","title":"TestCafe v1.8.0 Released | TestCafe","url":"https://devexpress.github.io/testcafe/blog/testcafe-v1-8-0-released.html","tags":["E2E","testing","library","ReleaseNote"],"content":"TestCafe v1.8.0リリース。\nChromium版MSEdgeをサポートなど","relatedLinks":[]},{"category":"Headline","title":"ECMAScript Archives","url":"https://www.ecma-international.org/archive/ecmascript/","tags":["ECMAScript","spec"],"content":"ECMAScript Archives Page。\n過去のECMAScript仕様に関するTC39MTGのミーティングログのアーカイブやドキュメント。\n1996年から2015年までのアーカイブ","relatedLinks":[]},{"category":"Headline","title":"Blog - Next.js 9.2 | Next.js","url":"https://nextjs.org/blog/next-9-2","tags":["JavaScript","React","library","ReleaseNote"],"content":"Next.js 9.2リリース。\nビルトインでCSSファイルをimportできるように、`.module.css`でCSS Modulesとしてimportできるように。\nCode Splittingに関するwebpackの設定を変更し、chunks作成時の戦略を変更など","relatedLinks":[]},{"category":"Headline","title":"Release 3.0.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v3.0.0","tags":[" node","testing","library","ReleaseNote"],"content":"AVA 3リリース。\n`ava debug`コマンドの追加、`--node-arguments`オプションの追加。\nNode 10未満のサポート終了、Babelが同梱ではなくなり別パッケージとしてインストールする形に変更、ES Modulesのサポートなど","relatedLinks":[]},{"category":"Article","title":"ブラウザで何が起こっているのかを知る Reporting API と ReportingObserver | blog.jxck.io","url":"https://blog.jxck.io/entries/2020-01-18/reporting.html","tags":["CSP","browser","WebPlatformAPI","article"],"content":"ブラウザで起きたエラーレポートなどを送信、監視するReporting APIとReportingObserverについて","relatedLinks":[]},{"category":"Article","title":"Cookie 概説 - 30歳からのプログラミング","url":"https://numb86-tech.hatenablog.com/entry/2020/01/19/004420","tags":["HTTP"," node","security"],"content":"ブラウザとexpressを使ったCookieの設定と属性などのCookieの仕組みについての解説記事。\nExpires、Max-Age、Domain、Path，Secure属性、HttpOnly属性、SameSite属性についての解説","relatedLinks":[]},{"category":"SlideVideo","title":"GoogleCloudPlatform/wombat-dressing-room: proxy designed to reduce the attack surface of npm publish","url":"https://github.com/GoogleCloudPlatform/wombat-dressing-room","tags":["npm","Github","security"],"content":"GitHubリポジトリに紐付いたnpm publishをするための認証トークンを発行するシステム。npm registryに対する2FA Proxy。\nトークンと該当するGitHubのタグがある場合にのみpublishでき、トークンはパッケージごとに異なるため流出しても特定のパッケージのみに影響を抑える目的。","relatedLinks":[{"title":"Wombat Dressing Room, an npm publication proxy on GCP | Google Open Source Blog","url":"https://opensource.googleblog.com/2020/01/wombat-dressing-room-npm-publication_10.html"}]},{"category":"WebsiteDocument","title":"wasm3/wasm3: 🚀 The fastest WebAssembly interpreter","url":"https://github.com/wasm3/wasm3","tags":["WebAssembly"],"content":"WebAssemblyのインタープリター","relatedLinks":[]},{"category":"SoftwareLibrary","title":"logaretm/villus: A tiny and fast GraphQL client for Vue.js","url":"https://github.com/logaretm/villus","tags":["Vue","GraphQL","library"],"content":"Vue.js向けのGraphQLクライアントライブラリ。","relatedLinks":[{"title":"Announcing Villus - A tiny and fast GraphQL Client for Vue.js - Abdelrahman' Blog","url":"https://logaretm.com/blog/2020-01-11-announcing-villus/"}]},{"category":"SoftwareLibrary","title":"gjtorikian/isBinaryFile: Detects if a file is binary in Node.js. Similar to Perl's -B","url":"https://github.com/gjtorikian/isBinaryFile","tags":[" node","library"],"content":"ファイルがバイナリかどうかを判定するNode.jsライブラリ","relatedLinks":[]}]},{"meta":{"title":"2020-01-27のJS: Safari TP 99(Remove Flash)、AVA 3.1.0(TypeScript) playwright(Cross Browser Puppeteer)","author":"azu","layout":"post","date":"2020-01-27T14:40:00.229Z","category":"JSer","tags":["safari","node","puppeteer"],"url":"https://jser.info/2020/01/27/safari-tp-99remove-flashava-3.1.0typescript-playwrightcross-browser-puppeteer/"},"items":[{"category":"Headline","title":"Release 🎉 HTM 3 is here! · developit/htm","url":"https://github.com/developit/htm/releases/tag/3.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"HTM 3リリース。\nStaticなTreeを判別してキャッシュ出来るように、Preact Xに対応、`babel-plugin-htm`に自動importのオプションを追加など","relatedLinks":[]},{"category":"Headline","title":"Node v13.7.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v13.7.0/","tags":[" node","ReleaseNote","sourcemap"],"content":"Node v13.7.0リリース。\n`module`モジュールにSource Mapを扱うAPIを追加、`process`に`uncaughtExceptionMonitor`リスナーの追加など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 99 | WebKit","url":"https://webkit.org/blog/9992/release-notes-for-safari-technology-preview-99/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 99リリース。\nFlashのサポートを削除、CSSの`image-set()`をサポートなど","relatedLinks":[]},{"category":"Headline","title":"ResizeObserver in WebKit | WebKit","url":"https://webkit.org/blog/9997/resizeobserver-in-webkit/","tags":["safari","DOM","WebPlatformAPI"],"content":"Safari Technology Preview 80で実装されたResizeObserverについて。\nResizeObserverによる要素に対するリサイズの監視などの使い方、イベントが発生する流れについての解説、利用例などについて","relatedLinks":[{"title":"Release Notes for Safari Technology Preview 80 | WebKit","url":"https://webkit.org/blog/8825/release-notes-for-safari-technology-preview-80/"}]},{"category":"Headline","title":"Release v4.8.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v4.8.0","tags":["npm","ReleaseNote"],"content":"パッケージ管理ツールのpnpm 4.8.0リリース。\nモジュールのインタラクティブアップデートを行う`pnpm update --interactive`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v1.30.0 · rollup/rollup","url":"https://github.com/rollup/rollup/releases/tag/v1.30.0","tags":["JavaScript","bundler","ReleaseNote"],"content":"Rollup 1.30.0リリース。\ndynamic importsのsplit chunksのロジックの改善。\nCode Splitting時にentry chunksで空importを行う最適化のためをON/OFFできるようにする`hoistTransitiveImports`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release 3.1.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v3.1.0","tags":["JavaScript","TypeScript","testing","ReleaseNote"],"content":"AVA 3.1.0リリース。\n`@ava/typescript`パッケージでTypeScriptサポートなど","relatedLinks":[]},{"category":"Article","title":"Debug z-index stacking content with 3D View in the Microsoft Edge DevTools - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2020/01/23/debug-z-index-3d-view-edge-devtools/","tags":["MSEdge","debug"],"content":"MSEdgeの開発者ツールに、`z-index`のスタックコンテキストをビジュアライズする3D Views機能が実験的に実装された","relatedLinks":[]},{"category":"Article","title":"💡🎁 JavaScript Visualized: Generators and Iterators - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/lydiahallie/javascript-visualized-generators-and-iterators-e36","tags":["JavaScript","article"],"content":"Generators、Iteratorsの動きをコードとコンソールの表示をあわせて見られるようにして解説している記事","relatedLinks":[]},{"category":"Article","title":"Replacing Mocha with Jest","url":"https://akoskm.com/2020/01/22/mocha-jest-react-testing.html","tags":["JavaScript","testing","library","article"],"content":"MochaからJestへのマイグレーション方法について。\nMochaの機能のJestでの代用方法について紹介されている。","relatedLinks":[]},{"category":"Article","title":"Inside node: What happens when we execute a script?","url":"https://blog.s1h.org/inside-node-executing-a-script/","tags":[" node","article"],"content":"Node.jsでスクリプトを実行するまでにどのような処理が行われているのかをコードから見ていく記事。\n`node`のコマンドライン引数の処理、ファイルのロード、`module`でのスクリプトをのコンパイル、libuvを使ったイベントループでのコード実行の流れについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"microsoft/playwright: Node library to automate Chromium, Firefox and WebKit browsers","url":"https://github.com/microsoft/playwright","tags":[" node","JavaScript","browser","Chrome","Firefox","webkit","library","Selenium","webdriver"],"content":"Chromium、WebKit、Firefoxを操作できるNode.jsライブラリ。\nPuppeteerと同じチームが開発していて、クロスブラウザ向けの抽象化されたAPIを提供する目的。\nWebDriverよりも機能的なDriver、分かりやすいAPI、setTimeout-freeな自動化を目的としている","relatedLinks":[]},{"category":"WebsiteDocument","title":"Puppeteer Sandbox | Headless Chrome Playground","url":"https://puppeteersandbox.com/","tags":["JavaScript","browser","Tools"],"content":"ブラウザからPuppeteerを扱うコードを書いて実行結果を取得できるSandboxツール","relatedLinks":[]},{"category":"WebsiteDocument","title":"All questions | TypeOfNaN JavaScript Quizzes","url":"https://quiz.typeofnan.dev/","tags":["JavaScript","webservice"],"content":"JavaScriptに関するクイズサイト。\nJavaScriptについてのクイズとその解説が掲載されている","relatedLinks":[]}]},{"meta":{"title":"2020-02-05のJS: npm unpublish policy、yarn v2(berry) RCリリース","author":"azu","layout":"post","date":"2020-02-05T03:42:06.633Z","category":"JSer","tags":["npm","yarn"],"url":"https://jser.info/2020/02/05/npm-unpublish-policy-yarn-v2berry-rc/"},"items":[{"category":"Headline","title":"Release v2.1.0 · puppeteer/puppeteer","url":"https://github.com/puppeteer/puppeteer/releases/tag/v2.1.0","tags":["JavaScript","Chrome","browser","library","ReleaseNote"],"content":"Puppeteer v2.1.0 リリース。\nChromium 80へアップデート、Firefoxをサポートなど","relatedLinks":[]},{"category":"Headline","title":"New PWABuilder release! - PWABuilder - Medium","url":"https://medium.com/pwabuilder/new-pwabuilder-release-b2932f4722a5","tags":["ProgressiveWebApp","Tools","ReleaseNote"],"content":"PWABuilderのアップデート。\nTrusted Web Activityを使ったAndroid向けのパッケージングに対応、パッケージングするためのガイドの刷新など","relatedLinks":[{"title":"PWABuilder","url":"https://www.pwabuilder.com/"},{"title":"GoogleChromeLabs/llama-pack: Llama Pack 🦙 is a Command Line Interface (CLI) that helps developers to create a Project for an Android application that launches an existing Progressive Web App (PWAs) using a Trusted Web Activity.","url":"https://github.com/GoogleChromeLabs/llama-pack"}]},{"category":"Headline","title":"The npm Blog — Changes to npm Unpublish Policy - January 2020","url":"https://blog.npmjs.org/post/190553543620/changes-to-npm-unpublish-policy-january-2020","tags":["npm","news"],"content":"npmのunpublish policyの変更。\n今まで24時間以内だったらunpublishできたのが、72時間以内ならunpublish出来るように変更された。\nまたダウンロード数が300未満、別の公開モジュールから依存されていない、メンテナが単独の条件を満たす場合もunpublishが可能となった。","relatedLinks":[{"title":"policies/unpublish.md at master · npm/policies","url":"https://github.com/npm/policies/blob/master/unpublish.md"}]},{"category":"Headline","title":"Introducing Yarn 2 ! 🧶🌟 - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/arcanis/introducing-yarn-2-4eh1","tags":["yarn","JavaScript","npm","ReleaseNote"],"content":"Yarn 2について。\nYarn v1はlegacyになり、今後のStableはv2(berry)に切り替わる予定。\nデフォルトでCacheをリポジトリに配置するように変更、CLIの出力の変更、`npx`と同じような`yarn dlx`の追加、`patch:`/`portal:`の対応。\nWorkspaceのコマンド改善、Workspaceの検証をするConstraintsの追加。\nパッケージごとにビルドするかを設定可能に、`yarn run`でOS間のシェルの違いをノーマライズするように、Lockファイルのフォーマット変更、パッケージはRead-Onlyに変更など","relatedLinks":[{"title":"Migration | Yarn - Package Manager","url":"https://next.yarnpkg.com/advanced/migration"},{"title":"Plug'n'Play | Yarn - Package Manager","url":"https://next.yarnpkg.com/features/pnp"},{"title":"Zero-Installs | Yarn - Package Manager","url":"https://next.yarnpkg.com/features/zero-installs"}]},{"category":"Headline","title":"Meteor 1.9 (Node.js 12) and new Roadmaps - Meteor Blog","url":"https://blog.meteor.com/meteor-1-9-node-js-12-and-new-roadmaps-cb993277d444","tags":["JavaScript"," node","ReleaseNote"],"content":"Meteor 1.9リリース。\nNode.js 12をサポート、Galaxy(Metorのホスティング環境)のロードマップについて","relatedLinks":[]},{"category":"Headline","title":"Release Releaaaaaaaaaaaaaaaaaaase · preactjs/preact","url":"https://github.com/preactjs/preact/releases/tag/10.3.0","tags":["React","JavaScript","ReleaseNote"],"content":"Preact 10.3.0リリース\nBuilt-In要素を継承したCustom Elementに対応、バグ修正など","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 81)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2020/01/devtools","tags":["Chrome","debug","article"],"content":"Chrome 81の開発者ツールの変更点について。\nブロックされたCookieに色をつけるように、ネットワークパネルで`Copy as Node.js fetch`の追加、Source Mapのエラーをコンソールに表示など","relatedLinks":[]},{"category":"Article","title":"JavaScript Libraries Are Almost Never Updated Once Installed","url":"https://blog.cloudflare.com/javascript-libraries-are-almost-never-updated/","tags":["JavaScript","library","article"],"content":"CDN経由でサイトに埋め込まれているJavaScriptライブラリは一度インストールされたあとにアップデートされることが殆どないというデータについて","relatedLinks":[]},{"category":"SlideVideo","title":"まもなくやってくる Vue.js 3 - Speaker Deck","url":"https://speakerdeck.com/kazupon/mamonakuyatutekuru-vue-dot-js-3","tags":["Vue","slide"],"content":"Vue.js 3についてのスライド。\nComposition API、ライフサイクルフック、DI(`provide`,`inject`)、ReactライクなPortalとSuspense、CSSの独自擬似クラスの追加。\nまたフィルターの削除、グローバル状態の整理などについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Adapt · React for your infrastructure.","url":"https://adaptjs.org/","tags":["React","Infrastructure","Tools"],"content":"Reactを使ってpulumiなどのようにインフラをコード管理するツール。\nHooks API、コンポーネント、JSXで設定を書ける。\n環境やプロバイダーなどの分離はStyleという形で分離できるようにしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cutenode/mingine: A module to get the minimum usable engine(s)","url":"https://github.com/cutenode/mingine","tags":["npm"," node","Tools","library"],"content":"依存してるnpmパッケージの`engines`フィールドから、`engines`ごとのminimumなバージョンを算出するライブラリ","relatedLinks":[]},{"category":"Book","title":"Manning | Deep Learning with JavaScript","url":"https://www.manning.com/books/deep-learning-with-javascript","tags":["JavaScript","MachineLearning","book"],"content":"TensorFlow.jsを使ったDeep Learningについての書籍","relatedLinks":[]},{"category":"Book","title":"プログラミングTypeScript ―スケールするJavaScriptアプリケーション開発 | Boris Cherny, 今村 謙士, 原 隆文 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4873119049/","tags":["TypeScript","book"],"content":"2020年3月16日発売\nProgramming TypeScriptの翻訳本","relatedLinks":[]}]},{"meta":{"title":"2020-02-12のJS: Electron 8.0.0、Angular 9、`request` module is deprecated","author":"azu","layout":"post","date":"2020-02-12T02:42:09.888Z","category":"JSer","tags":["Electron","Angular","node.js"],"url":"https://jser.info/2020/02/12/electron-8.0.0-angular-9-request-module-is-deprecated/"},"items":[{"category":"Headline","title":"Electron 8.0.0 | Electron Blog","url":"https://www.electronjs.org/blog/electron-8-0","tags":["Electron","ReleaseNote","V8"," node"],"content":"Electron 8.0.0リリース。\nChromium 80、V8 8.0、Node.js 12.13.0へのアップデート。\nChromeビルトインのスペルチェッカーを利用できるように、IPCにV8の Structured Clone Algorithmを利用することでパフォーマンスの改善など。\n`session.preconnect`、`tray.displayBalloon`、`contents.executeJavaScriptInIsolatedWorld`などのAPI追加。\n今回のリリースでElectron 5.xはEOL(End Of Support)となった。","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 3.8 RC | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-8-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.8RCリリース。\nType-Only Imports/Exports、ECMAScript Private Fields、Top-Level awaitのサポート。\nまた`checkJS`におけるJSDocの`@public`、`@private`、`@protected`をサポート、`watchOptions`の追加など","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 80  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2020/02/nic80","tags":["Chrome","ReleaseNote"],"content":"Chrome 80リリース。\nWebWorkerで`type:\"module\"`のサポート、Optional Chainingのサポート。\nまたOrigin TrialとしてContact Picker API、Notification triggers、Web Serialのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 💯 | WebKit","url":"https://webkit.org/blog/10024/release-notes-for-safari-technology-preview-100/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 100リリース。\nWeb Inspector Referenceへのリンクの追加、Web InspectorのCanvas Tab がGraphics Tabにリネームなど","relatedLinks":[{"title":"Web Inspector Reference | WebKit","url":"https://webkit.org/web-inspector/"}]},{"category":"Headline","title":"V8 Runtime Overview  |  Apps Script  |  Google Developers","url":"https://developers.google.com/apps-script/guides/v8-runtime","tags":["GAS","news"],"content":"Google Apps ScriptでV8が利用できるようになった","relatedLinks":[]},{"category":"Headline","title":"Release 3.3.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v3.3.0","tags":["JavaScript"," node","library","testing","ReleaseNote"],"content":"AVA 3.3.0リリース。\nECMAScript Modulesなテストファイルに対応","relatedLinks":[]},{"category":"Headline","title":"Version 9 of Angular Now Available — Project Ivy has arrived!","url":"https://blog.angular.io/version-9-of-angular-now-available-project-ivy-has-arrived-23c97b63cfa3","tags":["Angular","ReleaseNote"],"content":"Angular 9リリース。\nIvyがデフォルトとなりbundleファイルサイズなどの改善、`TestBed`の再実装でのテストパフォーマンスの改善、TypScript 3.7のサポートとテンプレートの型チェックオプションの追加。\nビルドエラーやスタックトレースの改善など","relatedLinks":[{"title":"Angular - Angular Ivy","url":"https://angular.io/guide/ivy"}]},{"category":"Headline","title":"Release v1.0.0 · scala-js/scala-js","url":"https://github.com/scala-js/scala-js/releases/tag/v1.0.0","tags":["scala","JavaScript","ReleaseNote"],"content":"Scala.js 1.0.0リリース","relatedLinks":[]},{"category":"Headline","title":"request - npm","url":"https://www.npmjs.com/package/request","tags":["npm"," node","HTTP","library","news"],"content":"Node.js向けのHTTPクライアントである`request`モジュールがDeprecatedとなった。","relatedLinks":[{"title":"Request’s Past, Present and Future · Issue #3142 · request/request","url":"https://github.com/request/request/issues/3142#issuecomment-584745385"},{"title":"Alternative libraries to request · Issue #3143 · request/request","url":"https://github.com/request/request/issues/3143"}]},{"category":"Headline","title":"Serenity/JS | Serenity/JS","url":"https://serenity-js.org/","tags":["E2E","testing","library","JavaScript"],"content":"Acceptance testingフレームワーク。\nScreenplay PatternでActorを中心にしたテストシナリオを書き、クロスブラウザでの受け入れテストを行う","relatedLinks":[]},{"category":"Article","title":"TensorFlow.js for React Native is here! — The TensorFlow Blog","url":"https://blog.tensorflow.org/2020/02/tensorflowjs-for-react-native-is-here.html","tags":["MachineLearning","React","mobile","article"],"content":"Tensorflow.js for React Nativeが一般公開された","relatedLinks":[]},{"category":"Article","title":"ECMAScript proposal updates @ 2020-02 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2020/02/11/ecmascript-proposal-update.md","tags":["ECMAScript","proposal","article"],"content":"2020年2月のTC39 MTGでのECMAScript Proposalの変更点まとめ","relatedLinks":[]},{"category":"Article","title":"Use Cloudflare JavaScript Workers to Deploy Your Static Generated Site (SSG)","url":"https://levelup.gitconnected.com/use-cloudflare-javascript-workers-to-deploy-you-static-generated-site-ssg-1c518e078646","tags":["webservice","ServiceWorker","article"],"content":"CloudflareのWorkersを使ったSSG(Static SIte Generator)の実装とデプロイについて。\nNext.jsを使った例を紹介している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"single-spa/single-spa: Microfrontends made easy","url":"https://github.com/single-spa/single-spa","tags":["MicroFrontend","library"],"content":"各種フレームワーク向けのアダプターを用意してるMicrofrontendsフレームワーク。\nそれぞれのフレームワークを使ったアプリを同一ページで扱うために必要なライフサイクルを管理するフレームワーク。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Himenon/code-dependency: A work efficiency tool for visualizing code dependencies on a browser.","url":"https://github.com/Himenon/code-dependency","tags":["JavaScript","Tools","server"],"content":"dependency-cruiserを使ったモジュールの依存関係図を生成してブラウザで表示できるツール","relatedLinks":[{"title":"dependency-cruiser","url":"https://qiita.com/himenoglyph/items/f28a9905e3b30e6cb213"}]},{"category":"SoftwareLibrary","title":"myliang/x-spreadsheet: A web-based JavaScript（canvas） spreadsheet","url":"https://github.com/myliang/x-spreadsheet","tags":["JavaScript","library","canvas"],"content":"依存のないSpreadSheetの実装ライブラリ。Canvasを使って描画をしている。","relatedLinks":[]}]},{"meta":{"title":"2020-02-18のJS: Firefox 73、Node.js 12.16.0(13.xからのバックポート)","author":"azu","layout":"post","date":"2020-02-18T01:52:14.927Z","category":"JSer","tags":["Firefox","Node.js"],"url":"https://jser.info/2020/02/18/firefox-73-node.js-12.16.013.x/"},"items":[{"category":"Headline","title":"Node v12.16.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v12.16.0/","tags":[" node","ReleaseNote"],"content":"Node 12.16.0リリース。\n実験的な機能として`assert.match`と`assert.doesNotMatch`の追加。\n`child_process`が`serialization`オプションをサポート、`--trace-exit`、`--trace-uncaught`の追加、`perf_hooks`がStable APIとなるなど。","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 81: Near Field Communications, Augmented Reality, and More","url":"https://blog.chromium.org/2020/02/chrome-81-near-field-communications.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 81 ベータリリース。\nOriginal Trialとしてモバイル向けのWeb NFC、`scheduler.postTask`のサポート、Mixed Contentの自動アップグレード、TLS 1.0と1.1の削除など","relatedLinks":[]},{"category":"Headline","title":"Announcing Ionic 5! | The Ionic Blog","url":"https://ionicframework.com/blog/announcing-ionic-5/","tags":["JavaScript","library","ReleaseNote"],"content":"Ionic 5リリース。\niOS 13に合わせたデザインの更新、Ionic Animationsの追加、Ioniconsの更新、Angular 9のIvyへの対応","relatedLinks":[{"title":"Introducing Ionic Animations | The Ionic Blog","url":"https://blog.ionicframework.com/introducing-ionic-animations/"}]},{"category":"Headline","title":"Release v2.0 · FullHuman/purgecss","url":"https://github.com/FullHuman/purgecss/releases/tag/v2.0.5","tags":["CSS","Tools","ReleaseNote"],"content":"使われてないCSSを削除するPurgeCSS 2.0.0リリース。\n非同期化、CSS Variablesの対応、Node.js 8以下のサポート終了","relatedLinks":[{"title":"PurgeCSS 2.0 - Full Human - Medium","url":"https://medium.com/full-human/purgecss-2-0-c0e812e6c4f6"}]},{"category":"Article","title":"Firefox 73 is upon us - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/02/firefox-73-is-upon-us/","tags":["Firefox","ReleaseNote"],"content":"Firefox 73リリース。\nフラグ付きでHTMLFormElementに`requestSubmit`メソッドの追加、開発者ツールのコンソールのスタイルでbackground imageをサポート、DNS over HTTPSのプロバイダーにNextDNSを追加","relatedLinks":[{"title":"Firefox 73.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/73.0/releasenotes/"},{"title":"Firefox 73 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/docs/Mozilla/Firefox/Releases/73"},{"title":"Firefox 73 Site Compatibility | Firefox Site Compatibility","url":"https://www.fxsitecompat.dev/versions/73/"}]},{"category":"Article","title":"Adding notification permission data to the Chrome User Experience Report","url":"https://developers.google.com/web/updates/2020/02/notification-permission-data-in-crux","tags":["Chrome","article"],"content":"Chrome User Experience Reportに通知許諾ダイアログのデータが追加された","relatedLinks":[]},{"category":"SlideVideo","title":"最新のブラウザで変わるCookieの取り扱いやPrivacyの考え方 - Speaker Deck","url":"https://speakerdeck.com/yosuke_furukawa/zui-xin-falseburauzadebian-warucookiefalsequ-rixi-iyaprivacyfalsekao-efang","tags":["browser","security","privacy","slide"],"content":"ブラウザのサードパーティクッキーやトラッキング防止周りの機能についてのスライド。\nSafariのITP、FIrefoxのETP、SameSite Cookie。\nCNAME CloakingやSafariの提案しているAd click attribution、ChromeのPrivacy Sandboxについてなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"OpenChakra","url":"https://openchakra.app/","tags":["React","GUI","editor"],"content":"Chakra UIを使ったサイトを構築できるビジュアルエディタ。D&Dでコンポーネントを組み立てでき、その結果をCodeSandboxにコードとして出力できる。","relatedLinks":[{"title":"Chakra UI | Design System built with React","url":"https://chakra-ui.com/"}]},{"category":"SoftwareLibrary","title":"Chakra UI | Design System built with React","url":"https://chakra-ui.com/","tags":["React","UI","library","WAI-ARIA"],"content":"Reactを使ったUIコンポーネントライブラリ。\n一貫性のある組み合わせが可能なコンポーネントを作ることを目的としていて、WAI-ARIAの対応、テーマ機能などを持っている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"evanw/esbuild: An extremely fast JavaScript bundler and minifier","url":"https://github.com/evanw/esbuild","tags":["golang","bundler"],"content":"Go言語製のJavaScript Bundler。\nCommonJS/ES Modules、Source Map、Minifier、JSXなどに対応している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"volument/baretest: An extremely fast and simple JavaScript test runner.","url":"https://github.com/volument/baretest","tags":["JavaScript","testing","library"],"content":"自己実行可能なテストフレームワーク。\n`test`関数といくつかのライフサイクルを提供する小さなテストフレームワーク。","relatedLinks":[{"title":"Baretest — An extremely minimalistic alternative to Jest","url":"https://volument.com/baretest"}]},{"category":"SoftwareLibrary","title":"Mirage JS • An API mocking library for frontend developers","url":"https://miragejs.com/","tags":["JavaScript","HTTP","testing","library"],"content":"APIモッキングライブラリ。\nブラウザで動くサーバを実装し、リクエストに対するレスポンスを定義できる。\n`fetch`や`XMLHttpRequest`をインターセプトすることで実装している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"FullCalendar - JavaScript Event Calendar","url":"https://fullcalendar.io/","tags":["JavaScript","library","UI"],"content":"カレンダーUIライブラリ。","relatedLinks":[]}]},{"meta":{"title":"2020-02-25のJS: TypeScript 3.8 正式リリース、ESLint 7.0.0の変更予定","author":"azu","layout":"post","date":"2020-02-25T02:30:48.221Z","category":"JSer","tags":["TypeScript","ESLint"],"url":"https://jser.info/2020/02/25/typescript-3.8-eslint-7.0.0/"},"items":[{"category":"Headline","title":"Announcing TypeScript 3.8 | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-8/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.8リリース。\n`import type`/`export type`の追加、Stage 3のES Private Fields、Top-Level `await`のサポート。\n`target`と`module`オプションに`es2020`を追加、`watchOptions`で`--watch`時の挙動を設定できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Node v13.9.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v13.9.0/","tags":[" node","ReleaseNote"],"content":"Node v13.9.0リリース。\n`async_hooks`モジュールに`executionAsyncResource`を追加、`crypto`モジュールに`diffieHellman`を追加。\nDiagnostic Reportがworker_thredsをサポート","relatedLinks":[{"title":"Diagnostic Report | Node.js v13.9.0 Documentation","url":"https://nodejs.org/api/report.html"}]},{"category":"Headline","title":"Release Initial Release: 1.0.0 · reduxjs/cra-template-redux","url":"https://github.com/reduxjs/cra-template-redux/releases/tag/v1.0.0","tags":["React","redux","Tools"],"content":"create-react-app向けのReduxテンプレート。\n`npx create-react-app my-app --template redux` でセットアップできる。\nRedux Toolkitを利用している","relatedLinks":[{"title":"Redux Toolkit | Redux Toolkit","url":"https://redux-toolkit.js.org/"}]},{"category":"Headline","title":"Release 3.4.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v3.4.0","tags":["JavaScript","testing","ReleaseNote"],"content":"AVA 3.4.0リリース。\nテストを失敗させずにAssertionを試せる`t.try()`のサポートなど","relatedLinks":[]},{"category":"Article","title":"Understanding the “Initial”, “Inherit” and “Unset” CSS Keywords","url":"https://medium.com/@elad/understanding-the-initial-inherit-and-unset-css-keywords-2d70b7121695","tags":["CSS","article"],"content":"CSSの`initial`、`inherit`、`unset`、`revert`について。\nCSS プロパティの初期値の違いやそれぞれの意味について","relatedLinks":[]},{"category":"Article","title":"The Circuit Breaker Pattern","url":"https://blog.bearer.sh/circuit-breaker-design-pattern/","tags":[" node","article"],"content":"Node.jsでCircuit Breakerパターンをしながら学んでいくチュートリアル","relatedLinks":[{"title":"Building a Circuit Breaker in Node.js (Part 1)","url":"https://blog.bearer.sh/build-a-circuit-breaker-in-node-js/"}]},{"category":"Article","title":"仮想DOMは本当に“速い”のか？ DOM操作の新しい考え方を、フレームワークを実装して理解しよう - エンジニアHub｜若手Webエンジニアのキャリアを考える！","url":"https://employment.en-japan.com/engineerhub/entry/2020/02/18/103000","tags":["VirtualDOM","article"],"content":"Virtual DOMとは何かやどのように実装されているかについて。\nなぜVirtual DOMではレンダリングが遅くなりにくいかについて","relatedLinks":[]},{"category":"Article","title":"Aborting a fetch request","url":"https://meetguns.com/blog/aborting-a-fetch-request/","tags":["JavaScript","Fetch","article"],"content":"`AbortController`を使ってFetchのキャンセルを行う方法について","relatedLinks":[]},{"category":"Article","title":"Angular 9: What’s New?","url":"https://auth0.com/blog/angular-9-whats-new/","tags":["Angular","article"],"content":"Angular 9の変更点についての解説","relatedLinks":[]},{"category":"Article","title":"What's coming in ESLint v7.0.0 - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2020/02/whats-coming-in-eslint-7.0.0","tags":["ESLint","article"],"content":"ESLint 7.0.0での変更予定について。\n`CLIEngine`クラスは非推奨となり新しく`ESLint`クラスが導入される、Node.jsやCommonJS関係のルールは`eslint-plugin-node`に移行される。\ndirective commentsにコメントを書けるように、`~/.eslintrc`の利用に警告がでるように、デフォルトのignore patternsの更新など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"benawad/destiny: Prettier for File Structures","url":"https://github.com/benawad/destiny","tags":["JavaScript","Tools","React"],"content":"プロジェクトのファイル構造をコンポーネントごとに分けるように編集するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"suchipi/hex-engine: A modern 2D game engine for the browser.","url":"https://github.com/suchipi/hex-engine","tags":["canvas","game","library","JavaScript"],"content":"Canvasを使った2Dゲームエンジンライブラリ。ReactインスパイアなAPIを持つ。\n音声同期、スプライトシートやアニメーション、物理エンジンなどのサポート。\nまたAseprite、Tiled、BMFontなどのオーサリングツールもサポートしている。","relatedLinks":[{"title":"Aseprite - Animated sprite editor & pixel art tool","url":"https://www.aseprite.org/"},{"title":"Tiled Map Editor | A flexible level editor","url":"https://www.mapeditor.org/"},{"title":"BMFont - AngelCode.com","url":"https://www.angelcode.com/products/bmfont/"}]}]},{"meta":{"title":"2020-03-02のJS: React v16.13.0、Rome(JavaScript Tool Chain)、Ember Octane","author":"azu","layout":"post","date":"2020-03-02T23:45:32.560Z","category":"JSer","tags":["React","JavaScript","Ember"],"url":"https://jser.info/2020/03/03/react-v16.13.0-romejavascript-tool-chain-ember-octane/"},"items":[{"category":"Headline","title":"React v16.13.0 – React Blog","url":"https://reactjs.org/blog/2020/02/26/react-v16.13.0.html","tags":["React","ReleaseNote"],"content":"React 16.13.0リリース。\n不適切な使い方に対する警告の追加、`React.createFactory`と`ReactDOM.unstable_createPortal`を非推奨化。\nhydrationに関する警告にコンポーネントスタックを表示するようになるなど","relatedLinks":[]},{"category":"Headline","title":"Announcing Scala.js 1.0.0 - Scala.js","url":"https://www.scala-js.org/news/2020/02/25/announcing-scalajs-1.0.0/","tags":["scala","JavaScript","ReleaseNote"],"content":"Scala.js 1.0.0リリース。\n0.6.xから変更点やマイグレーション方法について","relatedLinks":[]},{"category":"Article","title":"Understanding the ECMAScript spec, part 1 · V8","url":"https://v8.dev/blog/understanding-ecmascript-part-1","tags":["ECMAScript","spec","article"],"content":"ECMAScript仕様で使われる構文などの読み方について。\n`[[Expression]]`のInternal Slot、Internal Method、Completion records、`?` 構文について","relatedLinks":[]},{"category":"Article","title":"Getting Started with Ember Octane: Building a Blog - Ember Igniter","url":"https://emberigniter.com/getting-started-ember-octane-tutorial/","tags":["JavaScript","article","tutorial"],"content":"Ember Octaneを使ってブログを作るチュートリアル。\nEmber 3.15で導入されたEmber Octaneを使ってEmberがどのように動いているかを学びながらブログを作るチュートリアル記事","relatedLinks":[{"title":"Marak/faker.js: generate massive amounts of realistic fake data in Node.js and the browser","url":"https://github.com/marak/Faker.js/"}]},{"category":"Article","title":"How Autotracking Works","url":"https://www.pzuraq.com/how-autotracking-works/","tags":["Ember","JavaScript","article"],"content":"Ember OctaneのAutotrackingがどのように動いているかの解説記事。","relatedLinks":[]},{"category":"Article","title":"swyx Writing | Metrics, Logs, and Traces in JavaScript Tools","url":"https://www.swyx.io/writing/js-tools-metrics-logs-traces/","tags":["JavaScript","performance","article"],"content":"JavaScript/Node.jsでのビルドやパッケージなどのメトリクス、ログ、スタックトレースなどのデータのとり方やライブラリなどについての紹介記事","relatedLinks":[]},{"category":"Article","title":"Rome, a new JavaScript Toolchain","url":"https://jasonformat.com/rome-javascript-toolchain/","tags":["JavaScript","article","bundler"],"content":"Romeのアーキテクチャについて。\nRome自体がmonorepoでcompilerからbundlerまで含むため、重たいASTの処理のコストを軽減できる。\nまたコンパイルもモジュールごとにWorkerで実行していて、bundlerは単一スコープが問題となるが、コンパイル結果にファイル名を入れることで回避している仕組みについてなど","relatedLinks":[]},{"category":"Article","title":"Source maps in Node.js - Node.js - Medium","url":"https://medium.com/@nodejs/source-maps-in-node-js-482872b56116","tags":["node.js","sourcemap","article"],"content":"Node.js 12.12.0からフラグ付きで実装されたSource Map対応について。","relatedLinks":[]},{"category":"Article","title":"ブラウザとnode.jsに両対応したライブラリを作りたいときのWebpackレシピ集 - Qiita","url":"https://qiita.com/riversun/items/1da0c0668d0dccdc0460","tags":["JavaScript","webpack","article"],"content":"ライブラリをwebpackでbundleしてscriptタグで読み込める形式にして配布する際の`output`設定のパターンについて。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Cookie Status :: Current Status Of Browser Tracking Prevention | cookiestatus.com","url":"https://www.cookiestatus.com/","tags":["browser","privacy"],"content":"ブラウザごとのトラッキング対策、Cookieの1st party/3rd partyに対する取り組みなどをまとめているサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Cliqz - Secure browser with built-in quick search","url":"https://cliqz.com/","tags":["browser","privacy","Firefox"],"content":"Privacyを重視したウェブブラウザ/検索エンジン。\nFirefoxの拡張から始まったブラウザでFirefoxをForkしたものを使っている\nhttps://0x65.dev/blog/2019-12-17/why-we-forked-firefox-and-not-chromium.html","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Akryum/guijs: 🐣️ The app that makes your #devlife easier.","url":"https://github.com/Akryum/guijs","tags":[" node","GUI"],"content":"JavaScriptプロジェクト向けのGUIアプリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"edtr-io/edtr-io: Edtr.io is an open source WYSIWYG in-line web editor written in React. Its plugin architecture makes Edtr.io lean and extensive at the same time.","url":"https://github.com/edtr-io/edtr-io","tags":["JavaScript","library","React"],"content":"ReactベースのWYSIWYGエディタ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jaredpalmer/tsdx: Zero-config CLI for TypeScript package development","url":"https://github.com/jaredpalmer/tsdx","tags":["TypeScript","JavaScript","npm","Tools"],"content":"TypeScriptでnpmパッケージを開発する向けのツールキット。\nBuild、Test、Lintや最適化周りの設定などがビルトインされている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"facebookexperimental/rome: An experimental JavaScript toolchain","url":"https://github.com/facebookexperimental/rome","tags":["JavaScript","Tools"],"content":"外部依存のないJavaScript compiler、bundler、Linter、Formatter、開発サーバなどを含むツールキット。\nBabelとYarnを作ったsebmck製。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"petersalomonsen/wasm-git: GIT for nodejs and the browser using https://libgit2.org compiled to WebAssembly with https://emscripten.org","url":"https://github.com/petersalomonsen/wasm-git","tags":["git","WebAssembly","library"],"content":"libgitをEmscriptenでWebAssemblyにコンパイルしたライブラリ。\nブラウザとNode.jsで動作する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"TomPrograms/stormdb: 🌩️ StormDB is a tiny, lightweight, 0 dependency, easy-to-use JSON-based database for NodeJS, the browser or Electron.","url":"https://github.com/tomprograms/stormdb","tags":["JavaScript"," node","library","CoreData","JSON"],"content":"ブラウザ、Node.jsで動作するJSONデータベースライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"JasonEtco/actions-toolkit: 🛠 A toolkit for building GitHub Actions in Node.js","url":"https://github.com/JasonEtco/actions-toolkit","tags":["JavaScript","library","Github","Actions"],"content":"GitHub Actionsを書くための処理を集めたJavaScriptライブラリ、ツールキット。","relatedLinks":[]}]},{"meta":{"title":"2020-03-11のJS: Node.js 13.10.0、Rollup 2.0.0、Node.jsパフォーマンスチューニング","author":"azu","layout":"post","date":"2020-03-11T02:57:46.199Z","category":"JSer","tags":["Node.js","Roolup","Peformance"],"url":"https://jser.info/2020/03/11/node.js-13.10.0rollup-2.0.0node.js/"},"items":[{"category":"Headline","title":"Node v13.10.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v13.10.0/","tags":[" node","ReleaseNote"],"content":"Node.js 13.10.0リリース。\n`async_hooks`モジュールに非同期コンテキストにおけるストレージ機能を提供する`AsyncLocalStorage`の追加。\nStream#pipelineがGenerator functionをサポート、`vm.measureMemory`メソッドの実装など","relatedLinks":[{"title":"AsyncLocalStorage","url":"https://nodejs.org/api/async_hooks.html#async_hooks_class_asynclocalstorage"}]},{"category":"Headline","title":"Release v2.0.0 · rollup/rollup","url":"https://github.com/rollup/rollup/releases/tag/v2.0.0","tags":["JavaScript","bundler","ReleaseNote"],"content":"Rollup 2.0.0リリース。\nNode 10未満のサポート終了、APIのリネームや同梱されるASTの型定義の変更など。\nまたNode.js 13のconditional exportsに試験的に対応など","relatedLinks":[]},{"category":"Headline","title":"What is New in Version 1.0 · isomorphic-git","url":"https://isomorphic-git.org/blog/2020/02/25/version-1-0-0","tags":["git","JavaScript","library","ReleaseNote"],"content":"isomorphic-git 1.0リリース。\nTypeScriptの型改善、`init`や`checkout`、`commit`などのデフォルトの動作の変更、非推奨だったAPIの削除など。","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0 · immerjs/immer","url":"https://github.com/immerjs/immer/releases/tag/v6.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"immer.js 6.0.0リリース。\nES5やMapのサポートなどを明示的なメソッドを呼び出しするように変更など","relatedLinks":[]},{"category":"Headline","title":"p5.js 1.0 is Here! - Processing Foundation - Medium","url":"https://medium.com/processing-foundation/p5-js-1-0-is-here-b7267140753a","tags":["JavaScript","library","ReleaseNote"],"content":"ビジュアルコーディングライブラリのp5.js 1.0リリース。\n全体的にライブラリを書き直し。`image()`関数のGIFアニメーションサポート、`circle()`や`square()`関数なの追加、エラーメッセージの国際化など","relatedLinks":[{"title":"Release 1.0.0 · processing/p5.js","url":"https://github.com/processing/p5.js/releases/tag/1.0.0"}]},{"category":"Headline","title":"Introducing AdonisJS (v5 Preview)","url":"https://blog.adonisjs.com/introducing-adonisjs-v5/","tags":[" node","library","ReleaseNote","TypeScript"],"content":"Node.jsアプリフレームワークであるAdonisJS v5プレビューリリース。\nTypeScriptベースに書き直し、パフォーマンス改善。\nSigned Routesの対応、Health Checksモジュールの追加、ORMであるLucidの改善など","relatedLinks":[{"title":"adonisjs/core: 🚀 The Node.js Framework highly focused on developer ergonomics, stability and confidence","url":"https://github.com/adonisjs/core"}]},{"category":"Headline","title":"Firefox 74.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/74.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 74.0リリース。\nOptional chaining operatorのサポート、Feature PolicyとCross-Origin-Resource-Policyの有効化、TLS 1.0と1.1の削除など。\nクロスオリジンのiframeではデフォルトでFullscreenやカメラなどが無効となる変更など","relatedLinks":[{"title":"Firefox 74 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/docs/Mozilla/Firefox/Releases/74"},{"title":"Firefox 74 Site Compatibility | Firefox Site Compatibility","url":"https://www.fxsitecompat.dev/versions/74/"},{"title":"Geolocation, fullscreen, camera, mic, screen capture requests from cross-origin ","url":"https://www.fxsitecompat.dev/en-CA/docs/2020/geolocation-fullscreen-camera-mic-screen-capture-requests-from-cross-origin-iframe-are-now-disabled-by-default/"}]},{"category":"Article","title":"0から始めるNode.jsパフォーマンスチューニング | kohsweblog","url":"https://blog.koh.dev/2020-03-04-nodejs-performance/","tags":[" node","performance","article"],"content":"Node.jsアプリのパフォーマンス計測、改善についての記事。\nヒープやulimitの設定、cluster対応、プロファイリングの手法、よくある問題についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"Clinic.js - An Open Source Node.js performance profiling suite by NearForm","url":"https://clinicjs.org/","tags":[" node","performance"],"content":"NearFormのNode.jsパフォーマンスモニタリングツールセット","relatedLinks":[]},{"category":"SoftwareLibrary","title":"klaussinani/qoa: Minimal interactive command-line prompts","url":"https://github.com/klaussinani/qoa","tags":[" node","library","console"],"content":"インタラクティブなCUIを提供するためのNode.jsライブラリ。\nテキスト入力や選択肢などのインタラクティブなプロンプトを提供する","relatedLinks":[]}]},{"meta":{"title":"2020-03-17のJS: Next.js 9.3 、GitHubがnpm inc.を買収、JavaScriptの歴史","author":"azu","layout":"post","date":"2020-03-17T03:10:39.313Z","category":"JSer","tags":["Next.js","npm","GitHub","JavaScript"],"url":"https://jser.info/2020/03/17/next.js-9.3-githubnpm-inc.javascript/"},"items":[{"category":"Headline","title":"Release Worker Plugin 4.0 · GoogleChromeLabs/worker-plugin","url":"https://github.com/GoogleChromeLabs/worker-plugin/releases/tag/4.0.2","tags":["webpack","webworker","plugin","ReleaseNote"],"content":"webpack向けのWorker Plugin 4.0リリース。\nES Modulesのサポート、`worker-plugin/loader!<path>`のサポート、`SharedWorker`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node v13.11.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v13.11.0/","tags":[" node","ReleaseNote"],"content":"Node.js 13.11.0リリース。\n`AsyncLocalStorage#enterWith`の追加、`--jitless`オプションを`NODE_OPTIONS`に指定できるように、`wasi`モジュールに`returnOnExit`オプションを追加など","relatedLinks":[]},{"category":"Headline","title":"Blog - Next.js 9.3 | Next.js","url":"https://nextjs.org/blog/next-9-3","tags":["React","library","ReleaseNote"],"content":"Next.js 9.3リリース。\nビルド時にデータを取得する`getStaticProps`、ビルド時にDynamic Routingとデータを元にページを生成する`getStaticPaths`の追加。\nサーバサイドでリクエストごとに呼び出される`getServerSideProps`の追加。\nSassをビルトインサポート、`pages/404.js`で静的な404ページのカスタマイズができるようになるなど","relatedLinks":[{"title":"Next.js 9.3: 新世代の静的サイト生成、Built-in Sassのサポート - Qiita","url":"https://qiita.com/mottox2/items/5f01015e74c55c4df1be"}]},{"category":"Headline","title":"npm is joining GitHub - The GitHub Blog","url":"https://github.blog/2020-03-16-npm-is-joining-github/","tags":["npm","Github","news"],"content":"npm incがGitHubに買収された。\nnpm private registryはGitHub Package Registryに移行していく方針で、npmはpublic registryとCLIに注力していく方針","relatedLinks":[{"title":"The npm Blog — Next Phase Montage","url":"https://blog.npmjs.org/post/612764866888007680/next-phase-montage"}]},{"category":"Headline","title":"Release 6.0.0-beta.0 (2020-03-11) · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v6.0.0-beta.0","tags":["Chrome","performance","Tools","ReleaseNote"],"content":"Lighthouse 6.0.0βリリース。\nMetricsの更新、performanceスコア計算方法の変更。\nまた、Cumulative Layout Shift (CLS)、文字コード、アクセシビリティに関するAuditの追加など","relatedLinks":[{"title":"Cumulative Layout Shift (CLS)","url":"https://web.dev/cls/"}]},{"category":"Article","title":"Observable","url":"https://observablehq.com/@mitvis/introduction-to-d3","tags":["JavaScript","library","graphic","article"],"content":"インタラクティブなD3.js入門記事","relatedLinks":[]},{"category":"Article","title":"Alternatives to enums in TypeScript","url":"https://2ality.com/2020/02/enum-alternatives-typescript.html","tags":["JavaScript","TypeScript","article"],"content":"TypeScriptでのenumとunion typesについて","relatedLinks":[{"title":"さようなら、TypeScript enum | Kabuku Developers Blog","url":"https://www.kabuku.co.jp/developers/good-bye-typescript-enum"}]},{"category":"Article","title":"Slow Code HATES him! Optimising a web app from 1 to 60fps","url":"https://blog.scottlogic.com/2020/02/17/minesweeper-optimisation.html","tags":["JavaScript","canvas","performance","article"],"content":"マインスイーパ的な100x100のセルを更新するゲームのパフォーマンス最適化について。\nステートと更新する領域の最適化、DOMレイアウトのトリガーとなるCSSの削除、透明テキストの削除、レイヤーの分割、Canvasを使ったレンダリングなどについて","relatedLinks":[]},{"category":"Article","title":"The History of the URL","url":"https://blog.cloudflare.com/the-history-of-the-url/","tags":["URL","history","article"],"content":"URLの歴史についての記事。\nURLがどのようにできたのかの経緯、フラグメント、Basic認証などについて","relatedLinks":[]},{"category":"Article","title":"Bootstrap 5 release date and what's new about it - Themesberg","url":"https://themesberg.com/blog/design/bootstrap-5-release-date-and-whats-new","tags":["CSS","JavaScript","article"],"content":"Bootstrap 5の変更予定についての紹介記事。\njQueryの削除、IE 10のサポート終了、SVGアイコンなど","relatedLinks":[{"title":"twbs/icons: Official open source SVG icon library for Bootstrap.","url":"https://github.com/twbs/icons"}]},{"category":"Article","title":"‘CSS X’ | W3C Blog","url":"https://www.w3.org/blog/2020/03/css-x/","tags":["CSS","history","article"],"content":"CSS 4はなぜないのかについての解説記事。CSSの仕様開発の歴史、現在のCSS仕様に全体としてのLevelがない理由についてなど","relatedLinks":[]},{"category":"Article","title":"type-only imports — A new TypeScript feature that benefits Babel users","url":"https://levelup.gitconnected.com/improving-babel-support-for-typescript-with-type-only-imports-28cb209d9460","tags":["TypeScript","babel","article"],"content":"TypeScriptの`isolatedModules`とBabelのTypeScriptサポートの挙動について。\n曖昧なre-exportの問題とTypeScript 3.8で導入された`import type`/`export type`での解決について。","relatedLinks":[]},{"category":"SlideVideo","title":"JavaScript: The First 20 Years","url":"http://www.wirfs-brock.com/allen/posts/866","tags":["JavaScript","ECMAScript","history","paper "],"content":"ECMAScript 2015のEditorであるAllen Wirfs-BrockによるJavaScriptの歴史についての論文。","relatedLinks":[]},{"category":"WebsiteDocument","title":"RedwoodJS - Bringing Full-stack to the JAMstack","url":"https://redwoodjs.com/","tags":["JavaScript","GraphQL","React","library"],"content":"JAMstackフレームワーク。\nReact、GraphQL、Prismaを使ったフレームワーク","relatedLinks":[{"title":"Prisma - Database tools for modern application development","url":"https://www.prisma.io/"}]},{"category":"SoftwareLibrary","title":"vriad/zod: Typescript-first schema validation with static type inference","url":"https://github.com/vriad/zod","tags":["TypeScript","library"],"content":"TypeScriptの型チェックとRuntimeでの型チェックを行うスキーマライブラリ。\nライブラリが提供するAPIを使ってスキーマを定義する","relatedLinks":[{"title":"Designing the perfect Typescript schema validation library","url":"https://vriad.com/blog/zod/"}]},{"category":"SoftwareLibrary","title":"lukeed/uid: A tiny (134B) and fast utility to generate random IDs of fixed length","url":"https://github.com/lukeed/uid","tags":["JavaScript","library"],"content":"指定文字数のランダムな英数文字列を生成するライブラリ","relatedLinks":[]},{"category":"Book","title":"Build a Native Desktop GIF Searcher App Using NodeGui — SitePoint","url":"https://www.sitepoint.com/build-native-desktop-gif-searcher-app-using-nodegui/","tags":["JavaScript"," node","GUI","tutorial","AR"],"content":"QtベースのNode.js向けのGUIフレームワークであるNodeGuiを使ってアプリを作るチュートリアル記事。\nGIPHY APIを使ってGIFファイル表示するアプリの開発をしながら、NodeGuiについて見ていく記事","relatedLinks":[]}]},{"meta":{"title":"2020-03-24のJS: Chrome 81のリリース延期、Babel 7.9.0、Prettier 2.0","author":"azu","layout":"post","date":"2020-03-24T00:35:22.337Z","category":"JSer","tags":["Chrome","Babel","Prettier"],"url":"https://jser.info/2020/03/24/chrome-81babel-7.9.0prettier-2.0/"},"items":[{"category":"Headline","title":"Chrome Releases: Upcoming Chrome and Chrome OS releases","url":"https://chromereleases.googleblog.com/2020/03/upcoming-chrome-and-chrome-os-releases.html","tags":["Chrome","news"],"content":"2020年3月17日に予定していたChrome 81のリリースは延期。\n今のところスケジュールは未定とのこと。","relatedLinks":[]},{"category":"Headline","title":"Release v7.0.0 · nestjs/nest","url":"https://github.com/nestjs/nest/releases/tag/v7.0.0","tags":["JavaScript","node.js","library","ReleaseNote"],"content":"NestJS 7リリース。\n`type-graphql`パッケージから`@nestjs/graphql`パッケージに移行、\n`ParseArrayPipe`と`ParseBoolPipe`のtransformer pipeを追加など","relatedLinks":[{"title":"Announcing NestJS 7: What’s New - Trilon Consulting","url":"https://trilon.io/blog/announcing-nestjs-7-whats-new"}]},{"category":"Headline","title":"7.9.0 Released: Smaller preset-env output, Typescript 3.8 support and a new JSX transform · Babel","url":"https://babeljs.io/blog/2020/03/16/7.9.0","tags":["babel","ReleaseNote"],"content":"Babel 7.9.0リリース。\npreset-envにmodule/npnmoduleパターンをサポートするオプションの追加。Babel 8.0でデフォルト化する予定。\nTypeScript 3.8とFlow 0.120のサポート。ReactのRFCがでている新しいJSXの変換に対応など","relatedLinks":[]},{"category":"Headline","title":"Prettier 2.0 “2020” · Prettier","url":"https://prettier.io/blog/2020/03/21/2.0.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 2.0リリース。\nTypeScript 3.8をサポート、CLIでファイル名に`*`が含まれている場合をサポート。\nNode.js 10未満のサポート終了、デフォルト設定の一部変更など。\n\n- `trailingComma`:`es5`\n- `arrowParens`: `always`\n- `endOfLine`: `lf`","relatedLinks":[]},{"category":"Article","title":"npmのprivate registryからGitHub Packages Registryに移行する","url":"https://tech.plaid.co.jp/npm-private-registry-to-github-packages-registry/","tags":["node.js","npm","Github","Actions","article","JavaScript"],"content":"GitHub Packages Registryへの移行記事。\nnpmとGitHubの同名スコープの衝突問題。GitHub ActionsでのGitHub Packages Registryへのpublishフロー、Registry変更時のパッケージの静的、動的なチェックについてなど","relatedLinks":[]},{"category":"Article","title":"Implementing single-file Web Components","url":"https://ckeditor.com/blog/implementing-single-file-web-components/","tags":["JavaScript","WebComponents","article"],"content":"Web ComponentsでVueのようなSingle file componentを実装する記事。\nコンポーネントをFetchし、ファイル内をパースしてTemplate、CSS、JavaScriptを取りだす。\nScriptを`import`するために、データURLからBlobを作成しModuleとして読み込むハックについてなど","relatedLinks":[]},{"category":"Article","title":"luruke/browser-2020: Things you can do with a browser in 2020 ☕️","url":"https://github.com/luruke/browser-2020","tags":["browser","WebPlatformAPI","article","Chrome"],"content":"ブラウザ/Chromeに実装されている新しいAPIについての概要をまとめたもの。","relatedLinks":[]},{"category":"Article","title":"Node.jsでUnhandled RejectionsのときにExit Statusが0となる問題を回避する方法 | Web Scratch","url":"https://efcl.info/2020/03/20/node-unhandled-rejections-exit-status/","tags":["node.js","JavaScript","article"],"content":"Node.jsでのUnhandled Rejectionsの問題について。\n意図しない正常終了を避ける方法としてのエラーハンドリング、`unhandledRejection`イベント、`--unhandled-rejections`オプションについて","relatedLinks":[]},{"category":"Article","title":"Introduction to AntV / Jiazhe Wang / Observable","url":"https://observablehq.com/@jiazhewang/introduction-to-antv","tags":["JavaScript","graphic","library","article"],"content":"データビジュアライズライブラリのAntVについての紹介記事。","relatedLinks":[{"title":"AntV team","url":"https://github.com/antvis"}]},{"category":"SlideVideo","title":"TSerの遊び場：TS playground plugin","url":"https://talks.leko.jp/our-toys-your-sandbox/#0","tags":["TypeScript","slide","plugin"],"content":"TypeScript PlaygroundのPluginについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ryanelian/ts-polyfill: Runtime polyfills for TypeScript libs, powered by core-js!","url":"https://github.com/ryanelian/ts-polyfill","tags":["TypeScript","library"],"content":"tsconfig.jsonの`lib`に合わせたpolyfillを提供するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"elninotech/uppload: 📁 Uppload is a better JavaScript image uploader with 30+ plugins","url":"https://github.com/elninotech/uppload","tags":["JavaScript","library"],"content":"プラグインで様々なサービスに対応している画像アップロードライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"luciopaiva/heapify: The fastest JavaScript priority queue out there. Zero dependencies.","url":"https://github.com/luciopaiva/heapify","tags":["JavaScript","library"],"content":"優先度付きキューの実装ライブラリ","relatedLinks":[]},{"category":"Book","title":"The 2019 Web Almanac","url":"https://almanac.httparchive.org/ja/2019/","tags":["browser","performance","web ","HTTP","book"],"content":"HTTP Archiveのデータ元にしたレポートであるWeb Almanacの日本語訳。","relatedLinks":[]}]},{"meta":{"title":"2020-03-31のJS: TypeScript 3.9 Beta、Safari 13.1、CS Web Securityコース","author":"azu","layout":"post","date":"2020-03-30T14:02:02.940Z","category":"JSer","tags":["TypeScript","Safari","ITP","Security"],"url":"https://jser.info/2020/03/30/typescript-3.9-beta-safari-13.1-cs-web-security/"},"items":[{"category":"Headline","title":"Release v1.3.0 · reduxjs/redux-toolkit","url":"https://github.com/reduxjs/redux-toolkit/releases/tag/v1.3.0","tags":["redux","JavaScript","library","ReleaseNote"],"content":"Redux Toolkit 1.3.0リリース。\nステートの正規化を管理を手助けする`createEntityAdapter`、非同期処理のパターンを提供する`createAsyncThunk`の追加。\nStoreのmutationを検知してエラー通知する仕組みの追加など","relatedLinks":[]},{"category":"Headline","title":"Chrome Releases: Chrome and Chrome OS release updates","url":"https://chromereleases.googleblog.com/2020/03/chrome-and-chrome-os-release-updates.html","tags":["Chrome","news"],"content":"延期していたChromeのリリーススケジュールについて。Chrome 82はキャンセルされ83に統合される予定。\n\n- Chrome 81: 2020-04-07\n- Chrome 82: キャンセル\n- Chrome 83: 2020-05-19","relatedLinks":[]},{"category":"Headline","title":"Node v13.12.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v13.12.0/","tags":["node.js","rlee"],"content":"Node.js 13.12.0リリース。\nnpm 6.14.4へのアップデート、`Object.prototype.__proto__`の書き込みを無効化する`--disable-proto`オプションの追加など","relatedLinks":[{"title":"Disable ","url":"https://github.com/nodejs/node/issues/31951"}]},{"category":"Headline","title":"Announcing TypeScript 3.9 Beta | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-9-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScritp 3.9βリリース。\n`Promise.all`の型改善、`awaited` typeの追加、ビルドパフォーマンスの改善、Type Errorとなることを期待する`// @ts-expect-error`コメントの追加など。\nまた、ECMAScript仕様にあわせてGetter/Setterをトランスパイルするとenumerableだったのをnon-enumerableに変更するなど","relatedLinks":[]},{"category":"Headline","title":"Version 9.1 of Angular Now Available — TypeScript 3.8, faster builds, and more","url":"https://blog.angular.io/version-9-1-of-angular-now-available-typescript-3-8-faster-builds-and-more-eb292f989428","tags":["Angular","ReleaseNote"],"content":"Angular 9.1リリース。\nTypeScript 3.8サポート、ビルドパフォーマンスの改善、`ng e2e`が`grep`オプションをサポート、rtlのサポートなど","relatedLinks":[]},{"category":"Article","title":"SecretlintでAPIトークンや秘密鍵などのコミットを防止する | Web Scratch","url":"https://efcl.info/2020/03/24/secretlint/","tags":["security","node.js","Tools","Docker","article"],"content":"ファイル内にAWSやGCPなどのCredentialsを含んでいないかチェックできるLintツール。\nDockerやNode.jsから利用できる。プロジェクトや個人環境にpre-commit hookで組み込んだり、CIでうっかり秘匿情報が入ってないかをチェックできる。\nルールはNode.jsで自作して追加できる。","relatedLinks":[{"title":"secretlint/secretlint: Pluggable linting tool to prevent committing credential.","url":"https://github.com/secretlint/secretlint"}]},{"category":"Article","title":"Full Third-Party Cookie Blocking and More | WebKit","url":"https://webkit.org/blog/10218/full-third-party-cookie-blocking-and-more/","tags":["safari","security","privacy","article"],"content":"iOS 13.4、Safari 13.1のITPについて。\n3rd-party cookieは基本的にブロック、LocalStorageを含むストレージは最後のインタラクションから7日後に削除され、`document.referrer`はoriginのみとなった。\nストレージ削除のカウントのルールについてはホームに追加したアプリやSafariを起動していない日はカウントしないなどの例外がある","relatedLinks":[]},{"category":"Article","title":"🐛よくハマったFlexboxのバグまとめ｜たかもそ｜note","url":"https://note.com/takamoso/n/n32c4e6904cf7","tags":["CSS","article"],"content":"CSS Flexboxのブラウザの挙動の違いや仕様についてなど","relatedLinks":[]},{"category":"Article","title":"What’s new in react-query v1.0 - LogRocket Blog","url":"https://blog.logrocket.com/whats-new-in-react-query-v1-0/","tags":["JavaScript","React","library","article"],"content":"React Hooksで非同期処理を扱うreact-query 1.0の変更点について","relatedLinks":[{"title":"tannerlinsley/react-query: ⚛️ Hooks for fetching, caching and updating asynchronous data in React","url":"https://github.com/tannerlinsley/react-query"}]},{"category":"Article","title":"UI Fabric is evolving into Fluent UI - Microsoft 365 Developer Blog","url":"https://developer.microsoft.com/en-us/office/blogs/ui-fabric-is-evolving-into-fluent-ui/","tags":["JavaScript","React","library","article"],"content":"MSのUIフレームワークであるUI FabricがFluent UIにリネームした。\nパッケージネームも`@fluentui`のscopeで公開されるが、互換性のために`@uifabric`も公開され続ける。\nまた、今後のロードマップについて","relatedLinks":[{"title":"microsoft/fluentui: We've moved! UI Fabric is now Fluent UI - A set of React components for building Microsoft web experiences.","url":"https://github.com/microsoft/fluentui"}]},{"category":"Article","title":"HTML DOM - Common tasks of managing HTML DOM with vanilla JavaScript","url":"https://htmldom.dev/","tags":["JavaScript","DOM","document"],"content":"ライブラリを使わずにDOM API使ってできることを逆引きリファレンス的に紹介しているサイト","relatedLinks":[]},{"category":"SlideVideo","title":"CS253 - Web Security","url":"https://web.stanford.edu/class/cs253/","tags":["browser","web ","server","security","slide","video"],"content":"スタンフォード大学のWeb Securityコースのスライドと動画。\nブラウザからサーバまで攻撃/防御視点でのセキュリティについて学ぶ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Chrome DevTools // slidr.io","url":"https://slidr.io/bmeurer/chrome-devtools#1","tags":["Chrome","debug","ESLint"],"content":"Chrome DevToolsについてのスライド。\nDevToolsのアーキテクチャ、機能の紹介など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"chrvadala/node-ble: Bluetooth Low Energy (BLE) library written with pure Node.js (no bindings) - baked by Bluez via DBus","url":"https://github.com/chrvadala/node-ble","tags":["node.js","Bluetooth","library"],"content":"Pure Node.jsなBLEライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kriasoft/node-sqlite at v4","url":"https://github.com/kriasoft/node-sqlite/tree/v4","tags":["SQLite","node.js","library"],"content":"Node.jsのSQLiteクライアントライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"heremaps/harp.gl: harp.gl - web map rendering engine","url":"https://github.com/heremaps/harp.gl","tags":["JavaScript","WebGL","library"],"content":"three.jsを使った3Dマップレンダリングエンジンライブラリ","relatedLinks":[]},{"category":"Book","title":"TypeScript Weekly","url":"https://www.typescript-weekly.com/","tags":["TypeScript","mail"],"content":"TypeScriptについてのWeeklyメールマガジン","relatedLinks":[]},{"category":"Book","title":"初心者からちゃんとしたプロになる　JavaScript基礎入門 | 西畑 一馬, 須郷 晋也, 岡島 美咲, 扇 克至, 岩本 大樹 | 工学 | Kindleストア | Amazon","url":"https://www.amazon.co.jp/dp/B0863LYNQQ/","tags":["JavaScript","Vue","book"],"content":"2020年3月25日発売\nJavaScriptとVueについての書籍","relatedLinks":[]}]},{"meta":{"title":"2020-04-07のJS: ES2020 Candidate、WebdriverIO v6、ブラウザのリリース情報の追い方","author":"azu","layout":"post","date":"2020-04-07T01:38:40.312Z","category":"JSer","tags":["ECMAScript","WebDriver","Browser"],"url":"https://jser.info/2020/04/07/es2020-candidate-webdriverio-v6-/"},"items":[{"category":"Headline","title":"Release ES2020 Candidate · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2020","tags":["ECMAScript","spec","ReleaseNote"],"content":"ES2020のリリース候補が公開された。\n`import.meta`もES2020に含まれている。","relatedLinks":[]},{"category":"Headline","title":"WebdriverIO v6 Released · WebdriverIO","url":"https://webdriver.io/blog/2020/03/26/webdriverio-v6-released.html","tags":["webdriver","ReleaseNote","library"],"content":"WebdriverIO v6リリース。\nNode 8のサポート終了、Puppeteerの統合と`devtools`パッケージのデフォルト化、`request`から`got`への移行によるパフォーマンスの改善、TypeScriptサポートなど","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Temporarily rolling back SameSite Cookie Changes","url":"https://blog.chromium.org/2020/04/temporarily-rolling-back-samesite.html","tags":["Chrome","news","security"],"content":"Chrome 80で段階的にロールアウトされていたデフォルトをSameSite=Laxとする変更を、一時的にロールバックしてデフォルトを変更しないようにするとのこと。\n再展開は夏を目標にしている。","relatedLinks":[{"title":"SameSite Updates - The Chromium Projects","url":"https://www.chromium.org/updates/same-site"}]},{"category":"Headline","title":"New WebKit Features in Safari 13.1 | WebKit","url":"https://webkit.org/blog/10247/new-webkit-features-in-safari-13-1/","tags":["safari","webkit","ReleaseNote"],"content":"Safari 13.1の変更点について。\niPadOS 13.4でのPointer Eventsの対応。Web Animations API、Async Clipboard API、ResizeObserver、Picture-in-Pictureのサポート。\nES ProposalのNullish coalesing operator(`??`)のサポート、CSS Shadow Partsのサポート、ITPのアップデートなど","relatedLinks":[]},{"category":"Article","title":"ブラウザ/セキュリティ/プライバシー周りの一次情報に近い二次情報の情報源をまとめたもの","url":"https://gist.github.com/azu/7e879fd0c4598476b93aecd4d8dbb511","tags":["browser","article","MSEdge","Firefox","Chrome","safari","webkit"],"content":"ブラウザの新しいAPIやリリースなどの追い方や参考リソースのまとめ","relatedLinks":[]},{"category":"Article","title":"ECMAScript proposal updates @ 2020-04 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2020/04/04/ecmascript-proposal-update","tags":["ECMAScript","proposal","article"],"content":"2020-03から2020-04にかけて行われたTC39MTGで変更があったProposalのまとめ。\n`import.meta`がStage 4となり、ECMAScript 2020に含まれる。","relatedLinks":[{"title":"Release ES2020 Candidate · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2020"}]},{"category":"Article","title":"LCH colors in CSS: what, why, and how? | Lea Verou","url":"http://lea.verou.me/2020/04/lch-colors-in-css-what-why-and-how/","tags":["CSS","article"],"content":"CSS Color Modules Level 4で定義されているLCHカラーについて。\nLCHとは何かやなぜ導入されているのかについて。RGBと比較してより多くの色にアクセスできる点などについて解説している","relatedLinks":[]},{"category":"Article","title":"フロントエンド x RTC界隈の最近とこれから - console.lealog();","url":"https://lealog.hateblo.jp/entry/2020/04/02/094225","tags":["WebRTC","JavaScript","article"],"content":"WebRTC周りのWeb Platform APIのステータスやProposalについて。\nWebTransport、WebRTC-QUIC、WebCodecs、WebSocketStreamなどの関連するAPIについて","relatedLinks":[]},{"category":"Article","title":"A QUIC Update for Node.js","url":"https://www.nearform.com/blog/a-quic-update-for-node-js/","tags":["node.js","article","QUIC"],"content":"Node.jsでのQUICプロトコルの実装について。\nQUICの概要や、Node.js Coreに追加する目的で実装している `quic` モジュールについて","relatedLinks":[{"title":"nodejs/quic: Exploring a QUIC implementation for Node.js core","url":"https://github.com/nodejs/quic"}]},{"category":"WebsiteDocument","title":"engine262/engine262: An implementation of ECMA-262 in JavaScript","url":"https://github.com/engine262/engine262","tags":["JavaScript","ECMAScript","spec"],"content":"JavaScriptによるECMAScript実装。\nJavaScript開発者が新しい言語機能のプロトタイピングを簡単にできるようにするのが目的","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Lezer","url":"https://lezer.codemirror.net/","tags":["JavaScript","library","AST"],"content":"インクリメンタルなパースを行うパーサシステムライブラリ。\n文法を定義し、パースをインクリメンタルに行いエラー復帰なども対応したASTを生成するパーサジェネレータ。\nエディタのシンタックスハイライトのような用途で利用でき、CodeMirrorチームによって開発されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lirantal/npq: 🎖safely\\* install packages with npm or yarn by auditing them as part of your install process","url":"https://github.com/lirantal/npq","tags":["npm","console","Tools"],"content":"npmやyarnでパッケージをインストールする際に、パッケージのダウンロード数、READMEのうむ、インストールスクリプト、Snykでのチェックを行うCLI","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Keyboard Event Viewer","url":"https://w3c.github.io/uievents/tools/key-event-viewer.html","tags":["JavaScript","Keyboard","Tools","DOM"],"content":"JavaScriptのKeyboard Eventビューア","relatedLinks":[]},{"category":"SoftwareLibrary","title":"caroso1222/notyf: 👻 A minimalistic, responsive, vanilla JavaScript library to show toast notifications.","url":"https://github.com/caroso1222/notyf","tags":["JavaScript","UI","library"],"content":"依存がないToast通知を行うUIライブラリ。","relatedLinks":[]}]},{"meta":{"title":"2020-04-14のJS: jQuery 3.5.0(securify fix)、Firefox 75、Chrome 81","author":"azu","layout":"post","date":"2020-04-14T00:57:37.783Z","category":"JSer","tags":["jquery","Firefox","Chrome"],"url":"https://jser.info/2020/04/14/jquery-3.5.0securify-fix-firefox-75-chrome-81/"},"items":[{"category":"Headline","title":"Release 10.4.0 · preactjs/preact","url":"https://github.com/preactjs/preact/releases/tag/10.4.0","tags":["React","JavaScript","library","ReleaseNote"],"content":"Preact 10.4.0リリース。\nvnodeの厳密な比較によるパフォーマンス改善、SSR時にhydrationがうまく行かなかった際のfallbackを追加など","relatedLinks":[]},{"category":"Headline","title":"jQuery 3.5.0 Released! | Official jQuery Blog","url":"https://blog.jquery.com/2020/04/10/jquery-3-5-0-released/","tags":["jQuery","ReleaseNote"],"content":"jQuery 3.5.0リリース。\n`jQuery.htmlPrefilter`の正規表現のタグ展開によってXSSが発生する問題の修正。これによって`$(\"<div><div/></div>\")` のようなself-closedなタグと他のタグの組わせの挙動が変更される破壊的な変更も含まれる。\n4.0で削除される予定の`:even`と`:odd`の代わりに`.even()`と`.odd()`を追加など","relatedLinks":[{"title":"3.5 incompatible with FullCalendar 3 · Issue #4664 · jquery/jquery","url":"https://github.com/jquery/jquery/issues/4664"}]},{"category":"Headline","title":"Firefox 75: Ambitions for April - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/04/firefox-75-ambitions-for-april/","tags":["Firefox","ReleaseNote"],"content":"Firefox 75リリース。\n開発者ツールのコンソールにInstant evaluation previewsの追加、Async Stack Traceの対応。\n`<img loading=lazy>`での画像の遅延ロードのサポート、CSSの`min()`/`max()`/`clamp()`のサポート、Web Animations APIの改善など。","relatedLinks":[{"title":"Firefox 75.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/75.0/releasenotes/"},{"title":"Firefox 75 Site Compatibility | Firefox Site Compatibility","url":"https://www.fxsitecompat.dev/versions/75/"},{"title":"Firefox 75 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/ja/docs/Mozilla/Firefox/Releases/75"}]},{"category":"Headline","title":"New in Chrome 81  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2020/04/nic81","tags":["Chrome","ReleaseNote"],"content":"延期していたChrome 81リリース。\n次のChrome 82はスキップされ83が3週間早くリリースされる。\nBadging APIのサポート、Intl.DisplayNamesの実装、Origin TrialとしてWeb NFC APIの追加など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 104 | WebKit","url":"https://webkit.org/blog/10264/release-notes-for-safari-technology-preview-104/","tags":["webkit","safari","ReleaseNote"],"content":"Safari Technology Preview 104リリース。\n(macOSの開発版で)HTTP3をフラグ付きでサポート、CSSの`:is()`のサポート、WebRTC HEVC(H.265)のサポートなど","relatedLinks":[{"title":"H265 / HEVC, hardware accelerated, in #Webrtc – DONE … well, almost. | WebRTC by Dr Alex","url":"http://webrtcbydralex.com/index.php/2020/04/03/h265-hevc-hardware-accelerated-in-webrtc-done-well-almost/"}]},{"category":"Article","title":"Web Animations in Safari 13.1 | WebKit","url":"https://webkit.org/blog/10266/web-animations-in-safari-13-1/","tags":["CSS","safari","article"],"content":"Safari 13.1でサポートされたWeb Animations APIについて","relatedLinks":[]},{"category":"Article","title":"WebSocketStream: integrating streams with the WebSocket API","url":"https://web.dev/websocketstream/","tags":["WebSocket","strem","article"],"content":"PromiseベースであるWebSocketStream APIについての記事。\n`ReadableStream`や`WritableStream`などの基本的な使い方、Backpressureについて、Streamの閉じ方についてなど","relatedLinks":[]},{"category":"Article","title":"Digging into the Privacy Sandbox","url":"https://web.dev/digging-into-the-privacy-sandbox/","tags":["privacy","Chrome","article"],"content":"プライバシー保護に関するAPIセットであるPrivacy Sandboxについての紹介記事。\n現在のPrivacy Sandboxに関係するProposalの概要やゴール、関連する用語の解説など","relatedLinks":[]},{"category":"Article","title":"Under-the-hood of web bundlers (e.g. Webpack) - ITNEXT","url":"https://itnext.io/under-the-hood-of-web-bundlers-e-g-webpack-926e868f7f5e","tags":["JavaScript","bundler","article","video"],"content":"JavaScriptのBundlerについての発表動画の記事版。\nbundlerの行っていることの解説、小さなコンパイラを作りながらbundlerの動作の解説、実際にbundlerを使ってウェブアプリを出力するところまでを解説している。","relatedLinks":[{"title":"Under-the-hood of web bundlers (e.g. Webpack) - YouTube","url":"https://www.youtube.com/watch?v=JAY10_75vFw"},{"title":"craigtaub/our-own-webpack: Our own version of Webpack in <200 lines","url":"https://github.com/craigtaub/our-own-webpack"}]},{"category":"SlideVideo","title":"電子情報学特論：Chromiumのアーキテクチャを解き明かす - Google スライド","url":"https://docs.google.com/presentation/d/1AzBcuN-dmctk7v1IMZHivfpFAiXwCnsjyJS3wQ4sgE4/preview#slide=id.g82989a6582_1_134","tags":["Chrome","slide","architecture","security"],"content":"Chromiumのプロセスアーキテクチャについてのスライド。\nマルチプロセスアーキテクチャ、埋め込みコンテンツでのSpectreのメモリ読み取り、iframeでのSite Isolation、ChromeのGCの実装についてなど。\nまたレンダリング処理がParsing、Style、Layering、Rasterのステージに分けていて中間データをそれぞれ扱うことで動的な変更に対応している話など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Hopding/pdf-lib: Create and modify PDF documents in any JavaScript environment","url":"https://github.com/Hopding/pdf-lib","tags":["PDF","library","node.js"],"content":"PDFを作成できるNode.jsライブラリ","relatedLinks":[]},{"category":"Book","title":"JavaScript Primer 迷わないための入門書 | azu, Suguru Inatomi |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4048930737/","tags":["JavaScript","book"],"content":"2020年4月27日発売\nJavaScriptの入門書。\nhttps://jsprimer.net/ の書籍版。","relatedLinks":[{"title":"JavaScript Primerの書籍版が4月27日に発売予定です！ | Web Scratch","url":"https://efcl.info/2020/04/14/pre-jsprimer/"}]}]},{"meta":{"title":"2020-04-20のJS: puppeteer 3.0.0、Chrome 83 Beta、Vue.js 3.0 Beta","author":"azu","layout":"post","date":"2020-04-20T14:30:38.452Z","category":"JSer","tags":["puppeteer","Chrome","Vue"],"url":"https://jser.info/2020/04/20/puppeteer-3.0.0-chrome-83-beta-vue.js-3.0-beta/"},"items":[{"category":"Headline","title":"Node v13.13.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v13.13.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 13.13.0リリース。\n`fs.readv`の追加、`fs.readSync`に`offset`と`length`オプションの追加、`dns.ALL`フラグの追加。\nHTTPヘッダサイズのデフォルト値を8KBから16KBに変更など","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · puppeteer/puppeteer","url":"https://github.com/puppeteer/puppeteer/releases/tag/v3.0.0","tags":["Chrome","Firefox","library","ReleaseNote"],"content":"Puppeteer 3.0.0リリース。\nChromium 81にアップデート、Firefox Nightlyのバイナリをインストールできるように、Node.js 8のサポート終了など。","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 83 Beta: Cross-site Scripting Protection, Improved Form Controls, and Safe Cross-origin Resource Sharing","url":"https://blog.chromium.org/2020/04/chrome-83-beta-cross-site-scripting.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 83 Betaリリース。\nCSPとしてTrusted Typeを指定できるように、Form UI/Accessibilityの改善、COOPとCOEPの実装。\nOrigin Trialとして新しいNative File System、` Performance.measureMemory()`、`Scheduler.postTask()`の追加。\nその他には、ARIA Annotations 1.3 draftの対応、Barcode Detection API、CSSの`@supports selector()`のサポートなど","relatedLinks":[{"title":"Improving form controls in Microsoft Edge and Chromium - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2019/10/15/form-controls-microsoft-edge-chromium/"},{"title":"Making your website ","url":"https://web.dev/coop-coep/"},{"title":"The Native File System API: Simplifying access to local files","url":"https://web.dev/native-file-system/"}]},{"category":"Headline","title":"Release v1.7.0 · pikapkg/snowpack","url":"https://github.com/pikapkg/snowpack/releases/tag/v1.7.0","tags":["npm","browser","Tools","ReleaseNote","bundler"],"content":"Snowpack 1.7.0リリース。\n`--env`のサポート、Babelプラグインの更新、JSXとTypeScriptのサポート。\nまた Snowpack 2.0に向けて変更予定について書かれている","relatedLinks":[]},{"category":"Article","title":"AddyOsmani.com - Profiling React.js Performance","url":"https://addyosmani.com/blog/profiling-react-js/","tags":["React","performance","article"],"content":"Reactアプリのレンダリングパフォーマンスの計測方法について。\nExperimentalなReact Profiler API、Interaction tracingを使った方法。\nPuppeteerやUser Timing API、Lighthouseを使ったReactに依存しない計測についてなど","relatedLinks":[]},{"category":"Article","title":"A Tour of Inline Caching with Delete | WebKit","url":"https://webkit.org/blog/10298/inline-caching-delete/","tags":["webkit","performance","article","JavaScript"],"content":"`delete`演算子でプロパティを削除するオブジェクトの構造が変わって構造IDが変わることで、構造IDをkeyにしてキャッシュするInline Cachingが無効化されて遅くなる問題について。\nJSCではこのdeleteによる削除遷移に対する最適化を行うことで、Emberのデバッグビルドのようなdeleteを多用するアプリでのパフォーマンスを改善したという話","relatedLinks":[]},{"category":"Article","title":"Making your website \"cross-origin isolated\" using COOP and COEP","url":"https://web.dev/coop-coep/","tags":["Chrome","security","article"],"content":"`SharedArrayBuffer`など高度な機能は`self.crossOriginIsolated`が`true`の場合に利用できる。\n`crossOriginIsolated`を有効にするには、`Cross-Origin-Embedder-Policy`と`Cross-Origin-Opener-Policy`の対応が必要という話。\n`Cross-Origin-*` HTTPヘッダーの動きについての解説","relatedLinks":[{"title":"Raise the bar for SharedArrayBuffer via postMessage() by annevk · Pull Request #4734 · whatwg/html","url":"https://github.com/whatwg/html/pull/4734"},{"title":"COOP and COEP explained - Google ドキュメント","url":"https://docs.google.com/document/d/1zDlfvfTJ_9e8Jdc8ehuV4zMEu9ySMCiTGMS9y0GU92k/edit"},{"title":"Understanding ","url":"https://web.dev/same-site-same-origin/"}]},{"category":"Article","title":"Speed Up Your Angular App - 14 Angular Optimization Tips | GrapeCity","url":"https://www.grapecity.com/blogs/14-ways-to-speed-up-your-angular-app","tags":["Angular","article","performance"],"content":"Angular 9を使ったアプリの最適化Tips。","relatedLinks":[]},{"category":"Article","title":"What's new in ECMAScript 2020 | Strict Mode","url":"https://www.strictmode.io/articles/whats-new-es2020/","tags":["ECMAScript","JavaScript","article"],"content":"ES2020で追加される構文やメソッドについての紹介記事","relatedLinks":[]},{"category":"SlideVideo","title":"vime-js/vime: All your media player needs in one place - a modern alternative to Videojs and Plyr. Supports Html5, Hls, Dash, YouTube, Vimeo, Dailymotion and more to come.","url":"https://github.com/vime-js/vime","tags":["JavaScript","plugin","video","library"],"content":"プラグインで拡張できるVideoプレイヤーライブラリ。\n機能ごとにモジュール化されているため、必要なモジュールだけを利用できる。","relatedLinks":[]},{"category":"SlideVideo","title":"State of Vue Apr 16 2020 - Google スライド","url":"https://docs.google.com/presentation/d/1LHp-8hEtXEMSE1fd6YLAhYmtndQelQKbWlGggZKe4y8/edit#slide=id.p","tags":["Vue","slide"],"content":"Vue.js 3βリリースについてのスライド。\nVue 3の主な変更について。\nComposition API、Fragment、Teleport、Suspense、Custom Renderer APIの対応など。\nまた、Tree-shakingの対応によるファイルサイズの削減やTypeScriptのサポートについて","relatedLinks":[{"title":"vue-next/CHANGELOG.md at master · vuejs/vue-next","url":"https://github.com/vuejs/vue-next/blob/master/CHANGELOG.md#300-beta1-2020-04-16"}]},{"category":"WebsiteDocument","title":"Vuln Cost - security scanner for VS Code | Snyk","url":"https://snyk.io/security-scanner-vuln-cost/","tags":["VSCode","security","Tools"],"content":"VSCodeで`require`、`import`しているモジュールの脆弱性の数を表示する拡張機能","relatedLinks":[]},{"category":"WebsiteDocument","title":"CSS via inline variables","url":"https://codepen.io/WebReflection/pen/gOawwew","tags":["CSS","HTML","example"],"content":"`style`属性にCSS Custom Propertiesを定義して、CSS側でCSS Custom Propertiesの変数の読み取りと初期値を指定するパターン。\n利用側でCSS値をinjectできる仕組み","relatedLinks":[{"title":"Andrea Giammarchi on Twitter","url":"https://twitter.com/WebReflection/status/1252172398406877185"}]},{"category":"SoftwareLibrary","title":"aeroheim/midori: library for animated image backgrounds","url":"https://github.com/aeroheim/midori","tags":["JavaScript","WebGL","library"],"content":"Canvas/WebGLを使った背景画像のアニメーションを描画するライブラリ。\n読み込んだ背景画像に対してtransitionsやeffectsを設定できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"yusufnb/verify-json: verify-json","url":"https://github.com/yusufnb/verify-json","tags":["JSON","library"],"content":"JSONバリデーションライブラリ。\nスキーマを定義してJSONオブジェクトをバリデーションできる","relatedLinks":[]},{"category":"Book","title":"JavaScript Primer 迷わないための入門書 | azu, Suguru Inatomi |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4048930737/","tags":["JavaScript","book"],"content":"2020年4月27日発売\nJavaScriptの入門書。\nhttps://jsprimer.net/ の書籍版。","relatedLinks":[{"title":"JavaScript Primerの書籍版が4月27日に発売予定です！ | Web Scratch","url":"https://efcl.info/2020/04/14/pre-jsprimer/"}]},{"category":"Book","title":"速習 TypeScript 第2版 速習シリーズ | 山田祥寛 | 工学 | Kindleストア | Amazon","url":"https://www.amazon.co.jp/dp/B086JKVGPB/","tags":["TypeScript","book"],"content":"TypeScriptについての電子書籍","relatedLinks":[{"title":"【新刊紹介】『速習 TypeScript 第2版』発売、最新の3.8系にも対応：CodeZine（コードジン）","url":"https://codezine.jp/article/detail/12203"}]}]},{"meta":{"title":"2020-04-28のJS: Node.js 14.0.0、Got 11.0.0、Cost of JavaScript Frameworks","author":"azu","layout":"post","date":"2020-04-28T00:54:23.932Z","category":"JSer","tags":["Node.js","HTTP","Framework"],"url":"https://jser.info/2020/04/28/node.js-14.0.0-got-11.0.0-cost-of-javascript-frameworks/"},"items":[{"category":"Headline","title":"Release v11.0.0 · sindresorhus/got","url":"https://github.com/sindresorhus/got/releases/tag/v11.0.0","tags":["node.js","library","ReleaseNote"],"content":"Node.js向けHTTPクライアントのGot 11.0.0リリース。\nHTTP2をオプトインでサポート。\n`electron.net`のサポート終了、Pagination APIがStableに、`got.stream`の`encoding`オプションの変更、`dnsCache`オプションの変更など","relatedLinks":[{"title":"szmarczak/cacheable-lookup: A cacheable dns.lookup(…) that respects TTL","url":"https://github.com/szmarczak/cacheable-lookup"}]},{"category":"Headline","title":"Node v14.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v14.0.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 14.0.0リリース。\nV8 8.1へアップデート、Diagnostic ReportがStableに、`fs/promises`の追加など。\nExperimentalとしてWASIのサポート、ECMAScript ModulesのExperimental Warningの削除など","relatedLinks":[{"title":"Node.js version 14 available now - Node.js - Medium","url":"https://medium.com/@nodejs/node-js-version-14-available-now-8170d384567e"},{"title":"Node.js v14の主な変更点 - 別にしんどくないブログ","url":"https://shisama.hatenablog.com/entry/2020/04/22/011221"}]},{"category":"Headline","title":"Release 1.0.0 · markedjs/marked","url":"https://github.com/markedjs/marked/releases/tag/v1.0.0","tags":["Markdown","library","ReleaseNote"],"content":"Markdownパーサ、コンパイラのmarked 1.0.0リリース。\n`marked.use`でパーサに対してカスタマイズ処理ができるように","relatedLinks":[]},{"category":"Headline","title":"ESLint v7.0.0-rc.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2020/04/eslint-v7.0.0-rc.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v7.0.0-rc.0リリース。\n非同期処理の対応をした新しいESLint APIの追加、Node関係のルールは`eslint-plugin-node`が扱うためコアに含まれるNode関係のルールを非推奨化。\nエラーレポート位置情報の修正など","relatedLinks":[{"title":"mysticatea/eslint-plugin-node: Additional ESLint's rules for Node.js","url":"https://github.com/mysticatea/eslint-plugin-node"}]},{"category":"Headline","title":"Release 10.0.0 · highlightjs/highlight.js","url":"https://github.com/highlightjs/highlight.js/releases/tag/10.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"シンタックスハイライトライブラリのhighlight.js 10.0.0リリース。\nコードベースをES2015に変更しIEのサポート終了。\n`before:highlight`、`after:highlight` プラグインAPIの追加、それぞれの言語に`name`属性を追加など","relatedLinks":[{"title":"highlight.js/VERSION","url":"https://github.com/highlightjs/highlight.js/blob/master/VERSION_10_BREAKING_CHANGES.md"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 105 | WebKit","url":"https://webkit.org/blog/10428/release-notes-for-safari-technology-preview-105/","tags":["safari","webkit","ReleaseNote"],"content":"Safari Technology Preview 105リリース。\n仕様に準拠して`type=module`の`cross-origin`のデフォルト値を`anonymous`に変更。\nStage 3のES Proposalであるproposal-logical-assignmentを実装など","relatedLinks":[{"title":"tc39/proposal-logical-assignment: A proposal to combine Logical Operators and Assignment Expressions","url":"https://github.com/tc39/proposal-logical-assignment"}]},{"category":"Article","title":"node-fetch v3 beta is out! - Antoni Kepinski - Medium","url":"https://medium.com/@kepinski/node-fetch-v3-beta-is-out-9fbb8091999","tags":["node.js","HTTP","article"],"content":"node-fetch 3の変更予定について。\nNode.js 10未満のサポート終了、`browser`フィールドの削除、`res.textConverted()`の削除。\nData URLのサポート、`Blob`の実装、UTF8 URLハンドリングの改善、`highWaterMark`オプションの追加など","relatedLinks":[{"title":"node-fetch/node-fetch: A light-weight module that brings window.fetch to Node.js","url":"https://github.com/node-fetch/node-fetch"}]},{"category":"Article","title":"The Cost of Javascript Frameworks - Web Performance Consulting | TimKadlec.com","url":"https://timkadlec.com/remembers/2020-04-21-the-cost-of-javascript-frameworks/","tags":["browser","JavaScript","performance","article"],"content":"HTTP Archiveのデータを元にjQuery、Vue、Angular、Reactを使っているサイトでのメトリクスの比較について。\nそれぞれのライブラリを利用しているサイトのファイルサイズ、モバイル/デスクトップでのCPU消費時間について。\nまたjQueryと組み合わせているサイトとそうでないサイトの比較。\nReact単独のサイトではメインスレッドのCPU処理が増える傾向について","relatedLinks":[]},{"category":"Article","title":"A Taste of WebGPU in Firefox - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/04/experimental-webgpu-in-firefox/","tags":["WebGL","WebGPU","Firebug"],"content":"WebGPUについての記事。\nWebGLとWebGPUの違い、コンテキストの分離、パイプラインの状態のカプセル化、バインディングモデルについて。\nまたFirefoxのWebGPU実装について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"zeit/swr: React Hooks library for remote data fetching","url":"https://github.com/zeit/swr","tags":["React","library","Fetch"],"content":"データの取得を扱うReact Hooksライブラリ。\nデータの取得、リトライ、`mutate`による再取得、定期的な取得、SSRの対応、Suspenseの対応など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"developit/web-worker: Consistent Web Workers in browser and Node.","url":"https://github.com/developit/web-worker","tags":["JavaScript","node.js","browser","webworker","library"],"content":"UniversalなWebWorkerライブラリ。\nNode.jsの`worker_threads`とブラウザの`Worker`に対応している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ezhmd/opencv-wasm: Precompiled OpenCV 4.3.0 to JavaScript + WebAssembly for node.js environment","url":"https://github.com/ezhmd/opencv-wasm","tags":["WebAssembly","graphic","library"],"content":"OpenCV.jsのWebAssemblyビルドをパッケージとして配布しているライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bikeshaving/crank: Write JSX-driven components with functions, promises and generators.","url":"https://github.com/bikeshaving/crank","tags":["JavaScript","library","React"],"content":"ReactのようにJSXでコンポーネントを扱うライブラリ。\n非同期コンポーネントをPromiseとGeneratorを使って扱えるようにしている。","relatedLinks":[{"title":"Crank.js | Introducing Crank","url":"https://crank.js.org/blog/introducing-crank"}]},{"category":"SoftwareLibrary","title":"mohebifar/vidact: A compiler that converts React-compatible codes to VanillaJS with no Virtual DOM","url":"https://github.com/mohebifar/vidact","tags":["babel","React","JavaScript","library"],"content":"ReactライクなコードをプレーンなJavaScriptに変換するコンパイラとランタイム。\nSvelteと似たコンセプトで、Babelプラインとして実装したコンパイラでReact/JSXなコードを同等のDOM表現に変換する目的","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lukeed/rosetta: A general purpose internationalization library in 292 bytes","url":"https://github.com/lukeed/rosetta","tags":["JavaScript","i18n","library"],"content":"シンプルなローカライズライブラリ","relatedLinks":[]}]},{"meta":{"title":"2020-05-07のJS: Firefox 76、Jest 26、Web Vitals","author":"azu","layout":"post","date":"2020-05-07T04:42:34.756Z","category":"JSer","tags":["Firefox","Jest","Chrome","Performance"],"url":"https://jser.info/2020/05/07/firefox-76-jest-26-web-vitals/"},"items":[{"category":"Headline","title":"Firefox 76: Audio worklets and other tricks - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/05/firefox-76-audio-worklets-and-other-tricks/","tags":["Firefox","ReleaseNote"],"content":"Firefox 76リリース。\n開発者ツールの改善、Audio workletsのサポート、CSS System Colorsのサポート、未知のプロトコルへのNavigation移動をブロックするように変更など","relatedLinks":[{"title":"Firefox 76 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/76"},{"title":"Firefox 76 Site Compatibility | Firefox Site Compatibility","url":"https://www.fxsitecompat.dev/en-CA/releases/76/"},{"title":"Firefox 76.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/76.0/releasenotes/"}]},{"category":"Headline","title":"Node v12.16.3 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v12.16.3/","tags":["node.js","ReleaseNote"],"content":"Node.js 12.16.3リリース。\nExperimentalで実装されているconditional exportsに関するwarningメッセージが削除された","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 3.9 RC | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-9-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.9 RCリリース。\n`Promise.all`の型改善、ビルドパフォーマンスの改善、Type Errorとなることを期待する`// @ts-expect-error`コメントの追加など。 また、ECMAScript仕様にあわせてGetter/Setterをトランスパイルするように変更など\n`awaited` typeは延期","relatedLinks":[]},{"category":"Headline","title":"jQuery 3.5.1 Released: Fixing a Regression | Official jQuery Blog","url":"http://blog.jquery.com/2020/05/04/jquery-3-5-1-released-fixing-a-regression/","tags":["jQuery","ReleaseNote"],"content":"jQuery 3.5.1リリース。\njQuery 3.5.0でのリグレッションを修正。3.5ではXSSに対するセキュリティ修正のため、意図的に後方互換性がない部分も含まれる","relatedLinks":[]},{"category":"Headline","title":"Jest 26: Tick Tock · Jest","url":"https://jestjs.io/blog/2020/05/05/jest-26","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Jest 26リリース。\n`@sinonjs/fake-timers`ベースの新しいFake Timerの追加、`it`や`describe`などをexportする`@jest/globals`の追加、Native ESMのサポートなど。\nいくつかのコアモジュールでES5のビルドを提供しないように変更し、Node.js 8未満のサポートを終了。\n今後の変更として、Jest 27でデフォルトのtestRunnerを\"jest-circus\"に変更しenvironmentを\"node\"に変更する。\nまた、Jest 28で\"jest-jasmine2\"と\"jest-environment-jsdom\"をコアから別のパッケージへと分離する予定。","relatedLinks":[]},{"category":"Headline","title":"Release v1.6.0 · mdx-js/mdx","url":"https://github.com/mdx-js/mdx/releases/tag/v1.6.0","tags":["JavaScript","Markdown","ReleaseNote"],"content":"MarkdownにJSXを拡張するMDX 1.6.0リリース。\nVueをベータサポート","relatedLinks":[]},{"category":"Article","title":"What’s in that .wasm? Introducing: wasm-decompile · V8","url":"https://v8.dev/blog/wasm-decompile","tags":["WebAssembly","article"],"content":"`wasm-decompile`でのWebAssemblyのデコンパイルについて","relatedLinks":[{"title":"wabt/decompiler.md at master · WebAssembly/wabt","url":"https://github.com/WebAssembly/wabt/blob/master/docs/decompiler.md"}]},{"category":"Article","title":"window.location Cheatsheet - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/samanthaming/window-location-cheatsheet-4edl","tags":["JavaScript","チートシート","article"],"content":"`window.location`オブジェクトのプロパティやメソッドの挙動を解説している記事","relatedLinks":[]},{"category":"Article","title":"Improved Next.js and Gatsby page load performance with granular chunking","url":"https://web.dev/granular-chunking-nextjs/","tags":["webpack","article"],"content":"webpackの`SplitChunksPlugin`を行うことでNext.js 9.2やGatsbyのページ間でのCommon chunkを分けた話。\nHTTP/2における`maxInitialRequests`の設定によるcリクエスト数の増加の影響調査、ルーティングとchunkの分離についてなど","relatedLinks":[{"title":"feat(gatsby): enable granular chunks by wardpeet · Pull Request #22253 · gatsbyjs/gatsby","url":"https://github.com/gatsbyjs/gatsby/pull/22253"}]},{"category":"Article","title":"Web Vitals","url":"https://web.dev/vitals/","tags":["Chrome","performance","article","JavaScript"],"content":"ウェブページのパフォーマンス計測の重なメトリクスをCore Web Vitalsとしてまとめたという話。\nCore Web VitalsはLargest Contentful Paint(LCP)、First Input Delay(FID)、Cumulative Layout Shift(CLS)。\n同時に`web-vitals`というそれぞれのメトリクスを計測できるライブラリも提供し、 PageSpeed InsightsやSearch Consoleなどもそれぞれ対応していく予定","relatedLinks":[{"title":"GoogleChrome/web-vitals: Essential metrics for a healthy site.","url":"https://github.com/GoogleChrome/web-vitals"},{"title":"GoogleChrome/web-vitals-extension: A Chrome extension to measure essential metrics for a healthy site","url":"https://github.com/GoogleChrome/web-vitals-extension"}]},{"category":"SlideVideo","title":"rinsuki/play-flv-in-browser: Play FLV in Browser!","url":"https://github.com/rinsuki/play-flv-in-browser","tags":["flash","video","WebAssembly","JavaScript","browser"],"content":"ffmepgをWebAssemblyにコンパイルしたものを使ってflv/mp4をブラウザで再生するデモ","relatedLinks":[]},{"category":"WebsiteDocument","title":"antfu/i18n-ally: 🌍 All in one i18n extension for VS Code","url":"https://github.com/antfu/i18n-ally","tags":["VSCode","i18n","Extension","EmEditor"],"content":"VSCode上に作られたi18n編集システム。\nエディタ上で翻訳キーの代わりに翻訳結果の表示などローカライズの支援をする拡張機能。\nさまざまなフレームワークに対応している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"addaleax/gen-esm-wrapper: Generate ESM wrapper files for CommonJS modules","url":"https://github.com/addaleax/gen-esm-wrapper","tags":["node.js","CommonJS","ECMAScript","module"],"content":"CommonJSからESM Wrapperを生成するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jesseduffield/lazynpm: terminal UI for npm","url":"https://github.com/jesseduffield/lazynpm","tags":["npm","console","UI"],"content":"lazygit, lazydockerライクなnpmのターミナルUIツール。\nパッケージの情報表示、パッケージの管理、スクリプトの実行など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Quantum JavaScript (Q.js)","url":"https://quantumjavascript.app/","tags":["JavaScript","library"],"content":"量子回路シミュレーターライブラリ","relatedLinks":[]},{"category":"Book","title":"Tackling TypeScript: Upgrading from JavaScript","url":"https://exploringjs.com/tackling-ts/","tags":["TypeScript","book"],"content":"Dr. AxelによるTypeScriptの入門書","relatedLinks":[]}]},{"meta":{"title":"2020-05-12のJS: ESLint v7.0.0、Next.js 9.4、npm 7の変更予定","author":"azu","layout":"post","date":"2020-05-11T23:04:53.405Z","category":"JSer","tags":["ESLint","Next.js","npm"],"url":"https://jser.info/2020/05/12/eslint-v7.0.0-next.js-9.4-npm-7/"},"items":[{"category":"Headline","title":"V8 release v8.3 · V8","url":"https://v8.dev/blog/v8-release-83","tags":["V8","ReleaseNote"],"content":"V8 8.3リリース。\nArrayBufferのGC改善、 WebAssemblyで最大4GBのメモリを利用できるように、TypedArrayにおけるprototypeチェーンのバグを修正など","relatedLinks":[]},{"category":"Headline","title":"ESLint v7.0.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2020/05/eslint-v7.0.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 7.0.0リリース。\n破壊的な変更としてNode.js 8以下のサポート終了、`eslint:recommended`の更新、ルールの更新、デフォルトの無視ファイルの変更など。\n非同期処理に対応した`ESLint`クラスの追加、ディレクティブコメントに説明が書けるようになるなど","relatedLinks":[{"title":"ESLint v7.0.0 の変更点まとめ - Qiita","url":"https://qiita.com/mysticatea/items/0931a7d910fcb91733ee"},{"title":"Migrating to v7.0.0 - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/docs/user-guide/migrating-to-7.0.0"}]},{"category":"Headline","title":"Node v14.2.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v14.2.0/","tags":["node.js","ReleaseNote"],"content":"Node v14.2.0リリース。\nNode内部メソッドの`common.mustCall() `を`assert.CallTracker`として試験的に利用できるように。\nWorkerに`stackSizeMb`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Blog - Next.js 9.4 | Next.js","url":"https://nextjs.org/blog/next-9-4","tags":["React","ReleaseNote","library"],"content":"Next.js 9.4リリース。\nFast Refreshをデフォルトで有効化、`stale-while-revalidate`ライクな Incremental Static Regenerationをベータサポート。\nNode.js側にも`fetch`を自動的にpolfyill、`reportWebVitals`のサポート、モジュールを絶対パスで解決するAliasesのサポートなど","relatedLinks":[]},{"category":"Headline","title":"shqld/tish: A typescript utils for shell operations. Totally Promise, Multi-platform, Optimized, Lazy✌️","url":"https://github.com/shqld/tish","tags":["JavaScript","TypeScript","ShellScript","library"],"content":"シェルスクリプトのような処理をTypeScriptで書けるutilライブラリ。\nコマンドの実行やパイプ処理などを扱う","relatedLinks":[]},{"category":"Article","title":"Rebuilding our tech stack for a new Facebook.com - Facebook Engineering","url":"https://engineering.fb.com/web/facebook-redesign/","tags":["facebook","React","CSS","performance","article"],"content":"Facebook.com のリデザインにおけるパフォーマンス改善について。\nAtomicなCSSを生成して初期ロードに必要なCSSの削減、`rem`を使ったフォントサイズコントール。\nSVGをReactコンポーネントとしてロード、Dynamic Importを使ったコンポーネントの動的ロード、JavaScript Budgetの導入、GraphQLを使ったラウンドトリップの削減など","relatedLinks":[]},{"category":"Article","title":"The npm Blog — npm v7 Series - Introduction","url":"https://blog.npmjs.org/post/617484925547986944/npm-v7-series-introduction","tags":["npm","article"],"content":"npm 7のロードマップについて。\narboristを使った依存関係の分析の刷新、`peerDependencies`の自動インストール、`acceptDependencies`のサポート。\nまた`package-lock.json`の形式変更と`yarn.lock`に関する処理の追加。workspaces機能(yarn workspaces相当)、overrides機能(yarnのresolusions相当)の追加、段階的な公開を行う`--stage`オプションの追加など","relatedLinks":[{"title":"npm/arborist: npm's tree doctor","url":"https://github.com/npm/arborist"}]},{"category":"Article","title":"An in-depth guide to performance optimization with webpack - LogRocket Blog","url":"https://blog.logrocket.com/guide-performance-optimization-webpack/","tags":["webpack","performance","article"],"content":"webpackでのbundleサイズの分析、改善方法についてのチュートリアル。\nエントリポイントの分離、サードパーティライブラリの分離、chunkのグループ化、ルーティングごとのcode splitting、`runtimeChunk`でのmanifestファイルの統一。\nexternalsでのCDNの利用、Tree ShakingでDead Code削除、Performance Budgetの設定などをステップごとに見ていく記事","relatedLinks":[{"title":"doppelmutzi/react-performance-strategies at manifest-splitting","url":"https://github.com/doppelmutzi/react-performance-strategies/tree/manifest-splitting"}]},{"category":"Article","title":"Using Buffers in Node.js | DigitalOcean","url":"https://www.digitalocean.com/community/tutorials/using-buffers-in-node-js","tags":["node.js","article"],"content":"Node.jsの`Buffer`の基本的な使い方についての解説記事","relatedLinks":[]},{"category":"Article","title":"Comparing Ember Octane and React","url":"https://www.pzuraq.com/comparing-ember-octane-and-react/","tags":["Ember","React","article"],"content":"Ember OctaneとReactを比較した記事。\nそれぞれのフレームワークで同じコードを書くとどのような違いがあるかやそれぞれの仕組みについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Deno Weekly","url":"https://denoweekly.com/","tags":["mail","deno"],"content":"Denoに関する週刊のメールマガジン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sindresorhus/slugify: Slugify a string","url":"https://github.com/sindresorhus/slugify","tags":["JavaScript","node.js","library"],"content":"文字列からURLやファイル名などに使えるslug文字列を作成するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nikersify/pico: Take browser screenshots in Javascript 📸","url":"https://github.com/nikersify/pico","tags":["JavaScript","SVG","library"],"content":"SVGの`<foreignObject>`を使ってHTMLのスクリーンショットを作成するライブラリ","relatedLinks":[]},{"category":"Book","title":"Distributed Node.js - O'Reilly Media","url":"http://shop.oreilly.com/product/0636920342762.do","tags":["node.js","book"],"content":"Node.jsでのスケーラブルなバックエンドサービス開発についての書籍","relatedLinks":[]},{"category":"Book","title":"React: Up & Running, 2nd Edition - O'Reilly Media","url":"http://shop.oreilly.com/product/0636920252696.do","tags":["React","book"],"content":"Reactの入門書の第2版","relatedLinks":[]},{"category":"Book","title":"詳解HTTP/2（BarryPollard 北原憲 一ノ瀬太樹 洲崎俊 北原憲 一ノ瀬太樹 洲崎俊 新井悠 国分裕 長谷川陽介）｜翔泳社の本","url":"https://www.shoeisha.co.jp/book/detail/9784798163789","tags":["HTTP2","book","翻訳"],"content":"2020年06月15日発売\nHTTP/2 in Actionの翻訳本","relatedLinks":[]}]},{"meta":{"title":"2020-05-18のJS: TypeScript 3.9、Deno 1.0、Playwright 1.0","author":"azu","layout":"post","date":"2020-05-18T12:14:18.906Z","category":"JSer","tags":["TypeScript","Deno","Testing"],"url":"https://jser.info/2020/05/18/typescript-3.9-deno-1.0-playwright-1.0/"},"items":[{"category":"Headline","title":"Announcing TypeScript 3.9 | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-3-9/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 3.9リリース。`Promise.all`の型改善、ビルドパフォーマンスの改善、Type Errorとなることを期待する`// @ts-expect-error`コメントの追加など。 また、ECMAScript仕様にあわせてGetter/Setterをトランスパイルするように変更など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 106 | WebKit","url":"https://webkit.org/blog/10580/release-notes-for-safari-technology-preview-106/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 106リリース。\nCSSの`:where()` pseudo-classのサポート、ES2020のBigIntをサポート、`Intl.RelativeTimeFormat`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Deno 1.0","url":"https://deno.land/v1","tags":["deno","ReleaseNote","node.js"],"content":"Deno 1.0リリース。\nV8を使ったJavaScript/TypeScriptランタイム。\nオプトインで機能を有効化でき、formatterなどを同梱していて、Go言語ライクなStandard libraryを持っている。","relatedLinks":[]},{"category":"Headline","title":"Fast and reliable cross-browser testing with Playwright 🎭","url":"https://medium.com/@arjunattam/fast-and-reliable-cross-browser-testing-with-playwright-155c0e8a821f","tags":["browser","testing","library","ReleaseNote"],"content":"Playwright 1.0.0リリース。\nChrome、Firefox、SafariをサポートしたPuppeteer-likeなAPIを持つクスブラウザテストフレームワーク。\n時間ではなくイベントに対して待機できる仕組み、複数の独立したコンテキストの定義、さまざまなブラウザAPIに対応している","relatedLinks":[]},{"category":"Article","title":"How to use prefers-reduced-motion in React · Josh W Comeau","url":"https://joshwcomeau.com/react/prefers-reduced-motion/","tags":["React","JavaScript","article"],"content":"Reactで`prefers-reduced-motion`を利用したアニメーションの削減を実装する方法について。\nReact hooksを使った実装、SSRを考慮したパターンについて","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 84)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2020/05/devtools","tags":["Chrome","debug","article"],"content":"Chrome 84の開発者ツールの変更点について。\nパフォーマンスパネルにWeb Vitalsを反映した項目の追加、PromiseオブジェクトのStatusをコンソールに表示するように、CSS `revert` プロパティのサポートなど","relatedLinks":[]},{"category":"Article","title":"Kite Launches AI-Powered JavaScript Completions - Code Faster with Kite","url":"https://www.kite.com/blog/product/kite-launches-ai-powered-javascript-completions/","tags":["JavaScript","editor","article"],"content":"機械学習ベースのコード補完ツールであるKiteがJavaScriptの補完に対応したという話","relatedLinks":[]},{"category":"Article","title":"How an anti ad-blocker works: Reverse-engineering BlockAdBlock","url":"https://xy2.dev/article/re-bab/","tags":["ad ","JavaScript","article"],"content":"AdBlockのBlockerの実装を見ていく話。","relatedLinks":[]},{"category":"SlideVideo","title":"Production Ready State Management for React | Kea 2.0","url":"https://kea.js.org/","tags":["React","JavaScript","library"],"content":"React向けのステート管理ライブラリ。\nActions、Reducers、Listeners、Loaders、Selectors、Valuesを扱う","relatedLinks":[]},{"category":"SlideVideo","title":"ReactEurope 2020 - YouTube","url":"https://www.youtube.com/playlist?list=PLCC436JpVnK0Q4WHoB85ZYBwcCyTaMgAl","tags":["React","イベント","video"],"content":"React Europe 2020の動画一覧","relatedLinks":[{"title":"ReactEurope - The original European React.js ","url":"https://www.react-europe.org/"}]},{"category":"SlideVideo","title":"Focused Session: Performance profiling for Web Applications with Sam Saccone - YouTube","url":"https://www.youtube.com/watch?v=j9LW94EN7n4","tags":["performance","video","debug","browser"],"content":"ウェブアプリケーションのボトルネックの見つけ方について動画。\n初期ロードのネットワークにおけるクリティカルパスの問題とpreload、\n操作中のパフォーマンスのボトルネックの見つけ方についてのケーススタディ","relatedLinks":[{"title":"nodeschool April 18 2020 - webperf - Google スライド","url":"https://docs.google.com/presentation/d/1K9QKmQdZ51OU4DKGmXL_8R4KS4N-WVtZZEqZA9g4STA/edit#slide=id.p"}]},{"category":"WebsiteDocument","title":"addyosmani/puppeteer-webperf: Automating Web Performance testing with Puppeteer 🎪","url":"https://github.com/addyosmani/puppeteer-webperf","tags":["Chrome","performance","JavaScript","example"],"content":"Puppeteerを使ったパフォーマンス計測のメトリクス取得などのスニペットリポジトリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Raynos/npm-bin-deps: NPR allows you to run your CLI dependencies without having a copy in node\\_modules.","url":"https://github.com/Raynos/npm-bin-deps","tags":["npm","node.js","Tools"],"content":"npm run-scriptからコマンドとして利用するパッケージを`package.json`に`binDependencies`として定義して、利用するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sandersn/downlevel-dts: Convert a new d.ts to one that works with older versions of Typescript","url":"https://github.com/sandersn/downlevel-dts","tags":["TypeScript","Tools"],"content":"TypeScriptの型定義のダウングレードを行うツール。\nTypeScriptの古い機能を使って新しい機能を再現するように型定義を変換するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"facebookexperimental/Recoil: Recoil is an experimental state management library for React apps. It provides several capabilities that are difficult to achieve with React alone, while being compatible with the newest features of React.","url":"https://github.com/facebookexperimental/Recoil","tags":["React","JavaScript","library"],"content":"React向けのステート管理ライブラリ。","relatedLinks":[]},{"category":"Book","title":"JavaScript: The Definitive Guide, 7th Edition - O'Reilly Media","url":"http://shop.oreilly.com/product/0636920048633.do","tags":["JavaScript","book"],"content":"JavaScriptについての書籍。\nサイ本 第7版","relatedLinks":[]}]},{"meta":{"title":"2020-05-25のJS: Chrome 83、Electron 9.0.0、typescript-eslint 3.0.0","author":"azu","layout":"post","date":"2020-05-25T14:18:36.448Z","category":"JSer","tags":["Chrome","Electron","TypeScript","ESLint"],"url":"https://jser.info/2020/05/25/chrome-83-electron-9.0.0-typescript-eslint-3.0.0/"},"items":[{"category":"Headline","title":"Node v14.3.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v14.3.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 14.3.0リリース。\nREPLでoutput previewの改善、Top-Level Awaitのサポートなど","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 83  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2020/05/nic83","tags":["Chrome","ReleaseNote"],"content":"Chrome 83リリース。\nTrusted Typesのサポート、フォームコントロールUIのアップデート、COOPとCOEPの実装。\nOrigin Trialとして`performance.measureMemory()`や`Scheduler.postTask()`の追加。\nその他にはBarcode Detection APIやCSS ` prefers-color-scheme`のサポートなど","relatedLinks":[{"title":"Chromium Blog: Chrome 83 Beta: Cross-site Scripting Protection, Improved Form Controls, and Safe Cross-origin Resource Sharing","url":"https://blog.chromium.org/2020/04/chrome-83-beta-cross-site-scripting.html"}]},{"category":"Headline","title":"Release v3.0.0 · typescript-eslint/typescript-eslint","url":"https://github.com/typescript-eslint/typescript-eslint/releases/tag/v3.0.0","tags":["TypeScript","ESLint","ReleaseNote"],"content":"typescript-eslint 3.0.0リリース。\nESLint 7をサポート、TS 3.9のサポート。 \nNode.js 8とTypeScript 3.2のサポート終了。\n`recommended`と`recommended-requiring-typechecking`が`eslint-recommended`を継承するように変更。\nルールのデフォルト値の変更、Deprecatedなルールの削除など。","relatedLinks":[]},{"category":"Headline","title":"Electron 9.0.0 | Electron Blog","url":"https://www.electronjs.org/blog/electron-9-0","tags":["Electron","ReleaseNote"],"content":"Electron 9.0.0リリース。\nChromium 83、Node 12.14、V8 8.3へアップデート。\n`enableRemoteModle`オプションを使わずに`remote`モジュールを使うことを非推奨化、`app.enableRendererProcessReuse`をデフォルトで`true`に変更など。\nその他には、スペルチェッカーの改善、PDFビューアの有効化など","relatedLinks":[]},{"category":"Article","title":"Preparing for AppCache removal","url":"https://web.dev/appcache-removal/","tags":["Chrome"],"content":"ChromeのAppCache削除プラン。\nChrome 90で完全に消える予定。\nChrome on iOSではService Workerが使えないため、代用方法はない環境もある。他のブラウザでのAppCacheの削除予定についてなど","relatedLinks":[]},{"category":"Article","title":"Chromium Blog: The Science Behind Web Vitals","url":"https://blog.chromium.org/2020/05/the-science-behind-web-vitals.html","tags":["performance","Chrome","browser","article"],"content":"Web Vitalsの背景にあるUX調査について。\nLCPの2.5秒未満、CLSの0.1未満、FIDの100ミリ秒未満の推奨値の算出に関する調査についてまとめた記事","relatedLinks":[]},{"category":"Article","title":"Site Isolation 及び Web のセキュリティモデルの更新 | blog.jxck.io","url":"https://blog.jxck.io/entries/2020-05-22/site-isolation.html","tags":["browser","security","article"],"content":"異なるサイトのコードの実行やリソースを読み込みを観測することで情報を取得できるサイドチャネル攻撃を防止する仕組みについて。\nブラウザのプロセスを分離する方法とウェブサイト側でオプトインとしてクロスオリジンリクエストを制御する仕組みについて。","relatedLinks":[]},{"category":"Article","title":"Introducing App Service Static Web Apps - Microsoft Tech Community - 1394451","url":"https://techcommunity.microsoft.com/t5/azure-app-service/introducing-app-service-static-web-apps/ba-p/1394451","tags":["webservice","Azure","article"],"content":"Azureの静的サイトホスティングサービスのApp Service Static Web Appsについて。\nルーティングルール、GitHubアカウントなどを使った認証、Azure FunctionsでのサーバAPIの実装、GitHub Actionsを使ったデプロイなどができる","relatedLinks":[]},{"category":"Article","title":"module bundlerの作り方(準備編) - 技術探し","url":"https://blog.hiroppy.me/entry/create-module-bundler-preparation","tags":["webpack","bundler","JavaScript","article"],"content":"BabelのJavaScriptパーサを使って基本的なmodule bundlerを作成するチュートリアル","relatedLinks":[]},{"category":"Article","title":"swyx Writing | IE11 Mainstream End Of Life in Oct 2020","url":"https://www.swyx.io/writing/ie11-eol/","tags":["IE","article","opinion"],"content":"IE 11の「メインストリーム」でのサポート終了についての意見/記事。\nWindows 10のextended supportは2025年までだが、「メインストリーム」のサポートは2020年までのため、IE 11の「メインストリーム」サポートも2020年までではという話。\nChromiumベースのMSEdgeのリリースと、Windows Update経由での自動ロールアウトも2020年中には完了することも加味している。\nまた、IE 11のシェア、IE 11のサポートを終了しているサービスについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"What's New in Lighthouse 6.0","url":"https://web.dev/lighthouse-whats-new-6.0/","tags":["browser","Chrome","performance","ReleaseNote"],"content":"Lighthouse 6.0リリース。\nWeb Vitalsに基づく新しいメトリクスとしてLCP/CLSの追加、Performanceスコア計算の変更。\n新しいAuditsとして、Unused JavaScript、axe-coreベースのAccessibility Auditなどの追加。\nLighthouse拡張はPageSpeed Insights APIを使うように変更など","relatedLinks":[{"title":"Release v6.0.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v6.0.0"},{"title":"Lighthouse Scoring calculator","url":"https://googlechrome.github.io/lighthouse/scorecalc/"},{"title":"GoogleChrome/lighthouse-ci: Automate running Lighthouse for every commit, viewing the changes, and preventing regressions","url":"https://github.com/GoogleChrome/lighthouse-ci"}]},{"category":"WebsiteDocument","title":"WebGL guide (part 1/2)","url":"https://xem.github.io/articles/webgl-guide.html","tags":["WebGL","tutorial"],"content":"WebGL/GLSLについてのチュートリアル","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Introduction - Nuxt Content","url":"https://content.nuxtjs.org/","tags":["Vue","JavaScript","library"],"content":"Nuxt.jsからMarkdown、JSON、CSVなどのコンテンツデータを取得して、埋め込めるNuxt.jsモジュール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cacjs/cac: Simple yet powerful framework for building command-line apps.","url":"https://github.com/cacjs/cac","tags":["JavaScript","console","library"],"content":"コマンドラインツール向けのライブラリ。\n引数パーサ、ヘルプ表示、バージョン表示、サブコマンドの仕組みを持っている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"loreanvictor/rxxpress: An Experimental Mashup of RxJS and Express","url":"https://github.com/loreanvictor/rxxpress/","tags":["Rx","node.js","server","library"],"content":"RxJSを使ったExpressライクなサーバライブラリ。\nExpressのRouterと組み合わせ利用できるように設計されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"umijs/umi-request: A request tool based on fetch.","url":"https://github.com/umijs/umi-request","tags":["Fetch","browser","node.js","library"],"content":"Fetch APIベースのHTTPリクエストライブラリ","relatedLinks":[]}]},{"meta":{"title":"2020-05-31のJS: Babel 7.10.0(Babel Polyfills)、Snowpack 2.0、Chrome 84β","author":"azu","layout":"post","date":"2020-05-31T06:24:18.515Z","category":"JSer","tags":["babel","bundler","chrome"],"url":"https://jser.info/2020/05/31/babel-7.10.0babel-polyfills-snowpack-2.0-chrome-84b/"},"items":[{"category":"Headline","title":"7.10.0 Released: Class Fields in preset-env, '#private in' checks and better React tree-shaking · Babel","url":"https://babeljs.io/blog/2020/05/25/7.10.0","tags":["babel","ReleaseNote"],"content":"Babel 7.10.0リリース。\nES2015のUnicode escapeをES5に変換する`@babel/plugin-transform-unicode-escapes`の追加。\n`import.meta`のパースをデフォルトでサポート。\nES Module AttributesのProposalのパースを行う`babel-plugin-syntax-module-attributes`の追加、`@babel/preset-react`に`/*#__PURE__#/`アノテーションをつけるプラグインの追加。\ncore-js以外も選べるpolyfillエンジンの追加など","relatedLinks":[{"title":"babel/babel-polyfills: A set of Babel plugins that enable injecting different polyfills with different strategies in your compiled code.","url":"https://github.com/babel/babel-polyfills"}]},{"category":"Headline","title":"Node v12.17.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v12.17.0/","tags":["node.js","ReleaseNote"],"content":"Node v12.17.0リリース。\n`--experimental-modules`なしにES Modulesを利用可能に、Experimental APIとして`AsyncLocalStorage`の追加、REPLの改善。\nDiagnostic ReportがStableに、`server.headersTimeout`のデフォルト値の変更など","relatedLinks":[]},{"category":"Headline","title":"Introducing Snowpack 2.0","url":"https://www.snowpack.dev/posts/2020-05-26-snowpack-2-0-release/","tags":["bundler","Tools","JavaScript","ReleaseNote"],"content":"Snowpack 2.0リリース。\nES Modulesをネイティブに使った開発を行うためのビルドシステム。\n開発時はファイルごとにビルドを行い、production buildではwebpackやparcelを使ってbundleしたビルドを行う。\nBuild ScriptsやPluginでのカスタマイズを行えるようになっている。\nデフォルトではesbuildを使ってjs,jsx,ts,tsxのビルドを行う","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 107 | WebKit","url":"https://webkit.org/blog/10585/release-notes-for-safari-technology-preview-107/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 107リリース。\nWeb Inspectorの改善、`Intl.Locale`/`BigInt.asIntN`/`BigInt.asUintN`の実装。\nHTTPリファラのサイズを4KBに制限するように変更など","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.2 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v5.0.2","tags":["npm","ReleaseNote"],"content":"npmパッケージ管理ツールのpnpm 5.0リリース。\nパフォーマンスの改善、ハッシュ + hardlinkベースのキャッシュの仕組みへの変更に伴う一部設定の削除など。\nまた、`pnpm publish`時にGitのStageがcleanかを判定する`git-checks`がデフォルトで有効化など","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 84 Beta: Web OTP, Web Animations, New Origin Trials and More","url":"https://blog.chromium.org/2020/05/chrome-84-beta-web-otp-web-animations.html","tags":["Chrome","ReleaseNote","V8"],"content":"Chrome 84 Betaリリース。\nWeb OTP API、Web Animationsの改善。\nOrigin Trialとして非同期のCookie Stoer API、Idle Detection API、 Origin isolation、WebAssembly SIMDの追加。\nMixed ContentのAutoupgrade、CSSの`revert`キーワードのサポート、JSでは Private Methods and Accessors、WeakRefのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Resuming SameSite Cookie Changes in July","url":"https://blog.chromium.org/2020/05/resuming-samesite-cookie-changes-in-july.html","tags":["Chrome","security","news"],"content":"7月14日にリリース予定のChrome 84安定版に合わせて、一時的に停止していたSameSite Cookieのロールアウトが再開される予定","relatedLinks":[]},{"category":"Headline","title":"Pug 3.0.0 - RollingVersions - Medium","url":"https://medium.com/rollingversions/pug-3-0-0-2897d6dec294","tags":["JavaScript","template","library","ReleaseNote"],"content":"テンプレートエンジンのPug 3.0.0リリース。\nBufferに対するフィルターをサポート、`each ... of ...`構文のサポートなど","relatedLinks":[{"title":"Release pug@3.0.0 · pugjs/pug","url":"https://github.com/pugjs/pug/releases/tag/pug%403.0.0"}]},{"category":"Article","title":"Tools to measure Core Web Vitals","url":"https://web.dev/vitals-tools/","tags":["performance","Tools","browser","article"],"content":"Core Web Vitalsのメトリクスを計測するツールの紹介記事","relatedLinks":[]},{"category":"Article","title":"Detect inactive users with the Idle Detection API","url":"https://web.dev/idle-detection/","tags":["Chrome","WebPlatformAPI","article","proposal"],"content":"ユーザー/スクリーンがアクティブではない状態かを判定するAPI。\nChrome 84でOrigin Trialとして提供されている。\nuserとscreenのidle状態、変更検知ができる。利用には`notifications`のパーミッションを取得する必要がある。","relatedLinks":[]},{"category":"Article","title":"The Svelte Compiler Handbook | Tan Li Hau","url":"https://lihautan.com/the-svelte-compiler-handbook/","tags":["JavaScript","article"],"content":"Svelteのコンパイルプロセスを解説している記事。","relatedLinks":[{"title":"Compile Svelte in your head (Part 1) | Tan Li Hau","url":"https://lihautan.com/compile-svelte-in-your-head-part-1/"}]},{"category":"Article","title":"The process: Making Vue 3 – Increment: Frontend","url":"https://increment.com/frontend/making-vue-3/","tags":["Vue","article"],"content":"Vue 3の作成プロセスについての記事。\nVue 3でなぜ書き直しをしているのかやアーキテクチャの変更について","relatedLinks":[]},{"category":"SlideVideo","title":"Jamstack\\_conf\\_virtual\\_2020 - YouTube","url":"https://www.youtube.com/playlist?list=PL58Wk5g77lF8jzqp_1cViDf-WilJsAvqT","tags":["JavaScript","Conference","video"],"content":"Jamstack Conf 2020の動画一覧","relatedLinks":[{"title":"Jamstack Conf 2020 - Virtual & San Francisco","url":"https://jamstackconf.com/"}]},{"category":"SlideVideo","title":"11 years of Node: Let’s have an honest conversation - Anna Henningsen (LNUG May 2020) - YouTube","url":"https://www.youtube.com/watch?v=TthueRgvVQ4","tags":["node.js","video","slide","deno"],"content":"Node.js開発の現状について話。\nNode.jsはsmall coreと言われていたが、今は40以上のモジュールが入った巨大なリポジトリでもある。\nNode.jsのコアには非推奨となったモジュール/追加されたモジュール/レガシーなコードが混ざっている。\nそのため開発はバランスを取るのが難しく、これはESMサポートにおいても起きている。\n一方で、CollaboratorsやN-APIなどうまくいっている部分もある。\nまた、Denoとエコシステムについてなど","relatedLinks":[{"title":"11 years of Node: Let’s have an honest conversation - Google スライド","url":"https://docs.google.com/presentation/d/1zyN4JjRtIuzgSLLqUGgyu7X6fEAGNjFHBy4ZZm0ueOc/edit#slide=id.g87684983d8_0_47"}]},{"category":"WebsiteDocument","title":"Understanding client-side JavaScript frameworks - Learn web development | MDN","url":"https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks","tags":["document","JavaScript","library","tutorial"],"content":"MDNのJavaScriptフレームワークのチュートリアル。\nReact、Ember、Vueについてのチュートリアルがある","relatedLinks":[]},{"category":"WebsiteDocument","title":"deeppatel234/webpack-report: Webpack Build Analysis Plugin","url":"https://github.com/deeppatel234/webpack-report","tags":["webpack","performance","plugin"],"content":"webpackのbundleされたファイルの依存関係、ビルド時間などのビルド情報、chunkやモジュールなどのサイズのビジュアライズをしてくれるプラグイン。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"xFAANG/askql: AskQL is a query language that can express any data request","url":"https://github.com/xFAANG/askql","tags":["JavaScript","TypeScript","library","GraphQL","API"],"content":"実行できるコードをリクエストとして利用するクエリ言語。\nAskQLは、プログラミング言語ライクなクエリ(AskScript)を書いたものをコード(AskCode)に変換してサーバへ送信し、Sandbox機構をもつAskVMで実行した結果をJSONとして返す","relatedLinks":[]},{"category":"SoftwareLibrary","title":"babel/babel-polyfills: A set of Babel plugins that enable injecting different polyfills with different strategies in your compiled code.","url":"https://github.com/babel/babel-polyfills","tags":["babel","polyfill"],"content":"Babelのpolyfillエンジン。\ncore-jsやes-shimsなどpolyfillを選択できる。\npolyfillモジュールをinject方法として`entry-global`、`usage-global`、`usage-pure`をもつ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"otiai10/lookpath: The minimum and most straightforward way to check if command exists and where the executable is, WITHOUT spawning subprocess","url":"https://github.com/otiai10/lookpath","tags":["node.js","library"],"content":"`which`などのコマンドを使わずに、実行ファイルのパスを取得するNode.jsライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"divy-work/autopilot-deno: Cross-platform desktop automation library for Deno.","url":"https://github.com/divy-work/autopilot-deno","tags":["deno","Rust","library"],"content":"キーボードやマウスなどデスクトップ処理の自動化を行うDeno向けのライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"RoughNotation","url":"https://roughnotation.com/","tags":["JavaScript","library"],"content":"Underline、Box、Highlightなどを手書き風の描画をアニメーションできるライブラリ。\n手書き処理にはRoughJSを利用している","relatedLinks":[]},{"category":"Book","title":"Riot.jsで簡単Webアプリケーション開発 | 桑原 聖仁 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4863543115/","tags":["JavaScript","library","ReleaseNote"],"content":"2020年6月23日発売予定\nRiot.jsについての書籍","relatedLinks":[]}]},{"meta":{"title":"2020-06-09のJS: Firefox 77.0、HTML5 Boilerplate 8.0.0、React TypeScript Cheatsheets","author":"azu","layout":"post","date":"2020-06-09T02:47:09.211Z","category":"JSer","tags":["Firefox","HTML5","React","TypeScript"],"url":"https://jser.info/2020/06/09/firefox-77.0-html5-boilerplate-8.0.0-react-typescript-cheatsheets/"},"items":[{"category":"Headline","title":"June 2020 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/june-2020-security-releases/","tags":["node.js","security","ReleaseNote"],"content":"Node.jsのセキュリティアップデートそれぞれのバージョンがアップデートされている\n\n- Node.js v10.21.0 (LTS)\n- Node.js v12.18.0 (LTS)\n- Node.js v14.4.0 (Current)","relatedLinks":[]},{"category":"Headline","title":"New in Firefox 77: DevTool improvements and web platform updates - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/06/new-in-firefox-77-devtool-improvements-and-web-platform-updates/","tags":["Firefox","ReleaseNote"],"content":"Firefox 77リリース。\n開発者ツールのSource Mapロード時間の改善、デバッガーのステップ実行の改善、ネットワークパネルの改善など。\nまたString#replaceAllの実装、JPEG画像がExifデータに基づいて回転するように、`maxlength`以上の長さの文字列をペーストした場合に切り詰めしないように変更など","relatedLinks":[{"title":"Firefox 77 サイト互換性情報 | Firefox サイト互換性情報","url":"https://www.fxsitecompat.dev/ja/releases/77/"},{"title":"Firefox 77 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/77"},{"title":"Firefox 77.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/77.0/releasenotes/"}]},{"category":"Headline","title":"HTML5 Boilerplate 8.0.0 Released – HTML + CSS + JavaScript","url":"https://htmlcssjavascript.com/web/html5-boilerplate-8-0-0-released/","tags":["HTML5","Tools","ReleaseNote"],"content":"HTML5 Boilerplate 8.0.0リリース。\n`npx create-html5-boilerplate`の追加、Pracelを使ったサンプルの追加、jQueryの削除、レガシーIE向けのブラウザアップグレードプロンプトを削除など","relatedLinks":[]},{"category":"Headline","title":"ESLint v7.2.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2020/06/eslint-v7.2.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 7.2.0リリース。\nES2020で入る予定のNullish coalescing operatorや`import.meta`などをサポート(Optional Chainはまだ未サポート)。\n`no-extra-parens`に`enforceForFunctionPrototypeMethods`オプションの追加など","relatedLinks":[{"title":"ESLint v7.2.0 - Qiita","url":"https://qiita.com/mysticatea/items/9215050e4546c1e2d486"}]},{"category":"Headline","title":"angular.js/CHANGELOG.md at master · angular/angular.js","url":"https://github.com/angular/angular.js/blob/master/CHANGELOG.md#180-nested-vaccination-2020-06-01","tags":["Angular","ReleaseNote"],"content":"AngularJS 1.8.0リリース。\njQuery 3.5で修正されたXSSの問題に対するために、一部非互換な変更を含むセキュリティアップデート","relatedLinks":[{"title":"jQuery Core 3.5 Upgrade Guide | jQuery","url":"https://jquery.com/upgrade-guide/3.5/"}]},{"category":"Article","title":"webpackの次のバージョンで入るassetModulesの紹介 - 技術探し","url":"https://blog.hiroppy.me/entry/webpack-asset-modules","tags":["webpack","article"],"content":"webpack 5で導入される予定のAsset Modulesについて\nraw-loader. file-loader, url-loaderの代わりとなるplugin","relatedLinks":[]},{"category":"Article","title":"Securing JavaScript Modules - Agoric - Medium","url":"https://medium.com/agoric/ses-support-for-ecmascript-modules-28fc1beb709c","tags":["security","ECMAScript","JavaScript","article"],"content":"Secure EcmaScript (SES)についての記事。\nSESにおけるObject-capability model、SES shimsの実装、compartment(enviroment)について","relatedLinks":[]},{"category":"Article","title":"Case study: Analyzing Notion app performance · PerfPerfPerf","url":"https://3perf.com/blog/notion/","tags":["jacvas","performance","browser","article"],"content":"Notionのページをリバースエンジニアリングしてパフォーマンスの改善ポイントを見ていく話。\nロード関するJavaScriptコードの分離、初期化処理の遅延実行、webpackの`concatenateModules`オプション。\n利用していないコードの削除、core-jsの複数バージョンが含まれる問題、サードパーティスクリプトの遅延ロード、SSR時のstateの渡し方とscriptのpreloadについてなど","relatedLinks":[]},{"category":"Article","title":"Service Worker Lifecycle Explained | Felix Gerschau","url":"https://felixgerschau.com/service-worker-lifecycle-update/","tags":["ServiceWorker","article"],"content":"Service Workerのライフサイクルについて解説した記事","relatedLinks":[]},{"category":"Article","title":"画像による Layout Shift が無くなる Web がやって来る - mizdra's blog","url":"https://www.mizdra.net/entry/2020/05/31/192613","tags":["browser","article"],"content":"ブラウザのデフォルトスタイルシートに`aspect-ratio`の指定が入ることで、widthとheight属性に値を入れることでLayout Shiftが抑えられることについて","relatedLinks":[]},{"category":"SlideVideo","title":"大規模改修の裏でTypeScriptとテスト導入をすすめた話 - Speaker Deck","url":"https://speakerdeck.com/pittan/da-gui-mo-gai-xiu-falseli-detypescripttotesutodao-ru-wosusumetahua","tags":["JavaScript","Prototype.js","slide"],"content":"テストがないJavaScriptのコードをTypeScriptへの移行とテストコードを少しずつ追加していく話。\n段階的なTypeScriptへの移行について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Agoric/SES-shim: SES (Secure EcmaScript) is a secure runtime for executing third-party code safely","url":"https://github.com/Agoric/ses-shim","tags":["security","JavaScript","library"],"content":"SES(Secure EcmaScript)のshimライブラリ。\nオブジェクトの書き換えできなくしたり環境できなくした環境でコードを実行する機能、セキュリティモデル。\n一種のsandboxでコードを実行するための仕様の実装。","relatedLinks":[{"title":"Securing JavaScript Modules - Agoric - Medium","url":"https://medium.com/agoric/ses-support-for-ecmascript-modules-28fc1beb709c"}]},{"category":"WebsiteDocument","title":"TC39 Podcast","url":"https://tc39er.us/","tags":["TC39","podcast","ECMAScript"],"content":"ECMAScriptの策定グループであるTC39についてのPodcast","relatedLinks":[]},{"category":"WebsiteDocument","title":"React TypeScript Cheatsheets | React TypeScript Cheatsheets","url":"https://react-typescript-cheatsheet.netlify.app/","tags":["React","TypeScript","document"],"content":"TypeScript + Reactについてのドキュメント。\nコンポーネントや特定の機能における型定義の方法、型定義のパターン、TypeScriptへの移行方法などついて書かれてる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mvasilkov/assert-equal-html: Assert the equality of two HTML fragments","url":"https://github.com/mvasilkov/assert-equal-html","tags":["HTML","testing","library"],"content":"HTMLの断片同士を比較する関数。\nパーサでHTMLをパースしてその結果を比較している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"developit/redaxios: The Axios API, as an 800 byte Fetch wrapper.","url":"https://github.com/developit/redaxios","tags":["JavaScript","library","Fetch"],"content":"Fetch APIを使ったAxiosライクなAPIを実装する目的のHTTPライブラリ","relatedLinks":[]}]},{"meta":{"title":"2020-06-16のJS: Mocha 8.0.0(Parallel)、history.js 5.0.0、hegel(Type Checker)","author":"azu","layout":"post","date":"2020-06-15T15:16:17.281Z","category":"JSer","tags":["Mocha","Browser","TypeScript","Flow"],"url":"https://jser.info/2020/06/16/mocha-8.0.0parallel-history.js-5.0.0-hegeltype-checker/"},"items":[{"category":"Headline","title":"Release v8.0.0 · mochajs/mocha","url":"https://github.com/mochajs/mocha/releases/tag/v8.0.0","tags":["node.js","testing","library","ReleaseNote"],"content":"Mocha 8.0.0リリース。\nNode 10未満のサポート終了、`mocha.opts`のサポート終了、`enableTimeout()`の削除など。\n`--parallel`でパラレルテストをサポート、`--require`オプションでES Modulesを読み込めるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · ReactTraining/history","url":"https://github.com/ReactTraining/history/releases/tag/v5.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"history.js 5.0.0リリース。\nHTML5 history APIをサポートしてないブラウザのサポート終了、TypeScriptのサポート、ファイルサイズの削減など。","relatedLinks":[]},{"category":"Headline","title":"Release v1.1.0 · denoland/deno","url":"https://github.com/denoland/deno/releases/tag/v1.1.0","tags":["deno","ReleaseNote"],"content":"Deno v1.1.0 リリース。\n`deno eval -p`の追加、`deno lint`コマンドの追加、ファイルシステムのメソッドが`file:`なURLをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · rwaldron/johnny-five","url":"https://github.com/rwaldron/johnny-five/releases/tag/v2.0.0","tags":["JavaScript","IoT","library","ReleaseNote"],"content":"IoTフレームワークのjohnny-five 2.0リリース","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 108 | WebKit","url":"https://webkit.org/blog/10840/release-notes-for-safari-technology-preview-108/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 108リリース。\n`ParentNode.replaceChildren()`の実装、Async Clipboard APIで`\"image/png\"`の読み込みをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · puppeteer/puppeteer","url":"https://github.com/puppeteer/puppeteer/releases/tag/v4.0.0","tags":["Chrome","library","ReleaseNote"],"content":"Puppeteer v4.0.0リリース。\nNode.jsの`events`への依存を削除、`page.isJavaScriptEnabled()`の追加など","relatedLinks":[]},{"category":"Article","title":"小さなEventEmitterライブラリ - eventmitを書いた | Web Scratch","url":"https://efcl.info/2020/06/13/eventmit/","tags":["JavaScript","library","article"],"content":"1種類のイベントに対して1つのオブジェクトを作るEventEmitter的なライブラリについて。","relatedLinks":[{"title":"azu/eventmit: Simple EventEmitter. A single event object per an event.","url":"https://github.com/azu/eventmit"}]},{"category":"Article","title":"Introducing the MDN Web Docs Front-end developer learning pathway - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/06/introducing-the-mdn-web-docs-front-end-developer-learning-pathway/","tags":["JavaScript","mdn","document","article"],"content":"MDNのフロントエンド開発者向けのドキュメントについての紹介記事","relatedLinks":[]},{"category":"Article","title":"The complete guide to CSS media queries | Polypane browser for developers","url":"https://polypane.app/blog/the-complete-guide-to-css-media-queries/","tags":["CSS","article"],"content":"CSS Media Queryの使い方の解説。\n構文的な使い方の解説、ユースケースについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"GoogleCloudPlatform/require-so-slow: \\`require\\`s taking too much time? Profile 'em.","url":"https://github.com/GoogleCloudPlatform/require-so-slow","tags":["node.js","performance","Tools"],"content":"npmモジュールのロード時間をChrome Timeline Viewerで見られるようにプロファイルを取るツール。\nモジュール内での`require`にかかっている時間を可視化できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"JSMonk/hegel: An advanced static type checker","url":"https://github.com/JSMonk/hegel","tags":["JavaScript","TypeScript","Tools"],"content":"JavaScriptで書かれたJavaScriptの型チェッカ。\n型アノテーションを書くことで型チェックを行える。TypeScriptとは異なり静的な型チェックが通った場合に実行時エラーが出ないような実装をしている。ライブラリの型チェックにはTypeScriptの型定義ファイルを利用できる。","relatedLinks":[{"title":"What & Why | Hegel","url":"https://hegel.js.org/docs"}]},{"category":"SoftwareLibrary","title":"bcoe/http2spy: test helpers for working with Node.js' http2 module","url":"https://github.com/bcoe/http2spy","tags":["HTTP2","node.js","library","testing"],"content":"`http2`モジュールのspyライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bradtraversy/vanillawebprojects: Mini projects built with HTML5, CSS & JavaScript. No frameworks or libraries","url":"https://github.com/bradtraversy/vanillawebprojects","tags":["JavaScript","example"],"content":"ライブラリやフレームワークを使わずにHTML/JavaScript/CSSで書いたアプリケーションのサンプル集","relatedLinks":[]}]},{"meta":{"title":"2020-06-23のJS: ECMAScript 2020リリース、Bootstrap 5 alpha、Safari 14 Beta","author":"azu","layout":"post","date":"2020-06-23T02:59:04.220Z","category":"JSer","tags":["ECMAScript","Bootstrap","CSS","Safari"],"url":"https://jser.info/2020/06/23/ecmascript-2020-bootstrap-5-alpha-safari-14-beta/"},"items":[{"category":"Headline","title":"Ecma latest news","url":"https://www.ecma-international.org/news/index.html","tags":["ECMAScript","spec","ReleaseNote"],"content":"ECMAScript 2020とECMAScript 2020 Internationalization APIが正式リリース","relatedLinks":[]},{"category":"Headline","title":"Bootstrap 5 alpha! | Bootstrap Blog","url":"https://blog.getbootstrap.com/2020/06/16/bootstrap-5-alpha/","tags":["CSS","library","ReleaseNote"],"content":"Bootstrap 5αリリース。\njQueryの依存削除、IEのサポート終了、CSS Custom Propertiesでのカスタマイズの対応、formやgridの対応改善、Utilities APIの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v2.13.0 · nuxt/nuxt.js","url":"https://github.com/nuxt/nuxt.js/releases/tag/v2.13.0","tags":["Vue","library","ReleaseNote"],"content":"Nuxt.js 2.13.0リリース。\n`target: static`の追加、`.env`をビルトインサポート、`@nuxt/components`でのAuto Discoryオプションの追加など。\nまた、Nuxt.jsの利用情報を送信するようになり、オプトアウトのためのオプションの追加など","relatedLinks":[{"title":"nuxt/telemetry: Nuxt Telemetry","url":"https://github.com/nuxt/telemetry#opting-out"},{"title":"nuxt/components: Scan and auto import components for Nuxt.js 2.13+","url":"https://github.com/nuxt/components"}]},{"category":"Headline","title":"📦 Parcel 2 beta 1: improved stability, tree shaking, source map performance, and more! 🚀","url":"https://medium.com/@devongovett/parcel-2-beta-1-improved-stability-tree-shaking-source-map-performance-and-more-78179779e8b7","tags":["bundler","ReleaseNote"],"content":"Parcel 2 beta 1リリース。\nTree shakingのデフォルト有効化、Source Mapのパフォーマンス改善Content hashingの改善、モジュール解決エラーの改善など。\n非互換な変更としてはConfigの変更、サーバモードでも`dist`ディレクトリに出力するように変更、Plugin APIの変更なども含まれている","relatedLinks":[]},{"category":"Headline","title":"jspm.dev Release - jspm.org","url":"https://jspm.org/jspm-dev-release","tags":["JavaScript","module","news","cdn"],"content":"jspmのCDNとしてdev.jspm.ioの代わりとなるjspm.devが公開された。\nES Modulesに対して最適化されたCDNで、Rollupを使ってレスポンス時間が短くなるように事前に最適化している。\nパッケージのSubpathに対応、Node.jsの`export`フィールドなどに対応している","relatedLinks":[]},{"category":"Headline","title":"Dojo 7 Has Arrived","url":"https://dojo.io/blog/version-7-dojo","tags":["JavaScript","library","ReleaseNote"],"content":"Dojo 7リリース。\nWidgetsをTSXで書けるように、Custom Elements の対応改善、データとWidgetsを切り離して扱えるDojo Resourcesの追加、i18nの対応改善など","relatedLinks":[{"title":"Announcing Dojo 7 Widgets","url":"https://dojo.io/blog/version-7-dojo-widgets"}]},{"category":"Headline","title":"ESLint v7.3.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2020/06/eslint-v7.3.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 7.3.0リリース。\n新しいルールとして`no-promise-executor-return`と`no-unreachable-loop`の追加。\n設定値にJSONで扱えない値を入れると正しく動作しなくなるリグレッションが含まれるため修正バージョンもリリースされる予定。","relatedLinks":[{"title":"ESLint v7.3.0 - Qiita","url":"https://qiita.com/mysticatea/items/e155bd2fee35c22ee423"}]},{"category":"Headline","title":"vitejs/vite: Native-ESM powered web dev build tool. It's fast.","url":"https://github.com/vitejs/vite","tags":["Vue","Tools","bundler","ReleaseNote"],"content":"Vite 1.0.0βリリース","relatedLinks":[]},{"category":"Headline","title":"Safari 14 Beta Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safari-release-notes/safari-14-beta-release-notes","tags":["safari","ReleaseNote"],"content":"Safari 14ベータの変更点。\nWebExtensionsの拡張に対応、HTTP/3のサポート、Flashのサポート終了。\nJavaScriptでは、BigInt、EventTargetの継承、Public class fieldのサポート。\nCSSでは、`is()`、`:where()`、image-orientationのサポート。\nその他にはWebP、Picture in Pictureのサポートなど","relatedLinks":[{"title":"Safari Web Extensions | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safariservices/safari_web_extensions"},{"title":"Browser support for JavaScript APIs - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Browser_support_for_JavaScript_APIs"}]},{"category":"Article","title":"JavaScriptライブラリを読むときのコツ | blog.ojisan.io","url":"https://blog.ojisan.io/how-to-read-js","tags":["JavaScript","article"],"content":"JavaScriptライブラリのコードリーディングについて","relatedLinks":[]},{"category":"SlideVideo","title":"WebAssembly and the Elusive Universal Binary","url":"https://kripken.github.io/talks/2020/universal.html#/","tags":["WebAssembly","slide"],"content":"WebAssemblyでのCross PlatformなUniversal Binaryについてのスライド。","relatedLinks":[]},{"category":"SlideVideo","title":"slides/ModuleFederationWebpack5.md at master · sokra/slides","url":"https://github.com/sokra/slides/blob/master/content/ModuleFederationWebpack5.md","tags":["webpack","slide"],"content":"webpack 5で導入予定のModule Federationについてのスライド。\nFederationでの最適化や動作、既存のDLLやExternalsとの違いについて話されている","relatedLinks":[{"title":"Module Federation | webpack","url":"https://webpack.js.org/concepts/module-federation/"}]},{"category":"WebsiteDocument","title":"milesj/interweave: 🌀 React library to safely render HTML, filter attributes, autowrap text with matchers, render emoji characters, and much more.","url":"https://github.com/milesj/interweave","tags":["React","HTML","library"],"content":"HTML文字列をレンダリングできるReactコンポーネント。\n指定したタグのみを許可したり、自動リンク、絵文字の対応、SSRなどに対応している","relatedLinks":[]},{"category":"WebsiteDocument","title":"marcello3d/lascaux-sketch: Lascaux Sketch 2 is an open source web-based digital painting tool","url":"https://github.com/marcello3d/lascaux-sketch","tags":["JavaScript","WebGL","Tools"],"content":"WebGLを使ったお絵かきツール。\nJava AppletのLascaux SketchをWebGLベースに移植したもの","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mswjs/msw: Seamless REST/GraphQL API mocking library for browser and Node.","url":"https://github.com/mswjs/msw","tags":["JavaScript","browser","node.js","ServiceWorker","library","testing"],"content":"HTTPモックライブラリ。\nService Workerを使う方法、Fetch、XHR、`http`モジュールをinterceptする方法を提供している。\nリクエストに対するレスポンスを定義して、ブラウザとNode.jsでそれぞれHTTPリクエストのテストができるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"JSSpec | jsspec.github.io","url":"https://jsspec.github.io/","tags":["JavaScript","library","testing"],"content":"RSpecライクなContextを持ったテストフレームワーク。\n`subject`というグローバル変数に対してテストのコンテキストを割り当ててテストコードを書けるようになっている。","relatedLinks":[]}]},{"meta":{"title":"2020-06-30のJS: Angular 10、TypeScript 4.0 Beta、Safari 14の変更点(Tracking Prevention)","author":"azu","layout":"post","date":"2020-06-29T15:29:41.875Z","category":"JSer","tags":["Angular","TypeScript","Safari"],"url":"https://jser.info/2020/06/30/angular-10-typescript-4.0-beta-safari-14tracking-prevention/"},"items":[{"category":"Headline","title":"Version 10 of Angular Now Available - Angular Blog","url":"https://blog.angular.io/version-10-of-angular-now-available-78960babd41","tags":["Angular","ReleaseNote"],"content":"Angular 10.0.0リリース。\nAngular MaterialにDate Range Pickerの追加。\nCommonJSを取り込むと警告がでるように、`ng new`に`--strict`オプションの追加、TypeScript 3.9へのアップデート、デフォルトのbrowserslistsの更新など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.0 Beta | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-0-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.0 Betaリリース。\nVariadic Tuple Types、Labeled Tuple Elements、コンストラクタからClass Propertyの推論ができるように。\n`catch`節の変数が`any`から`unknown`に変更。\nStage 3のlogical assignmentをサポート、`jsxFragmentFactory`オプションのサポート、VSCodeでPartial Editing Modeのサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 109 with Safari 14 Features | WebKit","url":"https://webkit.org/blog/10875/release-notes-for-safari-technology-preview-109-with-safari-14-features/","tags":["safari","ReleaseNote"],"content":"Safari Technology 109リリース。\nSafari 14の変更も含まれる。\nWebExtensions、Private report、Web Authentication、private class fieldsのサポート。\nFlashのサポート終了など。","relatedLinks":[{"title":"Safari 14 Beta Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safari-release-notes/safari-14-beta-release-notes"}]},{"category":"Headline","title":"hapi.js on Twitter: \"Some un-hapi and joi-less news...\" / Twitter","url":"https://twitter.com/hapijs/status/1275887984114413569","tags":["node.js","server","library","news"],"content":"Node.jsフレームワークであるhapiのコア開発者がhapiの開発を終了するという宣言をした。","relatedLinks":[{"title":"Slack | end | hapi hour","url":"https://app.slack.com/client/T6ATU7T16/C015JQPME23/thread/C015JQPME23-1593110366.302100"},{"title":"hapi.dev - The simple, secure framework developers trust","url":"https://hapi.dev/"}]},{"category":"Article","title":"Async Clipboard API | WebKit","url":"https://webkit.org/blog/10855/async-clipboard-api/","tags":["safari","article"],"content":"Safari 13.1でサポートされたAsync Clipboard APIについて。\nクリップボードの読み書き、Security/Privacyにおける制限について","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 85)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2020/06/devtools","tags":["Chrome","article"],"content":"Chrome 85の開発者ツールの変更点について。\nCSSOM経由で追加されたCSSを編集に対応、Lighthouse 6にアップデート、App shortcutsについての警告に対応、`respondWith`がTimingタブに表示。\nパフォーマンスパネルにJavaScriptのコンパイルキャッシュの情報を表示するようになるなど","relatedLinks":[]},{"category":"Article","title":"Refactoring optional chaining into a large codebase: lessons learned – Lea Verou","url":"https://lea.verou.me/2020/06/refactoring-optional-chaining-into-a-large-codebase-lessons-learned/","tags":["JavaScript","article","refacoring"],"content":"ES2020で入ったOptional Chainingを使ったリファクタリングについて。\nOptional Chainingに書き換えできるパターン、書き換えてはいけないパターンについてなど","relatedLinks":[]},{"category":"Article","title":"Reactのレンダリングに関する完全ガイド - Qiita","url":"https://qiita.com/hellokenta/items/6b795501a0a8921bb6b5","tags":["React","article","translate"],"content":"Complete Guide to React Rendering Behaviorの翻訳。\nレンダリングとコミットのフェーズ、レンダリングの動作、パフォーマンスの測定、再レンダリングのタイミングについてなど","relatedLinks":[{"title":"Blogged Answers: A (Mostly) Complete Guide to React Rendering Behavior · Mark's Dev Blog","url":"https://blog.isquaredsoftware.com/2020/05/blogged-answers-a-mostly-complete-guide-to-react-rendering-behavior/"}]},{"category":"Article","title":"Tracking Prevention in WebKit | WebKit","url":"https://webkit.org/tracking-prevention/","tags":["safari","privacy","security"],"content":"Safariのトラッキング防止について解説しているドキュメント。\nFirst-Party、Third-PartyでのCookie、Storageの制限、Fingerprintingに利用できるため実装しないWeb API、ITPについてなど","relatedLinks":[{"title":"Tracking Prevention Policy | WebKit","url":"https://webkit.org/tracking-prevention-policy/"}]},{"category":"SlideVideo","title":"webpack 5 Miniseries - Tobias Koppers, webpack - YouTube","url":"https://www.youtube.com/watch?v=3c-RFpaiUT8&list=PLyspMSh4XhLP-mqulUMcaqTbLo-ZJxSX5&index=34&t=0s","tags":["webpack","video"],"content":"webpack 5の変更についての紹介動画。\n自動的なNode.jsのpolyfillの削除、生成コードのESバージョンを選択、ビルドのパフォーマンスやキャッシュの改善、最適化の改善やログの改善、Module Federationについてなど","relatedLinks":[]},{"category":"SlideVideo","title":"OpenJS World 2020 - YouTube","url":"https://www.youtube.com/playlist?list=PLyspMSh4XhLP-mqulUMcaqTbLo-ZJxSX5","tags":["JavaScript","video","Conference"],"content":"OpenJS World 2020の動画一覧","relatedLinks":[{"title":"OpenJS World | Linux Foundation Events","url":"https://events.linuxfoundation.org/openjs-world/"}]},{"category":"SoftwareLibrary","title":"ealush/vest: Vest - effortless validations","url":"https://github.com/ealush/vest","tags":["JavaScript","library"],"content":"バリデーションライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nastyox/Rando.js: The world's easiest, most powerful random function.","url":"https://github.com/nastyox/Rando.js","tags":["JavaScript","library"],"content":"指定範囲のランダムな値を生成するライブラリ。","relatedLinks":[]},{"category":"Book","title":"Talking TypeScript with the engineer who leads the team - Stack Overflow Blog","url":"https://stackoverflow.blog/2020/06/15/talking-typescript-with-ryan-cavanaugh/","tags":["TypeScript","Interview","Microsoft"],"content":"TypeScriptのプロジェクトリードであるRyan Cavanaughのインタビュー。\n作られた理由、Angularでの採用がターニングポイント、チーム構成、エディタとコンパイラサービス、JavaScriptのエコシステムについて","relatedLinks":[]}]},{"meta":{"title":"2020-07-06のJS: Firefox 78、Vue 3 Statusとリリーススケジュール","author":"azu","layout":"post","date":"2020-07-06T13:25:56.945Z","category":"JSer","tags":["Firefox","Vue"],"url":"https://jser.info/2020/07/06/firefox-78-vue-3-status/"},"items":[{"category":"Headline","title":"Release v1.0.0-beta.1 · vuejs/composition-api","url":"https://github.com/vuejs/composition-api/releases/tag/v1.0.0-beta.1","tags":["Vue","library","ReleaseNote"],"content":"Vue 2向けのComposition API実装である@vue/composition-api 1.0.0 beta  1リリース","relatedLinks":[]},{"category":"Headline","title":"New in Firefox 78: DevTools improvements, new regex engine, and abundant web platform updates - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/06/new-in-firefox-78/","tags":["Firefox","ReleaseNote"],"content":"Firefox 78リリース。ESRの更新バージョン。\nコンソールにPromiseのエラーをより詳細に表示、ネットワークパネルでリクエストの失敗理由の表示などの開発者ツールの改善。\nCSSの`:is`と`:where`のサポート、`:read-only`と`:read-write`のprefixなしをサポート。\n正規表現のNamed Cature Groupsをサポート、`ParentNode.replaceChildren`のサポート。\nTLS 1.0と1.1をデフォルトで無効化など","relatedLinks":[{"title":"Firefox 78.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/78.0/releasenotes/"},{"title":"Firefox 78 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/docs/Mozilla/Firefox/Releases/78"}]},{"category":"Headline","title":"Release v0.14.0 · video-dev/hls.js","url":"https://github.com/video-dev/hls.js/releases/tag/v0.14.0","tags":["HLS","JavaScript","library","ReleaseNote"],"content":"hls.js 0.14.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Node v14.5.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v14.5.0/","tags":["node.js","ReleaseNote"],"content":"Node v14.5.0リリース。\nV8 8.3へアップデート、`EventTarget`を試験的に実装など","relatedLinks":[]},{"category":"Headline","title":"V8 release v8.4 · V8","url":"https://v8.dev/blog/v8-release-84","tags":["V8","ReleaseNote"],"content":"V8 8.4(Chrome 84)リリース。\nWebAssembly SIMD APIがOrigin Trialで利用できるように、`WeakRef`のサポート、Private methodsとaccessorsのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · puppeteer/puppeteer","url":"https://github.com/puppeteer/puppeteer/releases/tag/v5.0.0","tags":["Chrome","Tools","ReleaseNote"],"content":"Puppeteer v5.0.0リリース。\n`page.emulateMedia`を `page.emulateMediaType`に変更。\nDirect requireを削除し、オブジェクトとして読み込むように変更など","relatedLinks":[]},{"category":"Headline","title":"Release Version 6.0.0 · react-hook-form/react-hook-form","url":"https://github.com/react-hook-form/react-hook-form/releases/tag/v6.0.0","tags":["React","library","ReleaseNote"],"content":"React Hook Form 6.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Vue 3: mid 2020 status update · Issue #183 · vuejs/rfcs","url":"https://github.com/vuejs/rfcs/issues/183","tags":["Vue","news"],"content":"Vue 3のステータスについて。\n7月にRC、8月に正式リリースの予定。","relatedLinks":[]},{"category":"Headline","title":"Release 3.10.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v3.10.0","tags":["node.js","testing","library","ReleaseNote"],"content":"AVA 3.10.0リリース。\n`.only()`を利用中にスナップショットをアップデートしないように、`t.timeout`にメッセージオプションを追加、`t.try()`や`t.snapshot()`がhook中に実行できないように修正など","relatedLinks":[]},{"category":"Article","title":"Sign-in form best practices","url":"https://web.dev/sign-in-form-best-practices/","tags":["HTML","accessibility","article"],"content":"`<form>`/`<input>`/`<label>`/`<button>`を使ったフォーム作成についてチェックリスト的な記事","relatedLinks":[]},{"category":"Article","title":"Creating an Application Performance Monitor Using Node 14 New and Experimental Features | Medium","url":"https://medium.com/@erickwendel/node-v14-x-is-up-deep-diving-into-new-features-ace6dd89ac0b","tags":["node.js","article"],"content":"Node.js 14で利用できるExperimentalな機能を使ってアプリケーションのモニタリングをするAgentを作るという話。\nAsync Local Storage、Diagnostic Reportsについて","relatedLinks":[]},{"category":"SlideVideo","title":"web.dev LIVE","url":"https://web.dev/live/","tags":["Conference","video","google","Chrome"],"content":"web.devのセッション動画まとめ。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Overview | Tooling.Report","url":"https://bundlers.tooling.report/","tags":["bundler","Tools","document"],"content":"browserify, parcel, rollup, webpackなどのbundlerの機能比較サイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"preactjs/compressed-size-action: GitHub Action that adds compressed size changes to your PRs.","url":"https://github.com/preactjs/compressed-size-action","tags":["Github","Actions","library","node.js","npm"],"content":"JavaScriptファイルのビルドサイズの変更を通知するGitHub Actions。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tom-sherman/immurl: 🔗 A tiny immutable URL library, backed by the native whatwg URL.","url":"https://github.com/tom-sherman/immurl","tags":["JavaScript","URL","library"],"content":"`URL`のimmutable版","relatedLinks":[]},{"category":"SoftwareLibrary","title":"antfu/vue-demi: 🎩 Creates Universal Library for Vue 2 & 3","url":"https://github.com/antfu/vue-demi","tags":["Vue","library"],"content":"Vue2と3に対応したライブラリを作成するためのライブラリ。\nVue2と3に互換性がないためどちらにも対応したライブラリを作るためのツールキット的なライブラリ","relatedLinks":[{"title":"Make Libraries Working with Vue 2 and 3 - Anthony Fu","url":"https://antfu.me/posts/make-libraries-working-with-vue-2-and-3/"},{"title":"Vue 3: mid 2020 status update · Issue #183 · vuejs/rfcs","url":"https://github.com/vuejs/rfcs/issues/183#issuecomment-651944231"}]},{"category":"Book","title":"はじめに - サバイバルTypeScript","url":"https://book.yyts.org/","tags":["TypeScript","document","ebook"],"content":"プログラミング経験のある人がTypeScriptを学ぶことを目的とした書籍","relatedLinks":[]}]},{"meta":{"title":"2020-07-14のJS: fastify 3.0.0、The future of hapi、Malina.js、Solid.js","author":"azu","layout":"post","date":"2020-07-14T02:29:59.970Z","category":"JSer","tags":["Node.js"],"url":"https://jser.info/2020/07/14/fastify-3.0.0-the-future-of-hapi-malina.js-solid.js/"},"items":[{"category":"Headline","title":"Grunt 1.2.0 released - Grunt: The JavaScript Task Runner","url":"https://gruntjs.com/blog/2020-07-03-grunt-1.2.0-released","tags":["Grunt","ReleaseNote"],"content":"Grunt 1.2.0リリース。\nプラグインの読み込みが`require.resolve`ベースで行えるように、CoffeeScriptの依存を削除、長いコマンド名での無限ループのバグを修正など","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · fastify/fastify","url":"https://github.com/fastify/fastify/releases/tag/v3.0.0","tags":["node.js","server","library","ReleaseNote"],"content":"Fastify v3リリース。\nExpress middlewareを使う場合は`fastify-express`プラグインを使うように、loggerのserializersのシグネチャーの変更、TypeScriptの型定義の変更など","relatedLinks":[{"title":"Fastify v3 released - Fastify - Medium","url":"https://medium.com/@fastifyjs/fastify-v3-released-da4601d79a5"}]},{"category":"Headline","title":"Yarn 2.1 🐱‍🏍 Git Workspaces, Focused Installs, Loose mode, Live Playground, ... - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/arcanis/yarn-2-1-git-workspaces-focused-installs-loose-mode-live-playground-4kfc","tags":["yarn","ReleaseNote"],"content":"Yarn 2.1リリース。\n`node_modules`を使うインストールの互換性改善、`git:` protocolの対応改善、`package-lock.json`などからどのパッケージマネージャかを判定するように。","relatedLinks":[]},{"category":"Headline","title":"The future of the hapi project · Issue #4113 · hapijs/hapi","url":"https://github.com/hapijs/hapi/issues/4113","tags":["node.js","issue","news"],"content":"現在のコアメンテナーが今年でメンテナンス終了を予定しているhapiの今後について。\nhapiのTechnical Steering Committee (TSC)を設立して、コミュニティでメンテナンスしていく方針について。\nメンテナーがTSCに移ったら新しいmajorバージョンをリリースする予定","relatedLinks":[{"title":"The future of the hapi project, a prelude · Issue #4111 · hapijs/hapi","url":"https://github.com/hapijs/hapi/issues/4111"}]},{"category":"Headline","title":"Release v1.2.0 · denoland/deno","url":"https://github.com/denoland/deno/releases/tag/v1.2.0","tags":["deno","ReleaseNote"],"content":"Deno 1.2.0リリース。\n`deno bundle`でlock fileのサポート、\nUser-timing　APIベースの`performance` APIの追加、`deno info --json`のサポートなど","relatedLinks":[]},{"category":"Article","title":"Introducing the Storage Access API - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2020/07/08/introducing-storage-access-api/","tags":["Chrome","MSEdge","article"],"content":"ストレージへのアクセス権限を持っているかを判定、許諾を得るStorage Access APIについて。\n`hasStorageAccess()`でのアクセスチェック、`requestStorageAccess()`でのリクエストについて。\nまたiframeの`sandbox`属性や、許諾ダイアログについてなど","relatedLinks":[]},{"category":"Article","title":"Dates and Times in JavaScript – Igalia Compilers Team","url":"https://blogs.igalia.com/compilers/2020/06/23/dates-and-times-in-javascript/","tags":["ECMAScript","JavaScript","spec","library","article"],"content":"現在Stage 2のECMAScript ProposalであるTemporalについて。\nDateとTimeの扱いを改善する目的の新しいビルトインオブジェクトで、実際のユースケースに適しているかのフィードバックを募集しているという話。","relatedLinks":[{"title":"Temporal documentation","url":"https://tc39.es/proposal-temporal/docs/index.html"},{"title":"tc39/proposal-temporal: Provides standard objects and functions for working with dates and times.","url":"https://github.com/tc39/proposal-temporal"}]},{"category":"WebsiteDocument","title":"Perf Track","url":"https://perf-track.web.app/","tags":["JavaScript","performance","Tools","library"],"content":"HTTP ArchiveとChrome UX Reportのデータを元にしたフレームワークごとのサイトデータのまとめ。\nAngular、Vue、ReactなどのフレームワークごとにWeb Vitalsの値、サイトのJavaScript/画像のサイズなどを一覧できる","relatedLinks":[]},{"category":"WebsiteDocument","title":"FontCDN: Search and Proxy for Google web fonts","url":"https://fontcdn.toolforge.org/","tags":["fonts","webservice","cdn"],"content":"Wikimediaのweb fonts CDNサービス","relatedLinks":[]},{"category":"WebsiteDocument","title":"Skypack","url":"https://www.skypack.dev/","tags":["JavaScript","cdn","library"],"content":"JavaScript Package CDNサービス。\n元Pika CDN。\nnpmパッケージをES Moudulesとして読み込めるCDN。\nパッケージバージョンの指定、minifyなどの最適化したビルドの配布、UAに合わたtranspileとpolyfillを含めたビルドの配布などができる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Foal TS - Node.JS and TypeScript framework for building web applications","url":"https://foalts.org/","tags":["node.js","TypeScript","library"],"content":"Node.jsフレームワーク。\nDecoratorを使ったルーティング、バリデーション、DI、TypeORMを使ったDBなどをもつHTTPサーバフレームワーク","relatedLinks":[{"title":"TypeORM","url":"https://github.com/typeorm/typeorm"}]},{"category":"SoftwareLibrary","title":"malinajs/malinajs: Frontend compiler, inspired by Svelte","url":"https://github.com/malinajs/malinajs","tags":["JavaScript","Tools","library"],"content":"SvelteライクなJavaScriptにコンパイルされるUIフレームワーク。\nSvelteとは異なる変更検知の仕組みやDOM更新の仕組みを使う","relatedLinks":[{"title":"I created the same app in Svelte.js and Malina.js. Here are the differences. | by Oleg Nechaev | JavaScript In Plain English | Jul, 2020 | Medium","url":"https://medium.com/javascript-in-plain-english/svelte-js-and-malina-js-b33c55253271"}]},{"category":"SoftwareLibrary","title":"ryansolid/solid: A declarative, efficient, and flexible JavaScript library for building user interfaces.","url":"https://github.com/ryansolid/solid","tags":["JavaScript","library","Tools","React","jsx","TypeScript"],"content":"JSXで書いてDOM APIを使ったRuntimeで動かすUIフレームワークとコンパイラ。\nReact HooksライクなReactivityやControl Flowを扱うComponentを持っている。","relatedLinks":[{"title":"Why SolidJS: Do we need another JS UI Library? - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/ryansolid/why-solidjs-do-we-need-another-js-ui-library-1mdc"}]},{"category":"Book","title":"Make smaller, faster and more secure native apps | Tauri Studio","url":"https://tauri.studio/","tags":["Rust","JavaScript","Electron"],"content":"WebViewを使ったデスクトップアプリケーションフレームワーク。\nHTML、JS、CSSを使ったフロントエンドとRustを使ったバックエンドでアプリケーションを作成できる。","relatedLinks":[{"title":"Creating Tiny Desktop Apps With Tauri And Vue.js — Smashing Magazine","url":"https://www.smashingmagazine.com/2020/07/tiny-desktop-apps-tauri-vuejs/"}]}]},{"meta":{"title":"2020-07-21のJS: Chrome 84(SameSite Cookie)、Vue 3 RC、React Spectrum","author":"azu","layout":"post","date":"2020-07-21T02:20:24.850Z","category":"JSer","tags":["Chrome","Vue","React"],"url":"https://jser.info/2020/07/21/chrome-84samesite-cookie-vue-3-rc-react-spectrum/"},"items":[{"category":"Headline","title":"New in Chrome 84  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2020/07/nic84","tags":["Chrome","ReleaseNote"],"content":"Chrome 84リリース。\nContent Indexing API、Wake lock API、`WeakRef`のサポート。\nOrigin trialsとしてIdle detection、Web Assembly SIMDのサポート。\nSame Site Cookieのロールアウトの再開、TLS 1.0と1.1のサポートの削除など","relatedLinks":[{"title":"V8 release v8.4 · V8","url":"https://v8.dev/blog/v8-release-84"},{"title":"Chromium Blog: Chrome 84 Beta: Web OTP, Web Animations, New Origin Trials and More","url":"https://blog.chromium.org/2020/05/chrome-84-beta-web-otp-web-animations.html"}]},{"category":"Headline","title":"Vue 3 is now in RC! · Issue #189 · vuejs/rfcs","url":"https://github.com/vuejs/rfcs/issues/189","tags":["Vue","library","ReleaseNote"],"content":"Vue 3 RCリリース。\nマイグレーションガイドも合わせて公開されている。","relatedLinks":[{"title":"Introduction | Vue.js","url":"https://v3.vuejs.org/guide/migration/introduction.html"}]},{"category":"Headline","title":"Release 2.0.0 · naver/billboard.js","url":"https://github.com/naver/billboard.js/releases/tag/2.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"D3.jsベースのチャートライブラリであるbillboard.js 2.0.0リリース。\nTypeScriptでの書き直し、ファイルサイズとパフォーマンスの改善、一部オプションのシグネチャーの変更、`.transform()`の非推奨化など","relatedLinks":[{"title":"📊 billboard.js 2.0 is out! 🎉🎊, more smaller and faster. | by Jae Sung Park | Jul, 2020 | Medium","url":"https://medium.com/@alberto.park/billboard-js-2-0-is-out-15e84b52ab11"},{"title":"CHANGELOG v2 · naver/billboard.js Wiki","url":"https://github.com/naver/billboard.js/wiki/CHANGELOG-v2"}]},{"category":"Headline","title":"ESLint v7.5.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2020/07/eslint-v7.5.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 7.5.0リリース。\nOptional Chainingのサポート、`id-blacklist`を非推奨化し`id-denylist`に変更など","relatedLinks":[]},{"category":"Headline","title":"Announcing the Release of Apollo Client 3.0 - Apollo Blog","url":"https://www.apollographql.com/blog/announcing-the-release-of-apollo-client-3-0/","tags":["GraphQL","JavaScript","library"],"content":"GraphQL ClientのApollo Client 3.0リリース。\n`InMemoryCache`に`evict()`や`gc()`などを追加、`makeVar`によるReactive variablesの追加など。","relatedLinks":[{"title":"Release 3.0.0 · apollographql/apollo-client","url":"https://github.com/apollographql/apollo-client/releases/tag/v3.0.0"}]},{"category":"Article","title":"Generating UUIDs at scale on the Web | by Matthieu Wipliez | Teads Engineering | Jul, 2020 | Medium","url":"https://medium.com/teads-engineering/generating-uuids-at-scale-on-the-web-2877f529d2a2","tags":["JavaScript","article"],"content":"クライアントサイトでのUUID生成について。\n`URL.createObjectURL`と`crypto.getRandomValues`を使ったランダムなUUIDの生成とcollisionについて","relatedLinks":[]},{"category":"Article","title":"Dynamic CSS Components Without JavaScript: Every Layout","url":"https://every-layout.dev/blog/css-components/","tags":["CSS","article"],"content":"style属性でCSS Custom Propertyを指定することで、CSSに対して値を渡す方法について。","relatedLinks":[{"title":"なぜ私たちはCSSフレームワークを使わないのか - Scott Tolinksi氏、Reactive Conf","url":"https://www.infoq.com/jp/news/2020/07/css-variables-design-systems/"}]},{"category":"Article","title":"eslint-plugin-vue で来たる Vue.js 3 のリリースに備えよう - BASE開発チームブログ","url":"https://devblog.thebase.in/entry/2020/07/16/141446","tags":["ESLint","Vue","article"],"content":"ESLintを使ったVue 3の対応チェックについて。\nVueで非推奨となった機能やVue3で廃止される機能をESLintでチェックする話","relatedLinks":[]},{"category":"WebsiteDocument","title":"adobe/react-spectrum: A collection of libraries and tools that help you build adaptive, accessible, and robust user experiences.","url":"https://github.com/adobe/react-spectrum","tags":["React","library","accessibility","i18n","Keyboard"],"content":"WAI-ARIAとコンポーネントの状態管理をするReact Hooks、AdobeのデザインシステムのReactコンポーネントの実装のライブラリ。\nWAI-ARIAやキーボード操作などのアクセシビリティ、i18の仕組みなどを提供することが目的","relatedLinks":[{"title":"React Spectrum","url":"https://react-spectrum.adobe.com/index.html"}]},{"category":"WebsiteDocument","title":"richardanaya/tour\\_of\\_rust: A tour of rust's language features","url":"https://github.com/richardanaya/tour_of_rust","tags":["WebAssembly","tutorial"],"content":"WebAssemblyのツアー式チュートリアル","relatedLinks":[]},{"category":"WebsiteDocument","title":"iamakulov/awesome-webpack-perf: A curated list of webpack tools for web performance","url":"https://github.com/iamakulov/awesome-webpack-perf","tags":["webpack","plugin","performance"],"content":"webpackのパフォーマンス関係のプラグイン、Loaderのまとめ。\n最適化を行うloaderやbundleの分析を行うプラグインなどをまとめたもの","relatedLinks":[]},{"category":"WebsiteDocument","title":"Zizzamia/perfume.js: Web performance library for measuring all User-centric performance metrics","url":"https://github.com/zizzamia/perfume.js","tags":["JavaScript","performance","library"],"content":"ブラウザのさまざまなパフォーマンスメトリクスを取得できるJavaScriptライブラリ。\nNavigation Timing、Element Timing、Web Vitalsなどに対応している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"breejs/bree: Bree is the best job scheduler for Node.js with support for cron, dates, ms, later, and human-friendly strings. Uses workers and spawns sandboxed processes. Supports async/await, retries, throttling, concurrency, and cancelable jobs (graceful shutdown). Simple, fast, and the most lightweight tool for the job. Made for Forward Email and Lad.","url":"https://github.com/breejs/bree","tags":["node.js","library"],"content":"Node.jsのjob scheduler/cron処理ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"getify/moduloze: Convert CommonJS (CJS) modules to UMD and ESM formats","url":"https://github.com/getify/moduloze","tags":["node.js","module","Bluetooth"],"content":"CommonJSをUMDとES Modulesに変換するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lukeed/dequal: A tiny (305B) utility for check for deep equality","url":"https://github.com/lukeed/dequal","tags":["JavaScript","library"],"content":"deep-equalライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lukeed/klona: A tiny (423B) and fast utility to \"deep clone\" Objects, Arrays, Dates, RegExps, and more!","url":"https://github.com/lukeed/klona","tags":["JavaScript","library"],"content":"deep-cloneライブラリ","relatedLinks":[]},{"category":"Book","title":"Building Micro-Frontends: the book - Building Micro-Frontends","url":"https://www.buildingmicrofrontends.com/","tags":["MicroFrontend","book"],"content":"MicroFrontendについての書籍。\nDAZNでのMicroFrontendアーキテクチャについて","relatedLinks":[]}]},{"meta":{"title":"2020-07-28のJS: SvelteのTypeScriptサポート、Chrome 85 beta、Web Speed Hackathon Online","author":"azu","layout":"post","date":"2020-07-28T02:42:16.641Z","category":"JSer","tags":["TypeScript","Chrome","Performance"],"url":"https://jser.info/2020/07/28/sveltetypescript-chrome-85-beta-web-speed-hackathon-online/"},"items":[{"category":"Headline","title":"Node v14.6.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v14.6.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 14.6.0リリース。\n`imports` fieldの実装、`vm`に`microtaskMode`オプションの追加、`fs`のfile descriptorに`trackUnmanagedFds`オプションの追加など","relatedLinks":[{"title":"module: package ","url":"https://github.com/nodejs/node/pull/34117"}]},{"category":"Headline","title":"Svelte <3 TypeScript","url":"https://svelte.dev/blog/svelte-and-typescript","tags":["Svelte","TypeScript","ReleaseNote"],"content":"SvelteのTypeScriptサポート。\nテンプレートにTypeScriptで書けるようになり、型チェックが行える。\nエディタはLSPを使ったサポートを実装している","relatedLinks":[]},{"category":"Headline","title":"wixplosives/pleb: a casual publisher","url":"https://github.com/wixplosives/pleb","tags":["npm","Tools"],"content":"monorepoのnpm publishで行うツール。\ngitコミットハッシュベースのcanaryリリースを行うこともできる","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2020-07 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2020/07/26/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2020-07のTC39ミーティングでステータスが変わったECMAScript Proposalのまとめ。\n`Promise.any`、WeakRefs、Logical Assignment Operators、Numeric separatorsがStage 4となりES2021に入る予定","relatedLinks":[]},{"category":"Headline","title":"V8 release v8.5 · V8","url":"https://v8.dev/blog/v8-release-85","tags":["V8","ReleaseNote"],"content":"V8 8.5リリース。\nStage 4の`Promise.any`と`AggregateError`、String#replaceAll、Logical assignment operatorsの実装。\nWebAssemblyでMulti-valueのサポート、BigIntsの値を渡せるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 85: Upload Streaming, Human Interface Devices, Custom Properties with Inheritance and More","url":"https://blog.chromium.org/2020/07/chrome-85-upload-streaming-human.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 85 beta リリース。\nOrigin TrialとしてFetch upload streaming、WebHID、Declarative Shadow DOM、Portalsのサポート。\nMixed Contentの画像に関するAutoupgradeの追加、AVIFフォーマットのサポート、CSSの`content-visibility`、`counter-set`プロパティのサポート。\n`color-scheme`プロパティの`only`を削除、Referrer Policyのデフォルト値を`strict-origin-when-cross-origin`に変更。Cookieで`Secure`属性がない`SameSite=None`のサポート終了など","relatedLinks":[]},{"category":"Headline","title":"Release 3.11.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v3.11.0","tags":["node.js","testing","ReleaseNote","library"],"content":"AVA 3.11.0リリース。\n`t.like()` assertionの追加。","relatedLinks":[]},{"category":"Headline","title":"Wiki.js","url":"https://wiki.js.org/","tags":["wiki","node.js","webservice","library"],"content":"Node.js製のWikiエンジン","relatedLinks":[]},{"category":"Article","title":"HTML5 Worker Test","url":"https://html5workertest.com/","tags":["webworker","browser"],"content":"WebWorkerで利用できるAPIについてブラウザごとにまとめた対応表","relatedLinks":[]},{"category":"Article","title":"TypeScript Contribution Diary: // @ts-expect-error | Goldblog","url":"http://blog.joshuakgoldberg.com/ts-expect-error/","tags":["TypeScript","article"],"content":"`@ts-expect-error`をどのように実装したのかについて","relatedLinks":[]},{"category":"Article","title":"Web Speed Hackathon Online 出題のねらいと解説 · CyberAgentHack/web-speed-hackathon-online Wiki","url":"https://github.com/CyberAgentHack/web-speed-hackathon-online/wiki/Web-Speed-Hackathon-Online-%E5%87%BA%E9%A1%8C%E3%81%AE%E3%81%AD%E3%82%89%E3%81%84%E3%81%A8%E8%A7%A3%E8%AA%AC","tags":["performance","article","webpack","babel","CSS"],"content":"ウェブアプリケーションのパフォーマンス改善ハッカソンの解説。\nフロントエンド、バックエンド、ビルド処理での最適化についてハッカソンのアプリを題材に解説している","relatedLinks":[{"title":"CyberAgentHack/web-speed-hackathon-online","url":"https://github.com/CyberAgentHack/web-speed-hackathon-online"}]},{"category":"Article","title":"A Mental Model to think in Typescript","url":"https://leandrotk.github.io/tk/2020/07/a-mental-model-to-think-in-typescript/","tags":["TypeScript","article"],"content":"TypeScriptの型システム、コンパイルエラーとランタイムエラーの違いについてなどについて解説している記事","relatedLinks":[]},{"category":"WebsiteDocument","title":"Create App - your tool for starting a new webpack or Parcel project","url":"https://createapp.dev/","tags":["JavaScript","Tools","webpack"],"content":"webpackやparcelの設定ジェネレータ。\n使いたいJavaScriptやCSSのフレームワーク、Lintツールなどを選択するとそれを導入できるwebpackやparcelの設定ファイルを出力してくれるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"returntocorp/semgrep: Lightweight static analysis for many languages. Find bug variants with patterns that look like source code.","url":"https://github.com/returntocorp/semgrep","tags":["console","Tools","search"],"content":"ASTベースのコード検索ツール。\nPython/JavaScript/Go/Java/C/JSONなどに対してパターンマッチでの検索ができる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"hugojosefson/minimum-node-version: Figures out the lowest version of Node.js that satisfies engines.node in package.json.","url":"https://github.com/hugojosefson/minimum-node-version","tags":["node.js","Tools"],"content":"依存してるライブラリの`engines`フィールドを満たす最小のNode.jsバージョンを検索するツール","relatedLinks":[]}]},{"meta":{"title":"2020-08-04のJS: Firefox 79、Babel 7.11.0、Speculation in JavaScriptCore","author":"azu","layout":"post","date":"2020-08-04T02:14:59.068Z","category":"JSer","tags":["Firefox","Babel","WebKit","JavaScriptCore"],"url":"https://jser.info/2020/08/04/firefox-79-babel-7.11.0-speculation-in-javascriptcore/"},"items":[{"category":"Headline","title":"Firefox 79: The safe return of shared memory, new tooling, and platform updates - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/07/firefox-79/","tags":["Firefox","relre"],"content":"Firefox 79リリース。\n非同期処理のスタックトレースのサポート、デバッガの改善。\n`target=_blank`のリンクに対して暗黙的に`rel=noopener`を同じ処理をするように、`crossOriginIsolated`が有効の場合に`SharedArrayBuffer`が利用可能に。\nStage 4の`Promise.any`、Logical assignment、WeakRefのサポート。\nWebAssemblyのBulk memory operations、Reference types、Threads のサポートなど","relatedLinks":[{"title":"Firefox 79.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/79.0/releasenotes/"},{"title":"Firefox 79 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/docs/Mozilla/Firefox/Releases/79"}]},{"category":"Headline","title":"Safely reviving shared memory - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/07/safely-reviving-shared-memory/","tags":["Firefox","security","JavaScript"],"content":"FirefoxでSpectreへの対応として無効になっていた`SharedArrayBuffer`が再度利用できるようになる話。\nプロセス分離、`Cross-Origin-Opener-Policy`と`Cross-Origin-Embedder-Policy`でCross-origin isolationについて。","relatedLinks":[{"title":"Why you need ","url":"https://web.dev/why-coop-coep/"}]},{"category":"Headline","title":"7.11.0 Released: ECMAScript 2021 support in preset-env, TypeScript 4.0 support, printing config and the future of \\`babel-eslint\\` · Babel","url":"https://babeljs.io/blog/2020/07/30/7.11.0","tags":["babel","ReleaseNote"],"content":"Babel 7.11.0リリース。\n`@babel/preset-env`がStage 4となったProposalのLogical Assignment、Numeric Separatorのサポート、TypeScript 4.0で追加される構文のサポート。\nStage 1のDecimal Literalをサポート、`BABEL_SHOW_CONFIG_FOR`での設定出力をサポート、`babel-eslint`が`@babel/eslint-parser`に移動など","relatedLinks":[]},{"category":"Headline","title":"Snowpack 2.7","url":"https://www.snowpack.dev/posts/2020-07-30-snowpack-2-7-release/","tags":["JavaScript","bundler","ReleaseNote"],"content":"フロントエンドビルドツールのSnowpack 2.7リリース。\nPlugin APIの変更、`snowpack.config.json`の書式の変更など。\nどちらもv2の間は後方互換性があるが、新しい形式に移行を推奨している。","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · ykzts/node-xmlhttprequest","url":"https://github.com/ykzts/node-xmlhttprequest/releases/tag/v3.0.0","tags":["node.js","XHR","library","ReleaseNote"],"content":"Node.jsでのXMLHttpRequestの実装ライブラリであるnode-xmlhttprequest 3.0.0リリース","relatedLinks":[]},{"category":"Headline","title":"Speculation in JavaScriptCore | WebKit","url":"https://webkit.org/blog/10308/speculation-in-javascriptcore/","tags":["JavaScript","JIT","webkit"],"content":"Filip PizloによるJavaScriptCoreの投機的コンパイル、JITについて詳しい解説。\nJavaScriptCoreにおける4層のコンパイル処理の解説、投機的コンパイル、再コンパイル、プロファイリング、インラインキャッシュなど。\n投機的コンパイルは動的に型付けの言語においてどんな型を持っているかを推測して最適化する手法。その推測には、複数の実行層を使ったプロファイリングなどを基にして最適化を行う話","relatedLinks":[]},{"category":"Headline","title":"Blog - Next.js 9.5 | Next.js","url":"https://nextjs.org/blog/next-9-5","tags":["JavaScript","React","ReleaseNote","library"],"content":"Next.js 9.5リリース。\n`revalidate`、`basePath`、`trailingSlash`のオプションの追加、`rewrites`と`redirects`の設定が可能になった。\nPage Bundleのビルドキャッシュの有効化、ProductionでReactのプロファイルができるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Ink 3 - Vadim's Blog","url":"https://vadimdemedes.com/posts/ink-3","tags":["React","console","ReleaseNote","library"],"content":"Reactを使ったコンソールUIライブラリであるInk 3リリース。\nパフォーマンスの改善、`<Color>`は`<Text>`コンポーネントにマージ、`useInput`や`useFocus`などのHookの提供など","relatedLinks":[{"title":"Release v3.0.0 · vadimdemedes/ink","url":"https://github.com/vadimdemedes/ink/releases/tag/v3.0.0"}]},{"category":"Article","title":"Performance monitoring with Lighthouse CI","url":"https://web.dev/lighthouse-ci/","tags":["Chrome","performance","Tools","article"],"content":"Lighthouse CIについての記事。\n設定方法、CIでテストとして使う方法、GitHub Actionの連携について","relatedLinks":[]},{"category":"Article","title":"A new default Referrer-Policy for Chrome: strict-origin-when-cross-origin","url":"https://developers.google.com/web/updates/2020/07/referrer-policy-new-chrome-default","tags":["Chrome","security","article"],"content":"ChromeのReferrer-Policyのデフォルト値が`strict-origin-when-cross-origin`に変更されることによる影響について。\n`Origin`や`Sec-Fetch-Site`での代替えなどについて","relatedLinks":[{"title":"Referer and Referrer-Policy best practices","url":"https://web.dev/referrer-best-practices/"}]},{"category":"Article","title":"【翻訳】Date and Times in JavaScript - from scratch","url":"https://yosuke-furukawa.hatenablog.com/entry/2020/07/28/102821","tags":["JavaScript","ECMAScript","proposal","translate"],"content":"Dateを置き換えるProposalであるTemporalについての翻訳","relatedLinks":[]},{"category":"Article","title":"Different versions of your site can be running at the same time - JakeArchibald.com","url":"https://jakearchibald.com/2020/multiple-versions-same-time/","tags":["JavaScript","article"],"content":"デプロイ中に複数のバージョンが同じサイトで動く問題についてどのように対処するかという話。\n再ビルドによるchunkファイルの404、Storageスキーマの変更、APIレスポンスの変更に対してどのような対策を取るかについて書かれている","relatedLinks":[]},{"category":"Article","title":"Webブラウザ上で純粋なHTTPだけで単方向リアルタイム通信を可能にするHTTPのストリーミングアップロードが遂にやってくる - nwtgck / Ryo Ota","url":"https://scrapbox.io/nwtgck/Web%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B6%E4%B8%8A%E3%81%A7%E7%B4%94%E7%B2%8B%E3%81%AAHTTP%E3%81%A0%E3%81%91%E3%81%A7%E5%8D%98%E6%96%B9%E5%90%91%E3%83%AA%E3%82%A2%E3%83%AB%E3%82%BF%E3%82%A4%E3%83%A0%E9%80%9A%E4%BF%A1%E3%82%92%E5%8F%AF%E8%83%BD%E3%81%AB%E3%81%99%E3%82%8BHTTP%E3%81%AE%E3%82%B9%E3%83%88%E3%83%AA%E3%83%BC%E3%83%9F%E3%83%B3%E3%82%B0%E3%82%A2%E3%83%83%E3%83%97%E3%83%AD%E3%83%BC%E3%83%89%E3%81%8C%E9%81%82%E3%81%AB%E3%82%84%E3%81%A3%E3%81%A6%E3%81%8F%E3%82%8B","tags":["Fetch","article"],"content":"Chrome 85βで実装されているFetch upload streamingについての記事","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lamplightdev/aeon: A lightweight date picker built with web components that can be used anywhere","url":"https://github.com/lamplightdev/aeon","tags":["JavaScript","UI","library"],"content":"Date PickerのWeb Componentsライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"apoorv-mishra/moment-guess: A utility package for guessing date's format","url":"https://github.com/apoorv-mishra/moment-guess","tags":["JavaScript","library","Tools"],"content":"多種多様な日付文字列をパースして、その日付にマッチするフォーマットを返すツール","relatedLinks":[]}]},{"meta":{"title":"JSer.info 500回目の更新 - Slackワークスペース作成、コラボレータ募集、10年に向けて","author":"azu","layout":"post","date":"2020-08-11T03:10:00.000Z","category":"Article","tags":["JSer"],"url":"https://jser.info/2020/08/11/500/"},"items":[]},{"meta":{"title":"2020-08-11のJS: React 17.0 RC、Rome、Thinking in Microfrontend","author":"azu","layout":"post","date":"2020-08-11T02:06:38.950Z","category":"JSer","tags":["React","Rome","MicroFrontend"],"url":"https://jser.info/2020/08/11/react-17.0-rc-rome-thinking-in-microfrontend/"},"items":[{"category":"Headline","title":"TestCafe v1.9.0 Released | TestCafe","url":"https://devexpress.github.io/testcafe/blog/testcafe-v1-9-0-released.html","tags":["browser","testing","ReleaseNote"],"content":"TestCafe v1.9.0リリース。\nMulti Windowのテストをサポート、失敗したAssertionsのDiffの詳細を表示するようになるなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.0 RC | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-0-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.0 RCリリース。 Variadic Tuple Types、Labeled Tuple Elements、コンストラクタからClass Propertyの推論ができるように。 `catch`節の変数が`any`から`unknown`に変更。 Stage 4のlogical assignmentをサポート、`jsxFragmentFactory`オプションのサポート、`--incremental`と`--noEmit`の組み合わせをサポート。\nTypeScript公式ウェブサイトの刷新など","relatedLinks":[]},{"category":"Headline","title":"Introducing Rome","url":"https://romefrontend.dev/blog/2020/08/08/introducing-rome.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"JavaScriptツールチェインのRomeベータリリース。\nJavaScript Compiler、Bundler、Tester、Linterなどを包含的に含むモノリシックツール","relatedLinks":[]},{"category":"Headline","title":"React v17.0 Release Candidate: No New Features – React Blog","url":"https://reactjs.org/blog/2020/08/10/react-v17-rc.html","tags":["React","ReleaseNote"],"content":"React 17.0 RCリリース。\nReactの内部的な仕組みの更新をしたため、メジャーアップデートしている。\n新しいバージョンのReactから古いバージョンReactのルートコンポーネントをLazy Loadして利用できるようにするGradual Upgradesが主な目的。\nイベントの仕組みを変更し複数のReactを同一ページ内で動くように、イベントの仕組みが変わったためEvent Poolongを削除、エラー時のコンポーネントスタックの改善など。","relatedLinks":[{"title":"reactjs/react-gradual-upgrade-demo: Demonstration of how to gradually upgrade an app to a new version of React","url":"https://github.com/reactjs/react-gradual-upgrade-demo/"}]},{"category":"Article","title":"Changes to SameSite Cookie Behavior - A Call to Action for Web Developers - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/08/changes-to-samesite-cookie-behavior/","tags":["Firefox","security","article"],"content":"FirefoxもCookieの`SameSite`属性をデフォルトLaxに変更していくという話。\n現時点ではBetaでテストしているが、Stableリリースのスケジュールは未定。","relatedLinks":[]},{"category":"Article","title":"Announcing the new TypeScript Website | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-the-new-typescript-website/","tags":["TypeScript","article"],"content":"TypeScriptの公式サイトがアップデートされた。","relatedLinks":[]},{"category":"Article","title":"Setting Up Redux For Use In A Real-World Application — Smashing Magazine","url":"https://www.smashingmagazine.com/2020/08/redux-real-world-application/","tags":["React","redux","tutorial"],"content":"React + Redux + @reduxjs/toolkitを使ったアプリケーション開発のチュートリアル","relatedLinks":[]},{"category":"Article","title":"How To Launch Child Processes in Node.js | DigitalOcean","url":"https://www.digitalocean.com/community/tutorials/how-to-launch-child-processes-in-node-js","tags":["node.js","article"],"content":"Node.jsの`child_process`についての記事","relatedLinks":[]},{"category":"Article","title":"microfrontends/english.md at master · phodal/microfrontends","url":"https://github.com/phodal/microfrontends/blob/master/english.md","tags":["MicroFrontend","article","opinion"],"content":"Microfrontendについての記事。\nMicroServiceがサービス間の依存を切り離すのに対して、MicroFrontendは複数のアプリケーションを1つのアプリケーションに見えるように集約する。\nルーティングによる分散/iframeのコンテナの利用/MicroFrontEnd/アプリケーションをモジュール化/Web Componentsでの実装についての比較。\nMicroFrontendのコンセプト、mooaでのMicroFrontend設計について。\nLazy LoadingとRoutingだけでビルド時に統合をすると個別のアプリケーションをデプロイできなくなる問題、サブアプリケーションモデルでの複数チームの並行開発について","relatedLinks":[{"title":"phodal/microfrontends: Micro-frontend Architecture in Action-微前端的那些事儿","url":"https://github.com/phodal/microfrontends"}]},{"category":"Article","title":"Migrating Large TypeScript Codebases To Project References","url":"https://engineering.shopify.com/blogs/engineering/migrating-large-typescript-codebases-project-references","tags":["TypeScript","article"],"content":"大きなTypeScriptのコードベースのビルド速度や解析速度をProject Referencesで改善した話。\nどのようにProject Referencesへ移行したかについて","relatedLinks":[{"title":"TypeScript: Handbook - Project References","url":"https://www.typescriptlang.org/docs/handbook/project-references.html"}]},{"category":"Article","title":"A Roadmap for Angular. At the beginning of 2020 at ng-conf… | by Jules Kremer | Aug, 2020 | Angular Blog","url":"https://blog.angular.io/a-roadmap-for-angular-1b4fa996a771","tags":["Angular","document","article"],"content":"Angularのロードマップが公開された。\nTypeScript 4.0への対応、RxJS v7への対応、Trusted Typesのサポートなどが進行中。\n将来的な予定としてZone.jsのオプショナル化、Legacy View Engineの削除、NgModulesの削除などが予定されている。","relatedLinks":[{"title":"Angular - Angular Roadmap","url":"https://angular.io/guide/roadmap"}]},{"category":"SoftwareLibrary","title":"indexeddbshim/IndexedDBShim: A polyfill for IndexedDB using WebSql","url":"https://github.com/indexeddbshim/IndexedDBShim","tags":["node.js","JavaScript","library"],"content":"WebSQL、SQLiteを使ったブラウザとNode.jsで動くIndexedDBのpolyfill","relatedLinks":[]},{"category":"SoftwareLibrary","title":"shikijs/shiki: A beautiful Syntax Highlighter.","url":"https://github.com/shikijs/shiki","tags":["JavaScript","library"],"content":"TextMateの構文を使ったシンタックスハイライトをしたHTMLを出力できるライブラリ","relatedLinks":[]}]},{"meta":{"title":"2020-08-18のJS: Storybook 6.0.0、npm 7 beta、hapi 20(Maintainerの交代)","author":"azu","layout":"post","date":"2020-08-18T00:56:08.467Z","category":"JSer","tags":["Storybook","npm","Node.js"],"url":"https://jser.info/2020/08/18/storybook-6.0.0-npm-7-beta-hapi-20maintainer/"},"items":[{"category":"Headline","title":"Release v6.0.0 · storybookjs/storybook","url":"https://github.com/storybookjs/storybook/releases/tag/v6.0.0","tags":["JavaScript","UI","Tools","ReleaseNote"],"content":"Storybook 6.0.0リリース。\nTypeScriptのビルトインサポート、ストーリー関数の最初の引数にArgsオブジェクトを渡すように、addon-knobsの代わりとなるaddon-controlsの導入。\n複数のStoryboardを1つのStorybookにまとめることができるようになるなど。\nまた5.3から6.0へのマイグレーションガイドも公開されている","relatedLinks":[{"title":"storybook/CHANGELOG.md at next · storybookjs/storybook","url":"https://github.com/storybookjs/storybook/blob/next/CHANGELOG.md#600-august-10-2020"},{"title":"storybook/MIGRATION.md at next · storybookjs/storybook","url":"https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#from-version-53x-to-60x"}]},{"category":"Headline","title":"The npm Blog — npm v7 Series - Beta Release! And: SemVer-Major...","url":"https://blog.npmjs.org/post/626173315965468672/npm-v7-series-beta-release-and-semver-major","tags":["npm","ReleaseNote"],"content":"npm 7 betaリリース。\n`peerDependencies`がデフォルトでインストールされるようになり、過去の挙動を再現する`--legacy-peer-deps`が追加された。\n`acceptDependencies`のサポート、`package-lock.json`の形式変更と`yarn.lock`のサポート、`workspaces`フィールドのサポートなど。\nまた、npm run-scriptにおける`npm_package_*`と`npm_package_*`の環境変数の削除などが行われている","relatedLinks":[]},{"category":"Headline","title":"Node v14.8.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v14.8.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 14.8.0リリース。\nTop-Level Awaitのデフォルトサポート、`async_hooks`モジュールに`AsyncResource.bind`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release Version 8.0.0 · acornjs/acorn","url":"https://github.com/acornjs/acorn/releases/tag/8.0.0","tags":["JavaScript","ECMAScript","library"],"content":"JavaScriptパーサであるAcorn 8.0.0リリース。\nECMAScript moduleとしてロードできるように、`ecmaVersion`オプションが必須となった","relatedLinks":[]},{"category":"Headline","title":"Update for Customers Using PhoneGap and PhoneGap Build | by Adobe I/O | Aug, 2020 | PhoneGap","url":"https://blog.phonegap.com/update-for-customers-using-phonegap-and-phonegap-build-cc701c77502c","tags":["JavaScript","app","news"],"content":"ウェブ技術を使ってネイティブアプリを作れるPhoneGapのビルドサービスが2020年10月で終了する。\n代替としてApache Cordova、Ionicなどがあることについて。","relatedLinks":[]},{"category":"Headline","title":"20.0.0 Release Notes · Issue #4138 · hapijs/hapi","url":"https://github.com/hapijs/hapi/issues/4138","tags":["node.js","library","ReleaseNote"],"content":"hapi 20.0.0リリース。\nコアメンテナーが交代しTechnical Steering Committee (TSC) ベースのプロジェクトに変更がメインのアップデート。\n`@hapi/joi`から`@hapi/validate`に変更、Node.js 14のサポートなど","relatedLinks":[{"title":"The future of the hapi project · Issue #4113 · hapijs/hapi","url":"https://github.com/hapijs/hapi/issues/4113"}]},{"category":"Headline","title":"emscripten/ChangeLog.md at master · emscripten-core/emscripten","url":"https://github.com/emscripten-core/emscripten/blob/master/ChangeLog.md#200-08102020","tags":["WebAssembly","JavaScript","library","Tools","ReleaseNote"],"content":"C/C++などをWebAssemblyにコンパイルするEmscripten 2.0リリース。\nfastcomp backendの削除、Python 2のサポートを削除。\nまた例外情報のメタデータをJSではなく`WebAssembly.Memory`に保存することで例外処理がスレッドセーフになるような変更など","relatedLinks":[{"title":"Remove fastcomp · Issue #11319 · emscripten-core/emscripten","url":"https://github.com/sbc100"}]},{"category":"Headline","title":"Release 2.11.0 · qunitjs/qunit","url":"https://github.com/qunitjs/qunit/releases/tag/2.11.0","tags":["JavaScript","test","library","ReleaseNote"],"content":"QUnit 2.11.0リリース。\nNode.js 10未満のサポートを削除、`assert.true`と`assert.false`の追加、HTMLレポートの検索改善など","relatedLinks":[]},{"category":"Headline","title":"Ajv Joins OpenJS Foundation as an Incubation Project - OpenJS Foundation","url":"https://openjsf.org/blog/2020/08/14/ajv-joins-openjs-foundation-as-an-incubation-project/","tags":["JSON","library","news","JavaScript"],"content":"JSON SchemaバリデーターであるAjvがOpenJS Foundationに入った。","relatedLinks":[{"title":"Evgeny Poberezkin - Ajv JSON Schema validator: Mozilla MOSS grant and OpenJS Foundation","url":"https://www.poberezkin.com/posts/2020-08-14-ajv-json-validator-mozilla-open-source-grant-openjs-foundation.html"}]},{"category":"Article","title":"Node.jsでプロトタイプ汚染後に任意コード実行まで繋げた事例 - knqyf263&#39;s blog","url":"https://knqyf263.hatenablog.com/entry/2020/08/11/050342","tags":["JavaScript","article","security"],"content":"Node.jsにおけるプロトタイプ汚染の実例を紹介している記事","relatedLinks":[]},{"category":"Article","title":"The Golden Rule of Generics","url":"https://effectivetypescript.com/2020/08/12/generics-golden-rule/","tags":["TypeScript","article"],"content":"TypeScriptのGenericsを使うべきかを判断するとき目安として「型パラメーターは2回表示されるとき」というルールについて。\nいろいろなコード例ともにGenericsの利用例を紹介している","relatedLinks":[{"title":"Handbook Page","url":"https://microsoft.github.io/TypeScript-New-Handbook/everything/#guidelines-for-writing-good-generic-functions"}]},{"category":"Article","title":"Optimizing CSS for faster page loads - Tomas Pustelnik's personal website","url":"https://pustelto.com/blog/optimizing-css-for-faster-page-loads/","tags":["CSS","article","performance"],"content":"CSSのCritical Pathの最適化について。\nCSSのロードタイムに与える影響、Critical CSSの分離と遅延ロード、CSSのCode Splittingについて","relatedLinks":[]},{"category":"Article","title":"Node.js and the struggles of being an EventTarget","url":"https://www.nearform.com/blog/node-js-and-the-struggles-of-being-an-eventtarget/","tags":["node.js","article"],"content":"Node.jsに`EventTarget`がなぜ実装されたのかについて。\nNode.jsにFethやAbortControllerなどのウェブ標準のAPIを実装するためにブラウザと互換性のある`EventTarget` APIが必要である点について。\n`EventTarget`を実装するにあたっての互換性、複数継承、パフォーマンスの問題をどう解決したかについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"twilco/kosmonaut: A web browser engine for the space age","url":"https://github.com/twilco/kosmonaut","tags":["Rust","browser"],"content":"ServoをインスパイアしたRust製のブラウザエンジン。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Shopify/web-foundation: Principles, decision logs, best practices, and common configuration for building web apps at Shopify","url":"https://github.com/Shopify/web-foundation","tags":["document"],"content":"Shopifyのウェブ開発における設定やその解説ドキュメントをまとめたリポジトリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ealush/vest: Vest ✅ Declarative validations framework","url":"https://github.com/ealush/vest","tags":["JavaScript","library"],"content":"テストフレームワークライクなバリデーションライブラリ。\nテストコードのようにバリデーションのコードを書けるライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Run JavaScript Everywhere.","url":"https://nodejs.dev/","tags":["node.js","document"],"content":"Node.jsについての入門ドキュメントサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Native mobile apps in JavaScript. Fast and secure framework. - Tabris","url":"https://tabris.com/","tags":["JavaScript","Native","iOS","Android","library"],"content":"React NativeのようにJavaScriptで書いてOSネイティブのUIを描画できるモバイルアプリ作成フレームワーク。","relatedLinks":[]}]},{"meta":{"title":"2020-08-25のJS: TypeScript 4.0、Cypress 5.0、Electron 10.0","author":"azu","layout":"post","date":"2020-08-25T02:59:14.022Z","category":"JSer","tags":["TypeScript","Testing","Electron"],"url":"https://jser.info/2020/08/25/typescript-4.0-cypress-5.0-electron-10.0/"},"items":[{"category":"Headline","title":"Release 2.8.0 · pikapkg/snowpack","url":"https://github.com/pikapkg/snowpack/releases/tag/snowpack%402.8.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"snowpack 2.8.0リリース。\n`snowpack build --watch`の追加、`--polyfill-node`でNodeコアモジュールのpolyfillを追加できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.3.0 · Polymer/lit-html","url":"https://github.com/Polymer/lit-html/releases/tag/v1.3.0","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"lit-html 1.3.0リリース。\nTrusted Typesのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.0 | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-0/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.0リリース。\nVariadic Tuple Types、Labeled Tuple Elements、Class Propertyの型がConstructorから推論されるように。\nES2021で入る予定のLogical Operators and Assignment Expressionsのサポート。\n`catch`節のデフォルトが`unknown`となるように、`jsxFragmentFactory`オプションのサポート、`--incremental`と`--noEmit`の組み合わせをサポート","relatedLinks":[]},{"category":"Headline","title":"axios/CHANGELOG.md at master · axios/axios","url":"https://github.com/axios/axios/blob/master/CHANGELOG.md#0200-august-20-2020","tags":["HTTP","JavaScript","library","ReleaseNote"],"content":"Axios 0.20.0リリース。\nBOMを含むJSONに対応、`maxBodyLength`オプションの追加、`decompress`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release 5.0.0 · cypress-io/cypress","url":"https://github.com/cypress-io/cypress/releases/tag/v5.0.0","tags":["JavaScript","browser","ReleaseNote","testing"],"content":"Cypress 5.0.0リリース。\n`cypress-plugin-retries`が非推奨化され、Cypress自体でリトライの設定できるように。\nサポート対象をTypeScript 3.4+、Node.js 10+に変更、`__dirname`と`__filename`の末尾に`/`が含まれなくなるなど","relatedLinks":[{"title":"Release 5.0.0 · cypress-io/cypress","url":"https://github.com/cypress-io/cypress/releases/tag/v5.0.0"}]},{"category":"Headline","title":"Release electron v10.0.0 · electron/electron","url":"https://github.com/electron/electron/releases/tag/v10.0.0","tags":["Electron","ReleaseNote"],"content":"Electron 10.0.0リリース。\nChromium 85、V8 8.5、Node.js 12.16へアップデート。\n`enableRemoteModule`を`false`に変更、`app.allowRendererProcessReuse`を`true`に変更。\n`contents.backgroundThrottling`プロパティの追加、`sameSite`情報を取得できるように、`worldSafeExecuteJavaScript`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Prettier 2.1: new --embedded-language-formatting option and new JavaScript/TypeScript features! · Prettier","url":"https://prettier.io/blog/2020/08/24/2.1.0.html","tags":["JavaScript","TypeScript","ReleaseNote"],"content":"Prettier 2.1リリース。\n`--embedded-language-formatting`フラグの追加、`--ignore-unknown`フラグの追加、TypeScript 4.0のサポート。\nES ProposalのPipeline operator、Record and Tuple構文のサポートなど","relatedLinks":[]},{"category":"Article","title":"ts-migrate: A Tool for Migrating to TypeScript at Scale | by Sergii Rudenko | Airbnb Engineering & Data Science | Aug, 2020 | Medium","url":"https://medium.com/airbnb-engineering/ts-migrate-a-tool-for-migrating-to-typescript-at-scale-cd23bfeb5cc","tags":["JavaScript","TypeScript","article"],"content":"JavaScriptからTypeScriptへのマイグレーションを補助する`ts-migrate`について。\n`.js`を`.ts`にリネーム、codemodベースでの`any`などの型付け、コンパイルエラーになる部分を`// @ts-expect-error`コメントで抑制していきマイグレーションする。","relatedLinks":[{"title":"airbnb/ts-migrate: A tool to help migrate JavaScript code quickly and conveniently to TypeScript","url":"https://github.com/airbnb/ts-migrate"}]},{"category":"Article","title":"What's New In DevTools (Chrome 86)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2020/08/devtools","tags":["Chrome","article"],"content":"Chrome 86のDevToolsの変更点について。\nMediaパネルの追加、コンテキストメニューから要素のスクリーンショットを撮影できるように。\nWebFontで`local()`がない場合をエミュレート、Idle Detectionのエミュレート、`prefers-reduced-data`のエミュレート機能の追加。\nLighthouse 6.2へアップデート、ApplicationパネルにFrameの情報を追加、`X-Client-Data`のデコードをサポートなど","relatedLinks":[]},{"category":"Article","title":"Protect your resources from web attacks with Fetch Metadata","url":"https://web.dev/fetch-metadata/","tags":["Chrome","article","security"],"content":"Fetch Metadataの`Sec-Fetch-*`ヘッダの解説。\nSame-OriginとCross-Siteの区別、それぞれの`Sec-Fetch-*`ヘッダの解説、クロスサイトリクエストを使った攻撃の判定と対策などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"HexEd.it - Browser-based Online and Offline Hex Editing","url":"https://hexed.it/","tags":["browser","editor","Tools"],"content":"ブラウザベースのバイナリエディタ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"azu/kvs: Key-Value storage library for Browser, Node.js, and In-Memory.","url":"https://github.com/azu/kvs","tags":["JavaScript","library"],"content":"ブラウザとNode.jsで動作するUniversalなKey-ValueなStorageライブラリ。\n同じインターフェイスをもつIndexedDBやファイルベースなどの実装があり、マイグレーションをサポートしている。\nそれぞれの実装は個別に分かれていて、それぞれのパッケージは1kb(gzip)程度のサイズとなっている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Elderjs/elderjs: Elder.js is an opinionated static site generator and web framework for Svelte built with SEO in mind.","url":"https://github.com/elderjs/elderjs","tags":["JavaScript","Svelte","library"],"content":"Svelteを使った静的サイトジェネレーター。\n規約ではなく`route.js`による柔軟なパーマネントリンクの生成、`data.js`でビルドに必要なものをまとめて取得して、静的なサイトを生成するためのツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"keiya01/react-performance-testing: A library to test runtime performance in React","url":"https://github.com/keiya01/react-performance-testing","tags":["React","testing","library"],"content":"Reactコンポーネントのレンダリング回数やレンダリング時間を計測できるライブラリ。\nReactにmonkey patchを当てて計測している。","relatedLinks":[{"title":"Reactでレンダリング回数やレンダリングにかかる時間をユニットテストでテストできるライブラリを開発しました - Qiita","url":"https://qiita.com/keiya01/items/93d83911fb44170717c2"}]}]},{"meta":{"title":"2020-08-31のJS: Firefox 80、D3.js 6.0.0、Chrome 85、Puppeteer & Playwright","author":"azu","layout":"post","date":"2020-08-31T10:43:01.021Z","category":"JSer","tags":["Firefox","D3.js","Chrome"],"url":"https://jser.info/2020/08/31/firefox-80-d3.js-6.0.0-chrome-85-puppeteer-and-playwright/"},"items":[{"category":"Headline","title":"Firefox 80.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/80.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 80.0リリース。\nES2020の`export * as namespace`構文のサポート。\n`window.open()`が`outerWidth`と`outerHeight`を無視するように、`Cache-Control`が設定されている場合に`Pragma`ヘッダは無視されるようになるなど","relatedLinks":[{"title":"Firefox 80 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/80#Changes_for_web_developers"},{"title":"Firefox 80 Site Compatibility | Firefox Site Compatibility","url":"https://www.fxsitecompat.dev/en-CA/releases/80/"}]},{"category":"Headline","title":"Release v6.0.0 · d3/d3","url":"https://github.com/d3/d3/releases/tag/v6.0.0","tags":["d3.js","JavaScript","library"],"content":"D3.js 6.0.0リリース。\nES2015のIterable、Map、Setを利用するように、bowerの対応を削除。\n`d3-selection`などのイベントの仕組みを変更、`d3-collection`の非推奨化など","relatedLinks":[{"title":"d3/CHANGES.md at master · d3/d3","url":"https://github.com/d3/d3/blob/master/CHANGES.md#changes-in-d3-60"}]},{"category":"Headline","title":"New in Chrome 85  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2020/08/nic85","tags":["Chrome","ReleaseNote"],"content":"Chrome 85リリース。\nCSS `content-visibility`の実装、CSS PropertiesをCSSで定義する`@property`の実装、AVIF画像のサポート。\nOrigin TrialとしてFetch APIのStreaming requests、WebHID、Declarative Shadow DOM、Portalのサポート。\nまた、Referrer Policyのデフォルト値を`strict-origin-when-cross-origin`に変更など","relatedLinks":[]},{"category":"Headline","title":"V8 release v8.5 · V8","url":"https://v8.dev/blog/v8-release-85","tags":["V8","ReleaseNote"],"content":"V8 8.5リリース。\nES2021予定の`Promise.any`と`AggregateError`のサポート、String#replaceAllのサポート、Logical assignment operatorsのサポート。\nWebAssemblyのbaseline compilerであるLiftoffが全てのプラットフォームで使われるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Yarn 2.2 🚅🌟 Dedupe, Faster, Lighter, ... - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/arcanis/yarn-2-2-dedupe-faster-lighter-ha5","tags":["yarn","ReleaseNote"],"content":"Yarn 2.2リリース。\n`yarn dedupe`の追加、パフォーマンス改善、オプトアウト方式でYarnの利用情報をDatadogに送るように","relatedLinks":[{"title":"berry/CHANGELOG.md at master · yarnpkg/berry","url":"https://github.com/yarnpkg/berry/blob/master/CHANGELOG.md#220"}]},{"category":"Article","title":"content-visibility: the new CSS property that boosts your rendering performance","url":"https://web.dev/content-visibility/","tags":["CSS","article","Chrome","performance"],"content":"Chrome 85で実装されたCSS `content-visibility`プロパティについて。\nCSS Containmentに依存した仕様。\nDOMのサブツリーに予測できる空間を定義することで、ブラウザがレンダリングを省略して最適化するための仕組み。\n`display: none`、`visibility: hidden`との違い、`content-visibility`プロパティのユースケースとしての無限スクロールなどについて","relatedLinks":[]},{"category":"Article","title":"Introducing Danfo.js, a Pandas-like Library in JavaScript — The TensorFlow Blog","url":"https://blog.tensorflow.org/2020/08/introducing-danfo-js-pandas-like-library-in-javascript.html","tags":["MachineLearning","JavaScript","library","article"],"content":"PandasインスパイアなライブラリであるDanfo.jsについて。\nTensorFlow.jsと組み合わせて利用できる","relatedLinks":[{"title":"opensource9ja/danfojs: danfo.js is an open source, JavaScript library providing high performance, intuitive, and easy to use data structures for manipulating and processing structured data.","url":"https://github.com/opensource9ja/danfojs"}]},{"category":"SlideVideo","title":"Vue.js with TSX - From Vue 2.x to Vue 3 #v\\_tokyo11 - Speaker Deck","url":"https://speakerdeck.com/potato4d/vue-dot-js-with-tsx-from-vue-2-dot-x-to-vue-3-number-v-tokyo11","tags":["Vue","jsx","TypeScript","slide"],"content":"VueでのTSX利用についてスライド。\nVue2/Vue3でのTSXの利用方法と制限、VueのSFCとTSXの比較など","relatedLinks":[]},{"category":"WebsiteDocument","title":"gluesql/gluesql: GlueSQL is quite sticky, it attaches to anywhere.","url":"https://github.com/gluesql/gluesql","tags":["Rust","JavaScript","DB "],"content":"ライブラリとしてのSQLデータベース。\nRustとWebAssembly(JavaScript)での実装が提供されている。\nJavaScript版はInMemoery、LocalStorageなどで動作する","relatedLinks":[]},{"category":"WebsiteDocument","title":"testimio/root-cause","url":"https://github.com/testimio/root-cause","tags":["JavaScript","browser","library","Tools","testing"],"content":"PuppeteerとPlaywrightを使ったE2Eテストの補助ツール。\nそれぞれの実行ステップをスクリーンショットで保存、コンソールログやネットワーク(HAR)ファイルの保存してレポートからテストが失敗した原因を検証できる。\n単独で動かす方法とJestやMochaなどのテストフレームワークに統合するライブラリを提供している。","relatedLinks":[{"title":"Root Cause - Fast authoring of AI-stabilized end-to-end tests—codeless, coded, or both","url":"https://www.testim.io/root-cause/"},{"title":"Testim Root Cause overview","url":"https://help.testim.io/docs/root-cause"}]},{"category":"WebsiteDocument","title":"theheadless.dev - Learn Puppeteer & Playwright","url":"https://theheadless.dev/","tags":["JavaScript","browser","document"],"content":"PuppeteerとPlaywrightの使い方やユースケースについて紹介しているサイト。\n基本的な使い方、E2Eテストやスクレイピングなどのユースケースごとの使い方について紹介している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dsherret/ts-morph: TypeScript Compiler API wrapper for static analysis and programmatic code changes.","url":"https://github.com/dsherret/ts-morph","tags":["TypeScript","AST","library"],"content":"TypeScript Compiler APIのラッパーライブラリ。\nTypeScriptのAST操作やファイル操作などを扱えるAPIを提供する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"davidkpiano/xactor: Actors for the modern web","url":"https://github.com/davidkpiano/xactor","tags":["JavaScript","TypeScript","library"],"content":"TypeScriptでのActorモデルの実装ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ztext.js | 3D Typography for the Web","url":"https://bennettfeely.com/ztext/","tags":["JavaScript","library","fonts"],"content":"3Dタイポグラフィライブラリ。\n文字列を3D表示するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Bnaya/objectbuffer: JavaScript Object like api, backed by an arraybuffer","url":"https://github.com/Bnaya/objectbuffer","tags":["JavaScript","library","webworker"],"content":"`ArrayBuffer`をバックエンドに使ったオブジェクトデータライブラリ。\n通常のオブジェクトはWeb Workerなどに渡す際にコピーされるが、`ArrayBuffer`などのTransferableなオブジェクトならコピーせずに渡せるのを目的にしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"edwinm/carbonium: Carbonium, for easy manipulation of the DOM","url":"https://github.com/edwinm/carbonium","tags":["JavaScript","DOM","library"],"content":"Proxyを使ったDOM操作ライブラリ。\nセレクタで要素選択し、選択した複数の要素に対してまとめて`style`や`classList`などのDOM APIでの操作を行えるライブラリ","relatedLinks":[]}]},{"meta":{"title":"2020-09-08のJS: Chrome 86ベータ、Underscore 1.11.0(ESM)、JavaScript Primer v2","author":"azu","layout":"post","date":"2020-09-08T03:28:31.282Z","category":"JSer","tags":["Chrome","Underscore","book"],"url":"https://jser.info/2020/09/08/chrome-86-underscore-1.11.0esm-javascript-primer-v2/"},"items":[{"category":"Headline","title":"Release 13.7.0 · stylelint/stylelint","url":"https://github.com/stylelint/stylelint/releases/tag/13.7.0","tags":["JavaScript","CSS","Tools","ReleaseNote"],"content":"stylelint 13.7.0リリース。\n`*-blacklist`、`*-requirelist`, `*-whitelist`を非推奨化し、` *-disallowed-list`, `*-required-list`にリネーム。\n`stylelint-disable`コメントに説明を書けるように","relatedLinks":[]},{"category":"Headline","title":"ESLint v7.8.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2020/08/eslint-v7.8.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 7.8.0リリース。\n`ecmaScript`オプションが`2021`に対応しLogical assignment operators、numeric separatorsに対応。","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · typescript-eslint/typescript-eslint","url":"https://github.com/typescript-eslint/typescript-eslint/releases/tag/v4.0.0","tags":["TypeScript","ESLint","ReleaseNote"],"content":"TypeScript-ESLint 4.0.0リリース。\nOptional ChainingとdecoratorsのASTを変更、Scope解析を改善して`no-unused-vars`などのルールを改善、`ban-ts-comment`のデフォルト値を変更など。\nまたTypeScript 4.0にはTypeScript-ESLint 3.10.0で対応している。","relatedLinks":[]},{"category":"Headline","title":"webpack 5 release plan · Issue #11406 · webpack/webpack","url":"https://github.com/webpack/webpack/issues/11406","tags":["webpack","news","issue"],"content":"webpack 5リリースまで予定について。\nwebpack 5は2020年10月10日リリース予定で、RCは9月にリリースする予定。\n細かいバグはwebpack 5リリース後に修正する予定とのこと。","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 86: Improved Focus Highlighting, WebHID, and More","url":"https://blog.chromium.org/2020/09/chrome-86-improved-focus-highlighting.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 86ベータリリース。\nCSS 擬似クラスの`:focus-visible`、擬似要素の`::marker`をサポート。\nDocument Policy、`FetchEvent.handled`、Shadow DOM Distribution API、`ParentNode.replaceChildren()`のサポートなど。\nまたOrigin TrialとしてWebHID API、Window placement API、`<meta name=\"battery-savings\">`などのサポート。\nその他にはFTPのサポートが非推奨となるなど","relatedLinks":[{"title":"window-placement/EXPLAINER.md at master · webscreens/window-placement","url":"https://github.com/webscreens/window-placement/blob/master/EXPLAINER.md"},{"title":"battery-savings/explainer.md at master · chrishtr/battery-savings","url":"https://github.com/chrishtr/battery-savings/blob/master/explainer.md"}]},{"category":"Headline","title":"Underscore.js","url":"https://underscorejs.org/#1.11.0","tags":["JavaScript","library","ReleaseNote"],"content":"underscore 1.10.0リリース。\nそれぞれの関数を個別のES Modulesにし、ES Modulesのエントリーポイントとして`underscore-esm.js`を追加。\n`_.isArrayBuffer`、`_.isDataView`、`_.isTypedArray`の追加、`_.flatten`がdepthを指定する第2引数をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Update on Adobe Flash Player End of Support - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2020/09/04/update-adobe-flash-end-support/","tags":["MSEdge","flash","news"],"content":"MSEdgeではFlash Playerを2021年1月のEdge 88で削除する予定。\nこの削除スケジュールはChromiumにあわせたもの","relatedLinks":[{"title":"Flash Roadmap - The Chromium Projects","url":"https://www.chromium.org/flash-roadmap#TOC-Flash-Support-Removed-from-Chromium-Target:-Chrome-88---Jan-2021-"}]},{"category":"Article","title":"Minimal React: getting started with the frontend library","url":"https://2ality.com/2020/08/minimal-react.html","tags":["React","tutorial","article"],"content":"snowpack、react、htm、immerを使ったReactのチュートリアル","relatedLinks":[]},{"category":"Article","title":"Introducing: Modern Web","url":"https://modern-web.dev/blog/introducing-modern-web/","tags":["WebComponents","article","testing"],"content":"ウェブ開発の汎用ツールとガイドに取り組むModern Webというプロジェクトについて。\nまずはWeb Test Runnerというブラウザを使ったテストツールをリリースしている。\n今後Web Dev Serverのような開発用サーバや開発ガイドなどに取り組んでいく予定とのこと","relatedLinks":[{"title":"modernweb-dev/web: Guides, tools and libraries for modern web development.","url":"https://github.com/modernweb-dev/web"}]},{"category":"Article","title":"Introducing Modular Underscore—Julian Gonggrijp","url":"https://juliangonggrijp.com/article/introducing-modular-underscore.html","tags":["JavaScript","library","article"],"content":"underscore 1.11.0でのES Modulesへの移行とその利用方法についての記事。\n既存(モノリシック)の使い方とES Modulesの使い方、ビルドサイズの最適化、Underscore 2.0についてなど","relatedLinks":[]},{"category":"Article","title":"Browsers may throttle requestAnimationFrame","url":"https://mattperry.is/writing-code/browsers-may-throttle-requestanimationframe-to-30fps","tags":["JavaScript","animation","article"],"content":"`requestAnimationFrame`のフレームレートがブラウザによって抑制される条件について。\niOSのlow-power mode、Safariのcross-origin iframesの条件下では抑制される点について。\nまた、Firefoxにおいて`performance.now()`の精度の抑制されていることとcross-origin isolateについて。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"andnp/SimplyTyped: yet another Typescript type library for advanced types","url":"https://github.com/andnp/SimplyTyped","tags":["TypeScript","library"],"content":"TypeScriptの型ユーティリティライブラリ。\n型定義の補助やランタイムでの補助関数などを提供する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mizchi/minlink: Minimum(> 1kb) and isomorphic worker wrapper with comlink like rpc.","url":"https://github.com/mizchi/minlink","tags":["JavaScript","webworker","node.js","library"],"content":"Web Worker/Node.jsの`worker_thread`でRPCをするためのライブラリ。\ncomlinkのように関数呼び出しで`postMessage`のやりとりをする","relatedLinks":[{"title":"minlink - browser/node で使える Worker ラッパー - mizdev","url":"https://mizchi.dev/202009061729-minlink-and-minify-tech"}]},{"category":"Book","title":"この書籍について · JavaScript Plugin Architecture","url":"https://azu.github.io/JavaScript-Plugin-Architecture/","tags":["JavaScript","plugin","book"],"content":"JavaScriptのプラグインアーキテクチャについて扱う小さな書籍。\njQuery、ESLint、Connect、gulp、Reduxのプラグインの仕組みを実装しながら紹介している。","relatedLinks":[{"title":"Release v2.0.0 · azu/JavaScript-Plugin-Architecture","url":"https://github.com/azu/JavaScript-Plugin-Architecture/releases/tag/v2.0.0"}]},{"category":"Book","title":"Release 2.0.0: ECMAScript 2020対応 · asciidwango/js-primer","url":"https://github.com/asciidwango/js-primer/releases/tag/v2.0.0","tags":["JavaScript","ECMAScript","book","ReleaseNote"],"content":"JavaScript入門書のJavaScript Primer 2.0.0リリース。\nES2020の`String.prototype.matchAll`、`globalThis`、BigInt、Nullish coalescing(`??`)、Optional chainin（`?.`）に対応など","relatedLinks":[{"title":"JavaScript Primer 2.0 - ECMAScript 2020に対応した入門書を公開しました | Web Scratch","url":"https://efcl.info/2020/09/01/jsprimer-2.0/"}]}]},{"meta":{"title":"2020-09-15のJS: playwright 1.4.0、snowpack 2.11.1、Migrating to JavaScript modules(Chrome Dev Tools)","author":"azu","layout":"post","date":"2020-09-15T02:59:01.892Z","category":"JSer","tags":["playwright","snowpack","modules"],"url":"https://jser.info/2020/09/15/playwright-1.4.0-snowpack-2.11.1-migrating-to-javascript-moduleschrome-dev-tools/"},"items":[{"category":"Headline","title":"Node v14.10.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v14.10.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 14.10.0リリース。\nランダムなintegerを返す`crypto.randomInt()`の追加、`performance.eventLoopUtilization()`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release 2.0.0 (2020-09-10) · serverless/serverless","url":"https://github.com/serverless/serverless/releases/tag/v2.0.0","tags":["node.js","library","ReleaseNote","serverless"],"content":"Serverless Frameworkのserverless 2.0リリース。\nNode.js 10未満のサポート終了、`slss`のaliasを削除、AWSの`httoApi`の`timeout`設定の削除など","relatedLinks":[]},{"category":"Headline","title":"Release v1.4.0 · denoland/deno","url":"https://github.com/denoland/deno/releases/tag/v1.4.0","tags":["deno","ReleaseNote"],"content":"Deno 1.4.0リリース。\nWebSocket APIの実装、`Deno.systemMemoryInfo()`の追加。\nまた、unstableな機能として`deno run --watch`、`deno test --coverage`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release snowpack@2.11.1 · pikapkg/snowpack","url":"https://github.com/pikapkg/snowpack/releases/tag/snowpack%402.11.1","tags":["bundler","ReleaseNote","JavaScript"],"content":"snowpack 2.11.1リリース。\nesbuildなどをベースにした`@snowpack/plugin-optimize`の追加、`build --watch`でHMR/Livereloadの対応。\nまた、`@snowpack/plugin-webpack`でもHTMLのminifyをするようになるなど。","relatedLinks":[]},{"category":"Headline","title":"ten1seven/what-input: A global utility for tracking the current input method (mouse/pointer, keyboard or touch).","url":"https://github.com/ten1seven/what-input","tags":["JavaScript","library","browser","DOM"],"content":"ユーザーの入力状態をトラッキングするライブラリ。\n現在の入力状態がmouse, keyboard, touchなのかを判定できる","relatedLinks":[]},{"category":"Headline","title":"Release v1.4.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.4.0","tags":["browser","library","Tools","ReleaseNote"],"content":"playwright 1.4.0リリース。\nplaywright-cliを正式リリース、Chromium 86/Firefox 80/WebKit 14へアップデート。\n`elementHandle.waitForElementState()`と`elementHandle.waitForSelector()`の追加など","relatedLinks":[]},{"category":"Article","title":"AVIF has landed - JakeArchibald.com","url":"https://jakearchibald.com/2020/avif-has-landed/","tags":["browser","Image","article"],"content":"AV1 video由来の画像フォーマットであるAVIFについて。\njpeg、WebP、AVIFのサイズや画質の比較。\nAVIFのエンコード、デコード時間、プログレッシブ表示できないといった特徴についてなど","relatedLinks":[{"title":"How to Use AVIF: The New Next-Gen Image Compression Format — Lightspeed","url":"https://reachlightspeed.com/blog/using-the-new-high-performance-avif-image-format-on-the-web-today/"}]},{"category":"Article","title":"DevTools architecture refresh: Migrating to JavaScript modules  |  Web","url":"https://developers.google.com/web/updates/2020/09/migrating-to-js-modules","tags":["JavaScript","Chrome","article","refacoring"],"content":"Chrome Dev Toolsのコードベースを独自モジュールシステムからES Modulesに移行した話。\n標準であるES Modulesの利点、移行戦略、exportの変更/importの変更の段階的な移行について。\nまた技術的な負債により初期の見積もり(数週間)よりも大きく時間(数ヶ月)かかったことについてなど","relatedLinks":[]},{"category":"Article","title":"Leading-Trim: The Future of Digital Typesetting | by Ethan Wang | Microsoft Design | Aug, 2020 | Medium","url":"https://medium.com/microsoft-design/leading-trim-the-future-of-digital-typesetting-d082d84b202","tags":["CSS","article"],"content":"CSS `leading-trim`プロパティについて","relatedLinks":[]},{"category":"Article","title":"A Practical Guide to the Web Cryptography API - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/voraciousdev/a-practical-guide-to-the-web-cryptography-api-4o8n","tags":["JavaScript","article"],"content":"Web Cryptography APIの基本的な使い方。\nEncryption、Decryption、転送や保存について","relatedLinks":[]},{"category":"WebsiteDocument","title":"type-challenges/type-challenges: Collection of TypeScript type challenges with online judge","url":"https://github.com/type-challenges/type-challenges","tags":["TypeScript","tutorial"],"content":"TypeScriptの型定義の問題に挑戦できる問題集","relatedLinks":[]},{"category":"WebsiteDocument","title":"microsoft/FluidFramework: Library for building distributed, real-time collaborative web applications","url":"https://github.com/microsoft/FluidFramework","tags":["JavaScript","library","webservice"],"content":"分散型リアルタイムコラボレーションのためのウェブアプリケーションフレームワーク。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"brahmosjs/brahmos: Super charged JavaScript library with modern React API and native templates.","url":"https://github.com/brahmosjs/brahmos","tags":["React","jsx","library","babel"],"content":"ReactのようなAPIとJSXで記述できるUIライブラリ。\nBabel pluginでJSXをTagged Template Literalに変換し、lit-htmlのような形でレンダリングする","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cookie-universal/packages/cookie-universal at master · microcipcip/cookie-universal","url":"https://github.com/microcipcip/cookie-universal/tree/master/packages/cookie-universal","tags":["browser","node.js","library","JavaScript"],"content":"ブラウザとNode.jsで動くCookieを扱うライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"microsoft/playwright-cli: CLI for common Playwright actions. Record and generate Playwright code, inspect selectors and take screenshots.","url":"https://github.com/microsoft/playwright-cli","tags":["node.js","browser","console","Tools"],"content":"PlaywrightのCLI。\n操作を記録して再生するコードの生成、要素のInspect、スクリーンショット、PDFの生成などの機能をもっている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ngneat/edit-in-place: A flexible and unopinionated edit in place library for Angular applications","url":"https://github.com/ngneat/edit-in-place","tags":["JavaScript","library","Angular"],"content":"クリックしたらその場で編集できるedit in placeを提供するAngular向けのライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sabljakovich/mongoose-execution-time: Mongoose plugin for measuring and logging query execution time","url":"https://github.com/sabljakovich/mongoose-execution-time","tags":["MongoDB","JavaScript","library"],"content":"mongooseでqueryの実行時間をログ出力するライブラリ","relatedLinks":[]},{"category":"Book","title":"JavaScript for Data Science","url":"https://js4ds.org/","tags":["JavaScript","book"],"content":"データサイエンティスト向けのJavaScriptの入門書","relatedLinks":[]}]},{"meta":{"title":"2020-09-21のJS: Moment.jsのステータス、PostCSS 8.0.0、Vue 3.0.0、DOMの順序と表示順序の一致","author":"azu","layout":"post","date":"2020-09-21T06:35:18.325Z","category":"JSer","tags":["Date","CSS","Vue","Accessibility"],"url":"https://jser.info/2020/09/21/moment.js-postcss-8.0.0-vue-3.0.0-dom/"},"items":[{"category":"Headline","title":"Moment.js | Docs","url":"https://momentjs.com/docs/#/-project-status/","tags":["JavaScript","news","library"],"content":"Moment.jsのプロジェクトステータスについてのドキュメントが追加された。\nMoment.jsに新しい機能の追加などはしないメンテンスモードであるということについてや代替となるライブラリとしてLuxon、Day.js、date-fns、js-jodaの紹介をしている。\nまた、ECMA-402の`Intl`オブジェクトとTemporal Proposalについて紹介している","relatedLinks":[{"title":"Luxon","url":"https://moment.github.io/luxon/"},{"title":"Day.js · 2kB JavaScript date utility library","url":"https://day.js.org/"},{"title":"Manual | js-joda","url":"https://js-joda.github.io/js-joda/"},{"title":"date-fns - modern JavaScript date utility library","url":"https://date-fns.org/"}]},{"category":"Headline","title":"Release 8.0 “President Ose” · postcss/postcss","url":"https://github.com/postcss/postcss/releases/tag/8.0.0","tags":["CSS","library","ReleaseNote","JavaScript"],"content":"PostCSS 8.0リリース。\nNode.js 8以下のサポート終了、ES2015のコードをそのまま配布するように、`postcss.vendor` APIの削除。\nPostCSS Plugin APIの変更、パーサの改善、Source Mapサポートの改善、TypeScriptのサポートなど","relatedLinks":[{"title":"Release 10.0 “Alis volat propriis” · postcss/autoprefixer","url":"https://github.com/postcss/autoprefixer/releases/tag/10.0.0"},{"title":"PostCSS 8.0: Plugin migration guide — Martian Chronicles, Evil Martians’ team blog","url":"https://evilmartians.com/chronicles/postcss-8-plugin-migration"}]},{"category":"Headline","title":"Release v3.0.0 One Piece · vuejs/vue-next","url":"https://github.com/vuejs/vue-next/releases/tag/v3.0.0","tags":[""],"content":"Vue 3.0.0リリース。\nコードベースをTypeScriptで書き直し、コアモジュールのパッケージ化。\nComposition API、Teleport、Fragmentsのサポート。\n実験的なAPIとして`<script setup>`と`<style vars>`のサポート。\n破壊的な変更として`Vue.*`以下のグローバルAPIをインスタンスAPIに移動、Template Directiveの挙動の変更、ライフサイクルオプション名のリネーム、Filterの削除など。\nまた、Vue 3.0.0時点ではIE 11のサポートは含まれていない。","relatedLinks":[{"title":"Evan You // Keynote: Live Free Online Announcement // Vuejs Global Online - YouTube","url":"https://www.youtube.com/watch?v=Vp5ANvd88x0"},{"title":"Introduction | Vue.js","url":"https://v3.vuejs.org/guide/migration/introduction.html"}]},{"category":"Headline","title":"Announcing TypeScript 4.1 Beta | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-1-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.1 Betaリリース。\nTemplate Literal Types、Mapped TypesでKeyのRemappingをサポート、再帰的なConditional Typesのサポート。\nインデックスアクセス時に`undefined`となる可能性を考慮する`noUncheckedIndexedAccess`オプションの追加、`baseUrl`なしで`paths`オプションを指定できるように。\n破壊的な変更として、`new Promise`における`resolve`関数の引数がOptionalではなくなるなど","relatedLinks":[]},{"category":"Headline","title":"Kea 2.2: The TypeScript Release | Kea 2.2","url":"https://kea.js.org/blog/kea-2.2/","tags":["React","JavaScript","library","ReleaseNote"],"content":"React向けのステート管理ライブラリであるKea 2.2リリース。\nTypeScriptのサポート","relatedLinks":[{"title":"TypeScript | Kea 2.2","url":"https://kea.js.org/docs/guide/typescript/"}]},{"category":"Article","title":"JSchallenger","url":"https://www.jschallenger.com/","tags":["JavaScript","tutorial"],"content":"JavaScriptのテストを通るように関数を実装するJavaScriptの練習問題集","relatedLinks":[]},{"category":"Article","title":"How to Simplify SVG Code Using Basic Shapes | CSS-Tricks","url":"https://css-tricks.com/how-to-simplify-svg-code-using-basic-shapes/","tags":["SVG","tutorial"],"content":"SVGを手書きするチュートリアル","relatedLinks":[]},{"category":"Article","title":"Working with JavaScript Media Queries | CSS-Tricks","url":"https://css-tricks.com/working-with-javascript-media-queries/","tags":["JavaScript","CSS","article"],"content":"JavaScriptでのMediaQueryの利用方法について。\n`window.matchMedia`の使い方、`resize`イベントを見る場合とのパフォーマンスの違いについて","relatedLinks":[]},{"category":"Article","title":"Introducing Source Order Viewer in the Microsoft Edge DevTools - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2020/09/15/source-order-viewer-edge-devtools/","tags":["MSEdge","Chrome","debug","article","accessibility"],"content":"MSEdge/Chrome 85に実験的な機能として要素のソースコードにおける順番を表示する機能が追加された。\nCSS Grid/FlexboxなどのCSSの機能で要素の順番を変更しやすくなったため、スクリーンリーダーなどの読み上げで問題が起きるケースを分かりやすくデバッグする機能。\nWCAG C27の\"DOMの順序を表示順序と一致させる\"の実装をデバッグする目的の機能。","relatedLinks":[{"title":"Source Order Matters | Adrian Roselli","url":"https://adrianroselli.com/2015/09/source-order-matters.html"},{"title":"Source Order Viewer in Canary | Adrian Roselli","url":"https://adrianroselli.com/2020/08/source-order-viewer-in-canary.html"},{"title":"C27: Making the DOM order match the visual order | Techniques for WCAG 2.0","url":"https://www.w3.org/TR/WCAG20-TECHS/C27.html"},{"title":"C27: DOM の順序を表示順序と一致させる | WCAG 2.0 達成方法集","url":"https://waic.jp/docs/WCAG-TECHS/C27"}]},{"category":"Article","title":"How to detect fullscreen mode using CSS – Amit Merchant – A blog on PHP, JavaScript and more","url":"https://www.amitmerchant.com/how-to-detect-fullscreen-mode-using-css/","tags":["CSS","JavaScript","article"],"content":"CSS Media Queryを使ってブラウザがフルスクリーンであるかを判定する方法について。\n`display-mode: fullscreen`をMedia Queryを使い判定することでフルスクリーンとなった場合の処理やCSSを実装できる","relatedLinks":[]},{"category":"Article","title":"Managing several displays with the Multi-Screen Window Placement API","url":"https://web.dev/multi-screen-window-placement/","tags":["JavaScript","Chrome","article","WebPlatformAPI"],"content":"Chrome 86でOrigin Trialとして実装されているMulti-Screen Window Placement APIについて。\n複数のスクリーンかの判定、それぞれのスクリーン情報の取得、スクリーン変更の検知、フルスクリーン化するスクリーンの指定についてなど","relatedLinks":[]},{"category":"Article","title":"Rewriting Facebook's \"Recoil\" React library from scratch in 100 lines","url":"https://bennetthardwick.com/blog/recoil-js-clone-from-scratch-in-100-lines/","tags":["JavaScript","React","library","article"],"content":"Recoil的なObserver Patternのステート管理を実装しながら仕組みを見ていく話","relatedLinks":[]},{"category":"WebsiteDocument","title":"flareact/flareact: Edge-rendered React framework built for Cloudflare Workers","url":"https://github.com/flareact/flareact","tags":["React","cdn","library"],"content":"Cloudflare WorkerのEdgeで動くReactフレームワーク","relatedLinks":[{"title":"Rendering React on the Edge with Flareact and Cloudflare Workers","url":"https://blog.cloudflare.com/rendering-react-on-the-edge-with-flareact-and-cloudflare-workers/"}]},{"category":"SoftwareLibrary","title":"nextauthjs/next-auth: Authentication for Next.js","url":"https://github.com/nextauthjs/next-auth","tags":["React","library","OAuth"],"content":"Next.js向けのAuthentication library。\nAuth0、Apple、Facebook、Googleなどいろいろなプロバイダーに対応している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"web-padawan/vanilla-colorful: A tiny color picker custom element for modern web apps","url":"https://github.com/web-padawan/vanilla-colorful","tags":["JavaScript","library","color"],"content":"依存がないカラーピッカーの実装ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"BGJar | Free svg background image generator for your websites","url":"https://bgjar.com/","tags":["SVG","Tools"],"content":"SVGでパターン背景を生成するジェネレーターツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pmndrs/jotai: 👻 Primitive, flexible state management for React","url":"https://github.com/pmndrs/jotai","tags":["JavaScript","React","library"],"content":"RecoilインスパイアなReact向けのステート管理ライブラリ。\nプリミティブな値をAtomでwrap、unwrapするAPIをもつ。\nUtilsとしてAtomを使ったHigh Level APIを提供する","relatedLinks":[]}]},{"meta":{"title":"2020-09-29のJS: 新しいJSXの変換、Content delivery networks (CDNs)、 Atomic CSS-in-JS","author":"azu","layout":"post","date":"2020-09-28T22:45:55.623Z","category":"JSer","tags":["JSX","CSS","CDN","CSS-in-JS"],"url":"https://jser.info/2020/09/29/jsx-content-delivery-networks-cdns-atomic-css-in-js/"},"items":[{"category":"Headline","title":"V8 release v8.6 · V8","url":"https://v8.dev/blog/v8-release-86","tags":["V8","ReleaseNote"],"content":"V8 8.6リリース。\nJavaScriptエンジンのFuzzingツールであるJS-Fuzzerの公開、`Number.prototype.toString`のパフォーマンス改善。\n`Atomics.notify`にリネームされたため`Atomics.wake`の削除、Wasmのパフォーマンス改善など","relatedLinks":[]},{"category":"Headline","title":"Release 10.5.0 - JSX Reloaded · preactjs/preact","url":"https://github.com/preactjs/preact/releases/tag/10.5.0","tags":["React","library","ReleaseNote"],"content":"Preact 10.5.0リリース。\n新しいJSXの変換に対応したRuntimeの追加、 hydrationにおけるSuspend & Resumeの改善など","relatedLinks":[]},{"category":"Headline","title":"Release DOMPurify 2.1.0 · cure53/DOMPurify","url":"https://github.com/cure53/DOMPurify/releases/tag/2.1.0","tags":["DOM","XSS","library","JavaScript","ReleaseNote"],"content":"DOMpurify 2.1.0リリース。\njQueryのメソッドはデフォルトで対応したため`SAFE_FOR_JQUERY`フラグを削除、mXSSの修正とコード整理など","relatedLinks":[]},{"category":"Headline","title":"Firefox 81.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/81.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 81リリース。\niframe要素の`sandbox`属性が`allow-downloads`をサポート、`Content-Disposition` HTTPヘッダにおいてクオートで囲まれていないファイル名に対応。\nJavaScriptのMIMEタイプではないWorkerスクリプトは`new Worker()`で読み込めないように変更など","relatedLinks":[{"title":"Firefox 81 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/docs/Mozilla/Firefox/Releases/81"},{"title":"Worker scripts with wrong MIME type will be blocked from loading with Worker() or SharedWorker() (Breaking) | Firefox Site Compatibility","url":"https://www.fxsitecompat.dev/docs/2020/worker-scripts-with-wrong-mime-type-will-be-blocked-from-loading-with-worker-or-sharedworker/"}]},{"category":"Headline","title":"ESLint v7.10.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2020/09/eslint-v7.10.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 7.10.0リリース。\n`no-inline-comments`に`ignorePattern`オプションの追加など","relatedLinks":[]},{"category":"Article","title":"Introducing the New JSX Transform – React Blog","url":"https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html","tags":["React","jsx","article"],"content":"新しいJSXの変換の仕組みについて。\nReact 17、Babel 7.9.0から対応している。\nコンポーネント内で`import React from \"react\"`が不要となり、パフォーマンスの改善や仕様のシンプル化が目的","relatedLinks":[{"title":"rfcs/0000-create-element-changes.md at createlement-rfc · reactjs/rfcs","url":"https://github.com/reactjs/rfcs/blob/createlement-rfc/text/0000-create-element-changes.md"}]},{"category":"Article","title":"Content delivery networks (CDNs)","url":"https://web.dev/content-delivery-networks/","tags":["network","cdn","performance","article"],"content":"CDNについての記事。\nCDNの仕組み、キャッシュのEvictionとPurging、Private/PublicなリソースでのCache-Control設定、動的/静的なコンテンツにおける設定の考え方。\nキャッシュヒット率(CHR)の計測と改善方法、CDNのパフォーマンス機能としての圧縮/TLS 1.3/minificationについてなど","relatedLinks":[]},{"category":"Article","title":"Feature watch: ECMAScript 2021","url":"https://2ality.com/2020/09/ecmascript-2021.html","tags":["ECMAScript","article"],"content":"ECMAScript 2021に入る予定のProposalまとめ","relatedLinks":[]},{"category":"Article","title":"Detached window memory leaks","url":"https://web.dev/detached-window-memory-leaks/","tags":["JavaScript","DOM","article"],"content":"`window.open`で開いたウィンドウにおけるメモリリークについて。\n切り離したwindowでメモリリークが起きる原理、heap snapshotや`performance.memory` APIでのメモリの増減の見方。\nまたメモリリークを避ける方法としてリファレンスを消す方法、WeakRefを使う方法、直接のリファレンスを持たない方法についてなど","relatedLinks":[]},{"category":"Article","title":"ECMAScript proposal updates @ 2020-09 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2020/09/26/ecmascript-proposal-updat","tags":["ECMAScript","proposal"],"content":"2020年9月のTC39ミーティングで更新されたECMAScript Proposalのまとめ。","relatedLinks":[]},{"category":"Article","title":"Publishing Node modules with TypeScript and ES modules - LogRocket Blog","url":"https://blog.logrocket.com/publishing-node-modules-typescript-es-modules/","tags":["TypeScript","node.js","library","article"],"content":"TypeScriptで書いたライブラリをTree Shakingできるような設定で配布できるようにするチュートリアル。","relatedLinks":[]},{"category":"Article","title":"Atomic CSS-in-JS","url":"https://sebastienlorber.com/atomic-css-in-js","tags":["CSS","JavaScript","article"],"content":"Atomic CSSについての記事。\nutility-firstなCSSを示す言葉だが、命名が難しい問題やutility-firstなライブラリであるTailwindのようなライブラリを使うと未使用のクラスが残る問題などの問題がある。\nCSS-in-JSと組み合わせることでこの問題を解決するatomic CSS-in-JSについて。\n例としてFacebookのStylexについてを紹介している。","relatedLinks":[{"title":"Tech stack rebuild for a new Facebook.com - Facebook Engineering","url":"https://engineering.fb.com/web/facebook-redesign/"},{"title":"Building the New Facebook with React and Relay | Frank Yan - YouTube","url":"https://www.youtube.com/watch?v=9JZHodNR184"}]},{"category":"SoftwareLibrary","title":"balazsbotond/urlcat: A URL builder library for JavaScript.","url":"https://github.com/balazsbotond/urlcat","tags":["JavaScript","URL","library"],"content":"URLの結合(join)、パラメータクエリの生成(query)、置換(subst)するライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"codemix/ts-sql: A SQL database implemented purely in TypeScript type annotations.","url":"https://github.com/codemix/ts-sql","tags":["TypeScript","SQL","library"],"content":"TypeScript 4.1のTemplate Literal Typeを使ってSQL構文からクエリ結果の型を返す型ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sumup-oss/performance-observer: Generic interface for PerformanceObserver API.","url":"https://github.com/sumup-oss/performance-observer","tags":["JavaScript","performance","library"],"content":"Performance Observerのラッパーライブラリ。\n指定したメトリクスを取得するAPIを提供する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jtbennett/create-ts-project: Create Typescript monorepo projects with project references, jest, eslint and prettier configured and ready for development.","url":"https://github.com/jtbennett/create-ts-project","tags":["TypeScript","monorepo","Tools"],"content":"TypeScript monorepo向けの管理ツール。\nTypeScript Project References、Yarn、Jest、ESLint、Pretitterなどが入ったCreact React Appのようなツールを目指している","relatedLinks":[]}]},{"meta":{"title":"2020-10-06のJS: MobX 6.0、Declarative Shadow DOM、ffmpeg.wasm","author":"azu","layout":"post","date":"2020-10-06T03:23:08.350Z","category":"JSer","tags":["MobX","WebComponents","Video"],"url":"https://jser.info/2020/10/06/mobx-6.0-declarative-shadow-dom-ffmpeg.wasm/"},"items":[{"category":"Headline","title":"Node v14.13.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v14.13.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 14.13.0リリース。\n`exports`フィールドで`*`パターンのサポート、CommonJSとESMのinteropに関する実装の追加など","relatedLinks":[]},{"category":"Headline","title":"mobx/CHANGELOG.md at mobx6 · mobxjs/mobx","url":"https://github.com/mobxjs/mobx/blob/mobx6/CHANGELOG.md#600","tags":["JavaScript","library","ReleaseNote"],"content":"MobX 6.0.0リリース。\n`decorate`を削除し、`makeObservable`と`makeAutoObservable`の追加。\nProxy APIなしでも動作するようになるなど。\nDecoratorを使ったコードをマイグレーションするツールとして`mobx-undecorate`も公開している。","relatedLinks":[{"title":"Migrating from MobX 4/5 · MobX","url":"https://mobx.js.org/migrating-from-4-or-5.html#migrating-from-mobx-45-"}]},{"category":"Headline","title":"The npm Blog — Release v7.0.0-rc.0","url":"https://blog.npmjs.org/post/630786103662821376/release-v700-rc0","tags":["npm","ReleaseNote"],"content":"npm 7.0.0 RCリリース","relatedLinks":[]},{"category":"Headline","title":"Bootstrap 5 Alpha 2 | Bootstrap Blog","url":"https://blog.getbootstrap.com/2020/09/29/bootstrap-5-alpha-2/","tags":["CSS","library","ReleaseNote"],"content":"Bootstrap 5 Alpha 2リリース。\n`.carousel-dark`の追加、`.dropdown-menu-dark`の追加、closeボタンのデザイン変更、Utilクラスの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v6.4.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v6.4.0","tags":["Chrome","performance","Tools","ReleaseNote"],"content":"Lighthouse 6.4.0リリース。\n`large-javascript-libraries`のAuditをexperimentalで追加、`unsized-images`のAuditを追加など","relatedLinks":[]},{"category":"Article","title":"JQuery to React: How we rewrote the HelloSign Editor - Dropbox","url":"https://dropbox.tech/application/jquery-to-react--how-we-rewrote-the-hellosign-editor","tags":["jQuery","React","article"],"content":"jQueryで書かれた署名アプリをReactに移行した話。\n移行する際にUIを再設計するべきか、アプリの構造、UIに対するStateの設計、Storybookを使ったデバッグ環境などについて。","relatedLinks":[]},{"category":"Article","title":"Declarative Shadow DOM","url":"https://web.dev/declarative-shadow-dom/","tags":["WebComponents","article"],"content":"Chrome 85に実験フラグ付きで実装されたDeclarative Shadow DOMについて。\n`<template>`要素の`shadowroot`属性で宣言的にShadow Root宣言できる。\nSSRの対応、`getInnerHTML()`でのShadowRootの取得、Custom Elementの`attachShadow()`の挙動、細かい挙動の解説など","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 87)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2020/10/devtools","tags":["Chrome","debug","article"],"content":"Chrome 87のDevToolsの変更点について。\nCSS Gridのデバッグ機能、WebAuthタブの追加、Lighthouse 6.4へのアップデート、resource-typeとurlでのフィルターができるように。\nCOEPとCOOPのレポート先の表示、CSS Overviewでコントラストの問題の表示、ショートカットのカスタマイズができるように","relatedLinks":[]},{"category":"WebsiteDocument","title":"a11yresources - A growing list of accessibility tools and resources","url":"https://a11yresources.webflow.io/","tags":["accessibility","Tools"],"content":"アクセシビリティに関するリソースのまとめ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Indicium: V8 runtime tracer tool · V8","url":"https://v8.dev/blog/system-analyzer","tags":["V8","debug","Tools"],"content":"V8/Chromeの実行ログからInline CacheとMapがどのように動いているかをトレース、デバッグ、分析するツール","relatedLinks":[{"title":"Indicium","url":"https://v8.github.io/tools/head/system-analyzer/"}]},{"category":"SoftwareLibrary","title":"yamalight/graffiti: Minimalistic GraphQL framework","url":"https://github.com/yamalight/graffiti/","tags":["GraphQL","node.js","library"],"content":"fastify/graphql-compose/Mongooseを使ったGraphQLフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bytedance/IconPark: Transform an SVG icon into multiple themes, and generate React icons，Vue icons，svg icons","url":"https://github.com/bytedance/IconPark","tags":["SVG","Vue","React","library"],"content":"SVGアイコン集。\nReact、Vueのコンポーネントとしても利用できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Robot - a fast 1kB functional library for creating Finite State Machines","url":"https://thisrobot.life/","tags":["JavaScript","library"],"content":"ステートマシンでのステート管理ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"happykit/flags: 🏳 Feature Flags for Next.js","url":"https://github.com/happykit/flags","tags":["JavaScript","Next.js","library","webservice"],"content":"Next.js向けのFeature Flag管理ライブラリとウェブサービス","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ffmpegwasm/ffmpeg.wasm: FFmpeg for browser and node, powered by WebAssembly","url":"https://github.com/ffmpegwasm/ffmpeg.wasm","tags":["JavaScript","Image","library","WebAssembly"],"content":"ffmpegをWebAssemblyとして動かすライブラリ","relatedLinks":[]}]},{"meta":{"title":"2020-10-13のJS: Chrome 86、webpack 5、Browserify 17","author":"azu","layout":"post","date":"2020-10-13T01:08:50.516Z","category":"JSer","tags":["Chrome","webpack","browserify"],"url":"https://jser.info/2020/10/13/chrome-86-webpack-5-browserify-17/"},"items":[{"category":"Headline","title":"Node v12.19.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v12.19.0/","tags":["node.js","ReleaseNote"],"content":"Node v12.19.0リリース。\n`import`フィールドのサポート、cryptoモジュールに`randomInt`関数の追加。\n`module.parent`の非推奨化など","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 86  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2020/10/nic86","tags":["Chrome","ReleaseNote"],"content":"Chrome 86リリース。\nFile System Access API、CSS 擬似クラスの`:focus-visible`、Document-Policyヘッダなどのサポート。\nOrigin TrialとしてWebHID API、Multi-Screen Window Placement APIなどのサポート。\nWeb Components v0の削除、FTPサポートの非推奨化。","relatedLinks":[]},{"category":"Headline","title":"Release v9.5.4 · vercel/next.js","url":"https://github.com/vercel/next.js/releases/tag/v9.5.4","tags":["Next.js","React","JavaScript","library","ReleaseNote"],"content":"Next.js 9.5.4リリース。\nオープンリダイレクト脆弱性のセキュリティ修正","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 114 | WebKit","url":"https://webkit.org/blog/11300/release-notes-for-safari-technology-preview-114/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 114リリース。\n`Intl.DateTimeFormat`の`dateStyle`/`timeStyle`/`dayPeriod`のサポート、`Intl.Segmenter`のサポート。\nPaint Timingの有効化、WebGL2の有効化、`loading=lazy`の実装など","relatedLinks":[]},{"category":"Headline","title":"Release v17.0.0 · browserify/browserify","url":"https://github.com/browserify/browserify/releases/tag/v17.0.0","tags":["browserify","ReleaseNote"],"content":"Browserify 17.0.0リリース。\nshimライブラリの`events`、`path`、`stream`、`util`をNode.js 10+互換となるようにアップデート。\n`.json`ファイルのrequire時にJSONのバリデーションを行うように","relatedLinks":[]},{"category":"Headline","title":"Webpack 5 release (2020-10-10) | webpack","url":"https://webpack.js.org/blog/2020-10-10-webpack-5-release/","tags":["webpack","ReleaseNote"],"content":"webpack 5リリース。\n破壊的な変更として、自動的なNode.jsのpolyfillの削除、デフォルトの出力コードにES2015が含まれるように、非推奨のオプションの削除やオプション名の変更など。\n機能追加として、filesystem cache、Asset modules、JSON Modules、`import.meta`、Worker script、Module Federation、Async modulesのサポート。\nまた、`target`オプションが`browserslist`をサポート、CommonJSのTree Shakingをサポート、コード生成とTree Shakingの改善など","relatedLinks":[{"title":"To v5 from v4 | webpack","url":"https://webpack.js.org/migrate/5/"},{"title":"webpack@5の主な変更点まとめ - 技術探し","url":"https://blog.hiroppy.me/entry/webpack5"}]},{"category":"Headline","title":"webpack-cli/CHANGELOG.md at master · webpack/webpack-cli","url":"https://github.com/webpack/webpack-cli/blob/master/CHANGELOG.md#400-2020-10-10","tags":["webpack","console","Tools"],"content":"webpack-cli 4.0.0リリース。\nwebpack 5に対応、Webpack Bundle Analyzerを実行する`--analyze`フラグの追加、`--env`フラグの追加、`init`コマンドの追加など","relatedLinks":[{"title":"webpack-cli/packages/webpack-cli at master · webpack/webpack-cli","url":"https://github.com/webpack/webpack-cli/tree/master/packages/webpack-cli"},{"title":"webpack-contrib/webpack-bundle-analyzer: Webpack plugin and CLI utility that represents bundle content as convenient interactive zoomable treemap","url":"https://github.com/webpack-contrib/webpack-bundle-analyzer"}]},{"category":"Headline","title":"Release v5.9.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v5.9.0","tags":["npm","Tools","ReleaseNote"],"content":"pnpm 5.9.0リリース。\nYarnのPlug'n'Playをサポート、`symlink`を無効化できる設定の追加など","relatedLinks":[]},{"category":"Article","title":"Gaining security and privacy by partitioning the cache  |  Web","url":"https://developers.google.com/web/updates/2020/10/http-cache-partitioning","tags":["Chrome","HTTP","article"],"content":"Chrome 86でのCache partitioningについて。\n今まではアクセスするリソースのURLのみでCache Keyを構成していたが、今後はアクセス元のサイトなどもCache Keyに利用されるという話。\nアクセス元のサイトとアクセスするリソースのURLのDouble-keying、アクセス元のサイトとiframeのサイトとアクセスするリソースのURLのTriple-keyingのキャッシュについて","relatedLinks":[{"title":"shivanigithub/http-cache-partitioning","url":"https://github.com/shivanigithub/http-cache-partitioning/"}]},{"category":"Article","title":"Bringing the browser developer tools to Visual Studio Code - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2020/10/01/microsoft-edge-tools-vscode/","tags":["MSEdge","VSCode","plugin"],"content":"Microsoft Edge Tools for VS Code extensionリリース。\nVSCode内でMSEdgeを使ったプレビュー、デバッグができる。\nヘッドレスモードの対応、Networkパネルの対応などをしている","relatedLinks":[]},{"category":"Article","title":"Understanding TypeScript Generics — Smashing Magazine","url":"https://www.smashingmagazine.com/2020/10/understanding-typescript-generics/","tags":["TypeScript","tutorial","article"],"content":"TypeScriptのGenericsについての記事。\nGenericsの使い方、ユースケースについて","relatedLinks":[]},{"category":"Article","title":"Using WebXR With Babylon.js — Smashing Magazine","url":"https://www.smashingmagazine.com/2020/10/using-webxr-with-babylonjs/","tags":["WebXR","WebGL","article","tutorial"],"content":"WebXRについてのチュートリアル。\nWebXR、3DoF、6DoFの解説。\nbabylon.jsを使ったWebXRのシーンの作成、デバッグ方法について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"doc22940/browserslist-user-agent-regexp","url":"https://github.com/doc22940/browserslist-user-agent-regexp","tags":["JavaScript","browser","library","Tools"],"content":"`browserslist`の定義からサポートするブラウザのUser Agentにマッチする正規表現を出力するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"boa-dev/boa: Boa is an embeddable and experimental Javascript engine written in Rust. Currently, it has support for some of the language.","url":"https://github.com/boa-dev/boa","tags":["JavaScript","Rust","library"],"content":"Rustで書かれたJavaScriptエンジン。\nRustのプロジェクトに組み込んだり、JavaScriptインタープリタをWebAssemblyとして動かすことができる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"awslabs/diagram-maker: A library to display an interactive editor for any graph-like data.","url":"https://github.com/awslabs/diagram-maker","tags":["aws","JavaScript"],"content":"AWSのダイアグラムエディタ。\nライブラリとして利用でき、プラグインで拡張可能になっていて、UIはPreactとReduxを使って書かれている。","relatedLinks":[{"title":"Diagram Maker: Open sourcing IoT visualization | AWS Open Source Blog","url":"https://aws.amazon.com/jp/blogs/opensource/diagram-maker-open-sourcing-iot-visualization/"}]},{"category":"SoftwareLibrary","title":"tuananh/camaro: camaro is an utility to transform XML to JSON, using Node.js binding to native XML parser pugixml, one of the fastest XML parser around.","url":"https://github.com/tuananh/camaro","tags":["JavaScript","XML","JSON","library","WebAssembly"],"content":"XMLをJSONに変換するライブラリ。\nC++で書かれていてWebAssemblyにコンパイルしたものを利用するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"RDambrosio016/RSLint: A (WIP) Extremely fast JavaScript linter and Rust crate","url":"https://github.com/RDambrosio016/RSLint","tags":["Rust","JavaScript","eslinn"],"content":"Rustで書かれたJavaScript Lintツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"RocktimSaikia/meta-fetcher: 🔎 Tiny URL meta-data fetcher(scrapper) for Node.js","url":"https://github.com/RocktimSaikia/meta-fetcher","tags":["node.js","library"],"content":"ウェブサイトのメタ情報を取得するnode-fetchベースのスクレイピングライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mljs/ml: Machine learning tools in JavaScript","url":"https://github.com/mljs/ml","tags":["MachineLearning","JavaScript","library"],"content":"機械学習向けのツールを集めたライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Schniz/fnm: 🚀 Fast and simple Node.js version manager, built in Rust","url":"https://github.com/Schniz/fnm","tags":["node.js","Tools","Rust"],"content":"Rustで書かれたNode.jsのバージョン管理ツール。","relatedLinks":[]}]},{"meta":{"title":"2020-10-19のJS: Babel 7.12.0、 Chrome 87 Beta、npm 7リリース","author":"azu","layout":"post","date":"2020-10-19T12:35:28.894Z","category":"JSer","tags":["babel","chrome","npm"],"url":"https://jser.info/2020/10/19/babel-7.12.0-chrome-87-beta-npm-7/"},"items":[{"category":"Headline","title":"Release v5.1.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.1.0","tags":["webpack","ReleaseNote"],"content":"webpack 5.1.0リリース。\n`cleverMerge`、`EntryOptionPlugin`、`DynamicEntryPlugin`をPublic APIに変更。\ntry-catch内で`require`を使ってモジュールの有無を判定する処理がエラーとなる問題の修正","relatedLinks":[{"title":"[","url":"https://github.com/webpack/webpack/issues/11639"}]},{"category":"Headline","title":"7.12.0 Released: TypeScript 4.1, strings as import/export names, and class static blocks · Babel","url":"https://babeljs.io/blog/2020/10/15/7.12.0","tags":["babel","ReleaseNote"],"content":"Babel 7.12.0リリース。\nTypeScript 4.1のサポート、\nStage 2 proposalのClass static blocksのサポート。\nimport/export名の扱いをECMAScriptの変更に追従、Import assertionsのパースをプラグインに切り出しなど","relatedLinks":[]},{"category":"Headline","title":"Node v14.14.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v14.14.0/","tags":["node.js","ReleaseNote"],"content":"Node v14.14.0リリース。\n`fs.rm`の追加、`res.setHeader`などでヘッダを配列として渡せるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 87 Beta: WebAuthn in DevTools, Pan/Tilt/Zoom, Flow Relative Shorthands and More","url":"https://blog.chromium.org/2020/10/chrome-87-beta-webauthn-in-devtools.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 87ベータリリース。\nDevToolsにWebAuthnタブを追加、カメラのpan/tilt/zoomのサポート、cross-origin isolationのサポート改善。\nまた、`isInputPending`、Service WorkerでRangeリクエストのサポート、`postMessage`で渡せるTransferable Streamsのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Presenting v7.0.0 of the npm CLI - The GitHub Blog","url":"https://github.blog/2020-10-13-presenting-v7-0-0-of-the-npm-cli/","tags":["npm","ReleaseNote"],"content":"npm 7リリース。\n破壊的な変更として、peerDependenciesの自動インストール、package-lock.jsonの形式変更とyarn.lockのサポート、`npm audit`の出力内容の変更。\n機能追加として、Workspacesのサポート、`npm exec`の追加など","relatedLinks":[{"title":"Release v7.0.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v7.0.0"}]},{"category":"Article","title":"min(), max(), and clamp(): three logical CSS functions to use today","url":"https://web.dev/min-max-clamp/","tags":["CSS","article"],"content":"CSSの`min()`、`max()`、`clamp()`関数についての記事。","relatedLinks":[]},{"category":"Article","title":"GraphQLの基礎の基礎 - Qiita","url":"https://qiita.com/shotashimura/items/3f9e04b93e79592030a4","tags":["node.js","JavaScript","GraphQL","article"],"content":"Node.jsでのGraphQL APIサーバの実装についての記事","relatedLinks":[]},{"category":"Article","title":"Create TypeScript declarations from JavaScript and JSDoc - Human Who Codes","url":"https://humanwhocodes.com/snippets/2020/10/create-typescript-declarations-from-javascript-jsdoc/","tags":["TypeScript","JavaScript","article"],"content":"JSDocからTypeScriptの型定義ファイルを生成する方法について。\nTypeScriptの出力オプションで`emitDeclarationOnly`と`allowJs`を組み合わせることでJSDocからd.tsファイルを作成できる","relatedLinks":[]},{"category":"Article","title":"Video processing with WebCodecs","url":"https://web.dev/webcodecs/","tags":["JavaScript","WebPlatformAPI","Chrome","article"],"content":"Chrome 86でOrigin Trialとして導入されたWebCodecsについて。\n動画と音声のエンコードとデコードができるAPI。\n`VideoTrackReader`、`VideoEncoder`、`VideoDecoder`について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Liaison – A love story between the frontend and the backend","url":"https://liaison.dev/","tags":["JavaScript","node.js","library"],"content":"バックエンド、フロントエンドを含んだフルスタックなJavaScriptフレームワーク。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"samizdatco/skia-canvas: A canvas environment for Node.js","url":"https://github.com/samizdatco/skia-canvas","tags":["node.js","canvas","library"],"content":"Skiaを使ったNode.jsでのCanvas実装","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sciter – Multiplatform HTML/CSS UI Engine for Desktop and Mobile Application","url":"https://sciter.com/","tags":["JavaScript","HTML","CSS","software"],"content":"アプリ組み込み向けのHTML/CSSエンジン。\nバイナリサイズが小さいアプリを作るためのフレームワークで、HTML/CSSのサブセットとスクリプトエンジンをもっている。","relatedLinks":[{"title":"Open Source Sciter Engine by Andrew Fedoniouk (a.k.a. c-smile) — Kickstarter","url":"https://www.kickstarter.com/projects/c-smile/open-source-sciter-engine?ref=thanks-tweet"}]},{"category":"SoftwareLibrary","title":"MTG/essentia.js: JavaScript library for music/audio analysis and processing powered by WebAssembly","url":"https://github.com/MTG/essentia.js","tags":["JavaScript","WebAssembly","C++","library"],"content":"C++で書かれた音声/音楽処理ライブラリであるEssentiaをWebAssemblyにコンパイルしたJavaScriptラッパーライブラリ。","relatedLinks":[{"title":"Essentia","url":"https://essentia.upf.edu/"}]},{"category":"SoftwareLibrary","title":"TimvanScherpenzeel/detect-gpu: Classifies GPUs based on their 3D rendering benchmark score allowing the developer to provide sensible default settings for graphically intensive applications.","url":"https://github.com/TimvanScherpenzeel/detect-gpu","tags":["JavaScript","WebGL","library","performance"],"content":"WebGLを使った3DレンダリングのベンチマークからGPUの判定、クラス分けをするライブラリ","relatedLinks":[]},{"category":"Book","title":"フロントエンド開発入門 プロフェッショナルな開発ツールと設計・実装 | 安達 稜, 武田 諭 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4798061778/","tags":["HTML","CSS","JavaScript","book","Tools"],"content":"2020年10月9日発売\nウェブフロントエンドとエコシステムについての書籍","relatedLinks":[]},{"category":"Book","title":"accrefs - Webアクセシビリティの参考資料まとめ","url":"https://accrefs.jp/","tags":["accessibility","links"],"content":"ウェブアクセシビリティについての資料をまとめたページ","relatedLinks":[]}]},{"meta":{"title":"2020-10-27のJS: React 17、Node v15.0.0、LibSass is Deprecated","author":"azu","layout":"post","date":"2020-10-27T03:03:13.305Z","category":"JSer","tags":["React","Node.js","sass"],"url":"https://jser.info/2020/10/27/react-17-node-v15.0.0-libsass-is-deprecated/"},"items":[{"category":"Headline","title":"React v17.0 – React Blog","url":"https://reactjs.org/blog/2020/10/20/react-v17.html","tags":["React","JavaScript","ReleaseNote","library"],"content":"React 17.0リリース。\n複数のバージョンを同時に動かして段階的なアップグレードを目的としたリリース。\n関連してイベントのdelegateの仕組みの変更、新しいJSXの変換に対応している。\n新しいJSXの変換については0.14.x, 15.x, 16.xへバックポートされている","relatedLinks":[]},{"category":"Headline","title":"Firefox 82.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/82.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 82リリース。\nserver-sent eventsのinspectのサポート、Media Session APIのデフォルト有効化、起動時のパフォーマンスの改善など。\nまた、クロスオリジンでの`window.name`は常に空文字列を返すように変更された","relatedLinks":[{"title":"Firefox 82 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/82"},{"title":"Coming through with Firefox 82 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/10/coming-through-with-firefox-82/"}]},{"category":"Headline","title":"Introducing Microsoft Edge preview builds for Linux - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2020/10/20/microsoft-edge-dev-linux/","tags":["MSEdge","linux","news"],"content":"MSEdge Dev ChannelのLinuxビルドが公開された","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · facebook/create-react-app","url":"https://github.com/facebook/create-react-app/releases/tag/v4.0.0","tags":["React","Tools","ReleaseNote"],"content":"create-react-app 4.0.0リリース。\nReact 17/新しいJSXの変換の対応、TypeScript 4、ESLint 6、Jest 26へアップデート。\nFast Refresh、workboxの対応改善、Web Vitalsレポート対応の追加など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 115 | WebKit","url":"https://webkit.org/blog/11333/release-notes-for-safari-technology-preview-115/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 115リリース。\nWeb Audio APIをprefixなしに変更、`HTMLMediaElement.setSinkId`のサポート、CSS `math-style`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node v15.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v15.0.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 15.0リリース。\n破壊的な変更としてN-API 7へアップデート、npm 7へアップデート、V8 8.6へアップデート、\n`unhandledRejection=throw`をデフォルトに変更、URLの仕様追従。\nAbortControllerとEventTargetのサポート、`crypto`モジュールがWeb Crypto APIをサポート。\nまた、`timers/promise`と`stream/promises`の追加、実験的な機能としてQUICのサポート。","relatedLinks":[{"title":"Node.js v15.0.0 is here!. This blog was written by Bethany… | by Node.js | Oct, 2020 | Medium","url":"https://nodejs.medium.com/node-js-v15-0-0-is-here-deb00750f278"},{"title":"Node.js v15 の主な変更点 - 別にしんどくないブログ","url":"https://shisama.hatenablog.com/entry/2020/10/21/004612"},{"title":"10月20日にメジャーアップデートとしてリリースされたNode.js v15の紹介 | watilde's blog","url":"https://blog.watilde.com/2020/10/20/node-js-v15/"},{"title":"Node.js 15 release: Updated handling of rejections, npm 7, N-API Version 7, and more – IBM Developer","url":"https://developer.ibm.com/blogs/nodejs-15-release-blog/"}]},{"category":"Headline","title":"Sass: LibSass is Deprecated","url":"https://sass-lang.com/blog/libsass-is-deprecated","tags":["Sass","news"],"content":"C++で書かれたLibSass(`node-sass`)が非推奨となった。\nDartで書かれたDartSass(`sass`)がメインで開発され、LibSassは機能追加や新しい構文のサポートはしないメンテナンスモードとなっている。","relatedLinks":[{"title":"sass/libsass: A C/C++ implementation of a Sass compiler","url":"https://github.com/sass/libsass"},{"title":"sass/dart-sass: The reference implementation of Sass, written in Dart.","url":"https://github.com/sass/dart-sass"}]},{"category":"Article","title":"ブラウザとNode.jsで動く1kBのキーバリューストレージライブラリを書いた | Web Scratch","url":"https://efcl.info/2020/10/23/kvs/","tags":["JavaScript","TypeScript","library","article"],"content":"ファイルサイズが小さなKey-Valueストレージライブラリ。\nブラウザ(IndexedDB、LocalStorage)、Node.js(ファイル)で動作し、マイグレーションAPI、TypeScriptでのスキーマをサポートしている","relatedLinks":[{"title":"azu/kvs: Lightweight key-value storage library for Browser, Node.js, and In-Memory.","url":"https://github.com/azu/kvs"}]},{"category":"Article","title":"Cumulative Layout Shift in Practice | NicJ.net","url":"https://nicj.net/cumulative-layout-shift-in-practice/","tags":["browser","performance","article"],"content":"Cumulative Layout Shift (CLS)について。\nCLSとはどのようなメトリクスなのか、適正なスコアとその計算式、CLSが悪いとどのような問題が起きやすいのかについて。\nRUMとSyntheticでの計測ツールやライブラリ、Chrome Dev Toolsでのデバッグ方法について","relatedLinks":[]},{"category":"WebsiteDocument","title":"npm public roadmap","url":"https://github.com/npm/roadmap/projects/1","tags":["npm","Github","document"],"content":"npmのロードマップ","relatedLinks":[{"title":"Introducing the npm public roadmap and a new feedback process - The GitHub Blog","url":"https://github.blog/2020-10-22-introducing-the-npm-public-roadmap-and-a-new-feedback-process/"}]},{"category":"WebsiteDocument","title":"Redirection from Internet Explorer to Microsoft Edge for compatibility with modern web sites | Microsoft Docs","url":"https://docs.microsoft.com/en-us/deployedge/edge-learnmore-neededge","tags":["IE","MSEdge","browser","document"],"content":"IEと非互換のサイトをIEで閲覧したときに、MSEdgeへ自動的にリダイレクトされる仕組みがMSEdge 87に入った。\n非互換かどうかはMicrosoftのリスト管理で判定される。また自動的にリダイレクトするかどうかはグループポリシーで設定できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bytedance/bytemd: A hackable Markdown editor component built with Svelte","url":"https://github.com/bytedance/bytemd","tags":["JavaScript","Markdown","editor","library"],"content":"Svelteで書かれたmarkdownエディタライブラリ。UIフレームワークなしで動かすことができ、React、Vue向けのバインディングが用意されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sinclairzx81/typebox: JSON Schema Type Builder with Static Type Resolution for TypeScript","url":"https://github.com/sinclairzx81/typebox","tags":["TypeScript","JSON","library"],"content":"JSON SchemaをTypeScriptで定義するbuilder関数を提供するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sysgears/webpack-virtual-modules: Webpack Virtual Modules is a webpack plugin that lets you create, modify, and delete in-memory files in a way that webpack treats them as if they were physically presented in the file system.","url":"https://github.com/sysgears/webpack-virtual-modules","tags":["webpack","plugin"],"content":"webpackでビルド時に特定のパスに特定のコードがあるように見せるwebpack plugin。\nwebpackのビルド中に仮想的なモジュールを追加できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"developit/snarkdown: A snarky 1kb Markdown parser written in JavaScript","url":"https://github.com/developit/snarkdown","tags":["Markdown","JavaScript","library","HTML"],"content":"ファイルサイズが小さなMarkdown to HTMLライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"piscinajs/piscina: A fast, efficient Node.js Worker Thread Pool implementation","url":"https://github.com/piscinajs/piscina","tags":["node.js","JavaScript","library"],"content":"Node.js向けのworker poolライブラリ。\nmjsのサポート、AbortControllerを使ったキャンセルのサポート、バックプレッシャーなどをサポートしている","relatedLinks":[{"title":"Learning to Swim with Piscina, the node.js worker pool","url":"https://www.nearform.com/blog/learning-to-swim-with-piscina-the-node-js-worker-pool/"}]}]},{"meta":{"title":"2020-11-03のJS: Node v14.15.0 (LTS)、Deno 1.5.0、Next.js 10","author":"azu","layout":"post","date":"2020-11-03T03:01:42.286Z","category":"JSer","tags":["Node.js","Deno","Next.js"],"url":"https://jser.info/2020/11/03/node-v14.15.0-lts-deno-1.5.0-next.js-10/"},"items":[{"category":"Headline","title":"Node v14.15.0 (LTS) | Node.js","url":"https://nodejs.org/ja/blog/release/v14.15.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 14.15.0リリース。\nNode.js 14のLTS(Long Term Support)となるバージョン。\nNode.js 14は2023年4月までサポートされる","relatedLinks":[{"title":"nodejs/Release: Node.js Release Working Group","url":"https://github.com/nodejs/Release"}]},{"category":"Headline","title":"Release v1.5.0 · denoland/deno","url":"https://github.com/denoland/deno/releases/tag/v1.5.0","tags":["deno","ReleaseNote"],"content":"Deno 1.5.0リリース。\n破壊的な変更として`isolatedModules`がデフォルトで有効化されている。\n`deno bundle --no-check`のサポート、型チェックしない場合はswcを使うことで高速化、`alert`/`confirm`/`promp`のサポートなど","relatedLinks":[{"title":"swc","url":"https://github.com/swc-project/swc"},{"title":"TypeScript compiler in Rust · Issue #5432 · denoland/deno","url":"https://github.com/denoland/deno/issues/5432#issuecomment-716890189"},{"title":"Deno 1.5 Release Notes","url":"https://deno.land/posts/v1.5"}]},{"category":"Headline","title":"Blog - Next.js 10 | Next.js","url":"https://nextjs.org/blog/next-10","tags":["Next.js","ReleaseNote"],"content":"Next.js 10リリース。\n画像の最適化とImage CDNからの読み込みに対応する`next/image`の追加、i18n Routingの対応。\nReact 17の対応、Fast Refreshの対応改善、Dynamic Routing時に`next/link`に対して`as`が多くのケースで不要に、`@next/codemod`コマンドの追加など","relatedLinks":[{"title":"next/image | Next.js","url":"https://nextjs.org/docs/api-reference/next/image"},{"title":"Advanced Features: Internationalized Routing | Next.js","url":"https://nextjs.org/docs/advanced-features/i18n-routing"}]},{"category":"Headline","title":"JavaScript Standard Style","url":"https://standardjs.com/changelog.html#1600---2020-10-28","tags":["ESLint","ReleaseNote"],"content":"Standard JS 16.0.0リリース。\nglobやフォルダ指定の挙動をESLintと合わせるように、`extensions`オプションのサポート、React/JSXに関するルールの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v4.4.0 · slevithan/xregexp","url":"https://github.com/slevithan/xregexp/releases/tag/v4.4.0","tags":["JavaScript","RegExp","library","ReleaseNote"],"content":"xRegExp v4.4.0 リリース。\nUnicode 13.0.0にアップデート、TypeScriptに対応、IE11 + core-js 3.6.0+での無限ループの修正","relatedLinks":[]},{"category":"Article","title":"pprof を使って nodejs アプリケーションのプロファイルを取る - その手の平は尻もつかめるさ","url":"https://moznion.hatenadiary.com/entry/2020/10/05/121259","tags":["node.js","performance","Tools","article"],"content":"pprof-nodejsを使ってNode.jsアプリケーションのプロファイルを取得してpprofツールで見る方法について","relatedLinks":[{"title":"google/pprof-nodejs: pprof support for Node.js","url":"https://github.com/google/pprof-nodejs"}]},{"category":"Article","title":"JSエコシステムぶらり探訪(4): npmとコマンドライン - Qiita","url":"https://qiita.com/qnighy/items/faddc72389f6c94421e1","tags":["npm","yarn","article"],"content":"`npx`/`npm exec`/`yarn exec`の動作、npmとyarnのライフサイクルスクリプトの実行順序、`npm link`/`yarn link`の挙動についてなど","relatedLinks":[]},{"category":"Article","title":"JavaScript's Memory Management Explained","url":"https://felixgerschau.com/javascript-memory-management/","tags":["JavaScript","performance","article"],"content":"JavaScriptでのメモリ管理について","relatedLinks":[]},{"category":"Article","title":"MDN Web Docs evolves! Lowdown on the upcoming new platform - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/10/mdn-web-docs-evolves-lowdown-on-the-upcoming-new-platform/","tags":["mdn","article","translate"],"content":"MDNの今後について。\nアーキテクチャやワークフローをWikiベースからGitHubベースに変更。\n初期リリースでは既存のローカライズ済みの記事はアーカイブとなりPRでの変更はできない、今後は主要なページと言語においての機械翻訳やコミュニティでの手動翻訳の対応を検討しているという話。","relatedLinks":[]},{"category":"WebsiteDocument","title":"dbohdan/classless-css: A list of classless CSS themes/frameworks with screenshots","url":"https://github.com/dbohdan/classless-css","tags":["CSS","library","links"],"content":"クラスをつけないでHTML要素自体にスタイルをあてるCSSテーマ/フレームワークのまとめ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mongodb-js/boxednode: 📦 boxednode – Ship a JS file with Node.js in a box","url":"https://github.com/mongodb-js/boxednode","tags":["node.js","library","Tools"],"content":"Node.jsアプリケーションをシングルバイナリ化するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"aidenybai/lucia: 🟪 Tiny library for tiny web apps.","url":"https://github.com/aidenybai/lucia","tags":["JavaScript","DOM","UI","library"],"content":"VueやAlpine.jsのようにDOMにテンプレートを書いてデータバインディングするViewライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jlfwong/speedscope: 🔬 A fast, interactive web-based viewer for performance profiles.","url":"https://github.com/jlfwong/speedscope","tags":["JavaScript","Tools","performance"],"content":"flamegraphビューアー。\nブラウザの開発者ツールのプロファイル、Ruby/Python/Goなどのプロファイルの読み込みに対応している","relatedLinks":[]},{"category":"Book","title":"\"SurviveJS - Webpack\" - Further webpack 5 updates","url":"https://survivejs.com/blog/webpack-book-webpack-5-updates/","tags":["webpack","book"],"content":"webpackについて電子書籍であるSurviveJSがwebpack5に対応した","relatedLinks":[]},{"category":"Book","title":"O'Reilly Japan - ハンズオンNode.js","url":"https://www.oreilly.co.jp/books/9784873119236/","tags":["node.js","book"],"content":"2020年11月17日発売\nNode.jsの入門書","relatedLinks":[]},{"category":"Book","title":"O'Reilly Japan - ハンズオンJavaScript","url":"https://www.oreilly.co.jp/books/9784873119229/","tags":["JavaScript","book"],"content":"2020年11月17日発売\nJavaScriptの入門書","relatedLinks":[]}]},{"meta":{"title":"2020-11-10のJS: Socket.IO 3.0.0、core-js 3.7.0、SvelteKit","author":"azu","layout":"post","date":"2020-11-10T02:59:14.907Z","category":"JSer","tags":["WebSocket","polyfill","svelte"],"url":"https://jser.info/2020/11/10/socket.io-3.0.0-core-js-3.7.0-sveltekit/"},"items":[{"category":"Headline","title":"Announcing TypeScript 4.1 RC | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-1-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.1 RCリリース。\n Template Literal Types、Mapped TypesでKeyのRemappingをサポート、再帰的なConditional Typesのサポート。 インデックスアクセス時に`undefined`となる可能性を考慮する`noUncheckedIndexedAccess`オプションの追加。\n`baseUrl`なしで`paths`オプションが利用可能に、`checkJs`は暗黙的に`allowJs`を有効化するように、新しいJSXの変換に対応。\n破棄的な変更として`Promise`の`resolve`の引数がオプショナルではなくなるなど","relatedLinks":[]},{"category":"Headline","title":"Release 3.7.0 - 2020.11.06 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.7.0","tags":["JavaScript","polyfill","library","ReleaseNote"],"content":"core-js 3.7.0リリース。\nECMAScript/Proposalの仕様に準拠した変更、Node.jsでの`queueMicroTask`の実行順序の問題を修正、一部環境でのバグを修正など","relatedLinks":[]},{"category":"Headline","title":"Node v15.1.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v15.1.0/","tags":["node.js","ReleaseNote"],"content":"Node v15.1.0リリース。\n診断ツール向けの`diagnostics_channel`モジュールを実験的に追加、`spawn`イベントの追加。\n`dns`モジュールに`setLocalAddress`の追加`v8`モジュールに`takeCoverage`と`stopCoverage`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release 3.0.0 · socketio/socket.io-client","url":"https://github.com/socketio/socket.io-client/releases/tag/3.0.0","tags":["WebSocket","library","ReleaseNote"],"content":"Socket.IO 3.0リリース。\n`maxHttpBufferSize`が100MBから1MBに変更、CORSの設定方法の変更、Cookieをデフォルトでは使わないように、APIの変更など。\nまたコードベースをTypeScriptで書き直し、`onAny`/`offAny`の追加、socket.io-msgpack-parserを同梱など","relatedLinks":[{"title":"Socket.IO 3 Release | Socket.IO","url":"https://socket.io/blog/socket-io-3-release/"},{"title":"Migrating from 2.x to 3.0 | Socket.IO","url":"https://socket.io/docs/migrating-from-2-x-to-3-0/"}]},{"category":"Article","title":"Tracing TypeScript Compiler. はじめに | by Yosuke Kurami | Oct, 2020 | Medium","url":"https://quramy.medium.com/tracing-typescript-compiler-4dcb96ab54e1","tags":["TypeScript","performance","article"],"content":"TypeScriptのコンパイルパフォーマンスの調査方法について。\n4.1で追加される`--generateTrace`を使ったプロファイルデータの読み方について","relatedLinks":[]},{"category":"Article","title":"What's the deal with SvelteKit?","url":"https://svelte.dev/blog/whats-the-deal-with-sveltekit","tags":["Svelte","article"],"content":"Svelte上に作られているNext.jsライクなSapperがSvelte自体に統合されSvelteKitとなる予定について。\nRollupとSnowpackを使ったモジュール単位のビルド方式となり、Adaptorによって各種プラットフォームに対応した形でアプリを生成できる用になる予定との話。","relatedLinks":[]},{"category":"Article","title":"Building a type checked url router from scratch","url":"https://ja.nsommer.dk/articles/type-checked-url-router.html","tags":["TypeScript","article"],"content":"TypeScript 4.1で実装されるTemplate Typeを使って、文字列でのルーティングに対して型をつける方法を見ていく記事","relatedLinks":[]},{"category":"Article","title":"Top problems I got switching to Vue 3 – Ghiura Alexandru","url":"https://ghalex.com/2020/11/03/top-problems-i-got-switching-from-vue-2-to-3/","tags":["Vue","article"],"content":"Vue 2からVue 3への移行でのハマりどころについての記事。\n`v-model`のデフォルトプロパティ名の変更、フィルターの廃止、Vue.useを使っている外部コンポーネントがある問題について","relatedLinks":[]},{"category":"Article","title":"Code-splitting and minimal edge latency: the perfect match | Fastly","url":"https://www.fastly.com/blog/code-splitting-and-minimal-edge-latency-the-perfect-match","tags":["React","performance","article"],"content":"create-react-appで作られたエディタアプリのパフォーマンス改善について。\nコードエディタにmonaco-editorを使いメインのJSが大きくなっているため、chunkに分離する話。\nまたchunkのようなscriptに対しては`prefetch`や`preload`は逆効果になる場合もある問題やread-onlyの場合でもmonaco-editorを読み込んでいる問題について。\nread-onlyの場合はPrismJSを使ってシンタックスハイライトだけのコンポーネントにすることでサイズを小さくする話","relatedLinks":[]},{"category":"SoftwareLibrary","title":"krzkaczor/ts-essentials: All basic TypeScript types in one place 🤙","url":"https://github.com/krzkaczor/ts-essentials","tags":["TypeScript","library"],"content":"TypeScriptの型ユーティリティライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sql-js/sql.js: A javascript library to run SQLite on the web.","url":"https://github.com/sql-js/sql.js/","tags":["SQLite","WebAssembly","library","JavaScript"],"content":"SQLiteをWebAssemblyにコンパイルしてJavaScriptで動かすライブラリ。\n既存のsqliteファイルをimport/exportできる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mattpocock/sextant: A development tool to chart application flows, then implement them in code","url":"https://github.com/mattpocock/sextant","tags":["JavaScript","Tools","graphic","GraphQL"],"content":"シーケンス図のGUIエディタでデータフローとGraphQLのPayloadを入力し、対応するTypeScriptの型を生成するツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gajus/http-terminator: Gracefully terminates HTTP(S) server.","url":"https://github.com/gajus/http-terminator","tags":["node.js","library","server"],"content":"expressなどのNode.jsの`http.Server`の実装に対してgraceful shutdownを行うライブラリ","relatedLinks":[]},{"category":"Book","title":"Distributed Systems with Node.js - Thomas Hunter II","url":"https://thomashunter.name/distributed-systems-with-nodejs","tags":["node.js","book","performance","server"],"content":"2020年11月4日発売\nNode.jsアプリケーションでの分散システムについて。\nNode.jsで書いたアプリケーションのでのobservable, scalable, resilientについて書かれている","relatedLinks":[]},{"category":"Book","title":"Lets start TypeScript ~Vue3 + Express で TypeScript 入門してみよう~","url":"https://zenn.dev/is_ryo/books/10ef5a30196e16110bc1","tags":["Vue","TypeScript","PostgreSQL","node.js","express","tutorial"],"content":"Express + PostgresSQL + Vue + TypeScriptでTodoアプリを作るチュートリアル","relatedLinks":[]}]},{"meta":{"title":"2020-11-16のJS: Angular 11、Reactアプリの最適化、TypeScriptを採用して学んだこと","author":"azu","layout":"post","date":"2020-11-16T00:28:55.656Z","category":"JSer","tags":["React","Angular","ESLint","performance","ECMAScript"],"url":"https://jser.info/2020/11/16/angular-11-react-typescript/"},"items":[{"category":"Headline","title":"Node v15.2.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v15.2.0/","tags":["node.js","ReleaseNote"],"content":"Node v15.2.0リリース。\r\n`events`にイベント名を指定してリスナーを取得する`getEventListeners`の追加、`fs`の`writeFile`/`readFile`がAbortSignal対応など","relatedLinks":[]},{"category":"Headline","title":"Bootstrap 5 Alpha 3 | Bootstrap Blog","url":"https://blog.getbootstrap.com/2020/11/11/bootstrap-5-alpha-3/","tags":["CSS","library","ReleaseNote"],"content":"Bootstrap 5 Alpha 3リリース。\r\n`.card`ベースのアコーディオンの代わりとなる`.accordion`の追加、`.btn-block`の削除、Utilitiesクラスの追加など","relatedLinks":[]},{"category":"Headline","title":"Version 11 of Angular Now Available | by Mark Techson | Nov, 2020 | Angular Blog","url":"https://blog.angular.io/version-11-of-angular-now-available-74721b7952f7","tags":["Angular","ReleaseNote"],"content":"Angular 11リリース。\r\nフォントの自動インライン化の対応、Component Test Harnessesがすべてのコンポーネントに対応、Language Serviceの対応改善、HMRをCLIの引数で有効化できるように。\r\nその他には、webpack5の実験的サポートなど","relatedLinks":[{"title":"angular/CHANGELOG.md at master · angular/angular","url":"https://github.com/angular/angular/blob/master/CHANGELOG.md#1100-2020-11-11"}]},{"category":"Headline","title":"Release v0.22.0 · ryansolid/solid","url":"https://github.com/ryansolid/solid/releases/tag/v0.22.0","tags":["DOM","JavaScript","library","ReleaseNote"],"content":"UI作成ライブラリのsolid v0.22.0リリース。\r\n`splid-js/dom`を非推奨化し、`solid-js/web`を代わりに利用。\r\n`dev`オプションのサポート、CDNのJSだけで動かせるように`solid-js/html`などを同梱、`renderToWebStream`や`createMutable`の追加など","relatedLinks":[]},{"category":"Headline","title":"Lunuy/iterable-weak: Iterable WeakSet / WeakMap using ES2021 WeakRef","url":"https://github.com/Lunuy/iterable-weak","tags":["JavaScript","library","ECMAScript"],"content":"WeakRefを使ったIterableなWeakMap/WeakSetの実装ライブラリ。\r\nIterateできるように要素を参照するが、WeakRefのFinalizationRegistryを使って参照を解放するようになっている","relatedLinks":[]},{"category":"Article","title":"What's New In DevTools (Chrome 88)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2020/11/devtools","tags":["Chrome","article"],"content":"Chrome 88の開発者ツールの変更点について。\r\nCSS angleのビジュアライズ、AVIFがサポートされていない状態をエミュレートできるように、storage quota sizeのエミュレートに対応。\r\nPerformanceパネルにWeb Vitalsレーンを追加、ApplicationパネルにCross-Origin Isolatedの状態を表示、network initiatorのコピーに対応。\r\n実験的な機能としてCSS Flexboxのデバッグ機能、ショートカットカスタマイズを追加など","relatedLinks":[]},{"category":"Article","title":"Optimize React Apps PageSpeed Insights Score - thetuteur","url":"https://thetuteur.com/optimize-react-apps-pagespeed-insights-score/","tags":["React","performance","article"],"content":"Reactアプリのパフォーマンス改善。\r\n未使用のJavaScriptを削除、コンポーネントのLazy Load、TTFBを短縮するためにレスポンスのキャッシュ。\r\n`react-lazy-load-image-component`を使って画像の遅延ロード、`react-lazy-hydration`を使い初期ロードでのCPU処理を減らす方法。\r\nまた、CSSの非同期ロード、`critical`を使ってUAごとに対してクリティカルパスCSSの生成などについて","relatedLinks":[]},{"category":"Article","title":"TypeScript: Prefer Interfaces — @ncjamieson","url":"https://ncjamieson.com/prefer-interfaces/","tags":["TypeScript","article"],"content":"TypeScriptの`type`と`interface`の違いについて。\r\n`interface`は名前で参照されるのに対して、`type`で定義した型はインライン化されることがある。そのため`type`を使った場合に`d.ts`が肥大化する問題について","relatedLinks":[{"title":"10 Insights from Adopting TypeScript at Scale | Tech At Bloomberg","url":"https://www.techatbloomberg.com/blog/10-insights-adopting-typescript-at-scale/"}]},{"category":"Article","title":"Performance · microsoft/TypeScript Wiki","url":"https://github.com/microsoft/TypeScript/wiki/Performance","tags":["TypeScript","performance","article"],"content":"TypeScriptのコンパイルパフォーマンスについてまとめられているページ。\r\n`type`と`interface`、Base TypeとUnion Type、Project Reference、tsconfig.jsonの設定による最適化について","relatedLinks":[]},{"category":"Article","title":"Angular: ESLintサポートの現状 2020 Autumn | <output type=text>","url":"https://blog.lacolaco.net/2020/11/angular-state-of-linting-2020/","tags":["Angular","ESLint","article"],"content":"AgularにおけるTSLint/ESLintでのLintの今後について。\r\nTSLintはAngular 12で非推奨となる予定で、ESLintへの対応はコミュニティベースで進んでいるという話","relatedLinks":[{"title":"angular-eslint/angular-eslint: Monorepo for all the tooling related to using ESLint with Angular","url":"https://github.com/angular-eslint/angular-eslint"}]},{"category":"Article","title":"Official Google Webmaster Central Blog: Timing for bringing page experience to Google Search","url":"https://webmasters.googleblog.com/2020/11/timing-for-page-experience.html","tags":["google","SEO","performance","article","search"],"content":"2021年5月からCore Web Vitals(LCP、FID、CLS)のスコアがGoogle検索結果のシグナルに使われる。\r\nウェブパフォーマンスが検索結果のランキングへ影響を与えるようになる","relatedLinks":[]},{"category":"Article","title":"microsoft/Web-Dev-For-Beginners: 24 Lessons, 12 Weeks, Get Started as a Web Developer","url":"https://github.com/microsoft/Web-Dev-For-Beginners","tags":["HTML","CSS","JavaScript","tutorial"],"content":"ウェブ開発のチュートリアル集、レッスン。HTML/CSS/JSについてやアプリ開発についての学習コンテンツ","relatedLinks":[]},{"category":"SlideVideo","title":"Next.js Conf 2020 - YouTube","url":"https://www.youtube.com/playlist?list=PLBnKlKpPeagnT2Cmv4giCbosfrbKnuYTD","tags":["Next.js","video","Conference"],"content":"Next.js Conf 2020の動画一覧","relatedLinks":[]},{"category":"WebsiteDocument","title":"ESM","url":"https://esm.sh/","tags":["ECMAScript","JavaScript","deno","cdn","library"],"content":"esbuildで依存を含めてbundleしたパッケージを配布するnpm CDNサービス。\r\nnpmパッケージをdenoからES Modulesとして読み込めるようにpolyfillの仕組みも用意されている","relatedLinks":[]},{"category":"WebsiteDocument","title":"open-source-labs/Recoilize: Recoil developer tool","url":"https://github.com/open-source-labs/Recoilize","tags":["JavaScript","debug","Tools","React"],"content":"recoilのデバッグツール","relatedLinks":[]},{"category":"WebsiteDocument","title":"acot-a11y/acot: More accessible web, all over the world.","url":"https://github.com/acot-a11y/acot","tags":["ESLint","accessibility","Tools"],"content":"ESLintライクなプラグインシステムをもったAccessibilityテストフレームワーク。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"trivago/prettier-plugin-sort-imports: A prettier plugin to sort imports in typescript and javascript files by the provided RegEx order.","url":"https://github.com/trivago/prettier-plugin-sort-imports","tags":["JavaScript","plugin"],"content":"import文の順番をソートするprettier plugin","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vinissimus/next-translate: i18n tool for Next.js 10 🌍 - Load page translations and use them in an easy way!","url":"https://github.com/vinissimus/next-translate","tags":["Next.js","i18n","library"],"content":"Next.js向けのi18nツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"angular-eslint/angular-eslint: Monorepo for all the tooling related to using ESLint with Angular","url":"https://github.com/angular-eslint/angular-eslint","tags":["Angular","ESLint"],"content":"Angular向けのESLintプラグインセット。\r\nCodelyzer/TSLintからのマイグレーションを目的にしている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"felixfbecker/dom-to-svg: Library to convert a given HTML DOM node into an accessible SVG \"screenshot\".","url":"https://github.com/felixfbecker/dom-to-svg","tags":["DOM","SVG","JavaScript","library"],"content":"`<foreignObject>`を使わずに、DOMからSVGを作成するライブラリ。\r\nDOM上のWAI-ARIAやリンクなども維持した状態のSVGを作成する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"davnicwil/react-frontload: Async data loading for React components, on client & server","url":"https://github.com/davnicwil/react-frontload","tags":["React","library","server"],"content":"React向けのData Loaderライブラリ。\r\nコンポーネントでAPIを叩いてデータの取得、取得中の表示を扱える。クライアントとサーバでそれぞれ対応するAPIを用意してhydrationも扱える","relatedLinks":[]},{"category":"SoftwareLibrary","title":"alephjs/aleph.js: The React Framework in Deno.","url":"https://github.com/alephjs/aleph.js","tags":["deno","React","library"],"content":"Deno向けのReactを使ったNext.jsライクなフレームワーク","relatedLinks":[]},{"category":"Book","title":"JavaScriptモダンプログラミング完全ガイド \\[堅牢なコードを効率的に開発できる! \\] (impress top gearシリーズ) | Cay S. Horstmann, 吉川 邦夫 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4295010561/","tags":["JavaScript","book"],"content":"2020年12月21日発売\r\nModern JavaScript for the Impatientの翻訳本","relatedLinks":[{"title":"Amazon | Modern JavaScript for the Impatient (English Edition) ","url":"https://www.amazon.co.jp/dp/B08F5HFWBH/"}]}]},{"meta":{"title":"2020-11-22のJS: Tailwind CSS v2.0、Electron 11.0.0、TypeScript 4.1、playwright-test","author":"azu","layout":"post","date":"2020-11-22T02:57:36.494Z","category":"JSer","tags":["Chrome","browser","proposal","security","XSS"],"url":"https://jser.info/2020/11/22/tailwind-css-v2.0-electron-11.0.0-typescript-4.1-playwright-test/"},"items":[{"category":"Headline","title":"Tailwind CSS v2.0 – Tailwind CSS","url":"https://blog.tailwindcss.com/tailwindcss-v2","tags":["CSS","library","ReleaseNote"],"content":"Tailwind CSS 2.0リリース。\r\n破壊的な変更としてIE11のサポートを終了、Node 10以下のサポートを終了、一部クラス名の変更など。\r\n機能追加としてカラーパレットの追加、ダークモードのサポート、`2xl` breakpointの追加。\r\nフォーム向けのプラグインとして`@tailwindcss/forms`の追加、`@apply`の対応改善、`overflow-ellipsis`と` overflow-clip`の追加など","relatedLinks":[]},{"category":"Headline","title":"Firefox 83 is upon us - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/11/firefox-83-is-upon-us/","tags":["Firefox","ReleaseNote"],"content":"Firefox 83リリース。\r\n開発者ツールで`scroll`のデバッグ改善、\r\nCSS `conic-gradient`関数のサポート、WebRenderのサポート対象の追加など","relatedLinks":[{"title":"Firefox 83 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/docs/Mozilla/Firefox/Releases/83"}]},{"category":"Headline","title":"Electron 11.0.0 | Electron Blog","url":"https://www.electronjs.org/blog/electron-11-0","tags":["Electron","ReleaseNote"],"content":"Electron 11.0.0リリース。\r\nChromium 87/V8 8.7/Node.js 12.18.3へアップデート。\r\nApple M1のサポート、`app.createThumbnailFromPath()`、`webContents.forcefullyCrashRenderer()`の追加など","relatedLinks":[{"title":"Release electron v11.0.0 · electron/electron","url":"https://github.com/electron/electron/releases/tag/v11.0.0"}]},{"category":"Headline","title":"New in Chrome 87  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2020/11/nic87","tags":["Chrome","ReleaseNote"],"content":"Chrome 87リリース。\r\nDevToolsにWebAuthnタブを追加、カメラのpan/tilt/zoomのサポート、Service WorkerでRangeリクエストのサポート。\r\nCookie Store API、`Intl.Segmenter`、`isInputPending`、`postMessage`にStreamsを渡せるようになるなど。\r\nまた、FTPをデフォルトで無効化。","relatedLinks":[{"title":"Chrome Platform Status","url":"https://www.chromestatus.com/features#milestone%3D87"}]},{"category":"Headline","title":"Announcing TypeScript 4.1 | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-1/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.1リリース。\r\nTemplate Literal Types、Mapped TypesでKeyのRemappingをサポート、再帰的なConditional Typesのサポート。 インデックスアクセス時に`undefined`となる可能性を考慮する`noUncheckedIndexedAccess`オプションの追加。\r\n`baseUrl`なしで`paths`オプションを指定できるように、新しいJSXの変換に対応。\r\n破壊的な変更として、`new Promise`における`resolve`関数の引数がOptionalではなくなるなど","relatedLinks":[]},{"category":"Headline","title":"Prettier 2.2: new JavaScript parsers, TS 4.1 and ESM standalone bundles · Prettier","url":"https://prettier.io/blog/2020/11/20/2.2.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 2.2.リリース。\r\nJavaScriptで`espree`と`meriyah`のパーサをサポート、TypeScript 4.1サポート、standalone版を同梱するようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 116 | WebKit","url":"https://webkit.org/blog/11348/release-notes-for-safari-technology-preview-116/","tags":["webkit","safari","ReleaseNote"],"content":"Safari Technology Preview 116リリース。\r\nAudioWorklet APIをデフォルトで有効化、MediaRecorderの改善、Storage Access APIをper frameからper pageに変更など","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2020-11 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2020/11/22/ecmascript-proposal-updat","tags":["ECMAScript","proposal","news"],"content":"2020-11におけるTC39 MeetingでのECMAScript Proposalのステータ変更のまとめ","relatedLinks":[]},{"category":"Article","title":"Back/forward cache","url":"https://web.dev/bfcache/","tags":["Chrome","article"],"content":"Chrome 87(Android)からcross-siteにおけるナビゲーションでBFCacheが有効化される。\r\nBFCacheの動作、BFCacheで表示されたかの判定方法、BFCacheされない条件とBFCacheからの処理の再開方法について。\r\nまた、Google Analyticsのアクセス解析とBFCache、パフォーマンス計測に対する影響についてなど","relatedLinks":[]},{"category":"Article","title":"Web 技術の調査方法 | blog.jxck.io","url":"https://blog.jxck.io/entries/2020-11-19/how-to-track-web-standards.html","tags":["article","browser","spec","proposal"],"content":"ウェブ技術に関連する仕様、ステータス、議論内容の調べ方について。\r\nBrowser、IETF、W3C/WHAWG、TC39について","relatedLinks":[]},{"category":"SlideVideo","title":"BlackFan/client-side-prototype-pollution: Prototype Pollution and useful Script Gadgets","url":"https://github.com/BlackFan/client-side-prototype-pollution","tags":["JavaScript","security","XSS"],"content":"Prototype Pollution攻撃の事例を集めたリポジトリ。\r\nさまざまなライブラリに対してのPrototype Pollutionのコード例をまとめている","relatedLinks":[]},{"category":"SlideVideo","title":"PrimeFaces – Ultimate UI Framework","url":"https://www.primefaces.org/","tags":["Angular","React","Vue","library","UI","Java"],"content":"Angular, React, Vue, JSFに対応したUIフレームワーク","relatedLinks":[]},{"category":"WebsiteDocument","title":"101arrowz/fflate: High performance (de)compression in an 8kB package","url":"https://github.com/101arrowz/fflate","tags":["JavaScript","library"],"content":"deflate,gzip,zlibのcompress/decompressをサポートしているライブラリ。\r\nファイルサイズの小ささとパフォーマンスを主な目的としていて、Workerでの非同期処理にも対応している","relatedLinks":[]},{"category":"WebsiteDocument","title":"microsoft/playwright-test: Build a cross-browser end-to-end test suite with Playwright.","url":"https://github.com/microsoft/playwright-test","tags":["E2E","browser","test","library"],"content":"Playwrightを使ったE2Eテストフレームワーク。\r\nJestライクなAssertion、PlaywrightとFolioを使ったテスト、Snapshotテストとしてビジュアルテスティングをサポートしている。","relatedLinks":[{"title":"microsoft/folio: A customizable test framework to build your own test frameworks","url":"https://github.com/microsoft/folio"}]},{"category":"SoftwareLibrary","title":"mkay581/cookie-store: A polyfill for the Cookie Store API","url":"https://github.com/mkay581/cookie-store","tags":["JavaScript","library","polyfill"],"content":"Cookie Store API のPolyfillライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"microsoft/folio: A customizable test framework to build your own test frameworks","url":"https://github.com/microsoft/folio","tags":["JavaScript","library","testing"],"content":"テストフレームワークを作るためのテストフレームワーク。\r\nTest Fixture、Annotation APIでFlaky Testsの宣言やリトライ、テストの生成などを行える","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kuu/hls-parser: A simple library to read/write HLS playlists","url":"https://github.com/kuu/hls-parser","tags":["HLS","JavaScript","library"],"content":"HLS playlistのパーサ、ジェネレーターライブラリ。\r\nApple Low-Latency HLS形式もサポートしている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ceifa/wasmoon: A real lua VM with JS bindings made with webassembly","url":"https://github.com/ceifa/wasmoon","tags":["JavaScript","library","Lua"],"content":"Lua VMをWebAssemblyに変換して、JavaScriptからLuaのコードを実行するライブラリ。","relatedLinks":[]}]},{"meta":{"title":"2020-12-01のJS: Workbox v6.0.0、TS auto mock、TypeScriptToLua","author":"azu","layout":"post","date":"2020-12-01T02:26:58.030Z","category":"JSer","tags":["Tools","node.js","TypeScript","git","plugin"],"url":"https://jser.info/2020/12/01/workbox-v6.0.0-ts-auto-mock-typescripttolua/"},"items":[{"category":"Headline","title":"Release v5.0.0 · typicode/husky","url":"https://github.com/typicode/husky/releases/tag/v5.0.0","tags":["JavaScript","git ","Tools","ReleaseNote"],"content":"git hook管理ツールのhusky 5.0.0リリース。`npm install husky@next`でインストールできる。\nライセンスをMITからLicense Zero Parity + MITに変更。\nGit 2.9+の`core.hooksPath`を使ったGit Hookの仕組みに変更、インストール時に自動でHook有効化はせずに明示的に`husky install`で有効化するように変更など","relatedLinks":[{"title":"Patron License 1.0.0","url":"https://patronlicense.com/versions/1.0.0"}]},{"category":"Headline","title":"Storybook 6.1","url":"https://storybook.js.org/blog/storybook-6-1/","tags":["JavaScript","UI","Tools","ReleaseNote","React","Angular"],"content":"Storybook 6.1リリース。\nビルドパフォーマンスの改善、Asynchronous loadersの追加、React 17の対応、Angular 11の対応など","relatedLinks":[]},{"category":"Headline","title":"Node v12.20.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v12.20.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 12.20.0リリース。\nNode.js 14からのbackportが中心。\n`fs.FSWatcher`に`ref()`と`unref()`を追加、`http.Agent`に`scheduling`オプションの追加、package.jsonでexports patternsのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 3.8.0 - 2020.11.26 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.8.0","tags":["JavaScript","polyfill","library","ReleaseNote"],"content":"core-js 3.8.0リリース。\n`Array#at`、`Number.range`、`Array.filterOut`、`Array#uniqueBy`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release Workbox v6.0.0 · GoogleChrome/workbox","url":"https://github.com/GoogleChrome/workbox/releases/tag/v6.0.0","tags":["ServiceWorker","ReleaseNote","JavaScript","library"],"content":"Workbox 6.0.0リリース。\nwebpack 5の対応、Strategy/Pluginの仕組みの変更、`workbox-recipes`パッケージの追加など。\nWorkboxの`skipWaiting`はDeprecatedとなり、Service Workerの`self.skipWaiting()`を使うのを推奨するようになるなど","relatedLinks":[]},{"category":"Article","title":"How To Secure Node.js Applications with a Content Security Policy | DigitalOcean","url":"https://www.digitalocean.com/community/tutorials/how-to-secure-node-js-applications-with-a-content-security-policy","tags":["node.js","CSP","article"],"content":"Node.jsアプリでのCSP実装についてのチュートリアル記事。\nCSPの設定方法、フォントや画像などの埋め込み許可の例、Nonceの設定、CSP Reporting APIとレポートの受け取り方法についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"Operator Lookup - Search JavaScript operators","url":"https://www.joshwcomeau.com/operator-lookup/","tags":["JavaScript","search","ECMAScript","Tools"],"content":"JavaScriptの演算子の意味を検索できるサイト","relatedLinks":[]},{"category":"WebsiteDocument","title":"funbox/harold: Compares frontend project bundles","url":"https://github.com/funbox/harold","tags":["JavaScript","Tools"],"content":"プロジェクトのフロントエンド周りのファイルサイズなどのスナップショットを取り、スナップショット同士を比較できるツール。\nプロジェクトのファイルサイズやビルド時間の変化などを計測できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Typescript-TDD/ts-auto-mock: Typescript transformer to unlock automatic mock creation for interfaces and classes","url":"https://github.com/Typescript-TDD/ts-auto-mock","tags":["TypeScript","plugin","test"],"content":"TypeScriptの型定義から自動的にモックをつくるTypeScript Plugin。\nttypescriptとts-patchを経由したTypeSriptのtransformとして動作する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"optoolco/tonic: A Low Profile Component Framework. Stable, Minimal, Auditable, and Build-Tool-Free.","url":"https://github.com/optoolco/tonic","tags":["WebComponents","library"],"content":"Web Componentsフレームワーク。\nコンポーネントの作成、`html`メソッドでのJSXライクなテンプレート、Proposでの値渡し、State、ライフサイクルイベントをもつ。\nビルドせずに使える。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Package Phobia","url":"https://packagephobia.com/","tags":["JavaScript","node.js","npm","webservice"],"content":"npmパッケージの依存を含めたインスールサイズ、パッケージのみのサイズを取得できるウェブサービス","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lukeed/uvu: uvu is an extremely fast and lightweight test runner for Node.js and the browser","url":"https://github.com/lukeed/uvu","tags":["node.js","JavaScript","browser","testing","library"],"content":"実行速度を目的にしたテストフレームワーク。\nテストファイル自体が実行でき、Native ES Modulesのサポート、ブラウザでも動作する。\n`test`と`suite`メソッド、`uvu/assert`モジュールを持っている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"FormidableLabs/urql: The highly customizable and versatile GraphQL client with which you add on features like normalized caching as you grow.","url":"https://github.com/FormidableLabs/urql","tags":["GraphQL","JavaScript","library"],"content":"GraphQLクライアントライブラリ。\nGraphQLへのリクエスト、キャッシュ、Reactなどのライブラリに対応している。\nExchangesという拡張の仕組みやデバッグ用の開発者ツールを持っている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"panva/jose: Universal \"JSON Web Almost Everything\" - JWA, JWS, JWE, JWT, JWK with no dependencies","url":"https://github.com/panva/jose","tags":["JWT","JavaScript","library"],"content":"UniversalなJWA, JWS, JWE, JWT, JWKの実装ライブラリ。\nブラウザではWeb Cryptography APIを利用している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"TypeScriptToLua","url":"https://typescripttolua.github.io/","tags":["TypeScript","Lua","Tools"],"content":"TypeScriptで書いてLuaのコードを出力するツール。\n既存Luaコードに対しては型定義ファイルで対応し、TypeScriptを使った型安全とIDEサポートを得た状態でLuaのコードを生成できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"talentlessguy/tinyhttp: ⚡ 0-legacy, tiny & fast web framework as a replacement of Express","url":"https://github.com/talentlessguy/tinyhttp","tags":["express","JavaScript","library"],"content":"express-likeなAPIを持つNode.jsウェブフレームワーク。\nexpress middlewareとの互換性を持ち、async functionをサポートしている","relatedLinks":[]}]},{"meta":{"title":"2020-12-08のJS: Snowpack 3.0 RC、WMR、State of CSS 2020","author":"azu","layout":"post","date":"2020-12-08T01:55:04.916Z","category":"JSer","tags":["Tools","Chrome","CSS","ESLint","HTML"],"url":"https://jser.info/2020/12/08/snowpack-3.0-rc-wmr-state-of-css-2020/"},"items":[{"category":"Headline","title":"Release v6.5.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v6.5.0","tags":["Chrome","Tools","ReleaseNote"],"content":"Lighthouse v6.5.0リリース。\nLCPとなる要素がPreloadされているかを判定する`preload-lcp-image`のAuditを追加など","relatedLinks":[]},{"category":"Headline","title":"Snowpack v3.0 Release Candidate","url":"https://www.snowpack.dev/posts/2020-12-03-snowpack-3-release-candidate","tags":["JavaScript","bundler","Tools","ReleaseNote"],"content":"snowpack 3.0 RCリリース。\nnpmパッケージの`import`をSkypackのCDN経由でダウンロードするStreaming NPM Importsのサポート、esbuildを使った最適化のサポート。\nDevサーバのルーティングサポート、snowpackのJavaScript　APIの変更など","relatedLinks":[]},{"category":"Headline","title":"The npm Blog — Release v7.1.0","url":"https://blog.npmjs.org/post/636604708661886976/release-v710","tags":["npm","ReleaseNote"],"content":"npm 7.1.0リリース。\n`package.json`の`scripts`を書き換える`npm set-script`コマンドの追加、引数なしの`npm exec`にインタラクティブモードの追加など","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 88: Digital Goods, Lighting Estimation in Augmented Reality, and More","url":"https://blog.chromium.org/2020/12/chrome-88-digital-goods-lighting.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 88 betaリリース。\n`target=_blank`のリンクを暗黙的に`rel=noopener`として扱うように、`addEventListener`に`signal`オプションの追加、CSS `aspect-ratio`のサポート。\n`Permissions-Policy` Headerのサポート、FTPサポートの削除、Web Components v0の削除など","relatedLinks":[]},{"category":"Headline","title":"Release v1.1.0 · aframevr/aframe","url":"https://github.com/aframevr/aframe/releases/tag/v1.1.0","tags":["WebXR","JavaScript","library","ReleaseNote"],"content":"WebXRフレームワークのAFrame v1.1.0リリース。\nWebXR compositor layers、WebXR DOM Overlays、WebXR immersive navigation、WebXR hand trackingのサポート。\nOculus Quest 2のコントローラーのサポートなど","relatedLinks":[]},{"category":"Article","title":"A Deep Dive Into CSS Grid minmax()","url":"https://ishadeed.com/article/css-grid-minmax/","tags":["CSS","article"],"content":"CSS Gridの`minmax()`、`autofit`、`autofill`について。","relatedLinks":[]},{"category":"Article","title":"フロントエンド（React Testing Library）で TDD（テスト駆動開発）をする","url":"https://zenn.dev/higa/articles/34439dc279c55dd2ab95","tags":["JavaScript","tutorial","test","article"],"content":"JavaScriptでTDDをしながら実装を書いていくチュートリアル記事。","relatedLinks":[]},{"category":"Article","title":"Web Performance Calendar » Human performance metrics","url":"https://calendar.perfplanet.com/2020/human-performance-metrics/","tags":["performance","article"],"content":"RUMでのパフォーマンスモニタリングとパフォーマンスに関するユーザーアンケートの結果に相関があったというWikipediaでの話。\nページの読み込み時間の中央値が120ミリ秒増加すると、ユーザー満足度が2％低下するなどわずかな変化でも満足度に影響が出たという話。","relatedLinks":[]},{"category":"SlideVideo","title":"Learning from Mini Apps—W3C TPAC Breakout Session","url":"https://blog.tomayac.com/2020/11/05/learning-from-mini-apps-w3c-tpac-breakout-session/","tags":["slide","JavaScript"],"content":"中国のMini Appsについてのスライド。\nMini Appsの仕組みや実装方法、Dev Toolsでのデバッグ方法、パーミッションやセキュリティモデルについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"The State of CSS 2020","url":"https://2020.stateofcss.com/en-US/","tags":["CSS","アンケート"],"content":"The State of CSS 2020のアンケート結果が公開された。\nCSSの機能ごとの認知、Preprocessorの選択、CSSフレームワークの利用状況、方法論、CSS-in-JS、ツール、リソースなどの項目についてアンケート結果が公開されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"yeonjuan/html-eslint: ESLint plugin for linting HTML","url":"https://github.com/yeonjuan/html-eslint","tags":["ESLint","HTML","Tools"],"content":"ESLint上でHTMLのLintをするプラグインとルール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"preactjs/wmr: 👩‍🚀 The tiny all-in-one development tool for modern web apps.","url":"https://github.com/preactjs/wmr","tags":["React","Tools","JavaScript"],"content":"RollupベースのJSやCSSのビルド、開発サーバ、Prerenderなどの機能を持ったウェブフロント開発ツールキット","relatedLinks":[]},{"category":"SoftwareLibrary","title":"naugtur/debugging-aid: Experimental tools for debugging Node.js apps without pausing","url":"https://github.com/naugtur/debugging-aid","tags":["node.js","debug","library"],"content":"Node.jsの`perf_hooks`などを使ったrequireするだけでinstrumentsを仕込めるモジュール集","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Beaker Browser 1.0","url":"https://beakerbrowser.com/2020/12/02/beaker-1-0.html","tags":["browser","p2p","Hypercore","software"],"content":"Hypercore Protocol(aka. dat)を扱うブラウザであるBeaker Browser 1.0リリース。\nHypercore Protocolを使ったP2Pでサイトを作成でき、サイトのフォーク、共有できる","relatedLinks":[]}]},{"meta":{"title":"2020-12-17のJS: Deno 1.6(deno compile)、Firefox 84/MDNの刷新、Chrome Developer Summit 2020","author":"azu","layout":"post","date":"2020-12-17T03:00:18.014Z","category":"JSer","tags":["Chrome","performance","node.js","document","browser"],"url":"https://jser.info/2020/12/17/deno-1.6deno-compile-firefox-84mdn-chrome-developer-summit-2020/"},"items":[{"category":"Headline","title":"Node v15.4.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v15.4.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 15.4.0リリース。\n`child_process.execFile`/EventTarget/StreamがAbortSignalをサポート、`response.setHeader`がメソッドチェーンできるように。\nExperimentalとして`worker_threads`モジュールにBroadcastChannelを実装など。","relatedLinks":[]},{"category":"Headline","title":"Deno 1.6 Release Notes","url":"https://deno.land/posts/v1.6","tags":["deno","ReleaseNote"],"content":"Deno 1.6リリース。\n`deno compile`でバイナリを出力できるように、`deno lsp`でDenoビルトインのLSPが利用できるように、TypeScript 4.1へアップデート。\nまた、Deno 1.5で初期値が`true`となった`isolatedModules`の設定を変更できないようになるなど","relatedLinks":[]},{"category":"Headline","title":"Announcing Nexus 1.0: A Major Release for Type-Safe, Code-First GraphQL APIs","url":"https://www.prisma.io/blog/announcing-the-release-of-nexus-schema-v1-b5eno5g08d0b","tags":["prisma","GraphQL","library","ReleaseNote"],"content":"コードファーストなGraphQL APIサーバであるNexus 1.0リリース。\nnullableの扱いを変更、ドキュメントサイトの刷新、JSDoでのドキュメントサポートなど","relatedLinks":[{"title":"graphql-nexus/nexus: Code-First, Type-Safe, GraphQL Schema Construction","url":"https://github.com/graphql-nexus/nexus"}]},{"category":"Headline","title":"Release v3! (But technically 3.2.0 😂) · tannerlinsley/react-query","url":"https://github.com/tannerlinsley/react-query/releases/tag/v3.2.0","tags":["React","JavaScript","library","ReleaseNote"],"content":"React Query 3リリース。\n`QueryCache`と`QueryClient`の分離、`useInfiniteQuery`が両方向をサポート、`react-query-devtools`は`react-query`パッケージに同梱されるように","relatedLinks":[{"title":"Migrating to React Query 3 | React Query | TanStack","url":"https://react-query.tanstack.com/guides/migrating-to-react-query-3"}]},{"category":"Headline","title":"And now for … Firefox 84 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/12/and-now-for-firefox-84/","tags":["Firefox","ReleaseNote"],"content":"Firefox 84リリース。\nAccessiblity Inspectorに\"Tabbing Order\"の表示を追加、`PerformancePaintTiming`のサポート。\nAppCacheの削除、`http://localhost`などのループバックアドレスから読まれたリソースをMixed Contentとして扱わないように変更など","relatedLinks":[{"title":"Firefox 84 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/docs/Mozilla/Firefox/Releases/84"}]},{"category":"Headline","title":"Release 4.0.0 · facebook/flux","url":"https://github.com/facebook/flux/releases/tag/4.0.0","tags":["Flux","JavaScript","library","ReleaseNote"],"content":"flux 4.0.0リリース。\nflux自体はメンテナンスモードとなっている。\nfbjsのアップデート、Babel 7との互換性に関する修正、React 17をPeerDependenciesに追加","relatedLinks":[]},{"category":"Headline","title":"Welcome Yari: MDN Web Docs has a new platform - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/12/welcome-yari-mdn-web-docs-has-a-new-platform/","tags":["mdn","news","document"],"content":"MDNの新しいバージョン(Yari)が公開された。\nGitHubとMarkdownを使ったコンテンツ管理となり、Jamstackアプローチなサイト構成になる。\n翻訳に関しては初期の方針を変更し、日本語/中国語/フランス語のTier 1言語に関しては手動での翻訳を受け付けられるようにする。","relatedLinks":[{"title":"MDN Web Docs","url":"https://developer.mozilla.org"},{"title":"An update on MDN Web Docs’ localization strategy - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2020/12/an-update-on-mdn-web-docs-localization-strategy/"}]},{"category":"Headline","title":"v1.10.0: New Compiler Options API, Resize and Screenshot Support for Child Windows | TestCafe","url":"https://devexpress.github.io/testcafe/blog/v1-10-0-new-compiler-options-api-resize-and-screenshot-support-for-child-windows.html","tags":["browser","testing","E2E","ReleaseNote"],"content":"TestCafe v1.10.0リリース。\nChild Windowのスクリーンショットやリサイズのサポート、TypeScript CompilerオプションのAPIを追加、Shadow DOMへアクセスするメソッドの追加など","relatedLinks":[]},{"category":"Article","title":"Roadmap 2021 (2020-12-08) | webpack","url":"https://webpack.js.org/blog/2020-12-08-roadmap-2021/","tags":["webpack","article"],"content":"webpackの今後のロードマップについて。\nエッジケースへの対応、ESMの対応改善、モジュールとしてのCSSやHTML、エントリポイントとしてのHTML。\nSource Mapのパフォーマンス改善、Nodeの`exports`などの対応、CommonJSのTree Shakingの改善、マルチスレッドの対応など。\nいろいろな項目を検討しているという話","relatedLinks":[]},{"category":"Article","title":"polyfill を深堀りする - mizdra's blog","url":"https://www.mizdra.net/entry/2020/12/05/234806","tags":["JavaScript","polyfill","library","article"],"content":"polyfill、transpile、shimの違いについて。","relatedLinks":[]},{"category":"Article","title":"AddyOsmani.com - The Import On Interaction Pattern","url":"https://addyosmani.com/blog/import-on-interaction/","tags":["JavaScript","performance","article"],"content":"ユーザーがUIを必要となったタイミングで、リソースを遅延ロードするという話。\nクリックしたタイミングでウィジェットをロードして表示するなど。いろいろなサイトの事例ごとに遅延ロードで取得するリソースのサイズ、インタラクションに関するパフォーマンスの違いについてまとめられている。\nまた、ReactやVueでの実装、静的なものへの置き換えについてなど","relatedLinks":[]},{"category":"Article","title":"Introduction to Event Loop Utilization in Node.js - NodeSource","url":"https://nodesource.com/blog/event-loop-utilization-nodejs","tags":["node.js","article","performance"],"content":"`perf_hooks`の`eventLoopUtilization()`を使ったEvent Loop Utilization (ELU)の収集について。\nスケーリングのメトリクスにイベントループの使用率(ELU)を使う話、CPU使用率との比較、モジュールの使い方について","relatedLinks":[]},{"category":"Article","title":"Publish, ship, and install modern JavaScript for faster applications","url":"https://web.dev/publish-modern-javascript/","tags":["JavaScript","article"],"content":"modern browserとlegacy browser向けにJavaScriptのbundleを分けて配布する際に、ビルドやwebpackでのbundleを最適化するプラグインについての紹介記事","relatedLinks":[]},{"category":"SlideVideo","title":"Chrome Developer Summit 2020 - YouTube","url":"https://www.youtube.com/playlist?list=PLNYkxOF6rcIDzLmWaDwfHVZJl1Q5RFgOR","tags":["Chrome","Conference","video"],"content":"Chrome Developer Summit 2020の動画一覧。\nそれぞれの動画に字幕/翻訳がついている","relatedLinks":[{"title":"Chrome Dev Summit 2020","url":"https://developer.chrome.com/devsummit/"}]},{"category":"WebsiteDocument","title":"Chrome Developers","url":"https://developer.chrome.com/","tags":["Chrome","document"],"content":"Google Chromeの新機能、DevToolsのドキュメント、拡張のドキュメントなどを扱うChromeのポータルサイト","relatedLinks":[{"title":"Welcome to the new developer.chrome.com! - Chrome Developers","url":"https://developer.chrome.com/blog/welcome/"}]},{"category":"WebsiteDocument","title":"Automating audits with AutoWebPerf","url":"https://web.dev/autowebperf/","tags":["Chrome","performance","browser","Tools"],"content":"WebPageTestやPageSpeed Insightsなどを使い、特定のサイトのパフォーマンスを計測したデータをGoogle Sheetsに出力し、パフォーマンスダッシュボードを作成するツール。","relatedLinks":[{"title":"Added URL connector that runs a single test with a specific URL.","url":"https://github.com/GoogleChromeLabs/AutoWebPerf/commit/a39097aea673515b0316dcd6a931deb892e017f5"}]},{"category":"WebsiteDocument","title":"gildas-lormeau/SingleFile: Web Extension for Firefox/Chrome/MS Edge and CLI tool to save a faithful copy of an entire web page in a single HTML file","url":"https://github.com/gildas-lormeau/SingleFile","tags":["Firefox","Chrome","Extension","console","Tools"],"content":"ウェブサイトをシングルファイルのHTMLとして保存できるブラウザ拡張とCLI","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rafgraph/rollpkg: Convention over configuration way to create packages with Rollup and TypeScript","url":"https://github.com/rafgraph/rollpkg","tags":["JavaScript","bundler","TypeScript"],"content":"TypeScriptとRollupを使ったパッケージ開発のためツールキット。\nCJS、ESMなどの各種モジュールのビルド、tsconfigやprettierなどのプリセット、ビルド時に開発向けのコードを取り除く仕組みなどをもつ","relatedLinks":[]}]},{"meta":{"title":"2020-12-22のJS:  lighthouse 7.0.0、React Server Components、Micro Frontends Architecture Patterns","author":"azu","layout":"post","date":"2020-12-22T05:12:45.397Z","category":"JSer","tags":["Tools","performance","webservice","Chrome","Java"],"url":"https://jser.info/2020/12/22/lighthouse-7.0.0-react-server-components-micro-frontends-architecture-patterns/"},"items":[{"category":"Headline","title":"Release v7.0.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v7.0.0","tags":["Chrome","performance","Tools","ReleaseNote"],"content":"Lighthouse 7.0.0リリース。\nNode.js 10のサポート終了。\nPWAカテゴリの変更、アクセシビリティのテストに使う`axe-core`のアップデート、nightlyを`lighthouse@next`としてインストールできるようになる。\nまた、スクリーンショットがフルページとなりレポートのファイルサイズが増加するなど","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · less/less.js","url":"https://github.com/less/less.js/releases/tag/v4.0.0","tags":["CSS","ReleaseNote"],"content":"Less 4.0.0リリース。\n破壊的な変更としてmixinの呼び出し方のチェックをより厳密に変更、`math`オプションの初期値を`parens-division`に変更など。\n`min()`/`max()`のサポート改善、`isdefined()`の追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing Stimulus 2.0 - Announcements - Stimulus Discourse","url":"https://discourse.stimulusjs.org/t/announcing-stimulus-2-0/1482","tags":["JavaScript","rails","library","ReleaseNote"],"content":"Basecampで使われているStimulus 2.0リリース。\nControllerで`values`と`classes`プロパティを追加、EventListnerの`once`と`passive`のサポートなど。\n`data`属性に`identifier`を含めて使うように変更、`input`要素を`change`から`input`イベントで監視するように変更など","relatedLinks":[{"title":"Release v2.0.0 · stimulusjs/stimulus","url":"https://github.com/stimulusjs/stimulus/releases/tag/v2.0.0"}]},{"category":"Headline","title":"Release v6.0.0 · fb55/htmlparser2","url":"https://github.com/fb55/htmlparser2/releases/tag/v6.0.0","tags":["HTML","library","ReleaseNote"],"content":"htmlparser2 6.0.0リリース","relatedLinks":[]},{"category":"Headline","title":"Release v0.13.0 · developit/microbundle","url":"https://github.com/developit/microbundle/releases/tag/v0.13.0","tags":["JavaScript","library","ReleaseNote","Tools"],"content":"ライブラリを配布用にbundleするmicrobundle 0.13.0リリース。\n`--css`フラグを追加し、CSSをデフォルトでは外部ファイル(`external`)として出力し、`inline`でインライン化できるように。","relatedLinks":[]},{"category":"Article","title":"Introducing Zero-Bundle-Size React Server Components – React Blog","url":"https://reactjs.org/blog/2020/12/21/data-fetching-with-react-server-components.html","tags":["React","article"],"content":"Reactで試験的に実装されたReact Server Componentsについて。\nリクエストごとにサーバコンポーネントをレンダリングした結果をJSONライクなデータ(SlotとコンポーネントのJSON表現を組み合わせた形式)として返し、クライアントではレンダリング結果を使いレンダリングできる仕組み。\nサーバサイドでコンポーネントをレンダリングすることで、レンダリング結果のみを扱うクライアントでは不要なライブラリを含めずに扱えるためサイズを減らせる。\nコンポーネントレベルでのSSRとHydrateを行える仕組み。","relatedLinks":[{"title":"RFC: React Server Components by josephsavona · Pull Request #188 · reactjs/rfcs","url":"https://github.com/reactjs/rfcs/pull/188"},{"title":"Data Fetching with React Server Components - YouTube","url":"https://www.youtube.com/watch?v=TQQPAU21ZUw&feature=emb_title"}]},{"category":"Article","title":"Conditional JavaScript - JavaScript - Dev Tips","url":"https://umaar.com/dev-tips/242-considerate-javascript/","tags":["JavaScript","performance","article"],"content":"選択的にモジュールをダウンロードする際に利用できるウェブAPIとブラウザのサポートについて。\nメモリ、CPU数、バッテリー、ストレージの空き容量、ネットワーク、saveDataなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"Moiva.io - Measure and compare JavaScript libraries","url":"https://moiva.io/","tags":["npm","webservice","Tools"],"content":"npmパッケージの同士を比較できるツール。\nNPMダウンロード数、Bundlephobiaでのサイズ、ThoughWorks、Google　Trends、GitHubのStar/Pulseなどを並べて見れるツール","relatedLinks":[]},{"category":"WebsiteDocument","title":"Cloudflare Pages","url":"https://pages.cloudflare.com/","tags":["cloudflare","webservice"],"content":"Cloudflareの静的サイトホスティングサービス。\nNetlifyやVercelのようにコミット/PRごとのレプビューURLの生成、Cloudflare Workersを使ったFaaSの仕組みを持っている","relatedLinks":[{"title":"Introducing Cloudflare Pages: the best way to build JAMstack websites","url":"https://blog.cloudflare.com/cloudflare-pages/"}]},{"category":"SoftwareLibrary","title":"cincheo/jsweet: A Java to JavaScript transpiler.","url":"https://github.com/cincheo/jsweet","tags":["Java","JavaScript","Tools"],"content":"JavaのコードからTypeScript/JavaScriptのコードに変換するTranspiler","relatedLinks":[]},{"category":"SoftwareLibrary","title":"f/honst: Fixes your dataset according to your rules.","url":"https://github.com/f/honst","tags":["JavaScript","library"],"content":"オブジェクトの配列に対してルールを元にデータを編集するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Agamnentzar/ag-psd: Javascript library for reading and writing PSD files","url":"https://github.com/Agamnentzar/ag-psd","tags":["JavaScript","library"],"content":"PSDファイルの読み書きをするライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"asos-craigmorten/opine: Fast, minimalist web framework for Deno ported from ExpressJS.","url":"https://github.com/asos-craigmorten/opine","tags":["deno","library","express"],"content":"expressをDeno向けのポートしたウェブサーバライブラリ","relatedLinks":[]},{"category":"Book","title":"Micro Frontends Architecture Patterns","url":"https://zenn.dev/okmttdhr/books/8c977618755cb68ad2c0","tags":["MicroFrontend","architecture","book"],"content":"Micro Frontendsを始めとしたアーキテクチャパターンについての電子書籍","relatedLinks":[]}]},{"meta":{"title":"2020-12-29のJS: CSS Snapshot 2020、100万のサイトをクロールした調査結果、FlowからTypeScriptへの移行","author":"azu","layout":"post","date":"2020-12-29T03:05:18.915Z","category":"JSer","tags":["browser","node.js","Tools","performance","Rust"],"url":"https://jser.info/2020/12/29/css-snapshot-2020-100-flowtypescript/"},"items":[{"category":"Headline","title":"Announcing Volta 1.0.0 | Volta","url":"https://blog.volta.sh/2020/12/21/announcing-volta-100/","tags":["JavaScript","node.js","Rust","Tools","ReleaseNote"],"content":"Nodeやnpmのバージョン管理ツールであるVolta 1.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Node v15.5.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v15.5.0/","tags":["node.js","ReleaseNote"],"content":"Node v15.5.0リリース。\n`child_process`と`stream`がAbortSignalをサポート、`querystring.stringify()`がBigIntをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 4.0.0 · fuse-box/fuse-box","url":"https://github.com/fuse-box/fuse-box/releases/tag/v4.0.0","tags":["bundler","Tools","ReleaseNote"],"content":"FuseBox 4.0リリース。\n破壊的な変更として`homeDir`、`output`、`useSigleBundle`の削除。\n`watch`オプションを`watcher`にリネーム、\n`output`オプションの代わりに`bundles.distRoot`を使うように変更など","relatedLinks":[{"title":"Changelog fuse 3 to 4 · FuseBox","url":"https://fuse-box.org/docs/development/changelog-fuse-compiler"}]},{"category":"Headline","title":"CSS Snapshot 2020","url":"https://www.w3.org/TR/2020/NOTE-css-2020-20201222/","tags":["CSS","spec","ReleaseNote"],"content":"CSS Snapshot 2020リリース","relatedLinks":[{"title":"CSS Snapshot 2020 日本語訳","url":"https://momdo.github.io/css-2020/"},{"title":"CSS Snapshot 2020が発行されました | フロントエンドBlog | ミツエーリンクス","url":"https://www.mitsue.co.jp/knowledge/blog/frontend/202012/23_1049.html"},{"title":"Working Group Note: CSS Snapshot 2020 | W3C News","url":"https://www.w3.org/blog/news/archives/8820"}]},{"category":"Headline","title":"cross-env is \"finished\" (now in maintenance mode) · Issue #257 · kentcdodds/cross-env","url":"https://github.com/kentcdodds/cross-env/issues/257","tags":["node.js","library","news"],"content":"cross-envがメンテナンスモードとなりアーカイブされた。\n機能として完成していて、これ以上機能追加することはないため。セキュリティアップデートと新しいNode.jsへの対応は続けるメンテナンスモードとなった","relatedLinks":[]},{"category":"Article","title":"CSS Containment によるパフォーマンス改善 — HACK The Nikkei","url":"https://hack.nikkei.com/blog/advent20201219/","tags":["browser","performance","article"],"content":"CSS Containmentの`contain: content`によるPaint Timeの改善について。","relatedLinks":[]},{"category":"Article","title":"Web Performance Calendar » Strategies for Telemetry Exfiltration (aka Beaconing In Practice)","url":"https://calendar.perfplanet.com/2020/beaconing-in-practice/","tags":["article","browser","WebPlatformAPI"],"content":"ブラウザからメトリクスデータを送信するときの戦略について。\n`navigator.sendBeacon`/Fetch/XHR/pixel imageでの送信、どのタイミングで送信するかのライフサイクルイベントの到達信頼性についての調査。\nローカルストレージでの再送やService Workerでのバッファ、Reporting APIについてなど。","relatedLinks":[]},{"category":"Article","title":"Maximally optimizing image loading for the web in 2021","url":"https://www.industrialempathy.com/posts/image-optimizations/","tags":["article","performance","browser"],"content":"画像の読み込みの最適化についてまとめた記事。\nwidthとheightでのCLSの回避、`content-visibility`、AVIF、`srcset`と`size`属性、Cache-Controlヘッダ、`loading`属性と`decoding`属性。\nプレースホルダー画像を使う方法についてなど","relatedLinks":[]},{"category":"Article","title":"War stories: The move from Flow to TypeScript","url":"https://react.christmas/2020/2","tags":["flowtype","TypeScript","article"],"content":"約15日でFlowからTypeScriptのマイグレーションした話。\njs-unused-exportsを使った使われてないファイルの削除、flow-to-tsを使った変換、ESLintを使ったフォーマットの修正。\nコードのフリーズとマイグレーションの目標について","relatedLinks":[]},{"category":"Article","title":"JavaScript Performance in the Wild 2020 | CatchJS","url":"https://catchjs.com/Blog/PerformanceInTheWild","tags":["article","performance","browser"],"content":"https://tranco-list.eu/ のデータを元にサイトをPuppeteerでクロールして集めたパフォーマンスに関するデータセットについて。\nKaggleでデータセットを公開している。\nHTTPのプロトコルバージョン、サードパーティリソース、ライブラリとそれぞれのメトリクスの関係性などについて。\n2.2%のサイトでjQueryのロードをしていないためにエラーが発生していることなどについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"msn0/mdn-polyfills: MDN polyfills - from, forEach, filter, find, findIndex, assign, includes, create, entries, of, repeat, startsWith, endsWith, toggleAttribute, bind, MouseEvent, CustomEvent, padEnd, padStart","url":"https://github.com/msn0/mdn-polyfills","tags":["JavaScript","mdn","library","polyfill"],"content":"MDNに載っているJavaScriptやDOM APIのpolyfillをまとめたパッケージ","relatedLinks":[]},{"category":"WebsiteDocument","title":"jsDocs.io","url":"https://www.jsdocs.io/","tags":["npm","JavaScript","library","webservice"],"content":"npmパッケージに含まれるTypeScriptの型定義ファイルをベースに自動的にドキュメントを生成して表示できるサービス","relatedLinks":[]},{"category":"WebsiteDocument","title":"jameslittle230/stork: 🔎 Impossibly fast web search, made for static sites.","url":"https://github.com/jameslittle230/stork","tags":["JavaScript","Rust","WebAssembly"],"content":"Rustで書かれたindexerとWebAssemblyを使った検索ライブラリ。\n検索対象のファイルからインデックスファイルを作り、それを元にした検索機能/UIを提供するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"devbridge/js-unused-exports","url":"https://github.com/devbridge/js-unused-exports","tags":["JavaScript","Tools"],"content":"JavaScriptのファイルから使われてない関数、ファイルを抽出するツール。\n細かい無視オプションやaliasの対応などのオプションをもっている。","relatedLinks":[]},{"category":"Book","title":"Webブラウザセキュリティ ― Webアプリケーションの安全性を支える仕組みを整理する – 技術書出版と販売のラムダノート","url":"https://www.lambdanote.com/collections/frontpage/products/wbs","tags":["browser","security","book"],"content":"2021年1月5日 発売\nウェブセキュリティについての書籍。\nSOP、CORS、CSPなどのOriginを境界にしたセキュリティ機構、ブラウザのプロセス分離モデル、Cookieについてなど","relatedLinks":[]}]},{"meta":{"title":"2021-01-07のJS: Wasmer 1.0、2021年のウェブ標準とブラウザ、xstyled","author":"azu","layout":"post","date":"2021-01-07T03:27:36.334Z","category":"JSer","tags":["CSS","node.js","TypeScript","React","browser"],"url":"https://jser.info/2021/01/07/wasmer-1.0-2021-xstyled/"},"items":[{"category":"Headline","title":"Wasmer 1.0. By leveraging Wasm for software… | by Syrus Akbary | Wasmer | Jan, 2021 | Medium","url":"https://medium.com/wasmer/wasmer-1-0-3f86ca18c043","tags":["WebAssembly","ReleaseNote","Tools"],"content":"WebAssembly RuntimeであるWasmer 1.0リリース。\nWasmファイルを`.dll`などにプリコンパイルする`wasmer compile`の追加、クロスコンパイルの対応、エラーレポートの改善など","relatedLinks":[{"title":"wasmer/CHANGELOG.md at master · wasmerio/wasmer","url":"https://github.com/wasmerio/wasmer/blob/master/CHANGELOG.md#100---2021-01-05"}]},{"category":"Headline","title":"Node v15.5.1 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v15.5.1/","tags":["node.js","security","ReleaseNote"],"content":"Node.js 15.5.1リリース。\nDoSにつながる脆弱性とHTTP Request Smugglingの脆弱性の修正を含むセキュリティアップデート。\nNode.js 10, 12, 14にそれぞれ同様のセキュリティリリースがされている","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 118 | WebKit","url":"https://webkit.org/blog/11439/release-notes-for-safari-technology-preview-118/","tags":["safari","webkit","ReleaseNote"],"content":"Safari Technology Preview 118リリース。\nWeb InspectorにNetworkリクエストのinterceptをするUIの追加。\nECMAScript Proposalの`Array#at`をサポート、Private Click Measurementの設定をexperimentalから標準UIに移動など","relatedLinks":[{"title":"tc39/proposal-relative-indexing-method: A TC39 proposal to add an .at() method to all the basic indexable classes (Array, String, TypedArray)","url":"https://github.com/tc39/proposal-relative-indexing-method"}]},{"category":"Article","title":"Reactチュートリアル1：犬画像ギャラリーを作ろう","url":"https://zenn.dev/likr/articles/6be53ca64f29aa035f07","tags":["React","tutorial"],"content":"Reactを使ったウェブアプリケーションの開発チュートリアル。\nReactの基本的な使い方、コンポーネント、Netlifyを使った公開方法について","relatedLinks":[]},{"category":"Article","title":"2021年のウェブ標準とブラウザ：新春特別企画｜gihyo.jp … 技術評論社","url":"https://gihyo.jp/design/column/newyear/2021/web-standards-and-browsers","tags":["HTML","CSS","DOM","article","spec","browser"],"content":"2020年におけるHTML、CSS、DOM APIに変化についてまとめた記事。\nまた、IE 11と旧Edgeのサポート状況、UA Client HintやPrivacy Sandboxなどの取り組みについてなど幅広くウェブ(標準)の状況について扱っている","relatedLinks":[]},{"category":"Article","title":"2021年のWebアクセシビリティ：新春特別企画｜gihyo.jp … 技術評論社","url":"https://gihyo.jp/design/column/newyear/2021/web-accessibility-prospect","tags":["accessibility","article","spec"],"content":"ウェブアクセシビリティの仕様のステータスについての記事。\n2020年のWCAGの変更点、WCAGのデジュール標準としてのISO/JIS版のステータス。\n策定作業中のWCAG 3.0、WAI-ARIA 1.2についてなど","relatedLinks":[]},{"category":"Article","title":"Denoからnpmパッケージを使用するノウハウ","url":"https://zenn.dev/uki00a/articles/how-to-use-npm-packages-in-deno","tags":["deno","TypeScript","npm","article"],"content":"Denoからnpmに公開されたパッケージを利用する方法について。\nskypack、esm.sh、jspm.devを使った方法について。\nまた、JavaScriptで書かれたパッケージを型チェックする仕組みとしての`X-TypeScript-Types`ヘッダと`@deno-types`について","relatedLinks":[]},{"category":"Article","title":"Vanilla Hooks (outside React). Hooks are a pattern, not something… | by Andrea Giammarchi | JavaScript In Plain English | Jan, 2021 | Medium","url":"https://medium.com/javascript-in-plain-english/vanilla-hooks-outside-react-860471e5f95c","tags":["JavaScript","DOM","library","article"],"content":"uhooksを使ってReact HooksライクにDOM APIを使ったTODOアプリを書く話。","relatedLinks":[{"title":"WebReflection/uhooks: micro hooks: a minimalistic client/server hooks' implementation","url":"https://github.com/WebReflection/uhooks"}]},{"category":"WebsiteDocument","title":"TabFS","url":"https://omar.website/tabfs/","tags":["Chrome","Firefox","WebExtension"],"content":"ブラウザのタブをファイルシステムとしてマウントするブラウザ拡張","relatedLinks":[]},{"category":"SoftwareLibrary","title":"g-plane/typed-query-selector: Better typed \\`querySelector\\` and \\`querySelectorAll\\`.","url":"https://github.com/g-plane/typed-query-selector","tags":["TypeScript","library"],"content":"Template Literal Typeを使って`document.querySelector`の引数から返す要素の型を推論するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"xstyled - A utility-first CSS-in-JS framework built for React. - xstyled","url":"https://xstyled.dev/","tags":["React","CSS","library","TypeScript"],"content":"React向けのUtility-firstなCSS-in-JSフレームワーク。\nCSS-in-JSライブラリとしてstyled-componentsまたはemotionを使い、TailwindのようなUtilityスタイルを指定できるコンポーネントを提供する目的。\nstyled-systemをインスパイアしている","relatedLinks":[{"title":"Styled System","url":"https://styled-system.com/"},{"title":"Release 🚀 v2.0.0 · gregberge/xstyled","url":"https://github.com/gregberge/xstyled/releases/tag/v2.0.0"}]},{"category":"SoftwareLibrary","title":"Nullstack - Full-stack Javascript Components","url":"https://nullstack.app/","tags":["JavaScript","node.js","browser","library"],"content":"同じコンポーネントでブラウザとNode.jsで動くコードを扱うフルスタックフレームワーク。\n`.njs`という拡張子でライフサイクルメソッドとJSXを使ったコンポーネントを書くことで、SSRやHydrateなどを行う。\nサーバで動くコードは`static async`で書き、インスタントメソッドはブラウザ向けの処理となり、`context`オブジェクトで値をやり取りする。\nビルドするとブラウザとサーバのコードをそれぞれbundleしたファイルを出力する。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kripod/otion: Atomic CSS-in-JS with a featherweight runtime","url":"https://github.com/kripod/otion","tags":["CSS","JavaScript","library"],"content":"runtimeでのatomic CSS-in-JSの実装ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"atlassian-labs/compiled: Build time atomic CSS-in-JS. Baked and ready to serve.","url":"https://github.com/atlassian-labs/compiled","tags":["CSS","JavaScript","library"],"content":"build timeでのAtomic CSS-in-JSの実装ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Yord/shargs: 🦈 shargs is a library for building command-line argument parsers.","url":"https://github.com/Yord/shargs","tags":["node.js","JavaScript","console","library"],"content":"コマンドライン引数パーサライブラリ。\nサブコマンド、スペルミスの訂正、REPLなどに対応している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"O1dMate/dns-host: Simple, lightweight DNS server written in pure JavaScript with no external dependencies.","url":"https://github.com/O1dMate/dns-host","tags":["node.js","library"],"content":"Node.jsの`dgram`コアパッケージを使ったDNSサーバの実装ライブラリ","relatedLinks":[]},{"category":"Book","title":"Amazon.co.jp: Web配信の技術―HTTPキャッシュ・リバースプロキシ・CDNを活用する: 田中 祥平: 本","url":"https://www.amazon.co.jp/dp/4297119250/","tags":["book","cdn","HTTP"],"content":"2021年2月13日 発売","relatedLinks":[]}]},{"meta":{"title":"2021-01-12のJS: Node.jsライブラリのESM対応の計画、TypeScriptとJSDocでJavaScriptの型チェック","author":"azu","layout":"post","date":"2021-01-12T02:03:31.254Z","category":"JSer","tags":["Tools","TypeScript","V8","performance","npm"],"url":"https://jser.info/2021/01/12/node.jsesm-typescriptjsdocjavascript/"},"items":[{"category":"Headline","title":"Release v7.4.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v7.4.0","tags":["npm","ReleaseNote"],"content":"npm 7.4.0リリース。\n`--foreground-scripts`の追加、`npm publish --dry-run`の修正など","relatedLinks":[]},{"category":"Headline","title":"js-yaml/CHANGELOG.md at master · nodeca/js-yaml","url":"https://github.com/nodeca/js-yaml/blob/master/CHANGELOG.md#400---2021-01-03","tags":["JavaScript","library","ReleaseNote"],"content":"js-yaml 4.0.0リリース。\n`safe{Load,LoadAll,Dump}`などを`load`/`loadAll`/`dump`にリネームしsafeメソッドをデフォルトに変更。\nunsafeな挙動は外部パッケージの`js-yaml-js-types`に移動、numberのパースをYAML 1.2準拠に変更、`dump`の出力を一部変更など。\nその他には`.mjs`のサポート、prototype pollutionに関する挙動の修正など","relatedLinks":[{"title":"js-yaml/migrate","url":"https://github.com/nodeca/js-yaml/blob/master/migrate_v3_to_v4.md"},{"title":"nodeca/js-yaml-js-types: Extra js types for js-yaml","url":"https://github.com/nodeca/js-yaml-js-types"}]},{"category":"Headline","title":"The ESM move · Discussion #15 · sindresorhus/meta","url":"https://github.com/sindresorhus/meta/discussions/15","tags":["node.js","library","issue"],"content":"sindresorhusパッケージの`\"type\":\"module\"`によるESMのネイティブ対応の計画についてのIssue","relatedLinks":[]},{"category":"Article","title":"phodal/clean-frontend: Clean Frontend Architecture：整洁前端架构","url":"https://github.com/phodal/clean-frontend","tags":["JavaScript","architecture","article","Chinese"],"content":"フロントエンドでのクリーンアーキテクチャについて。\nUIフレームワークにおけるロジックの偏り、クリーンアーキテクチャの概念的な解説や実装ガイド","relatedLinks":[]},{"category":"Article","title":"crossorigin 属性の仕様を読み解く","url":"https://nhiroki.jp/2021/01/07/crossorigin-attribute","tags":["HTML","WHATWG","JavaScript","spec","article"],"content":"CORSに関するrequest modeとcredentials modeの振る舞いを指定する`crossorigin`属性について。\n`<img>`, `<script>`, `<link rel=preconnect>`における`crossorigin`属性の指定による振る舞いの解説。\nFetch APIでの表現方法について。","relatedLinks":[]},{"category":"Article","title":"Check your JS with TS","url":"https://whistlr.info/2021/check-js-with-ts/","tags":["JavaScript","TypeScript","article"],"content":"JSDocとTypeScriptを使って、JavaScriptのコードを型チェックする方法について。\ntsconfig.jsonの設定、JSDocでの型定義、JavaScriptから`.d.ts`ファイルをimportして型定義をJSDocに利用する方法など","relatedLinks":[]},{"category":"Article","title":"Slowfil.es – Demonstate and observe slow-loading resources","url":"https://slowfil.es/","tags":["webservice","HTTP","performance","Tools"],"content":"レイテンシを再現したリソースの配信をテストできるサービス。\nscript要素の`async`属性や`defer`属性の動作のテストなどリソースのレイテンシに関するパフォーマンステストに利用できる。","relatedLinks":[{"title":"slowfil.es – a service for slow assets with high priority | Stefan Judis Web Development","url":"https://www.stefanjudis.com/notes/slowfil-es-a-service-for-slow-assets-with-high-priority/"},{"title":"Oh The Scripts We'll Load - A Performance Talk by Tim Kadlec - YouTube","url":"https://www.youtube.com/watch?v=tr6aHw8I32M"}]},{"category":"Article","title":"An additional non-backtracking RegExp engine · V8","url":"https://v8.dev/blog/non-backtracking-regexp","tags":["V8","RegExp","article"],"content":"V8にバックトラックをしない正規表現エンジンをフラグ付きで実装したという話。\nバックトラックによってReDoSのような指数関数的にマッチする問題が知られていて、これを解決するためにバックトラックを使わないアルゴリズムの実装をしたという話","relatedLinks":[]},{"category":"WebsiteDocument","title":"byte-js/byte: A easy JavaScript Runtime Engine that aims towards productivity","url":"https://github.com/byte-js/byte","tags":["Rust","V8","console","Tools"],"content":"簡単なコマンドラインツールを作れることを目的にしたV8とRustを使ったJavaScriptのRuntime","relatedLinks":[{"title":"denoland/rusty","url":"https://github.com/denoland/rusty_v8"}]},{"category":"WebsiteDocument","title":"Nx: Extensible Dev Tools for Monorepos","url":"https://nx.dev/","tags":["monorepo","Tools","JavaScript"],"content":"JavaScriptのmonorepoプロジェクトを扱う開発ツール。\n目的に合わせたmonorepoの作成、task runnerの管理、VSCode拡張を使ったUIをもつ。\n依存グラフを使ったキャッシュ、インクリメンタルビルド、Nx Cloudを使ったリモートキャッシュなどを行う","relatedLinks":[]},{"category":"WebsiteDocument","title":"Checka11y.css - CSS stylesheet to quickly highlight a11y concerns","url":"https://checka11y.jackdomleo.dev/","tags":["accessibility","CSS"],"content":"CSSでHTMLのアクセシビリティをチェックするスタイルシート。\n類似するツールとしてhttps://ffoodd.github.io/a11y.css/ がある。","relatedLinks":[]},{"category":"WebsiteDocument","title":"cloudfour/lighthouse-parade: A Node.js command line tool that crawls a domain and gathers lighthouse performance data for every page.","url":"https://github.com/cloudfour/lighthouse-parade","tags":["Chrome","performance","Tools"],"content":"Lighthouseでクロールしてパフォーマンス計測した結果をCSVとしてまとめるツール。\n複数のページの結果をSpreadsheetなどに集めて分析する目的","relatedLinks":[]},{"category":"SoftwareLibrary","title":"menduz/typed-url-params: TypeSystem based parser for url parameters","url":"https://github.com/menduz/typed-url-params","tags":["TypeScript","library"],"content":"path-to-regexpのようなルーティング文字列に対する型推論をTemplate Literarl Typeで行うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mistlog/react-peg: A react style parser generator based on PEG.js","url":"https://github.com/mistlog/react-peg","tags":["TypeScript","jsx","library"],"content":"PEG.jsの構文定義をJSXで書けるライブラリ。\nTypeScriptのTSXを使うことで、構文に対する型チェックをしながら、構文定義をコンポーネントのように書けるようにすることが目的。","relatedLinks":[]}]},{"meta":{"title":"JSer.info 10周年: JavaScript情報の集め方、書き方、まとめ方","author":"azu","layout":"post","date":"2021-01-16T00:00:00.000Z","category":"Article","tags":["JSer"],"url":"https://jser.info/2021/01/16/jser-10th/"},"items":[]},{"meta":{"title":"2021-01-18のJS: Snowpack 3.0、Front-End Performance Checklist、State of JS 2020","author":"azu","layout":"post","date":"2021-01-18T02:02:00.700Z","category":"JSer","tags":["Tools","TypeScript","browser","WebComponents","Vue"],"url":"https://jser.info/2021/01/18/snowpack-3.0-front-end-performance-checklist-state-of-js-2020/"},"items":[{"category":"Headline","title":"Snowpack v3.0","url":"https://www.snowpack.dev/posts/2021-01-13-snowpack-3-0","tags":["JavaScript","ECMAScript","debug","Tools","ReleaseNote"],"content":"Snowpack 3.0リリース。\nStreaming Importsのサポート、esbuildを使ったbundleの最適化のサポート、JavaScript APIの更新など","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0 · karma-runner/karma","url":"https://github.com/karma-runner/karma/releases/tag/v6.0.0","tags":["browser","testing","ReleaseNote","library"],"content":"Karma 6.0.0リリース。\n`customFileHandlers`と`customScriptTypes`の削除、不正なオプションを渡した時にエラーを出すようになるなど","relatedLinks":[]},{"category":"Headline","title":"Node v15.6.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v15.6.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 15.6.0リリース。\n`child_process`に`overlapped`オプション、`.fork`がAbortSinalに対応。\n`crypto`モジュールに`randomUUID`メソッドの追加、X509Certificate APIのサポート。\n`server.listen`がAbortSignalをサポート、`http.Agent`の`scheduling`オプションにLIFOアルゴリズムを追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.2 Beta | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-2-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.2 Betaリリース。\nTuple TypesでRest Elementをサポート、Type Aliasの型追跡の改善、template literal typesの改善。\n`noPropertyAccessFromIndexSignature`オプションの追加、`abstract new`のサポートなど。\nまた、`--explainFiles`でなぜファイルが含まれるかを表示できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Adobe Flash Player End of Life","url":"https://www.adobe.com/products/flashplayer/end-of-life.html","tags":["flash","browser","news"],"content":"Adobe Flash Playerが2021年1月12日でサポートを終了した。","relatedLinks":[]},{"category":"Headline","title":"Announcing Scala.js 1.4.0 - Scala.js","url":"https://www.scala-js.org/news/2021/01/12/announcing-scalajs-1.4.0/","tags":["scala","JavaScript","ReleaseNote"],"content":"Scala.js 1.4.0リリース","relatedLinks":[]},{"category":"Article","title":"Reflections for 2020-2021 | The Vue Point","url":"https://blog.vuejs.org/posts/hello-2021.html","tags":["Vue","article"],"content":"Vueの2020年の取り組みと2021の取り組み予定について。\nVue 2から3へのマイグレーションツール、Vue CLIのwebpack 5対応、Vue 3のIE 11対応、Vue 2.7のリリースなどを予定している。","relatedLinks":[{"title":"Roadmap","url":"https://github.com/vuejs/vue/projects/6"}]},{"category":"Article","title":"Front-End Performance Checklist 2021 — Smashing Magazine","url":"https://www.smashingmagazine.com/2021/01/front-end-performance-2021-free-pdf-checklist/","tags":["performance","article"],"content":"フロントエンドパフォーマンスチェックリスト。\nサマリ版のPDFと詳細な解説をした記事で構成されている。\n全部で77コの項目があり、パフォーマンスの文化、メトリクスの設定や収集、さまざまなパフォーマンスTipsについて書かれている","relatedLinks":[]},{"category":"Article","title":"Deno in 2020","url":"https://deno.land/posts/deno-in-2020","tags":["deno","article"],"content":"Denoの2020年の変更点のサマリと2021年のロードマップについて。","relatedLinks":[]},{"category":"SlideVideo","title":"State of JS 2020","url":"https://2020.stateofjs.com/en-US/","tags":["JavaScript","アンケート"],"content":"JavaScript開発者アンケートであるState of JS 2020の結果が公開された。\n言語、ライブラリ、ツール、エディタ、リソースなど各項目ごとに認知、満足度、興味、利用しているかなどをアンケートをとったもの","relatedLinks":[]},{"category":"WebsiteDocument","title":"znck/vue-developer-experience: A collection of tools for vue ecosystem.","url":"https://github.com/znck/vue-developer-experience","tags":["Vue","Tools","VSCode","plugin"],"content":"Vueに関するツール、VSCodeプラグインを扱うリポジトリ。\n静的解析ツール、パーサ、ASTヘルパー、VScode向けのプラグインなどが含まれている","relatedLinks":[]},{"category":"WebsiteDocument","title":"imolorhe/altair: ✨⚡️ A beautiful feature-rich GraphQL Client for all platforms.","url":"https://github.com/imolorhe/altair","tags":["GraphQL","EmEditor","Tools"],"content":"GraphQLクライアントのIDE","relatedLinks":[]},{"category":"SoftwareLibrary","title":"egoist/tsup: Bundle your TypeScript library with no config, powered by esbuild.","url":"https://github.com/egoist/tsup","tags":["JavaScript","TypeScript","Tools"],"content":"esbuildを使ったTypeScriptのコードをbundleしてesm,cjs,iife形式のコードを出力するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tw-in-js/twind: The smallest, fastest, most feature complete Tailwind-in-JS solution in existence.","url":"https://github.com/tw-in-js/twind","tags":["CSS","JavaScript","library"],"content":"Tailwind CSSをCSS-in-JSで行うライブラリとツール。\nTemplate Literalを使ったクラスの生成するAPI、SSR向けにCSSファイルの作成、ビルド無しでTailwindクラスを利用するshimライブラリなどを提供する。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"TomerAberbach/grfn: 🦅 A tiny (~400B) utility that executes a dependency graph of async functions as concurrently as possible.","url":"https://github.com/TomerAberbach/grfn","tags":["JavaScript","library"],"content":"Promiseを使った非同期処理のコントロールフローを管理するライブラリ。\nデバッグ用にコントールフローの図を生成する機能を持っている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"natemoo-re/microsite: A fast, opinionated static site generator powered by Snowpack. Build simple static sites with fool-proof performance by leveraging automatic partial hydration.","url":"https://github.com/natemoo-re/microsite","tags":["JavaScript","Tools","React"],"content":"SnowpackとPreactを使ったNext.jsライクなディレクトリ構造のルールを持った静的サイトジェネレーター","relatedLinks":[]},{"category":"SoftwareLibrary","title":"github/jtml: Write HTML in JavaScript, using template-tags.","url":"https://github.com/github/jtml","tags":["JavaScript","HTML","library","WebComponents"],"content":"GitHubのlit-htmlインスパイアなテンプレートレンダリングライブラリ。\nWHAWG HTMLで提案中のTemplate Partsの実装を含んでいる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Catalyst","url":"https://github.github.io/catalyst/","tags":["Github","WebComponents","library"],"content":"GitHubのWeb Componentsライブラリ。\nCustom Elementの登録、Stimulusインスパイアな`data-action`属性を使ったイベントリスナー、Custom Element内からHTMLの要素を紐付けるクエリ機能を持っている。","relatedLinks":[{"title":"Removing jQuery from GitHub.com frontend - The GitHub Blog","url":"https://github.blog/2018-09-06-removing-jquery-from-github-frontend/"}]},{"category":"Book","title":"JavaScript［完全］入門 | 柳井 政和 | コンピュータ・IT | Kindleストア | Amazon","url":"https://www.amazon.co.jp/dp/B08PKHSVFZ/","tags":["JavaScript","book"],"content":"2021年2月4日 発売\nJavaScriptの入門書","relatedLinks":[]}]},{"meta":{"title":"2021-01-26のJS: webpack 5.17.0(lazyCompilation)、Deno 1.7、Open Web Docs","author":"azu","layout":"post","date":"2021-01-26T02:14:34.817Z","category":"JSer","tags":["node.js","browser","React","IPFS","p2p"],"url":"https://jser.info/2021/01/26/webpack-5.17.0lazycompilation-deno-1.7-open-web-docs/"},"items":[{"category":"Headline","title":"IPFS Support in Brave","url":"https://brave.com/ipfs-support/","tags":["browser","news","IPFS","p2p"],"content":"BraveがP2PプロトコルであるIPFS(InterPlanetary File System)をサポート。\nBrave 1.19.x以降では、ゲートウェイとローカルノードを使ったIPFSURIの解決ができるようになる。","relatedLinks":[{"title":"Brave Integrates IPFS","url":"https://brave.com/brave-integrates-ipfs/"}]},{"category":"Headline","title":"Release v5.17.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.17.0","tags":["webpack","ReleaseNote"],"content":"webpack 5.17.0リリース。\n実験的な機能として、Dynamic Importしているモジュールをアクセスした時にビルドできる`experiments.lazyCompilation`オプションを追加。\n起動時にすべてをビルドしないことで、利用してないエントリポイントがビルドパフォーマンスに影響を与えないようにする目的。","relatedLinks":[{"title":"liximomo/lazy-compile-webpack-plugin: Boost webpack startup time by lazily compiling dynamic imports","url":"https://github.com/liximomo/lazy-compile-webpack-plugin"}]},{"category":"Headline","title":"The Node.js Runtime  |  Cloud Functions Documentation  |  Google Cloud","url":"https://cloud.google.com/functions/docs/concepts/nodejs-runtime#nodejs_14_public_preview","tags":["GCP","node.js","news"],"content":"Cloud FunctionがNode.js 14をpublic previewとしてサポート","relatedLinks":[]},{"category":"Headline","title":"Deno 1.7 Release Notes","url":"https://deno.land/posts/v1.7","tags":["deno","ReleaseNote"],"content":"Deno 1.7リリース。\n`deno compile`のサイズ改善とクロスコンパイルの対応、Data URLのimportをサポート、`deno fmt`のMarkdownサポート。\nSteram APIをWHATWGに準拠するように修正、Web Workerに`permissions`でDeno独自のパーミッションを指定可能に。\n`--location`フラグを使って相対URLのFetchに対応、FetchのリクエストbodyにStreamを指定可能になるなど。\n破壊的な変更としてDeno APIsの変更やUnstable APIとして`Deno.resolveDns`のサポートが含まれる。","relatedLinks":[{"title":"Release v1.7.0 · denoland/deno","url":"https://github.com/denoland/deno/releases/tag/v1.7.0"},{"title":"Deno 1.7.0 がリリースされたので新機能や変更点の紹介","url":"https://zenn.dev/magurotuna/articles/55575eb16ae422"}]},{"category":"Headline","title":"Open Web Docs - Open Collective","url":"https://opencollective.com/open-web-docs/updates/introducing-open-web-docs","tags":["document","news","mdn"],"content":"MDNのようなウェブプラットフォームのドキュメントに対して長期的に取り組んでいくためのプロジェクト。MozillaなどのブラウザベンダーやW3Cなどがメンバーにいる。\n当面はMDNへのコントリビューションをしていく。","relatedLinks":[{"title":"Supporting Open Web Docs to deliver web developer documentation - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2021/01/25/welcome-open-web-docs/"},{"title":"Introducing Open Web Docs","url":"https://web.dev/open-web-docs/"},{"title":"Welcoming Open Web Docs to the MDN family - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2021/01/welcoming-open-web-docs-to-the-mdn-family/"},{"title":"Open Web Docs | Igalia","url":"https://www.igalia.com/2021/01/25/Open-Web-Docs.html"},{"title":"Welcome to Open Web Docs! | W3C Blog","url":"https://www.w3.org/blog/2021/01/welcome-to-open-web-docs/"},{"title":"project/membership-expectations.md at main · openwebdocs/project","url":"https://github.com/openwebdocs/project/blob/main/steering-committee/membership-expectations.md"}]},{"category":"Article","title":"How to Solve the Infinite Loop of React.useEffect()","url":"https://dmitripavlutin.com/react-useeffect-infinite-loop/","tags":["React","JavaScript","article"],"content":"Reactの`useEffect`の中でStateを更新した場合になぜ無限ループが起きるのか、またその修正方法について","relatedLinks":[]},{"category":"Article","title":"Migrating Puppeteer to TypeScript  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2021/01/puppeteer-typescript","tags":["JavaScript","TypeScript","article"],"content":"PuppeteerのコードベースをJavaScriptからTypeScriptの移行するどのように取り組んでいるかについて","relatedLinks":[{"title":"Upgrading DevTools' architecture to the modern web - YouTube","url":"https://www.youtube.com/watch?v=BHogHiiyuQk"}]},{"category":"Article","title":"The Secret Parameter, LFR, and Potential RCE in NodeJS Apps","url":"https://blog.shoebpatel.com/2021/01/23/The-Secret-Parameter-LFR-and-Potential-RCE-in-NodeJS-Apps/","tags":["JavaScript","node.js","security","express","article"],"content":"Expressで`hbs`(handlebars)を使っている際に`res.render`の第2引数にユーザー入力をそのまま渡してしまうと、`layout`プロパティによって任意のファイルを読める問題について。\nまた、Handlerbars 4.0.14未満にあった脆弱性と組み合わせることでRCEにつながるという話","relatedLinks":[{"title":"pillarjs/hbs: Express view engine wrapper for Handlebars","url":"https://github.com/pillarjs/hbs"},{"title":"Express 4.x - API リファレンス","url":"https://expressjs.com/ja/api.html#res.render"}]},{"category":"SlideVideo","title":"ブラウザの作り方 - Speaker Deck","url":"https://speakerdeck.com/keiya01/burauzafalsezuo-rifang","tags":["browser","Rust","slide"],"content":"Let's build a browser engine!を参考にブラウザのレンダリングエンジンを作りながら、どのようにHTMLやCSSのパースからレンダリングしているのかという話","relatedLinks":[{"title":"keiya01/kamaitachi: ","url":"https://github.com/keiya01/kamaitachi"},{"title":"Let's build a browser engine! Part 1: Getting started","url":"https://limpet.net/mbrubeck/2014/08/08/toy-layout-engine-1.html"}]},{"category":"WebsiteDocument","title":"JSitor - JavaScript, HTML, CSS, online editor","url":"https://jsitor.com/","tags":["JavaScript","HTML","CSS","editor","webservice"],"content":"jsfiddle的なHTML/CSS/JSを書いて公開できるPlaygroundサービス。\nMonaco Editorを使ったエディタ、整形機能を持っている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"forgojs/forgo: An ultra-light UI runtime","url":"https://github.com/forgojs/forgo","tags":["React","jsx","library","JavaScript"],"content":"JSXで書けるUIライブラリ。\nReactとは違いコンポーネント内でもDOM APIを扱う形になっていて、再レンダリングも手動で行う。\nファイルサイズの小ささやフレームワークの抽象を少なくして、DOM APIを知っていれば扱えるようにするのが目的。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Nodepack","url":"https://nodepackjs.com/","tags":["node.js","library","Tools"],"content":"Node.jsウェブフレームワーク。\nプロジェクトを管理するためのCLIとそれを拡張するプラグインシステムをもつ","relatedLinks":[]}]},{"meta":{"title":"2021-02-02のJS: WebRTC 1.0、Firefox 85、Chrome 89 Beta","author":"azu","layout":"post","date":"2021-02-02T02:55:41.962Z","category":"JSer","tags":["TypeScript","node.js","browser","WebRTC","Firefox"],"url":"https://jser.info/2021/02/02/webrtc-1.0-firefox-85-chrome-89-beta/"},"items":[{"category":"Headline","title":"January brings us Firefox 85 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2021/01/january-brings-us-firefox-85/","tags":["Firefox","ReleaseNote"],"content":"Firefox 85リリース。\nFlashのサポート終了。\nCSSでPrefixなしの`:focus-visible`をサポート、`<link rel=\"preload\">`のサポート。\nまた、Network partitioningの導入など","relatedLinks":[{"title":"Firefox 85.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/85.0/releasenotes/"},{"title":"Firefox 85 Cracks Down on Supercookies - Mozilla Security Blog","url":"https://blog.mozilla.org/security/2021/01/26/supercookie-protections/"},{"title":"Gaining security and privacy by partitioning the cache  |  Web","url":"https://developers.google.com/web/updates/2020/10/http-cache-partitioning#what_is_the_impact_of_this_behavioral_change"},{"title":"Firefox 85 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/85"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 119 | WebKit","url":"https://webkit.org/blog/11525/release-notes-for-safari-technology-preview-119/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 119リリース。\nSpeechRecognition APIの有効化、CSS `aspect-ratio`プロパティのサポート改善、`prefers-contrast: more`のサポートなど。\nWebAssemblyで`memory.copy`、`memory.init`、`memory.fill`をフラグ付きでサポートなど","relatedLinks":[{"title":"bulk-memory-operations/Overview.md at master · WebAssembly/bulk-memory-operations","url":"https://github.com/WebAssembly/bulk-memory-operations/blob/master/proposals/bulk-memory-operations/Overview.md"},{"title":"Media Queries Level 5","url":"https://drafts.csswg.org/mediaqueries-5/#prefers-contrast"}]},{"category":"Headline","title":"Release v7.5.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v7.5.0","tags":["npm","ReleaseNote"],"content":"npm 7.5.0リリース。\nnpmパッケージのDiffを取得する`npm diff`コマンドの追加など","relatedLinks":[{"title":"npm diff - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/ruyadorno/npm-diff-23dh"}]},{"category":"Headline","title":"Chromium Blog: Chrome 89 Beta: Advanced Hardware Interactions, Web Sharing on Desktop, and More","url":"https://blog.chromium.org/2021/01/chrome-89-beta-advanced-hardware.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 89ベータリリース。\nWebHID API、Web NFC、Web Serial APIのデフォルト有効化、デスクトップでのWeb Sharingの有効化。\nCross-origin opener policy reporting API、Manifastに`display_override`の追加。\n`performance.measureUserAgentSpecificMemory() `の追加、Streams APIがByte Streamsをサポート。\nその他にはTop-Level awaitのサポートなど","relatedLinks":[]},{"category":"Headline","title":"WebRTC 1.0 is a W3C Recommendation | W3C News","url":"https://www.w3.org/blog/news/archives/8897","tags":["W3C","WebRTC","news"],"content":"WebRTC 1.0がW3C Recommendationとなった","relatedLinks":[{"title":"Web Real-Time Communications (WebRTC) transforms the communications landscape; becomes a World Wide Web Consortium (W3C) Recommendation and multiple Internet Engineering Task Force (IETF) standards","url":"https://www.w3.org/2021/01/pressrelease-webrtc-rec.html.en"},{"title":"WebRTC is now a W3C and IETF standard","url":"https://web.dev/webrtc-standard-announcement/"}]},{"category":"Headline","title":"TOAST UI Chart 4.0 is here! | TOAST UI :: Make Your Web Delicious!","url":"https://ui.toast.com/weekly-pick/en_20210126","tags":["JavaScript","chart","library","ReleaseNote"],"content":"グラフライブラリのTOAST UI Chart v4.0リリース。\n依存をなくしファイルサイズの削減、レスポンシブサポート、ライブアップデートに対応したグラフの追加、テーマオプションの改善など。\nv3からのマイグレーションガイドも公開している","relatedLinks":[{"title":"tui.chart/v4.0-migration-guide-en.md at main · nhn/tui.chart","url":"https://github.com/nhn/tui.chart/blob/main/docs/v4.0-migration-guide-en.md"}]},{"category":"Headline","title":"CKEditor 5 v25.0.0 with flexible annotations, improved text blocks handling and performance fixes","url":"https://ckeditor.com/blog/CKEditor-5-v25.0.0-with-flexible-annotations-improved-text-blocks-handling-and-performance-fixes/","tags":["JavaScript","editor","library","ReleaseNote"],"content":"CKEditor 5 v25.0.0リリース。\nReDoSの問題の修正、コンテンツブロックの動作改善、大量のテキストのフォーマットのパフォーマンス改善、画像管理の改善など","relatedLinks":[]},{"category":"Headline","title":"Release v5.3.4 · vuejs/vue-devtools","url":"https://github.com/vuejs/vue-devtools/releases/tag/v5.3.4","tags":["Vue","Extension","ReleaseNote","security","browser"],"content":"Vue DevTools 5.3.4リリース。\nUniversal XSS脆弱性の修正","relatedLinks":[{"title":"Vue.js devtools Universal XSS (Chrome extension) · Issue #1353 · vuejs/vue-devtools","url":"https://github.com/vuejs/vue-devtools/issues/1353"}]},{"category":"Headline","title":"Babel 8 Release Plan · Issue #10746 · babel/babel","url":"https://github.com/babel/babel/issues/10746","tags":["babel","issue"],"content":"Babel 8のRoadmap Issue","relatedLinks":[]},{"category":"Article","title":"When to use HTTPS for local development","url":"https://web.dev/when-to-use-local-https/","tags":["HTTPS","debug","article"],"content":"ローカル開発でもHTTPSが必要なものと`localhost`について。\nまた、ローカルでの開発に使うべきTLDについて","relatedLinks":[{"title":"How to use HTTPS for local development","url":"https://web.dev/how-to-use-local-https/"}]},{"category":"Article","title":"Visitor pattern in TypeScript | Writing | Kirill Vasiltsov","url":"https://www.kirillvasiltsov.com/writing/visitor-pattern-typescript/","tags":["TypeScript","article"],"content":"TypeScriptのinterfaceを使ったVisitor Patternの実装方法についての記事","relatedLinks":[]},{"category":"Article","title":"Cypress vs Selenium vs Playwright vs Puppeteer speed comparison | Checkly blog","url":"https://blog.checklyhq.com/cypress-vs-selenium-vs-playwright-vs-puppeteer-speed-comparison/","tags":["JavaScript","browser","E2E","article","testing"],"content":"テストフレームワークの実行速度について比較した記事。\nPuppeteer、Playwright、WebDriverIO、Selenium、Cypressをいくつかのシナリオで比較している。","relatedLinks":[{"title":"Puppeteer vs Selenium vs Playwright, a speed comparison | Checkly blog","url":"https://blog.checklyhq.com/puppeteer-vs-selenium-vs-playwright-speed-comparison/"}]},{"category":"Article","title":"\\`undefined\\` vs. \\`null\\` revisited","url":"https://2ality.com/2021/01/undefined-null-revisited.html","tags":["JavaScript","article","opinion"],"content":"`undefined`と`null`について。\n`undefined`と`null`の歴史、`undefined`と`null`が言語的に発生するケース。言語的に特別扱いされるケース、どれを値がない値として使うかについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"azu/express-lazy-router: Lazy loading for express router","url":"https://github.com/azu/express-lazy-router","tags":["express","TypeScript","library","node.js"],"content":"expressのRouterを遅延ロードするライブラリ。\nts-node-devとか@babel/registerでruntime compileしているケースで、起動時に全コンパイルじゃなくて分散コンパイルできるようにする目的","relatedLinks":[]},{"category":"SoftwareLibrary","title":"WebReflection/linkedom: A triple-linked lists based DOM implementation.","url":"https://github.com/WebReflection/linkedom","tags":["HTML","DOM","JavaScript","node.js","library"],"content":"Node.js向けのHTML/DOMの実装ライブラリ。\n基本的なユースケースにおけるHTML文字列のパース、DOM APIを一定のパフォーマンスで実現できるものを目指している。\nDOM標準互換を目指すのではなく、basichtmlの置き換えを目的に治している。","relatedLinks":[{"title":"WebReflection/basicHTML: A NodeJS based, standard oriented, HTML implementation.","url":"https://github.com/WebReflection/basicHTML#readme"}]},{"category":"SoftwareLibrary","title":"shinyoshiaki/werift-webrtc: WebRTC Implementation for TypeScript (Node.js)","url":"https://github.com/shinyoshiaki/werift-webrtc","tags":["WebRTC","JavaScript","library"],"content":"Node.jsでのWebRTCの実装。\nSTUN、TURN、ICE、DataChannel、MediaChannelなどの実装","relatedLinks":[]},{"category":"SoftwareLibrary","title":"willmendesneto/perf-marks: The isomorphic, simplest, and lightweight solution for User Timing API in Javascript - 🚀 only 208B 🚀. Tree-shaking and entry points built-in. Simple as that!","url":"https://github.com/willmendesneto/perf-marks","tags":["performance","JavaScript","library","node.js","browser"],"content":"User Timing APIのラッパーライブラリ。\nブラウザとNode.js(`perf_hooks`)で利用できる。\nUser Timing APIのラップ、サポートしているかの判定処理、関数のプロファイル機能などを提供する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"alesgenova/post-me: 📩 Use web Workers and other Windows through a simple Promise API","url":"https://github.com/alesgenova/post-me","tags":["JavaScript","webworker","library","Promises","TypeScript"],"content":"Worker、Window(iframe)間のメッセージングライブラリ。\nPromiseベースのAPIでWindowとWorker間でメッセージのやり取りができる","relatedLinks":[]}]},{"meta":{"title":"2021-02-09のJS: npm 7正式リリース、Vuex v4.0.0、Puppeteer v6.0.0","author":"azu","layout":"post","date":"2021-02-09T03:18:50.582Z","category":"JSer","tags":["node.js","Tools","iOS","TypeScript","npm"],"url":"https://jser.info/2021/02/09/npm-7-vuex-v4.0.0-puppeteer-v6.0.0/"},"items":[{"category":"Headline","title":"npm 7 is now Generally Available - GitHub Changelog","url":"https://github.blog/changelog/2021-02-02-npm-7-is-now-generally-available/","tags":["npm","ReleaseNote"],"content":"npm 7がlatestとしてリリースされ、`npm install --global npm`でnpm 7がインストールされるようになった","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0 · puppeteer/puppeteer","url":"https://github.com/puppeteer/puppeteer/releases/tag/v6.0.0","tags":["Chrome","library","ReleaseNote"],"content":"Puppeteer v6.0.0リリース。\n`aria/*` selectorが非表示などスキップされた要素にはマッチしないように変更、TypeScriptの型定義を同梱するようになるなど。\nまた、Chromiumのアップデート、`page.emulateNetworkConditions`の追加、Apple M1のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node v15.8.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v15.8.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 15.8.0リリース。\n`crypto`モジュールに`generatePrime`と`checkPrime`メソッドを追加、npm 7.5.0へアップデート。\n`dgram.createSocket`と`readline.question`がAbortSignalをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · vuejs/vuex","url":"https://github.com/vuejs/vuex/releases/tag/v4.0.0","tags":["Vue","library","ReleaseNote"],"content":"Vuex 4.0リリース。\nVue 3サポート、インストールプロセスの変更、Vue 3に合わせたbundleの配布など。","relatedLinks":[]},{"category":"Headline","title":"Node.js 14.x runtime now available in AWS Lambda | AWS Compute Blog","url":"https://aws.amazon.com/jp/blogs/compute/node-js-14-x-runtime-now-available-in-aws-lambda/","tags":["node.js","aws","Lambda","news"],"content":"AWS LambdaがNode.js 14をサポート","relatedLinks":[]},{"category":"Headline","title":"Typicode's blog - Husky 5","url":"https://blog.typicode.com/husky-5/","tags":["JavaScript","library","Tools","git ","ReleaseNote"],"content":"Git Hooksを扱うhusky 5が正式リリース。\n依存なしに変更、ライセンスがMITからLicense Zero's Parity Licenseに変更。\n4.xからのマイグレーションツールも公開している。","relatedLinks":[{"title":"typicode/husky-4-to-5: Quickly migrate your hooks from husky v4 to v5","url":"https://github.com/typicode/husky-4-to-5"}]},{"category":"Article","title":"Node By Numbers 2020 - NodeSource","url":"https://nodesource.com/blog/node-by-numbers-2020","tags":["node.js","article"],"content":"NodesourceのLinux環境向けのNode.jsの2020年を数字で振り返る記事。\nrpmとdebのダウンロード数、地域、バージョンごとのダウンロード数など。\nセキュリティリリースがあった場合にはダウンロードのスパイクが発生している点についてなど","relatedLinks":[]},{"category":"Article","title":"SMS OTPの自動入力によるリスクとその対策 - Akaki I/O","url":"https://akaki.io/2021/sms_otp_autofill","tags":["security","HTML","article","iOS","Android"],"content":"iOSとAndroidにおけるSMS OTPの自動入力(`autocomplete=\"one-time-code\"`)の動作の検証。\nフィッシングなどの攻撃への利用やDomain-bound codesでの自動入力の検証や仕様などについて","relatedLinks":[]},{"category":"Article","title":"生 WebGL と TypeScript で Vercel のロゴを作る","url":"https://zenn.dev/ixkaito/articles/webgl-typescript-vercel-logo","tags":["WebGL","JavaScript","article","tutorial","TypeScript"],"content":"WebGLを使って図形を描画するまでをstep by stepで解説しているチュートリアル","relatedLinks":[]},{"category":"Article","title":"useEncapsulation | Kyle Shevlin","url":"https://kyleshevlin.com/use-encapsulation","tags":["React","article"],"content":"React Componentで扱うStateをCustom Hooksで構築するパターンについて。\nCustom HooksにまとめることでStateや操作をカプセル化したり、依存関係がわかりやすくなるなど","relatedLinks":[]},{"category":"Article","title":"Introducing Private Click Measurement, PCM | WebKit","url":"https://webkit.org/blog/11529/introducing-private-click-measurement-pcm/","tags":["safari","iOS","privacy","ad ","article"],"content":"iOS 14.5ベータでSafariとアプリでできるPrivate Click Measurement(PCM)についての解説。\nトラッカーからプライバシーを保護しながら、広告のコンバージョンを遅延して送信する仕組みについて","relatedLinks":[]},{"category":"Article","title":"10 bad TypeScript habits to break this year","url":"https://startup-cto.net/10-bad-typescript-habits-to-break-this-year/","tags":["TypeScript","article"],"content":"TypeScriptでの良くない習慣について。\n何故良くないのかと、どうするべきなのについて書かれている。\n`strict`、`||`、`any`、`as`、Optional、Genricsの名前、真偽値チェック、`!!`、`!= null`などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Replay: Record and replay web applications","url":"https://replay.io/","tags":["browser","webservice","debug"],"content":"リプレイデバッグサービス。\nFirefoxベースのリプレイを記録/再生するためのブラウザをオープンソースとして公開している\nhttps://github.com/RecordReplay/","relatedLinks":[]},{"category":"SoftwareLibrary","title":"samthor/gumnut: JS parser in Web Assembly / C","url":"https://github.com/samthor/gumnut","tags":["JavaScript","library","WebAssembly"],"content":"Cで書かれたJavaScriptパーサをWebAssemblyにコンパイルして扱う、JavaScriptパーサライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"davidjbradshaw/eslint-config-auto: Automatically configure ESLint based on project dependencies","url":"https://github.com/davidjbradshaw/eslint-config-auto","tags":["ESLint","Tools"],"content":"プロジェクトの`package.json`を元にAirbnbのルールを基本としたESLintルール設定を自動で行うツール","relatedLinks":[]}]},{"meta":{"title":"2021-02-16のJS: TypeScript 4.2 RC、WebdriverIO v7、Nuxt.js 2.15.0","author":"azu","layout":"post","date":"2021-02-16T03:07:05.874Z","category":"JSer","tags":["TypeScript","Vue","HTML","node.js","Fetch"],"url":"https://jser.info/2021/02/16/typescript-4.2-rc-webdriverio-v7-nuxt.js-2.15.0/"},"items":[{"category":"Headline","title":"Release v4.0.0 · lerna/lerna","url":"https://github.com/lerna/lerna/releases/tag/v4.0.0","tags":["JavaScript","monorepo","ReleaseNote"],"content":"lerna 4.0.0リリース。\nNode.js 10未満のサポート終了、依存のアップデートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.2 RC | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-2-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.2 RCリリース。\nTuple TypesでRest Elementをサポート、Type Aliasの型追跡の改善、オブジェクトではないオペランドに対する`in`演算子のチェックを追加。`noPropertyAccessFromIndexSignature`オプションの追加、`abstract new`のサポート、`--explainFiles`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · markedjs/marked","url":"https://github.com/markedjs/marked/releases/tag/v2.0.0","tags":["Markdown","library","ReleaseNote"],"content":"marked 2.0.0リリース","relatedLinks":[]},{"category":"Headline","title":"eBay Launches Marko 5","url":"https://tech.ebayinc.com/engineering/ebay-launches-marko-5/","tags":["JavaScript","library","template","ReleaseNote"],"content":"Marko 5リリース。\nコンパイラにBabelを使うように、webpackとRollupでのbundleに対応、`@marko/testing-library`の追加、VScodeなどのエディタ拡張のサポートなど。","relatedLinks":[{"title":"Upgrading to Marko 5","url":"https://markojs.com/docs/marko-5-upgrade/"}]},{"category":"Headline","title":"WebdriverIO v7 Released | WebdriverIO","url":"https://webdriver.io/blog/2021/02/09/webdriverio-v7-released/","tags":["webdriver","JavaScript","library","ReleaseNote"],"content":"WebdriverIO v7リリース。\nNode.js 10のサポート終了、TypeScriptでの書き直し、Cucumber v7へアップデート、Lightouse連携の改善。\n`browser.checkPWA()`の追加、`@babel/register`や`ts-node`がインストールされている場合に自動的にコンパイルする`autoCompileOpts`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v2.15.0 · nuxt/nuxt.js","url":"https://github.com/nuxt/nuxt.js/releases/tag/v2.15.0","tags":["Vue","library","ReleaseNote"],"content":"Nuxtjs 2.15.0リリース。\nNode.js 10のサポート終了、YarnのPlug'n'Playのサポート、`@nuxt/components` v2へのアップデートなど","relatedLinks":[{"title":"nuxt/components: Scan and auto import components for Nuxt.js 2.13+","url":"https://github.com/nuxt/components#migration-guide"},{"title":"nuxt-contrib/jiti: Runtime Typescript and ESM support for Node.js","url":"https://github.com/nuxt-contrib/jiti"}]},{"category":"Article","title":"Dynamic Static Typing In TypeScript — Smashing Magazine","url":"https://www.smashingmagazine.com/2021/01/dynamic-static-typing-typescript/","tags":["TypeScript","article","express"],"content":"expressのルーティングの型を書きながら、TypeScriptの高度な型について見ていくチュートリアル","relatedLinks":[]},{"category":"Article","title":"Generators in Javascript: How to use them - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/karimelghamry/generators-in-javascript-how-to-use-them-372d","tags":["JavaScript","article"],"content":"generator関数の使い方とユースケースについて","relatedLinks":[]},{"category":"Article","title":"Lazy Load Routes in Vue with webpack Dynamic Comments | CSS-Tricks","url":"https://css-tricks.com/lazy-load-routes-in-vue-with-webpack-dynamic-comments/","tags":["Vue","article"],"content":"Vue Routerを使った遅延ロードについての解説記事。\nwebpackでのchunkの分離、`webpackChunkName`でのchunkのファイル名の指定についてなど","relatedLinks":[]},{"category":"Article","title":"Just(js): On Javascript Performance","url":"https://just.billywhizz.io/blog/on-javascript-performance-01/","tags":["JavaScript","benchmark","performance","article","C++"],"content":"Just(js)はどのような最適化をしてTechempowerのベンチマークのスコアをあげていったかについての記事","relatedLinks":[{"title":"Introduction - TechEmpower Framework Benchmarks","url":"https://www.techempower.com/benchmarks/#section=intro"}]},{"category":"SlideVideo","title":"Write videos in React | Remotion","url":"https://www.remotion.dev/","tags":["React","video","library"],"content":"Reactを使って動画を作るための開発環境とライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tildeio/simple-html-tokenizer: A lightweight JavaScript library for tokenizing non-`<script>` HTML expected to be found in the `<body>` of a document","url":"https://github.com/tildeio/simple-html-tokenizer","tags":["JavaScript","HTML","library"],"content":"HTMLをパースしてトークナイズするライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Ethan-Arrowood/undici-fetch: A WHATWG Fetch implementation based on @nodejs/undici","url":"https://github.com/Ethan-Arrowood/undici-fetch","tags":["node.js","Fetch","library"],"content":"Node.js向けのFetch APIの実装ライブラリ。\nundiciをベースに実装している。","relatedLinks":[{"title":"nodejs/undici: An HTTP/1.1 client, written from scratch for Node.js","url":"https://github.com/nodejs/undici"}]},{"category":"SoftwareLibrary","title":"vercel/nft: Node.js dependency tracing utility","url":"https://github.com/vercel/nft","tags":["JavaScript","module","library","CommonJS","TypeScript"],"content":"JavaScriptファイルの依存関係をトレースするライブラリ。\n`node_modules`などを含むモジュールが依存するファイルパスを取得できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gzuidhof/sunder: A minimal framework for Service Workers (such as Cloudflare Workers).","url":"https://github.com/gzuidhof/sunder","tags":["ServiceWorker","cloudflare","library","JavaScript"],"content":"Service WorkerやCloudflare Worker向けのルーティングライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"zeroturnaround/sql-formatter: A whitespace formatter for different query languages","url":"https://github.com/zeroturnaround/sql-formatter","tags":["JavaScript","SQL","library"],"content":"JavaScriptで書かれたSQLのフォーマッター","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mizdra/eslint-interactive","url":"https://github.com/mizdra/eslint-interactive","tags":["ESLint","Tools"],"content":"ESLintをルールごとにチェックして、ルールごとに`--fix`での修正をインタラクティブにできるコマンドラインツール","relatedLinks":[{"title":"rule ごとに高速に eslint --fix できるツールを作った - mizdra's blog","url":"https://www.mizdra.net/entry/2021/02/11/211856"}]}]},{"meta":{"title":"2021-02-24のJS: Vite v2、Babel 7.13.0(設定の共通化)、WHATWG Streams入門ガイド","author":"azu","layout":"post","date":"2021-02-24T03:07:37.684Z","category":"JSer","tags":["Tools","node.js","TypeScript","Firefox","security"],"url":"https://jser.info/2021/02/24/vite-v2-babel-7.13.0-whatwg-streams/"},"items":[{"category":"Headline","title":"Announcing Vite 2.0 - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/yyx990803/announcing-vite-2-0-2f0a","tags":["Vue","JavaScript","ReleaseNote","Tools"],"content":"フレームワークに依存しない開発環境ツールのVite 2.0リリース。\n公式のテンプレートを用意しVue以外もサポート、WMRをインスパイアしたRollupを拡張したプラグインのサポート、CSSの扱いを改善。\nまた、試験的にSSRのサポートしている。","relatedLinks":[{"title":"Migration from v1 | Vite","url":"https://vitejs.dev/guide/migration.html#config-options-change"}]},{"category":"Headline","title":"Node v15.9.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v15.9.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 15.9.0リリース。\n`fs/promises`に`watch()`を追加、`fs.watch`がAbortSignalをサポート、`timers/promises`で`setInterval`をasync iteratorとして扱えるように","relatedLinks":[]},{"category":"Headline","title":"Release 3.9.0 - 2021.02.19 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.9.0","tags":["JavaScript","polyfill","library","ReleaseNote"],"content":"core-js 3.9.0リリース。\nES Proposal Stage 1の`Array#findLast()`、`Array#findLastIndex()`のサポート。","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · svg/svgo","url":"https://github.com/svg/svgo/releases/tag/v2.0.0","tags":["SVG","Tools","library","ReleaseNote"],"content":"SVG最適化ツールであるSVGO 2.0リリース。\n設定ファイルの書式の変更、CLIでinline json configを渡せないように変更、Node.js APIの変更。\nまた、ブラウザ向けのbundleを同梱するようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0-rc.1 · video-dev/hls.js","url":"https://github.com/video-dev/hls.js/releases/tag/v1.0.0-rc.1","tags":["HLS","JavaScript","library","ReleaseNote"],"content":"hls.js 1.0.0 RC1リリース。\n破壊的な変更としてAPIの一部変更、Promiseへ依存するようになった。\nLow-Latency HLSサポート、実験的にIMSC1の基本的な機能をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v5.24.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.24.0","tags":["webpack","ReleaseNote"],"content":"webpack 5.24.0リリース。\nConcatenationするモジュールを探索する際のパフォーマンス改善","relatedLinks":[{"title":"improve performance of finding modules for concatenation by sokra · Pull Request #12745 · webpack/webpack","url":"https://github.com/webpack/webpack/pull/12745"}]},{"category":"Headline","title":"7.13.0 Released: Records and Tuples, granular compiler assumptions, and top-level targets · Babel","url":"https://babeljs.io/blog/2021/02/22/7.13.0","tags":["babel","ReleaseNote"],"content":"Babel 7.13.0リリース。\n`targets`の設定をTop-Levelに書くことで各プラグインがその設定を利用するように、仕様のエッジケースを無視してより小さなコードを出力する`assumptions`オプションの追加。\nES Proposal Stage 2のRecordsとTuplesのサポート、Flowの`this`パラメータのサポート、TypeScript 4.2のサポートなど。\nまた、`@babel/runtime`がNode.jsの`exports`フィールドに対応するなど","relatedLinks":[]},{"category":"Headline","title":"A Fabulous February Firefox — 86! - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2021/02/a-fabulous-february-firefox-86/","tags":["Firefox","ReleaseNote"],"content":"Firefox 86リリース。\nETPのStrict ModeでState Partitioningを導入、Dev Toolsで`iframe`のinspectionを改善。\nCSSでprefixなし`:autofill`のサポート、`Intl.DisplayNames`をデフォルトで有効化など。\nまた、異なるドメインからページをロードした際に`Window.name`が空文字列となるように変更されている","relatedLinks":[{"title":"Firefox 86.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/86.0/releasenotes/"},{"title":"Firefox 86 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/86"},{"title":"Note Window.name privacy behavior in Firefox 86+ by Rumyra · Pull Request #9129 · mdn/browser-compat-data","url":"https://github.com/mdn/browser-compat-data/pull/9129"}]},{"category":"Headline","title":"Announcing TypeScript 4.2 | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-2/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.2リリース。\nTuple TypesでRest Elementをサポート、Type Aliasの型追跡の改善、オブジェクトではないオペランドに対する`in`演算子のチェックを追加。`noPropertyAccessFromIndexSignature`オプションの追加、`abstract new`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"February 2021 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/february-2021-security-releases/","tags":["node.js","ReleaseNote","security"],"content":"Node.jsのセキュリティアップデートとして10.x、12.x、14.x、15.xがそれぞれリリースされている。\nHTTP2のunknownProtocolを使ったDoSの修正、`--inspect`時のDNS rebindingの修正、OpenSSLのセキュリティアップデート","relatedLinks":[]},{"category":"Article","title":"Interview with Ryan Dahl, Node.js &amp; Deno creator by Evrone","url":"https://evrone.com/ryan-dahl-interview","tags":["deno","Interview","article","JavaScript","opinion"],"content":"Node.jsとDenoの作者であるRyan Dahlのインタビュー記事。\nJavaScript/TypeScript、Denoの設計、プログラミング言語の特性と問題領域、オープンソースについてなど","relatedLinks":[]},{"category":"Article","title":"Understanding Z-Index in CSS","url":"https://ishadeed.com/article/understanding-z-index/","tags":["CSS","tutorial"],"content":"CSSの`z-index`について図とともに視覚的に学べるチュートリアル。\nスタックコンテキスト、スタックコンテキストを作るプロパティ、`z-index`との関係について","relatedLinks":[]},{"category":"Article","title":"Using AbortController as an Alternative for Removing Event Listeners | CSS-Tricks","url":"https://css-tricks.com/using-abortcontroller-as-an-alternative-for-removing-event-listeners/","tags":["DOM","JavaScript","article"],"content":"Chrome 88から`addEventListener`がAbort Signalに対応したため、`removeEventListener`を使わずにイベントリスナーを解除できるという話","relatedLinks":[]},{"category":"Article","title":"Listify a JavaScript Array","url":"https://kentcdodds.com/blog/listify-a-java-script-array","tags":["JavaScript","i18n","article"],"content":"`Intl.ListFormat`を使うことで、\"A, B, and C\"のような言語に応じたandとorの表現を作成できるという話","relatedLinks":[]},{"category":"Article","title":"Introducing State Partitioning - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2021/02/introducing-state-partitioning/","tags":["Firefox","security","article"],"content":"Firefox 86でETPのStrictモードを使っている際に有効化されたState Partitioningについて。\nCookieの保存もサイトごとのdoubled keyとなり、3rd party cookieなども分離される。\nSSOなどを壊さないようにopenerを使った動作に対するヒューリスティックな回避策やStorage Access APIについても書かれている","relatedLinks":[{"title":"State Partitioning - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Privacy/State_Partitioning"},{"title":"Firefox 86 Introduces Total Cookie Protection - Mozilla Security Blog","url":"https://blog.mozilla.org/security/2021/02/23/total-cookie-protection/"}]},{"category":"Article","title":"Streams—The definitive guide","url":"https://web.dev/streams/","tags":["WHATWG","stream","article"],"content":"WHATWG Streamsについての解説記事。\nコンセプト、仕組み、`ReadableStream`/`WritableStream`/`TransformStream`の使い方と`pipeTo`での連携。\nFetch API、Text Encoding、Compression、File System API、Web SocketsなどStreamをサポートしているAPIについても紹介している","relatedLinks":[]},{"category":"WebsiteDocument","title":"w3c/browser-statuses: Implementation support information of Web technologies on main desktop and mobile browsers","url":"https://github.com/w3c/browser-statuses","tags":["browser","WebPlatformAPI","library"],"content":"Can I Use、Chrome Platform Status、MDN、WebKit Feature Statusのデータをノーマライズしたデータセット。\nAPIごとにブラウザやPolyfillのサポート状況を取得できるライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ThomasAribart/json-schema-to-ts: Infer TS types from JSON schemas 📝","url":"https://github.com/ThomasAribart/json-schema-to-ts","tags":["JSON","TypeScript","library"],"content":"JSON SchemaからTypeScriptの型推論をするライブラリ","relatedLinks":[]}]},{"meta":{"title":"2021-03-02のJS: Bundle Size以外のJavaScriptパフォーマンス、CORS 完全手冊","author":"azu","layout":"post","date":"2021-03-01T21:33:41.685Z","category":"JSer","tags":["debug","React","Chrome","CSS","performance"],"url":"https://jser.info/2021/03/02/bundle-sizejavascript-cors/"},"items":[{"category":"Article","title":"Introducing Env: a better way to read environment variables in JavaScript - Human Who Codes","url":"https://humanwhocodes.com/blog/2021/02/introducing-env-javascript-environment-variables/","tags":["JavaScript","library","article"],"content":"環境変数のよくある問題を回避するライブラリについて","relatedLinks":[]},{"category":"Article","title":"CSS-in-JS support in DevTools  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2021/02/css-in-js","tags":["Chrome","debug","CSS","article"],"content":"Chrome 85 DevToolsのCSS-in-JSの対応について。\n今まではCSSOM APIで追加されたルールのスタイルは編集できなかったが、編集できるようになったという話","relatedLinks":[]},{"category":"Article","title":"JavaScript performance beyond bundle size | Read the Tea Leaves","url":"https://nolanlawson.com/2021/02/23/javascript-performance-beyond-bundle-size/","tags":["JavaScript","performance","article"],"content":"JavaScriptのBundle sizeとランタイムのCPUコスト、メモリ使用量、電力使用量の調べ方について。\nBundle SizeについてはBundlePhobiaやWeb Vitalsなどで分かるようになってきているが、パフォーマンスはもっと多面的なものであるため、他のメトリクスをどのように見るかについて","relatedLinks":[{"title":"BundlePhobia ❘ cost of adding a npm package","url":"https://bundlephobia.com/"}]},{"category":"Article","title":"How Web Content Can Affect Power Usage | WebKit","url":"https://webkit.org/blog/8970/how-web-content-can-affect-power-usage/","tags":["safari","webkit","debug","article"],"content":"CPU、GPU、ネットワークなどが電力消費に与える影響について。\nバックグラウンド時にCPU消費をなくす方法、Web InspectorのEnergy Impactの表示について","relatedLinks":[]},{"category":"Article","title":"Why JavaScript Developers Should Prefer Axios Over Fetch | by Sabesan Sathananthan | Feb, 2021 | Better Programming","url":"https://betterprogramming.pub/why-javascript-developers-should-prefer-axios-over-fetch-294b28a96e2c","tags":["JavaScript","Fetch","article"],"content":"Fetch APIとaxiosの比較。\nレスポンスデータの自動変換、エラー処理、ダウンロードのprogress処理、アップロードのprogress処理、HTTPのインターセプト、タイムアウト、並列リクエストについて比較している","relatedLinks":[]},{"category":"Article","title":"Use CSS Variables instead of React Context | Epic React by Kent C. Dodds","url":"https://epicreact.dev/css-variables/","tags":["React","CSS","article"],"content":"CSS-in-JSを使ったThemeコンポーネントのようなテーマの切り替えをCSS Custom Propertiesで実装してみる話。\n実装の違い、レンダリングフローの違いについて","relatedLinks":[]},{"category":"Article","title":"React Context を export するのはアンチパターンではないかと考える | stin&#039;s blog","url":"https://blog.stin.ink/articles/do-not-export-react-context","tags":["React","article"],"content":"React Contextをモジュールからexportするのではなく、Custom Hookとしてexportするという話。","relatedLinks":[]},{"category":"Article","title":"CORS 完全手冊（一）：為什麼會發生 CORS 錯誤？ - Huli","url":"https://blog.huli.tw/2021/02/19/cors-guide-1/","tags":["CORS","security","browser","article"],"content":"CORSの概念、対応方法、よくある間違い、CORB/CORP/COEP/COOPなどオリジン関連のルール、セキュリティ的な問題についての連載記事。\nクロスオリジンリクエストはなぜブロックされるのか、CORSの仕様解説、CORSのキャッシュ、CORSの設定ミスなどについて","relatedLinks":[]},{"category":"Article","title":"What&#039;s New In DevTools (Chrome 90)  |  Web  |  Google Developers","url":"https://developers.google.com/web/updates/2021/02/devtools","tags":["Chrome","debug","article"],"content":"Chrome 90のDev Toolsの変更点について。\nCSS flexboxのデバッグツールの追加、Core Web Vitalsのオーバーレイ表示、\nIssues tabの改善、CSS color-gamutのエミュレート機能の追加。\nDev Toolsを開いた状態でのデバッグのパフォーマンス改善、`fn.displayName`のサポートを非推奨化など","relatedLinks":[]},{"category":"SlideVideo","title":"GoudekettingRM/link-overview-jsworld-2021","url":"https://github.com/GoudekettingRM/link-overview-jsworld-2021","tags":["JavaScript","Conference","video","slide"],"content":"JS World 2021のスライドや動画のまとめ","relatedLinks":[{"title":"JS World - Online Conference by Frontend Love","url":"https://frontenddeveloperlove.com/"}]},{"category":"SoftwareLibrary","title":"jcubic/tagger: Zero Dependency, Vanilla JavaScript Tag Editor","url":"https://github.com/jcubic/tagger","tags":["JavaScript","library"],"content":"依存のないタグ入力UIライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"wynntee/joss: JOSS can serialize almost every JavaScript data type and data structure, so data can be seamlessly exchanged between browsers and servers (Deno or Node.js).","url":"https://github.com/wynntee/joss","tags":["JavaScript","library"],"content":"JOSSというJavaScriptオブジェクトのシリアライズ、デシアライズの仕様とそのリファレンス実装ライブラリ。\nBigInt、循環参照、疎な配列、`-0`などJSONにはない部分もサポートしている。\nブラウザ、Node、Denoで動作する","relatedLinks":[{"title":"JS Open Serialization Scheme","url":"https://www.wynntee.com/projects/serialization/specification/index.html"}]},{"category":"SoftwareLibrary","title":"andrewcourtice/harlem: Simple, unopinionated, lightweight and extensible state management for Vue 3","url":"https://github.com/andrewcourtice/harlem","tags":["Vue","JavaScript","TypeScript","library"],"content":"Vue 3向けのステート管理ライブラリ。\npluginでVue DevToolsへの対応や、SSR、Storage保存、トランザクション対応などができる。","relatedLinks":[]},{"category":"Book","title":"React テスト応用、テストに悩む人へ","url":"https://zenn.dev/tkdn/books/react-testing-patterns","tags":["React","testing","book"],"content":"ReactコンポーネントとHooksのテストについての書籍。","relatedLinks":[]}]},{"meta":{"title":"2021-03-09のJS: Gatsby 3、Electron 12、ブラウザのライフサイクルの変化","author":"azu","layout":"post","date":"2021-03-08T14:53:58.520Z","category":"JSer","tags":["React","serverless","aws","GraphQL","jQuery"],"url":"https://jser.info/2021/03/08/gatsby-3-electron-12-/"},"items":[{"category":"Headline","title":"Gatsby v3 Incremental Builds in OSS, new Gatsby Image, and more | Gatsby","url":"https://www.gatsbyjs.com/blog/gatsby-v3/","tags":["React","GraphQL","ReleaseNote"],"content":"Gatsby 3.0リリース。\n破壊的変更としてNode.js 12未満のサポート終了、webpack 5/ESLint 7へアップデート、globalの`graphql`ではなくimportして使うように変更、APIの変更など。\nローカルでは実際にアクセスされたページだけをビルドすることで、全体を再構築せずにビルドできるように","relatedLinks":[{"title":"Migrating from v2 to v3 | Gatsby","url":"https://www.gatsbyjs.com/docs/reference/release-notes/migrating-from-v2-to-v3/"}]},{"category":"Headline","title":"jQuery 3.6.0 Released! | Official jQuery Blog","url":"https://blog.jquery.com/2021/03/02/jquery-3-6-0-released/","tags":["jQuery","JSON","ReleaseNote"],"content":"jQuery 3.6.0リリース。\nJSONPのリクエスト時に、エラーレスポンスがJSONを返した場合の挙動を変更。\n`.focus()`のバグを修正など","relatedLinks":[]},{"category":"Headline","title":"Deno 1.8 Release Notes","url":"https://deno.land/posts/v1.8","tags":["deno","ReleaseNote"],"content":"Deno 1.8.0リリース。\n試験的にWebGPU APIのサポート。\nICUに対応しECMA i18n APIである`Intl` オブジェクトなどのサポート。`DENO_AUTH_TOKENS`でモジュールを取得する際の認証トークンをサポート、Exit sanitierを`Deno.test`に追加、`deno fmt`がJSONをサポート、TypeScript 4.2へアップデート。\nImport Map、`Deno.permissions`、`Deno.link`、`Deno.symlink` APIがそれぞれStable APIとなった。","relatedLinks":[]},{"category":"Headline","title":"New Microsoft Edge to replace Microsoft Edge Legacy with April’s Windows 10 Update Tuesday release - Microsoft Tech Community","url":"https://techcommunity.microsoft.com/t5/microsoft-365-blog/new-microsoft-edge-to-replace-microsoft-edge-legacy-with-april-s/ba-p/2114224","tags":["MSEdge","news"],"content":"Microsoft Edge Legacyは2021年3月9日でサポート終了される。\nまた、2021年4月13に削除されるセキュリティアップデートが配信され、同時に新しいChromiumベースのMSEdgeがインストールされる。","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Speeding up Chrome&#039;s release cycle","url":"https://blog.chromium.org/2021/03/speeding-up-release-cycle.html","tags":["Chrome","news"],"content":"Chromeのリリースサイクルが6週間ごとから4週間ごとに短縮される。","relatedLinks":[]},{"category":"Headline","title":"Announcing the New TypeScript Handbook | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-the-new-typescript-handbook/","tags":["TypeScript","document"],"content":"TypeScript Handbookが刷新された。","relatedLinks":[{"title":"TypeScript: The starting point for learning TypeScript","url":"https://www.typescriptlang.org/docs/"}]},{"category":"Headline","title":"Electron 12.0.0 | Electron Blog","url":"https://www.electronjs.org/blog/electron-12-0","tags":["Electron","ReleaseNote"],"content":"Electron 12.0.0リリース。\nChromium 89、V8 8.9、Node.js 14.16へアップデート。\n`exposeInMainWorld`がオブジェクト以外をサポート、`webFrameMain` APIの追加など。\n`contextIsolation`と`worldSafeExecuteJavaScript`がデフォルトで`true`に変更、`remote`モジュールが非推奨となり`@electron/remote`外部モジュール化","relatedLinks":[{"title":"electron/remote: Bridge JavaScript objects from the main process to the renderer process in Electron.","url":"https://github.com/electron/remote"}]},{"category":"Headline","title":"Release v6.0.0 · pixijs/pixi.js","url":"https://github.com/pixijs/pixi.js/releases/tag/v6.0.0","tags":["JavaScript","game","library","ReleaseNote","canvas","WebGL"],"content":"pixi.js 6.0.0リリース。\nTypeScriptの型改善、DeprecatedとなっていたAPIの削除、`alpha`オプションのデフォルト値を`true`に変更、`FAIL_IF_MAJOR_PERFORMANCE_CAVEAT`のデフォルト値を`false`に変更など","relatedLinks":[]},{"category":"Headline","title":"Google Developers Blog: Announcing Flutter 2","url":"https://developers.googleblog.com/2021/03/announcing-flutter-2.html","tags":["Flutter","ReleaseNote"],"content":"Flutter 2リリース。\nWebサポートとデスクトップサポートがStableとなり、Dart 2.12をサポート。\niOSでAutocompleteとScaffoldMessengerのサポートなど","relatedLinks":[{"title":"Dart 2.12","url":"https://medium.com/dartlang/announcing-dart-2-12-499a6e689c87"},{"title":"Flutter web support hits the stable milestone | Flutter","url":"https://medium.com/flutter/flutter-web-support-hits-the-stable-milestone-d6b84e83b425"},{"title":"What’s New in Flutter 2. by Chris Sells | Mar, 2021 | Medium | Flutter | Flutter","url":"https://medium.com/flutter/whats-new-in-flutter-2-0-fe8e95ecc65"}]},{"category":"Article","title":"Mini apps - web.dev","url":"https://web.dev/mini-apps/","tags":["article"],"content":"Mini appsのエコシステムの記事","relatedLinks":[]},{"category":"Article","title":"Hiding Content Responsibly | Kitty Giraudel","url":"https://kittygiraudel.com/2021/02/17/hiding-content-responsibly/","tags":["HTML","CSS","accessibility","article"],"content":"コンテンツの非表示を意味するCSSやWAI-ARIA属性のそれぞれの動作とアクセシビリティ的な挙動についてのまとめ。\nデータ、ビジュアル、レイアウト、セマンティクス、コンテンツ、キーボード、ポインター、スタイルなどの状態について","relatedLinks":[{"title":"removal techniques and implications","url":"https://codepen.io/vincent-valentin/full/JjGmxzV"}]},{"category":"SoftwareLibrary","title":"serverless-stack/serverless-stack: Serverless Stack (SST) is a framework that makes it easy to build serverless apps.","url":"https://github.com/serverless-stack/serverless-stack","tags":["serverless","aws"],"content":"AWS CDKを使ったserverless管理、開発ツール。\nLambdaの開発、デプロイ、ビルドやLintの設定、各種AWSスタックとの連携などを含む","relatedLinks":[]},{"category":"SoftwareLibrary","title":"NightlyCommit/twing: First-class Twig engine for Node.js","url":"https://github.com/NightlyCommit/twing","tags":["template","JavaScript","library"],"content":"テンプレートエンジンであるTwigのJavaScript実装ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"JakePartusch/serverlessui: A command-line utility for deploying serverless applications to AWS. Complete with custom domains, deploy previews, TypeScript support, and more.","url":"https://github.com/JakePartusch/serverlessui","tags":["aws","serverless","Tools"],"content":"AWSへserverlessアプリケーションをデプロイするためのツール。\nCDKを使って静的なサイトとlambdaなどのデプロイを一括で行う","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nanojsx/nano: 🎯 SSR first, lightweight 1kB JSX library.","url":"https://github.com/nanojsx/nano","tags":["jsx","React","library"],"content":"JSXを使ったSSR firstなUIライブラリ。\n指定したコンポーネントのみをHydrate、Lazy Hydrateができ、ビルトインでRouterやHead周りのコンポーネントを持っている。\nReactライクなライフサイクルメソッドやHooksの処理を持っている。","relatedLinks":[{"title":"Nano JSX • Lightweight 1kB JSX library","url":"https://nanojsx.github.io/"}]}]},{"meta":{"title":"2021-03-16のJS: Safari Technology Preview 122、React Native 0.64、SvelteKit","author":"azu","layout":"post","date":"2021-03-15T23:42:20.954Z","category":"JSer","tags":["Tools","debug","Chrome","CSS","React"],"url":"https://jser.info/2021/03/16/safari-technology-preview-122-react-native-0.64-sveltekit/"},"items":[{"category":"Headline","title":"Release v0.9.0 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.9.0","tags":["JavaScript","Tools","relre"],"content":"esbuild 0.9.0リリース。\npackage.jsonの`exports`フィールドのサポート、`esbuild.startService()` APIの削除、bannerとfooterを言語ごとに指定できるように","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 122 | WebKit","url":"https://webkit.org/blog/11577/release-notes-for-safari-technology-preview-122/","tags":["safari","webkit","ReleaseNote"],"content":"Safari Technology Preview 122リリース。\n実験フラグ付きでCSS `:focus-visible`とCSS Color 5の実装を追加。\nES ProposalのPrivate method、Top-Level await、RegExp Match Indicesのサポート。\nWorkerで`type: module`をサポート、Paint Timingの有効化など","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 90 Beta: AV1 Encoder for WebRTC, New Origin Trials, and More","url":"https://blog.chromium.org/2021/03/chrome-90-beta-av1-encoder-for-webrtc.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 90 Betaリリース。\nAV1 Encoderのサポート。\nOrigin Trialとして`getCurrentBrowsingContextMedia()`、Breakout Box、WebAssembly Exception Handlingのサポート。\nCSSの`aspect-ratio`とwidthかheightが指定されているときに推論されるように、`:state`、`overflow: clip`のサポート。\nFeature-Policyに代わるPermissions-Policy、`StaticRange`のサポートなど。\n`navigator.plugins`と`navigator.mimeTypes`が空要素を返すようになるなど","relatedLinks":[]},{"category":"Headline","title":"Announcing React Native 0.64 with Hermes on iOS · React Native","url":"https://reactnative.dev/blog/2021/03/12/version-0.64","tags":["React","iOS","Android","ReleaseNote"],"content":"React Native 0.64リリース。\niOSでもJSエンジンのHermesを利用可能に、MetroでInline Requiresがデフォルトで有効化、HermesがES Proxyのサポート、React 17へアップデートなど","relatedLinks":[]},{"category":"Headline","title":"sveltejs/kit: A monorepo for SvelteKit and friends","url":"https://github.com/sveltejs/kit","tags":["Svelte","JavaScript","Tools","news"],"content":"SvelteKitのソースコードが公開された","relatedLinks":[]},{"category":"Headline","title":"Release ES2021 Candidate March 2021 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2021-candidate-2021-03","tags":["ECMAScript","spec","ReleaseNote"],"content":"ECMAScript 2021のリリース候補が公開された。ECMAScript 2021に入る予定の機能は決定され仕様もフリーズされたため、masterブランチはES 2022となった","relatedLinks":[{"title":"ECMAScript 2021: the final feature set","url":"https://2ality.com/2020/09/ecmascript-2021.html"},{"title":"proposals/finished-proposals.md at master · tc39/proposals","url":"https://github.com/tc39/proposals/blob/master/finished-proposals.md"}]},{"category":"Headline","title":"Socket.IO 4.0.0 | Socket.IO","url":"https://socket.io/blog/socket-io-4-release/","tags":["WebSocket","node.js","library","ReleaseNote"],"content":"Socket.IO 4.0.0リリース。\n破壊的な変更としてサーバ側の`io.to()`がimmutableに変更、protocolは互換性を維持している。\n`pingTimeout`のデフォルト値を5秒から20秒へ変更、Utilityメソッドの追加、`autoUnref`オプションの追加など","relatedLinks":[{"title":"Migrating from 3.x to 4.0 | Socket.IO","url":"https://socket.io/docs/v3/migrating-from-3-x-to-4-0/"},{"title":"fix: set default protocol version to 3 to allow backward compatibilit… by simonemazzoni · Pull Request #616 · socketio/engine.io","url":"https://github.com/socketio/engine.io/pull/616"}]},{"category":"Article","title":"Debugging layout shifts","url":"https://web.dev/debugging-layout-shifts/","tags":["performance","debug","article"],"content":"Layout Instability APIでのCumulative Layout Shift (CLS)の計測とCLSの特定とデバッグ方法について","relatedLinks":[]},{"category":"Article","title":"Digging Into CSS Logical Properties","url":"https://ishadeed.com/article/css-logical-properties/","tags":["CSS","article"],"content":"RTLに対応したCSSの書き方と`margin-inline-end`について。","relatedLinks":[]},{"category":"Article","title":"レシピサービスのフロントエンドに CSS in JS を採用した話 - クックパッド開発者ブログ","url":"https://techlife.cookpad.com/entry/2021/03/15/090000","tags":["React","CSS","article"],"content":"emotionを使ったCSS-in-JSについて。\nstyled-componentsの記法ではなくString Stylesを採用した理由、stylelintを使ったLint、Jestを使ったスナップショットテストについてなど","relatedLinks":[]},{"category":"Article","title":"JavaScript: What is the meaning of this?","url":"https://web.dev/javascript-this/","tags":["JavaScript","article"],"content":"いろいろなケースの`this`の意味について解説している記事","relatedLinks":[{"title":"関数とthis · JavaScript Primer #jsprimer","url":"https://jsprimer.net/basic/function-this/"}]},{"category":"Article","title":"Beyond Console.log() – Level up Your Debugging Skills - SitePoint","url":"https://www.sitepoint.com/beyond-console-log-level-up-your-debugging-skills/","tags":["console","debug","JavaScript","article","Chrome"],"content":"Console APIやChrome DevToolsを使ったデバッグについての記事。\nログフォーマット、Console APIの紹介、Dev Tools上で使える関数、Overrides、VScodeとの連携についてなど","relatedLinks":[]},{"category":"Article","title":"The Death of a Node.js Process - Thomas Hunter II","url":"https://thomashunter.name/posts/2021-03-08-the-death-of-a-nodejs-process","tags":["node.js","article"],"content":"Node.jsにおけるプロセス終了とエラーについて。\nuncaughtException、unhandledRejectionでのエラーのキャッチと`process.exit`でのプロセス終了方法。\nまた、Signalとそれをハンドリングできるかどうかについてのまとめ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Post-Spectre Web Development","url":"https://w3c.github.io/webappsec-post-spectre-webdev/","tags":["security","document"],"content":"Spectre以後のウェブ開発における脅威モデルと戦略についてのドキュメント。\nIsolation、サブリソース、クロスオリジンを意図した操作についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"What is SvelteKit? | SK Incognito","url":"https://sk-incognito.vercel.app/learn/what-is-sveltekit","tags":["Svelte","tutorial"],"content":"SvelteKitのチュートリアルサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Cloud9c/taro: A lightweight 3D game engine for the web.","url":"https://github.com/Cloud9c/taro","tags":["JavaScript","3D","game","library"],"content":"three.jsとcannon-esを使った3Dゲームエンジンライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rsms/estrella: Lightweight and versatile build tool based on the esbuild compiler","url":"https://github.com/rsms/estrella","tags":["JavaScript","Tools","bundler"],"content":"esbuildとtscのラッパーツール。\nesbuildでビルドしながら、tscでの型チェックを同時に実行できるビルドツール","relatedLinks":[{"title":"Through the pipeline: An exploration of front-end bundlers - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/walpolea/through-the-pipeline-an-exploration-of-front-end-bundlers-ea1"}]}]},{"meta":{"title":"2021-03-23のJS: Node.js 15.12.0(fs.promisesのパフォーマンス改善)、strict CSP、CSS Auditing Tools","author":"azu","layout":"post","date":"2021-03-23T03:32:29.241Z","category":"JSer","tags":["node.js","performance","Tools","testing","browser"],"url":"https://jser.info/2021/03/23/node.js-15.12.0fs.promises-strict-csp-css-auditing-tools/"},"items":[{"category":"Headline","title":"Node v15.12.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v15.12.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 15.12.0リリース。\n`crypto.create{Public,Private}Key`がJWKオブジェクトをサポート、`fs.promises`のwriteFileとreadFileのパフォーマンス改善。\n`AbortSignal.abort()`の実装、`worker_threads`モジュールに`{get,set}EnvironmentData`を追加など","relatedLinks":[{"title":"fs.promises.readFile is 40% slower than fs.readFile · Issue #37583 · nodejs/node","url":"https://github.com/nodejs/node/issues/37583"}]},{"category":"Headline","title":"V8 release v9.0 · V8","url":"https://v8.dev/blog/v8-release-90","tags":["V8","ReleaseNote"],"content":"V8 v9.0リリース。\n`RegExp#insices`の実装、`super`のプロパティアクセスのパフォーマンス改善、JavaScriptからWasmの関数を呼ぶときのパフォーマンスを改善など","relatedLinks":[]},{"category":"Headline","title":"Release v7.3.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v7.3.0","tags":["performance","Tools","ReleaseNote","Chrome"],"content":"Lighthouse 7.3.0リリース。\n新しいauditとしてcsp-xssを試験的に追加。","relatedLinks":[{"title":"new","url":"https://github.com/GoogleChrome/lighthouse/pull/12044"}]},{"category":"Headline","title":"jasmine/3.7.0.md at main · jasmine/jasmine","url":"https://github.com/jasmine/jasmine/blob/main/release_notes/3.7.0.md","tags":["JavaScript","library","ReleaseNote","testing"],"content":"Jasmine 3.7リリース。\nNode.jsのSource Mapsに対応、Array.prototypeを拡張している際にテストが一部落ちる問題の修正、`.and.callFake`がGenerator関数をサポートなど","relatedLinks":[{"title":"Source maps in Node.js. Supporting the many flavors of… | by Node.js | Medium","url":"https://nodejs.medium.com/source-maps-in-node-js-482872b56116"}]},{"category":"Headline","title":"ECMAScript proposal updates @ 2021-03 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2021/03/22/ecmascript-proposal-update","tags":["ECMAScript","news"],"content":"2021年3月のTC39でECMAScript Proposalのステータス変更のまとめ。\nModule FragmentsがStage 1へ、`Array#findLast`がStage2へ、TemporalがStage 3へ更新など","relatedLinks":[{"title":"JavaScript の Module Fragments について","url":"https://sosukesuzuki.dev/posts/stage-0-module-fragments/"}]},{"category":"Headline","title":"sinon/CHANGELOG.md at master · sinonjs/sinon","url":"https://github.com/sinonjs/sinon/blob/master/CHANGELOG.md#1000--2021-03-22","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Sinon.js 10.0.0リリース。\nIE 11、Legacy Edge、Legacy Safariのサポートを終了。","relatedLinks":[]},{"category":"Article","title":"Mitigate cross-site scripting (XSS) with a strict Content Security Policy (CSP)","url":"https://web.dev/strict-csp/","tags":["CSP","article","security"],"content":"ドメインの許可リストのCSPよりも、strict設定のCSPを推奨するという話。\nnonceとstrict-dynamicベースのCSP設定で防げるXSS、nonceベースとhashベースのCSPの設定、CSPの導入手順について","relatedLinks":[]},{"category":"Article","title":"Supabseチームはどのようにフロントエンドの高速化に成功したのか - バンクーバーで考え中","url":"https://jp.taishikato.com/posts/making-the-supabase-dashboard-supa-fast","tags":["performance","article"],"content":"Making the Supabase Dashboard Supa-fastの翻訳記事。\nベースラインと目標設定、バンドルサイズの改善、パフォーマンス文化について","relatedLinks":[{"title":"Making the Supabase Dashboard Supa-fast","url":"https://supabase.io/blog/2020/12/13/supabase-dashboard-performance"}]},{"category":"Article","title":"The #1 tip to familiarize with new JavaScript Codebases","url":"https://www.kevinpeters.net/the-fastest-way-to-understand-new-code-bases","tags":["JavaScript","article"],"content":"`code-complexity`を使ったコードの複雑度分析について。\nComplexityとChurnについて","relatedLinks":[{"title":"simonrenoult/code-complexity: Measure the churn/complexity ratio. Higher values mean hotspots where refactorings should happen.","url":"https://github.com/simonrenoult/code-complexity"}]},{"category":"Article","title":"CSS Auditing Tools — Smashing Magazine","url":"https://www.smashingmagazine.com/2021/03/css-auditing-tools/","tags":["CSS","article","Tools"],"content":"CSSのAuditツールについての記事。\nCSSセレクタの詳細度、複雑度の測定、Code Coverage、継続的な分析など","relatedLinks":[]},{"category":"Article","title":"Next 10 years of Node.js — Understanding the needs of the Node.js constituencies | by Node.js | Mar, 2021 | Medium","url":"https://nodejs.medium.com/next-10-years-of-node-js-understanding-the-needs-of-the-node-js-constituencies-2f95a1df6a6f","tags":["node.js","article"],"content":"Node.jsの次の10年について","relatedLinks":[{"title":"nodejs/next-10: Repository for discussion on strategic directions for next 10 years of Node.js","url":"https://github.com/nodejs/next-10"}]},{"category":"SoftwareLibrary","title":"101arrowz/isoworker: Isomorphic workerization with context support","url":"https://github.com/101arrowz/isoworker","tags":["browser","node.js","library"],"content":"WebWorkerと`worker_threds`に対応したWorkerライブラリ。\nInline CodeをWorkerコードを作成し、Workerに対してクラスや関数を含めたデータを渡して実行した結果を取得できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"taoqf/node-html-parser: A very fast HTML parser, generating a simplified DOM, with basic element query support.","url":"https://github.com/taoqf/node-html-parser","tags":["HTML","DOM","library"],"content":"HTMLパーサとDOM APIライブラリ。\nパースした結果のオブジェクトでDOM APIライクな操作ができる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Hello from tRPC | tRPC","url":"https://trpc.io/","tags":["JavaScript","browser","node.js","library","TypeScript","React","Next.js"],"content":"HTTP通信のデータレイヤーライブラリ。\nTypeScriptとyup/zodなどのバリデーターを使ったサーバ側のAPIエンドポイントを定義し、その型をクライアントからも利用できる。\nReact向けのHooks/SSR対応のクライアントライブラリも公開されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Charts.css","url":"https://chartscss.org/","tags":["CSS","library"],"content":"CSSを使ったグラフライブラリ。\n様々な種類のチャートの表示に対応している。","relatedLinks":[]},{"category":"Book","title":"Learning TensorFlow.js","url":"https://learning.oreilly.com/library/view/learning-tensorflowjs/9781492090786/","tags":["JavaScript","MachineLearning","book"],"content":"2021年7月発売\nTensorFlow.jsの入門書","relatedLinks":[]}]},{"meta":{"title":"2021-03-30のJS: Firefox 87.0、Next.js 10.1、Spectreの対応","author":"azu","layout":"post","date":"2021-03-30T06:12:26.680Z","category":"JSer","tags":["TypeScript","book","npm","security","Tools"],"url":"https://jser.info/2021/03/30/firefox-87.0-next.js-next.js-10.1-spectre/"},"items":[{"category":"Headline","title":"Release v7.7.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v7.7.0","tags":["npm","ReleaseNote"],"content":"npm 7.7.0リリース。\nnpm run-scriptと`npm exec`が`--workspace`フラグでworkspacesをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Firefox 87.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/87.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 87.0リリース。\nReferrer Policyのデフォルト値を`strict-origin-when-cross-origin`に変更、トラッカーのスクリプトをローカルで置き換えるSmartBlock。\nDevToolsで`prefers-color-scheme`のシミュレートなど","relatedLinks":[{"title":"Firefox 87 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/87"},{"title":"Firefox 87 trims HTTP Referrers by default to protect user privacy - Mozilla Security Blog","url":"https://blog.mozilla.org/security/2021/03/22/firefox-87-trims-http-referrers-by-default-to-protect-user-privacy/"},{"title":"Firefox 87 introduces SmartBlock for Private Browsing - Mozilla Security Blog","url":"https://blog.mozilla.org/security/2021/03/23/introducing-smartblock/"}]},{"category":"Headline","title":"Release v8.0.0 · ajv-validator/ajv","url":"https://github.com/ajv-validator/ajv/releases/v8.0.0","tags":["JSON","library","JavaScript","ReleaseNote"],"content":"JSON SchemaバリデーターのAjv 8.0.0リリース。\nJSON Schema draft-2020-12のサポート、JSON Type Definition(JTD)の仕様と揃えるために`instancePath`を`dataPath`にリネームなど。","relatedLinks":[{"title":"JSON Type Definition","url":"https://jsontypedef.com/"}]},{"category":"Headline","title":"JSON Type Definition","url":"https://jsontypedef.com/","tags":["JSON","TypeScript","program","spec"],"content":"コードジェネレーター向けにJSONで型定義を表現する仕様。IETF/RFC 8927として策定中。\nJTDはコード生成を意識して作られているのでコンパクトな仕様、エラーに関しても仕様で定義されているため実装に依存しにくいポータブルなものを目指している。JSONまたはYAMLで記述できる。","relatedLinks":[]},{"category":"Headline","title":"billboard.js 3.0 release: D3.js v6 support &amp; new candlestick type! | by Jae Sung Park | Mar, 2021 | Medium","url":"https://netil.medium.com/billboard-js-3-0-release-d3-js-v6-support-new-candlestick-type-9bd74af6a753","tags":["JavaScript","SVG","graphic","library","ReleaseNote"],"content":"billboard.js 3.0リリース。\nD3.js v6へアップデート、Candlestick Chartの追加、`.export()` API がサイズ指定をサポートなど","relatedLinks":[{"title":"Release 3.0.0 · naver/billboard.js","url":"https://github.com/naver/billboard.js/releases/tag/3.0.0"}]},{"category":"Headline","title":"Blog - Next.js 10.1 | Next.js","url":"https://nextjs.org/blog/next-10-1","tags":["Next.js","library","ReleaseNote"],"content":"Next.js 10.1リリース。\nwebpack 5をopt-inで対応、パッケージサイズの改善、`next/image`がApple M1の対応や`layout`オプションの追加サポートなど。\nその他には、500ページのカスタマイズ、`router.push`や`router.replace`時にページトップへスクロールするように変更など","relatedLinks":[]},{"category":"Article","title":"TypeScriptの型定義からバリデーションコードを生成するツールを書いた | Web Scratch","url":"https://efcl.info/2021/03/26/create-validator-ts/","tags":["TypeScript","security","express","article","Tools"],"content":"TypeScriptの型定義からAjvとJSON Schemaを使ったバリデーションコードを生成するツールについて。\nまた、リクエストをバリデーションせずにMongoなどのNoSQLのクエリにわたすと発生するNoSQL Injectionについて","relatedLinks":[{"title":"azu/create-validator-ts: Create JSON Schema validator from TypeScript.","url":"https://github.com/azu/create-validator-ts"}]},{"category":"Article","title":"React State Management Libraries and How to Choose","url":"https://daveceddia.com/react-state-management/","tags":["React","JavaScript","library","article"],"content":"Reactのステート管理方法/ライブラリの比較。\n`useState`/`useReducer`、Redux、MobX、Recoil、react-query、XStateについて利点と欠点について書かれている","relatedLinks":[{"title":"JS 状態管理ライブラリ探索記 – Introduction - to-R Media","url":"https://www.to-r.net/media/js-state-libraries-introduction/"}]},{"category":"Article","title":"Handling User Permissions in JavaScript | CSS-Tricks","url":"https://css-tricks.com/handling-user-permissions-in-javascript/","tags":["JavaScript","article"],"content":"JavaScriptでパーミッションのビジネスロジックを実装する方法についての記事。\nSingle source of truthであること、変更が簡単であること、テスト可能で有ることを意識した設計と実装方法について","relatedLinks":[]},{"category":"Article","title":"Making the slowest &#039;fast&#039; page | Tune The Web","url":"https://www.tunetheweb.com/blog/making-the-slowest-fast-page/","tags":["performance","article","opinion"],"content":"Lighthouse/WebVitalで満点な遅いページを作る方法について。\n意図して表示を遅らせることでスコアをあげるという実験。現実的には遅い\"fast\"なサイトは、スコアを上げる以外の意味はないため概念実証としての話。","relatedLinks":[]},{"category":"Article","title":"Google Developers Japan: Spectre の影響を受けないウェブを作るための概念実証について","url":"https://developers-jp.googleblog.com/2021/03/a-spectre-proof-of-concept-for-spectre.html","tags":["browser","security","CPU","Chrome","article"],"content":"A Spectre proof-of-concept for a Spectre-proof webの翻訳記事。\nSpectreの脆弱性、ブラウザ上でのSpectreのデモ、ブラウザでのSpectre対策としてのプロセス分離について","relatedLinks":[{"title":"Google Online Security Blog: A Spectre proof-of-concept for a Spectre-proof web","url":"https://security.googleblog.com/2021/03/a-spectre-proof-of-concept-for-spectre.html"},{"title":"leaky.page","url":"https://leaky.page/"}]},{"category":"WebsiteDocument","title":"Deno Deploy","url":"https://deno.com/deploy","tags":["deno","webservice","ServiceWorker"],"content":"Denoを扱うFaaS。\nCloudflare Workersと同じくService Worker APIをベースにしていて、DenoのスクリプトをCDN Edgeで動かせるサービス。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"seek-oss/vanilla-extract: Zero-runtime Stylesheets-in-TypeScript","url":"https://github.com/seek-oss/vanilla-extract","tags":["CSS","JavaScript","Tools"],"content":"CSSをTypeScriptで書いて、スコープ付きのCSS Variablesを含んだCSSファイルに展開するツール。\nBabelとwebpackを使いビルド時にCSSファイルを生成し、HTML側にはクラス名のみが入る。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"toplenboren/simple-git-hooks: A simple git hooks manager for small projects","url":"https://github.com/toplenboren/simple-git-hooks","tags":["npm","git ","library"],"content":"Git hooksを管理するnpmモジュール。\n`simple-git-hooks`コマンドを実行するとpackage.jsonや`.simple-git-hooks.js`に定義したGit Hookスクリプトを`.git/hooks/*`にインストールする。","relatedLinks":[]},{"category":"Book","title":"Developing Web Components with TypeScript - Native Web Development Using Thin Libraries | Jörg Krause | Apress","url":"https://www.apress.com/gp/book/9781484268391","tags":["TypeScript","WebComponents","book"],"content":"TypeScriptを使ったWeb Components開発についての書籍","relatedLinks":[]},{"category":"Book","title":"Manning | Testing JavaScript Applications","url":"https://www.manning.com/books/testing-javascript-applications","tags":["JavaScript","book","testing"],"content":"2021年4月13日発売。\nJavaScriptのテストについての書籍。\nフロントエンド、バックエンド、React、E2Eテスト、CI/CDについて","relatedLinks":[]}]},{"meta":{"title":"2021-04-06のJS: TypeScript 4.3 Beta、hls.js v1.0.0(Apple Low-Latency HLS)、Storybook 6.2","author":"azu","layout":"post","date":"2021-04-05T22:08:25.064Z","category":"JSer","tags":["Tools","node.js","TypeScript","Vue","license"],"url":"https://jser.info/2021/04/06/typescript-4.3-beta-hls.js-v1.0.0apple-low-latency-hls-storybook-6.2/"},"items":[{"category":"Headline","title":"Node v12.22.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v12.22.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 12.22.0リリース。\n`--http-parser=legacy`を非推奨化、ES ModulesをStable化、`NAPI_VERSION`を`8`に変更。\n`v8.takeCoverage()`、`v8.stopCoverage()`、`worker.performance.eventLoopUtilization()`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0 · typicode/husky","url":"https://github.com/typicode/husky/releases/tag/v6.0.0","tags":["JavaScript","Tools","license","ReleaseNote"],"content":"husky 6.0.0リリース。\n5.0.0はParity Publicライセンスとしてリリースされ、30日経過したので6.0.0ではMITライセンスとなった。","relatedLinks":[]},{"category":"Headline","title":"Node v15.13.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v15.13.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 15.13.0リリース。\nウェブとの互換性を目的として`buffer`モジュールに`btoa`と`atob`メソッドを実装など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.3 Beta | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-3-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.3 Betaリリース。\nsetterにgetterとは異なる型を指定できるように、`override`キーワードの追加、Template String Typeの改善。\nPrivate Class Elements(fields/methods/accessors)のサポート、Promiseオブジェクトを条件式に渡してしまうミスのチェックを追加。\nその他には、`static` Index Signatureのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v5.30.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.30.0","tags":["webpack","JavaScript","ReleaseNote"],"content":"webpack 5.30.0リリース。\n`cache.type: \"memory\"`でwatch中に`[contenthash]`などを使うと、ファイル変更ごとにゴミがメモリに貯まる問題の改善。\n`cache.maxGenerations`と`cache.maxAge`で不要となったキャッシュを削除できるように","relatedLinks":[{"title":"SourceMapDevTool plugin leaks memory in watch mode · Issue #12947 · webpack/webpack","url":"https://github.com/webpack/webpack/issues/12947"},{"title":"memory usage improvements, add GC support for memory cache, persistent cache only mode by sokra · Pull Request #12990 · webpack/webpack","url":"https://github.com/webpack/webpack/pull/12990"}]},{"category":"Headline","title":"Release v1.0.0 · video-dev/hls.js","url":"https://github.com/video-dev/hls.js/releases/tag/v1.0.0","tags":["JavaScript","HLS","library","ReleaseNote"],"content":"HLS.js 1.0.0リリース。\nApple Low-Latency HLSのサポート、fmp4 streamのサポート改善、コードベースをTypeScriptに書きなおしなど。\n破壊的な変更として`backBufferLength`のデフォルト値の変更、イベントのシグネチャの変更など","relatedLinks":[{"title":"hls.js/MIGRATING.md at master · video-dev/hls.js","url":"https://github.com/video-dev/hls.js/blob/master/MIGRATING.md#migrating-from-hlsjs-0x-to-1x"}]},{"category":"Headline","title":"Proposal for dropping ie11 support in Vue 3 · Discussion #296 · vuejs/rfcs","url":"https://github.com/vuejs/rfcs/discussions/296","tags":["Vue","IE","proposal"],"content":"Vue 3ではIE 11のサポートをしないというRFC。\n代わりにVue 2.xへ3.xの機能をバックポートすることに注力するというProposal。","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · js-reporters/js-reporters","url":"https://github.com/js-reporters/js-reporters/releases/tag/v2.0.0","tags":["JavaScript","test","library","ReleaseNote","spec"],"content":"JavaScriptのテストフレームワークのレポートの共通インターフェイスを定義する目的のjs-reporters 2.0.0リリース。\n`SummaryReporter`の実装、Proposalの更新など","relatedLinks":[]},{"category":"Headline","title":"Storybook 6.2","url":"https://storybook.js.org/blog/storybook-6-2/","tags":["JavaScript","debug","Tools","ReleaseNote"],"content":"Storybook 6.2リリース。\nVue 3とSvelteサポート、Yarn 2のPnp/npm 7/ESMのサポート、webpack 5をopt-inでサポート。\nControls addonにJSON editorやcolor pickerの追加など","relatedLinks":[]},{"category":"Article","title":"React Hooksのみでドラッグ＆ドロップの並び替えを実装する","url":"https://zenn.dev/uttk/articles/b90454baec68c8","tags":["React","article","tutorial"],"content":"Reactで要素の並び替えをD&Dする実装についての記事。\nマウスイベントとCSSを使ったD&D、要素の重なりの判定、要素の入れ替えのアニメーションなどを実装しながら見ていく記事","relatedLinks":[]},{"category":"Article","title":"特定の端末のみで起こる WebView プチフリーズを Tracing を利用して追った話 - SmartNews Engineering Blog","url":"https://developer.smartnews.com/blog/2021/03/chrome_tracing/","tags":["Chrome","webview","performance","article"],"content":"WebViewのパフォーマンスデバッグについての記事。\nChromeのRemote Inspectを使ってデバイスに接続し、プロファイルやTracingを使ったボトルネックの調査方法について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Organize Kubernetes manifests in JavaScript | Kosko","url":"https://kosko.dev/","tags":["kubernetes","JavaScript","Tools"],"content":"kubernetesのmanifestをJavaScript/TypeScriptで書けるツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mistlog/typetype: A programming language designed for typescript type generation","url":"https://github.com/mistlog/typetype","tags":["TypeScript","library"],"content":"TypeScriptの型書くDSLのパーサとジェネレーター。\nConditional Typeを表現する`if`、Mapped Typesを表現する`for`などを使って型定義を書ける。\nパーサはreact-pegを使い、パースしたASTからBabelを通してTSのコードを出力している","relatedLinks":[{"title":"mistlog/react-peg: A react style parser generator based on PEG.js","url":"https://github.com/mistlog/react-peg"}]},{"category":"SoftwareLibrary","title":"egoist/esbuild-register: Transpile JSX, TypeScript and esnext features on the fly with esbuild","url":"https://github.com/egoist/esbuild-register","tags":["JavaScript","Tools","node.js"],"content":"esbuildを使ったruntimeでの変換ツール。\n@babel/registerやts-node/registerのように`--require`に指定して変換処理をする","relatedLinks":[]},{"category":"SoftwareLibrary","title":"FicusJS - a set of lightweight functions for developing applications using web components","url":"https://docs.ficusjs.org/","tags":["WebComponents","library"],"content":"Web Componentsでアプリケーションを開発する目的のライブラリセット。\nコンポーネントの作成、`uhtml`/`lit-html`/`htm`などを使ったレンダリング、Storeでのステート管理などの機能を提供する","relatedLinks":[{"title":"Developing Without a Build (1): Introduction - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/open-wc/developing-without-a-build-1-introduction-26ao"}]},{"category":"Book","title":"Accessible Vue – The Why and How of building inclusive apps in Vue.js","url":"https://accessible-vue.com/","tags":["Vue","accessibility","book"],"content":"ウェブアクセシビリティとVueでの実装についての書籍","relatedLinks":[{"title":"Accessible Vue by Marcus Herrmann ","url":"https://leanpub.com/accessible-vue"}]}]},{"meta":{"title":"2021-04-13のJS: Node.jsのセキュリティアップデート、Cloudflare Pages、migrating Chrome  DevTools to TypeScript","author":"azu","layout":"post","date":"2021-04-13T13:32:18.497Z","category":"JSer","tags":["React","performance","Chrome","book","node.js"],"url":"https://jser.info/2021/04/13/node.js-cloudflare-pages-migrating-chrome-devtools-to-typescript/"},"items":[{"category":"Headline","title":"Release v2.20.0 · date-fns/date-fns","url":"https://github.com/date-fns/date-fns/releases/tag/v2.20.0","tags":["JavaScript","library","ReleaseNote"],"content":"date-fns 2.20.0リリース。\n`eachMinuteOfInterval`, `nextWednesday`, `nextThursday`, `nextFriday`, `nextSaturday`, `nextSunday` の追加など","relatedLinks":[]},{"category":"Headline","title":"April 2021 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/april-2021-security-releases/","tags":["node.js","security","ReleaseNote"],"content":"Node.jsのセキュリティアップデート。\nOpenSSL関係が2件、`y18n`のprototype pollutionに関するアップデート。\nNode.js v10.24.1, v12.22.1, v14.16.1, v15.14.0がそれぞれリリースされている","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.1 · verdaccio/verdaccio","url":"https://github.com/verdaccio/verdaccio/releases/tag/v5.0.1","tags":["npm","library","ReleaseNote"],"content":"npm registryの実装であるverdaccio 5.0リリース。\nnpm token createのサポートがデフォルト化、native moduleへの依存の問題からtokenの保存にleveldbではなくlowdbを利用するように。","relatedLinks":[{"title":"typicode/lowdb: ⚡️ lowdb is a small local JSON database powered by Lodash (supports Node, Electron and the browser)","url":"https://github.com/typicode/lowdb"}]},{"category":"Headline","title":"Cloudflare Pages is now Generally Available","url":"https://blog.cloudflare.com/cloudflare-pages-ga/","tags":["news","webservice"],"content":"Cloudflare PagesがGAとなり一般公開された。\nNetlifyライクな`_redirects`ファイルのサポート。\n今後はGitLab/Bitbucket連携、webhooks、A/B testing、Cloudflare Workersとの連携強化をしていく予定","relatedLinks":[]},{"category":"Headline","title":"ES2021 edition of “JavaScript for impatient programmers”","url":"https://gist.github.com/rauschma/e9c00fddc17e73fab6ce6c22b2e78e17","tags":["ECMAScript","JavaScript","news","book"],"content":"JavaScript for impatient programmersのES2021版がリリース。\nES2021版の変更点について書かれている","relatedLinks":[{"title":"JavaScript for impatient programmers (ES2021 edition)","url":"https://exploringjs.com/impatient-js/"}]},{"category":"Headline","title":"Release Version 7.0.0 · react-hook-form/react-hook-form","url":"https://github.com/react-hook-form/react-hook-form/releases/tag/v7.0.0","tags":["React","JavaScript","library","ReleaseNote"],"content":"React Hook Form 7.0.0リリース。\n`register`の使い方の変更、`valueAs*`が`validate`の前に処理されるように、APIの返り値や引数の変更などが含まれている。\nマイグレーション用のツールも合わせて公開されている。","relatedLinks":[{"title":"Migrate From V6 to V7 | React Hook Form - Simple React forms validation","url":"https://react-hook-form.com/migrate-v6-to-v7/"}]},{"category":"Article","title":"Evolving the CLS metric","url":"https://web.dev/evolving-cls/","tags":["performance","Chrome","article"],"content":"CLSのスコア計算のロジックの変更について。\n1秒のギャップ/最大5秒のセッションウィンドウでLayout Shiftを検出して、その合計をCLSのスコアとする予定について","relatedLinks":[{"title":"Feedback wanted: The road to a better layout shift metric for long-lived pages","url":"https://web.dev/better-layout-shift-metric/"}]},{"category":"Article","title":"DevTools architecture refresh: migrating DevTools to TypeScript - Chrome Developers","url":"https://developer.chrome.com/blog/migrating-to-typescript/","tags":["Chrome","article","TypeScript"],"content":"Chrome DevToolsのコードベースを\nClosure Compilerベースの型チェックからTypeScriptに移行する話。\nなぜ移行するのか、TypeScriptの型推論の評価、移行のオプションですべてのTSエラーを修正する方法を選んだ理由、マイグレーションの分析などについて","relatedLinks":[]},{"category":"Article","title":"The definitive guide to profiling React applications","url":"https://blog.asayer.io/the-definitive-guide-to-profiling-react-applications","tags":["React","performance","article"],"content":"React DevToolsを使ったプロファイルとパフォーマンス改善について。\nDevToolsのFlamegraphなどの各種グラフの読み方、renderやcommitの意味、`Profiler`コンポーネントについて。\n入力に対してデータの取得と更新を行うコードを例にしたプロファイラを使った改善の例など","relatedLinks":[]},{"category":"SlideVideo","title":"Cookpad Online Spring Internship 2021 - YouTube","url":"https://www.youtube.com/playlist?list=PLGT7Exkshx4ifQpZkjim4yJN52D00Ej3c","tags":["JavaScript","React","tutorial","video"],"content":"JavaScript/TypeScript/React/Next.jsの概要を紹介する動画","relatedLinks":[]},{"category":"Book","title":"はじめに | 好奇心旺盛な人のためのWebRTC","url":"https://webrtcforthecurious.com/ja/","tags":["WebRTC","translate","book"],"content":"WebRTC For The Curiousの日本語訳","relatedLinks":[]}]},{"meta":{"title":"2021-04-20のJS:  Headless UI 1.0、esbuild/Snowpack/Vite/wmrの比較、debugging Web Vitals","author":"azu","layout":"post","date":"2021-04-20T02:45:24.600Z","category":"JSer","tags":["Tools","performance","Chrome","browser","TypeScript"],"url":"https://jser.info/2021/04/20/headless-ui-1.0-esbuildsnowpackvitewmr-debugging-web-vitals/"},"items":[{"category":"Headline","title":"Deno 1.9 Release Notes | Deno Blog","url":"https://deno.com/blog/v1.9","tags":["deno","ReleaseNote"],"content":"Deno 1.9リリース。\nHTTP/2なウェブサーバの実装、opcallの改善、Blob URLのサポート。\n`--allow-env`と`--allow-run`で個別の指定ができるように、`--prompt`でインタラクティブにパーミッションの許可ができるように。\n`Deno.listenTls`でALPNのサポート、tsconfig.jsonの`useDefineForClassFields`をデフォルト化など","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 90 - Chrome Developers","url":"https://developer.chrome.com/blog/new-in-chrome-90/","tags":["Chrome","ReleaseNote"],"content":"Chrome 90リリース。\n`overflow: clip`のサポート、AV1 Encoderサポート、Declarative Shadow DOMのサポートなど。\nFeature PolicyがPermissions Policyにリネーム、アドレスバーのデフォルトプロトコルが`https`に変更など","relatedLinks":[]},{"category":"Headline","title":"Headless UI v1.0 – Tailwind CSS","url":"https://blog.tailwindcss.com/headless-ui-v1","tags":["React","Vue","library","accessibility","lib"],"content":"Headless UI 1.0リリース。\nReactとVueのスタイルなしのUIコンポーネントの実装で、Tailwind CSSと組み合わせる目的で作られている。","relatedLinks":[{"title":"tailwindlabs/headlessui: Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.","url":"https://github.com/tailwindlabs/headlessui"}]},{"category":"Headline","title":"Release v6.0.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v6.0.0","tags":["npm","Tools","ReleaseNote"],"content":"pnpm 6.0.0リリース。\nNode.js 10のサポート終了、`pre`/`post` scriptを自動で実行しないように、lockfileのフォーマットを変更、`pnpx`が自動的にパッケージをインストールはしないようになるなど。\n`pnpm link`が`--global`をつけたときにglobal modulesとリンクするように、`pnpm fetch`コマンドの追加など","relatedLinks":[]},{"category":"Headline","title":"helmet/CHANGELOG.md at main · helmetjs/helmet","url":"https://github.com/helmetjs/helmet/blob/main/CHANGELOG.md#450---2021-04-17","tags":["node.js","express","library","ReleaseNote"],"content":"Expressのセキュリティヘッダを扱うhelmet 4.5.0リリース。\nCross-Origin isolationを扱うCOEP、COOP、CORPヘッダに対応など","relatedLinks":[{"title":"Making your website ","url":"https://web.dev/coop-coep/"}]},{"category":"Headline","title":"React-pdf - Announcing react-pdf v2.0","url":"https://react-pdf.org/blog/announcing-react-pdf-v2","tags":["React","PDF","library","ReleaseNote"],"content":"ReactでPDFを作成するreact-pdf v2.0リリース。\nレイアウトとレンダリングの分離、SVGサポート、Hooks APIの追加など","relatedLinks":[]},{"category":"Headline","title":"Never too late for Firefox 88 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2021/04/never-too-late-for-firefox-88/","tags":["Firefox","ReleaseNote"],"content":"Firefox 88リリース。\n`:user-valid`と`:user-invalid`の実装、`RegExp#indices`の実装、`AbortSignal.abort()`の実装、FTPサポートの無効化など","relatedLinks":[{"title":"Firefox 88 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/88"},{"title":"Firefox 88.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/88.0/releasenotes/"}]},{"category":"Article","title":"Comparing the New Generation of Build Tools | CSS-Tricks","url":"https://css-tricks.com/comparing-the-new-generation-of-build-tools/","tags":["JavaScript","Tools","article"],"content":"esbuild, Snowpack, Vite, wmrを比較した記事。\nそれぞれのツールの特徴や使い方、サポートしているファイル、production buildなどについて比較している。","relatedLinks":[]},{"category":"Article","title":"Introducing CSS Grid Inspector | WebKit","url":"https://webkit.org/blog/11588/introducing-css-grid-inspector/","tags":["safari","debug","article"],"content":"Safari Technology Preview 123で導入されたCSS Grid Inspectorの紹介","relatedLinks":[]},{"category":"Article","title":"Real-world CSS vs. CSS-in-JS performance comparison - Tomas Pustelnik&#039;s personal website","url":"https://pustelto.com/blog/css-vs-css-in-js-perf/","tags":["CSS","JavaScript","performance","article"],"content":"Styled Componentsを使ったCSS-in-JSと\nlinaria を使ってCSSファイルに分離した場合のパフォーマンスを比較した記事。\nサイズ、Lighthouseなどを使ったRuntimeのパフォーマンス計測","relatedLinks":[]},{"category":"Article","title":"HTML Inputs and Labels: A Love Story | CSS-Tricks","url":"https://css-tricks.com/html-inputs-and-labels-a-love-story/","tags":["HTML","accessibility","article"],"content":"LabelとInputについての記事。\nアクセシビリティを考慮したラベルの扱い方について","relatedLinks":[]},{"category":"Article","title":"Debug Web Vitals in the field","url":"https://web.dev/debug-web-vitals-in-the-field/","tags":["browser","Chrome","performance","article"],"content":"Web VitalsのメトリクスをJavaScriptで取得して、実際にどの要素がスコアに影響してるのかをデバッグする方法について","relatedLinks":[{"title":"GoogleChromeLabs/web-vitals-report: Measure and report on your Web Vitals data in Google Analytics","url":"https://github.com/GoogleChromeLabs/web-vitals-report"}]},{"category":"Article","title":"An In-Depth Guide To Measuring Core Web Vitals — Smashing Magazine","url":"https://www.smashingmagazine.com/2021/04/complete-guide-measure-core-web-vitals/","tags":["browser","Chrome","performance","article"],"content":"Web Vitalsについての記事。\nWeb VitalsのLCP/FID/CLSの解説、Lighthouse/Google Search Consoleのレポート読み方、CrUXのデータの読み方や分析方法などについて。","relatedLinks":[]},{"category":"Article","title":"Slow and Steady: Converting Sentry’s Entire Frontend to TypeScript | Product Blog • Sentry","url":"https://blog.sentry.io/2021/04/12/slow-and-steady-converting-sentrys-entire-frontend-to-typescript","tags":["article","TypeScript","refacoring"],"content":"SentryのコードをベースをTypeScriptへマイグレーションした話。\n戦略として教育、新しいコードをTSで書く、既存のコードをTSに変換をしていった。\n徐々に変換していくこと、少しずつ複雑な型にしていくこと、TypeScriptを最新に保つことなどを教訓としてあげている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Waterfaller - find and fix all the slowdowns on your web page to boost speed and core web vital scores","url":"https://waterfaller.dev/","tags":["webservice","performance","Tools"],"content":"Web Vitalsの指標とリソースのロードをウォーターフォールチャートで表示し、なぜSlowdownしてるのかの解説と修正方法を提示してくれるツール。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Cumulative Layout Shift Debugger (CLS) - webvitals.dev","url":"https://webvitals.dev/cls","tags":["Tools","browser","performance","webservice"],"content":"Cumulative Layout Shift(CLS)のデバッグツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ivanhofer/typesafe-i18n","url":"https://github.com/ivanhofer/typesafe-i18n","tags":["JavaScript","TypeScript","i18n","library"],"content":"依存のないi18nライブラリ。\nTypeScriptを使った翻訳漏れのチェック、pluralなどのtransformerサポート、rollupやCLIを使った最適化などをサポートしている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lukejacksonn/servor: Dependency free file server for single page app development","url":"https://github.com/lukejacksonn/servor","tags":["node.js","server","console","Tools"],"content":"依存のないローカルサーバライブラリ。\nファイル変更でリロード、起動時にブラウザやエディタで開く、httpsの対応のオレオレ証明生成などに対応している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"callstack/linaria: Zero-runtime CSS in JS library","url":"https://github.com/callstack/linaria","tags":["CSS","JavaScript"],"content":"CSS-in-JSでスタイルを書いて、そのスタイルをCSSファイルに分離するライブラリとツールキット。","relatedLinks":[]}]},{"meta":{"title":"2021-04-27のJS: Node.js 16.0.0、Chrome 91 beta、Prisma(Ready for production)","author":"azu","layout":"post","date":"2021-04-27T02:24:29.529Z","category":"JSer","tags":["node.js","Tools","Chrome","TypeScript","CSS"],"url":"https://jser.info/2021/04/27/node.js-16.0.0-chrome-91-beta-prismaready-for-production/"},"items":[{"category":"Headline","title":"Node v16.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v16.0.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 16.0.0リリース。\nV8 9.0へアップデート、`timers/promises`の追加、Apple Silicon向けのprebuiltバイナリの配布など。\n`fs.rmdir`の`recursive`オプションの非推奨化、`process.binding`を使ったアクセスの非推奨化、`module.createRequireFromPath`の削除など。\nこれに加えてNode 15での変更であるnpm 7へのアップデートなどが含まれている","relatedLinks":[{"title":"Node.js 16 available now. We are excited to announce the release… | by Node.js | Apr, 2021 | Medium","url":"https://nodejs.medium.com/node-js-16-available-now-7f5099a97e70"}]},{"category":"Headline","title":"Release v11.5.0 · raineorshine/npm-check-updates","url":"https://github.com/raineorshine/npm-check-updates/releases/tag/v11.5.0","tags":["npm","Tools","ReleaseNote"],"content":"npm-check-updates 11.5.0リリース。\nyarnの自動検出に対応","relatedLinks":[]},{"category":"Headline","title":"Release v9.0.0 · puppeteer/puppeteer","url":"https://github.com/puppeteer/puppeteer/releases/tag/v9.0.0","tags":["Chrome","browser","library","ReleaseNote"],"content":"Puppeteer 9.0.0リリース。\nChromium 91へアップデート、Apple M1のサポート、`FileChooser.cancel()`が同期処理になるなど","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 91: Handwriting Recognition, WebXR Plane Detection and More","url":"https://blog.chromium.org/2021/04/chrome-91-handwriting-recognition-webxr.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 91ベータリリース。\nOrigin Trialとして、Service Workerのmanifestの`capture_links`、WebTransport、WebXR Plane Detection API。\nTimerの解像度を仕様準拠の値に変更、WebSockets over HTTP/2のサポート、Service WorkerでES Modulesのサポートなど","relatedLinks":[{"title":"sw-launch/declarative","url":"https://github.com/WICG/sw-launch/blob/main/declarative_link_capturing.md"}]},{"category":"Headline","title":"Release v4.1.0 · reduxjs/redux","url":"https://github.com/reduxjs/redux/releases/tag/v4.1.0","tags":["redux","JavaScript","library","ReleaseNote"],"content":"Redux 4.1.0リリース。\nエラーメッセージをproduction buildから除外することでファイルサイズの改善など","relatedLinks":[]},{"category":"Article","title":"Understanding TypeScript&#039;s Popularity | Notes","url":"https://orta.io/notes/js/why-typescript","tags":["TypeScript","article","history","opinion"],"content":"TypeScriptがなぜ人気となったのかを主要なイベントのタイムラインや類似するツールと比較しながら見ている記事。","relatedLinks":[]},{"category":"Article","title":"Prisma – The Complete ORM for Node.js &amp; TypeScript","url":"https://www.prisma.io/blog/prisma-the-complete-orm-inw24qjeawmb","tags":["node.js","TypeScript","MySQL","PostgreSQL","article"],"content":"Node.jsとTypeScript向けのORMマッパーであるPrismaがProduction Readyとなった。\nスキーマからTypeScriptの型定義を出力して利用できるPrisma Client、データモデルからPrisma Migrate、GUIでデータの閲覧と変更ができるPrisma Studioを持つ","relatedLinks":[{"title":"Node.js ","url":"https://zenn.dev/kanasugi/articles/a082bd39c5bdf2"}]},{"category":"Article","title":"Using asynchronous web APIs from WebAssembly","url":"https://web.dev/asyncify/","tags":["WebAssembly","JavaScript","article"],"content":"Emscriptenで非同期を扱うAsyncify、C++とJS間の値を変換するEmbind、JavaScriptを組み合わせてWasmから非同期のWebPlatformAPIを扱う方法について。","relatedLinks":[{"title":"GoogleChromeLabs/asyncify: Standalone Asyncify helper for Binaryen","url":"https://github.com/GoogleChromeLabs/asyncify"}]},{"category":"Article","title":"The great SameSite confusion :: jub0bs.com","url":"https://jub0bs.com/posts/2021-01-29-great-samesite-confusion/","tags":["security","article"],"content":"cross-site/same-siteとcross-origin/same-originの違いについての解説記事。\nSame-Site Cookieの動作とメカニズムについて","relatedLinks":[{"title":"same-site/cross-site, same-origin/cross-originをちゃんと理解する","url":"https://zenn.dev/agektmr/articles/f8dcd345a88c97"}]},{"category":"Article","title":"Overflow Issues In CSS — Smashing Magazine","url":"https://www.smashingmagazine.com/2021/04/css-overflow-issues/","tags":["CSS","article"],"content":"ページの幅を突き抜ける要素の問題と対策についての記事。\n要素やCSSプロパティごとに問題の原因や対応方法について紹介している。\nまたoverflowしている要素の見つけた方などのデバッグ方法について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Headless WYSIWYG Text Editor – tiptap editor","url":"https://www.tiptap.dev/","tags":["JavaScript","editor","library"],"content":"ProseMirrorベースのWYSIWYGエディタライブラリ。\nVue、React、Svelteなどに対応、Y.jsを使ったリアルタイムコラボレーションの対応、シンタックスハイライトやMarkdownの記法を使ったショートカットに対応している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mhmd-22/ezgesture: Small js library for enabling gesture events","url":"https://github.com/mhmd-22/ezgesture","tags":["JavaScript","library"],"content":"ドラッグ、スワイプ、ピンチイン/アウトを扱うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Vue.js UI/UX Library - Inkline","url":"https://inkline.io/","tags":["Vue","UI","library"],"content":"Vue向けのUIフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Style Check","url":"https://style-check.austingil.com/","tags":["CSS","Tools"],"content":"CSSを読み込んでHTML要素に対するスタイルの影響をチェックできるツール","relatedLinks":[]},{"category":"Book","title":"The GraphQL Guide","url":"https://graphql.guide/","tags":["GraphQL","book","video"],"content":"GraphQLについての書籍と動画。\nJohn ResigとLoren Sands-RamshawによるGraphQLのガイド。\nGraphQLの解説、フロントエンド、バックエンド、React、Vue、Android、iOSについて扱う","relatedLinks":[{"title":"Releasing The GraphQL Guide. John Resig’s book on GraphQL is here! | by Loren Sands-Ramshaw | Apr, 2021 | The GraphQL Guide","url":"https://blog.graphql.guide/releasing-the-graphql-guide-d9be04747148"}]}]},{"meta":{"title":"2021-05-04のJS: Babel 7.14.0、RxJS 7.0.0、Safari 14.1","author":"azu","layout":"post","date":"2021-05-04T12:44:24.309Z","category":"JSer","tags":["node.js","React","babel","Angular","E2E"],"url":"https://jser.info/2021/05/04/babel-7.14.0-rxjs-7.0.0-safari-14.1/"},"items":[{"category":"Headline","title":"Future of Angular E2E &amp; Plans for Protractor · Issue #5502 · angular/protractor","url":"https://github.com/angular/protractor/issues/5502","tags":["Angular","E2E","issue","news","testing"],"content":"AngularでのE2EテストフレームワークであるProtractorの開発終了のスケジュールについて。\n他のテストフレームワークが充実してきているので、2021年5月にDeprecatedとし、2022年末に開発終了とするスケジュールについて。","relatedLinks":[]},{"category":"Headline","title":"7.14.0 Released: New class features enabled by default, TypeScript 4.3, and better CommonJS interop · Babel","url":"https://babeljs.io/blog/2021/04/29/7.14.0","tags":["babel","ReleaseNote"],"content":"Babel 7.14.0リリース。\nStage 4となったclass fieldsをpreset-envがデフォルトでサポート、`importInterop: \"node\"`オプションの追加、TypeScript 4.3のサポート。\nまた、Stage 1のES Proposalである`async do` expressionのサポートなど","relatedLinks":[{"title":"Release v7.14.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v7.14.0"}]},{"category":"Headline","title":"rxjs/CHANGELOG.md at master · ReactiveX/rxjs","url":"https://github.com/ReactiveX/rxjs/blob/master/CHANGELOG.md#700-2021-04-29","tags":["JavaScript","Rx","library","ReleaseNote"],"content":"RxJS 7.0.0リリース。\nTypeScript 4.2未満のサポート終了、`rxjs-compat`の削除、`lift`をexposeしないように、各種演算子のAPI変更など","relatedLinks":[{"title":"RxJS - Breaking Changes in Version 7","url":"https://rxjs.dev/deprecations/breaking-changes"}]},{"category":"Headline","title":"New WebKit Features in Safari 14.1 | WebKit","url":"https://webkit.org/blog/11648/new-webkit-features-in-safari-14-1/","tags":["safari","ReleaseNote"],"content":"Safari 14.1の変更点について。\nFlexbox Gap、macOSでDate&Time input、Web Speech API、MediaRecorder API、WebMのサポートなど。\nJavaScriptのClass Fields、WekRefのサポート、i18n APIのサポート改善、WebAssemblyのThreadingのサポートなど。\nまた、Private Click Measurementをデフォルトで有効化、Storage AccessAPIの更新など。","relatedLinks":[]},{"category":"Headline","title":"Release yargs v17.0.0 · yargs/yargs","url":"https://github.com/yargs/yargs/releases/tag/v17.0.0","tags":["JavaScript","node.js","deno","library","ReleaseNote"],"content":"コマンドライン引数パーサーのyargs 17.0.0リリース。\n破壊的な変更として、Node.js 10のサポート終了、PrivateメソッドにPrivate Fieldsを使うように変更、`reset()`メソッドを非推奨化など。\nNode v14.8.0からTop-Level Awaitをサポートしたため、`yargs()`や`parseAsync`など色々な処理で非同期処理に対応するように変更など","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2021-04 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2021/05/04/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2021年4月のTC39 MeetingsでStageが変わったProposalのまとめ。\nClass Field/Private MethodsがStage 4となり、ES2022に入ることが決まった","relatedLinks":[]},{"category":"Article","title":"React17のevent delegationの破壊的変更を理解する","url":"https://zenn.dev/co9xs/articles/react17-event-delegation","tags":["React","article"],"content":"React 17のevent delegationの変更についての記事。\n実際に動作が変わるサンプルを元に、React 17でのevent delegationの仕組みの変化について解説している","relatedLinks":[{"title":"React v17.0 Release Candidate: 新機能「なし」 – React Blog","url":"https://ja.reactjs.org/blog/2020/08/10/react-v17-rc.html"}]},{"category":"Article","title":"How to Use ECMAScript Modules in Node.js","url":"https://dmitripavlutin.com/ecmascript-modules-nodejs/","tags":["node.js","article"],"content":"Node.jsでのECMAScript modulesの使い方についての記事。\nモジュールモード、モジュールのimportの方法、Dynamic Import、CommonJSなモジュールのimport、`import.meta`についてなど","relatedLinks":[]},{"category":"Article","title":"Build an HTTPS-intercepting JavaScript proxy in 30 seconds flat | HTTP Toolkit","url":"https://httptoolkit.tech/blog/javascript-mitm-proxy-mockttp/","tags":["node.js","library","article"],"content":"mockttpを使ったhttpsのサイトをProxyで書き換える方法についての紹介記事","relatedLinks":[{"title":"httptoolkit/mockttp: Powerful friendly HTTP mock server ","url":"https://github.com/httptoolkit/mockttp"}]},{"category":"Article","title":"Node.js 10がサポート終了したので、Node.js 12以降だとできるようになることをまとめる","url":"https://zenn.dev/azu/scraps/bb1106a04ed9e6","tags":["node.js","article"],"content":"Node.js 12から利用できるようになったNode.jsのAPIや機能、V8アップデートによるECMAScriptサポートについてまとめた記事。","relatedLinks":[]},{"category":"Article","title":"Hosting SQLite databases on Github Pages - (or any static file hoster) - phiresky&#039;s blog","url":"https://phiresky.github.io/blog/2021/hosting-sqlite-databases-on-github-pages/","tags":["SQLite","JavaScript","WebAssembly","article"],"content":"WebAssemblyにコンパイルしたSQLiteと参照用のSQLiteファイルを用意し、必要な部分だけを取得できる仕組みを作ったという話。\nDBファイルをすべてメモリへ載せないで使うために、HTTP Rangeリクエストを使って必要なchunkだけを取得するHTTPベースの仮想ファイルシステムを作っている。\nSQLiteのDBのページサイズやスキーマ情報から必要な部分だけをRangeリクエストで取得している。","relatedLinks":[]},{"category":"Article","title":"Introducing CloudFront Functions – Run Your Code at the Edge with Low Latency at Any Scale | AWS News Blog","url":"https://aws.amazon.com/jp/blogs/aws/introducing-cloudfront-functions-run-your-code-at-the-edge-with-low-latency-at-any-scale/","tags":["aws","JavaScript","webservice","cdn","article"],"content":"AWS CloudFrontでCDNエッジな処理をJavaScriptでかけるサービス。\nECMAScript 5.1互換なJavaScript、処理時間が1ms以内、メモリは2MB以内、パッケージサイズは10kb以下のファイルサイズ、Network/File IOなし","relatedLinks":[]},{"category":"SoftwareLibrary","title":"itsjavi/jsx-runtime: Extremely lightweight JSX runtime (&lt;2KB) to write JSX without React in TypeScript or JavaScript.","url":"https://github.com/itsjavi/jsx-runtime","tags":["jsx","babel","Tools","TypeScript"],"content":"JSXで書いて変換するとStandaloneで動作するコードを出力するJSX TransformerとRuntime","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Fower","url":"https://fower.vercel.app/","tags":["JavaScript","CSS","library","React","Vue","Svelte"],"content":"TailwindcssライクなUtility-firstのCSS in JSライブラリ。\nReactやVue、またスタイルをJavaScriptで生成するためReact Nativeにも対応する。\nUtilityベースのスタイルをPropsとして指定し、TSXや各フレームワーク用のコード補完に対応している。","relatedLinks":[{"title":"Fower v1.0. After half a year’s efforts, today… | by forsigner | Apr, 2021 | ITNEXT","url":"https://itnext.io/fower-v1-0-8df48723de0b"}]},{"category":"SoftwareLibrary","title":"Mantine","url":"https://mantine.dev/","tags":["React","library","UI"],"content":"ReactコンポーネントとHooksのフレームワーク。\nCSS-in-JSにはJSSを利用している。","relatedLinks":[{"title":"cssinjs/jss: JSS is an authoring tool for CSS which uses JavaScript as a host language.","url":"https://github.com/cssinjs/jss"}]},{"category":"Book","title":"Multithreaded JavaScript","url":"https://learning.oreilly.com/library/view/multithreaded-javascript/9781098104429/","tags":["JavaScript","webworker","ServiceWorker","book"],"content":"2021年11月発売\nJavaScriptでのマルチスレッドについての書籍。\nWeb Worker、Service Worker、SharedWorkerなどについて","relatedLinks":[]}]},{"meta":{"title":"2021-05-11のJS: Bootstrap 5、Underscore.js 1.13.0(`_.template`のセキュリティ修正)、Prettier 2.3","author":"azu","layout":"post","date":"2021-05-11T02:01:52.181Z","category":"JSer","tags":["CSS","Tools","node.js","book","WebComponents"],"url":"https://jser.info/2021/05/11/bootstrap-5-underscore.js-1.13.0_.template-prettier-2.3/"},"items":[{"category":"Headline","title":"Bootstrap 5 | Bootstrap Blog","url":"https://blog.getbootstrap.com/2021/05/05/bootstrap-5/","tags":["CSS","library","ReleaseNote","JavaScript"],"content":"Bootstrap 5リリース。\nIEのサポート終了、jQueryの削除。\noffcanvasコンポーネント、cardの代替えとなるaccordionコンポーネントの追加。\nFormとLayoutの変更、RTLのサポート、SassのUtility APIの追加など。","relatedLinks":[{"title":"Migrating to v5 · Bootstrap v5.0","url":"https://getbootstrap.com/docs/5.0/migration/"}]},{"category":"Headline","title":"Underscore.js","url":"https://underscorejs.org/#1.13.0","tags":["JavaScript","library","ReleaseNote"],"content":"underscore 1.13.0リリース。\nECMAScript Modulesのサポート。\n1.12.1では`_.template`の`variable`オプション経由でのCode Injectionができる脆弱性も修正されている。","relatedLinks":[]},{"category":"Headline","title":"Prettier 2.3. In which assignments are consistent, short keys non-breaking, and Handlebars official · Prettier","url":"https://prettier.io/blog/2021/05/09/2.3.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 2.3リリース。\nJavaScriptのフォーマットの大きめな変更、Handlebarsサポートをalphaからreleaseに変更、JSON5/JSONのフォーマットの修正など","relatedLinks":[]},{"category":"Article","title":"How we use Web Components at GitHub - The GitHub Blog","url":"https://github.blog/2021-05-04-how-we-use-web-components-at-github/","tags":["WebComponents","Github","JavaScript","article"],"content":"GitHubでのWeb Componentsについて。\nRails ViewComponentとCatalystを使ったWeb Componentsの組み込み、GitHub Elementsの公開についてなど","relatedLinks":[{"title":"github/github-elements: GitHub","url":"https://github.com/github/github-elements"}]},{"category":"Article","title":"リソースの読み込みを助けるウェブブラウザ API の世界","url":"https://nhiroki.jp/2021/05/06/resource-loading-apis","tags":["browser","WebPlatformAPI","article"],"content":"先読みや読み込みの優先度などウェブブラウザにおけるリソースロードのHintとなるAPIや仕組みについてのまとめ","relatedLinks":[]},{"category":"Article","title":"Hello, Modules!. JavaScript Modules, also known as ESM… | by Sindre Sorhus | May, 2021 | 🦄 Sindre Sorhus’ blog","url":"https://blog.sindresorhus.com/hello-modules-d1010b4e777b","tags":["ECMAScript","node.js","article"],"content":"Node.js 10のサポートが終了したことで、ESMへの移行をどのようにするかについての記事。\nESMのメリット、パッケージのメンテナ向けの移行ガイドについて","relatedLinks":[]},{"category":"Article","title":"A Guide To Newly Supported, Modern CSS Pseudo-Class Selectors — Smashing Magazine","url":"https://www.smashingmagazine.com/2021/04/guide-supported-modern-css-pseudo-class-selectors/","tags":["CSS","article"],"content":"最近のCSSで扱える擬似クラスの紹介記事。\n任意の`a`にマッチする`:any-link`、フォーカスしてる要素を扱う`:focus-visible`と`:focus-within`、セレクタを扱う`:is()`と`where()`と`:has()`、`:empty`など","relatedLinks":[]},{"category":"Article","title":"Chapter 8: CSS | CSS-Tricks","url":"https://css-tricks.com/chapter-8-css/","tags":["CSS","history","article"],"content":"CSSの歴史についての記事。\nLie、IE3のCSS実装、W3CのCSS WG、NetscapeのJSSS。\ndoctype宣言でのスイッチと後方互換性、fantasai、CSS3でのモジューラアプローチについてなど","relatedLinks":[]},{"category":"SlideVideo","title":"Svelte Summit Spring 2021 簡易まとめ","url":"https://zenn.dev/tomoam/articles/889618f2e6e62f","tags":["Svelte","video","Conference"],"content":"Svelte Summit Springの動画と概要のまとめ","relatedLinks":[{"title":"Svelte Summit is a FREE whole-day online event.","url":"https://sveltesummit.com/"}]},{"category":"SoftwareLibrary","title":"sinclairzx81/hammer: Build Tool for Browser and Node Applications","url":"https://github.com/sinclairzx81/hammer","tags":["JavaScript","HTML","Tools"],"content":"esbuildをベースにしたparcelのようにHTMLをエントリポイントにしたビルド/開発ツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jsxtools/cqfill: Polyfill for CSS Container Queries","url":"https://github.com/jsxtools/cqfill","tags":["CSS","JavaScript","polyfill","library"],"content":"CSS Container Queriesのpolyfill。\nPostCSSと組み合わせて利用できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"google/zx: A tool for writing better scripts","url":"https://github.com/google/zx","tags":["ShellScript","node.js","Tools"],"content":"シェルスクリプトのような処理をJavaScriptで書けるNode.js製のツール。\nTop-Level awaitを使ってシェルコマンドをそのまま使える`$`やHTTP通信するfetchなどが同梱されている。","relatedLinks":[]},{"category":"Book","title":"プロフェッショナルWebプログラミング　JavaScript | 柳井 政和 | 工学 | Kindleストア | Amazon","url":"https://www.amazon.co.jp/dp/B092QQJQF4/","tags":["JavaScript","book"],"content":"ウェブページを動作させることに絞ったJavaScriptの入門書","relatedLinks":[]},{"category":"Book","title":"React と Vue に関する XSS アンチパターン","url":"https://zenn.dev/yuuhu04/books/xss-anti-pattern-of-react-and-vue","tags":["React","Vue","XSS","document"],"content":"ReactとVueにおけるXSSのパターンについて書かれた文章。\nReactとVueのエスケープの仕組み、フレームワークが保護しないケースとXSSが発生するパターンについて書かれている","relatedLinks":[]}]},{"meta":{"title":"2021-05-18のJS: Node.js 14.17.0、TypeScript 4.3 RC(インクリメンタルビルドの改善)、Angular v12","author":"azu","layout":"post","date":"2021-05-18T02:32:50.556Z","category":"JSer","tags":["TypeScript","React","node.js","CSS","issue"],"url":"https://jser.info/2021/05/18/node.js-14.17.0-typescript-4.3-rc-angular-v12/"},"items":[{"category":"Headline","title":"What do you not like about DefinitelyTyped as a user and contributor? · Issue #44030 · microsoft/TypeScript","url":"https://github.com/microsoft/TypeScript/issues/44030","tags":["TypeScript","issue"],"content":"DefinitelyTypedへの意見を募集しているIssue","relatedLinks":[]},{"category":"Headline","title":"Node v14.17.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v14.17.0/","tags":["node.js","ReleaseNote"],"content":"Node v14.17.0リリース。\n試験的に`diagnostics_channel`を追加、`crypto.randomUUID()`の追加。\nまた、Node.js 15で実装されていたコアモジュールにおける`AbortController`と`AbortSignal`の対応をバックポートなど","relatedLinks":[]},{"category":"Headline","title":"Deno 1.10 Release Notes | Deno Blog","url":"https://deno.com/blog/v1.10","tags":["deno","ReleaseNote"],"content":"Deno 1.10リリース。\n`deno test`がisolateした状態でparallelにテストを実行、`permissions`の指定に対応、出力の変更、コメントのコードの型チェックに対応など。\n`Worker.postMessage`がstructured clone algorithmに対応、localStorageなどのWeb Storage APIに対応。\n`WebAssembly.Memory`が`shared`オプションに対応、`--import-map`へリモートURLを指定できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.3 RC | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-3-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.3 RCリリース。\nsetterにgetterとは異なる型を指定できるように、`override`キーワードの追加、Template String Typeの改善。\nPrivate Class Elements(fields/methods/accessors)のサポート、`static` Index Signatureのサポート。\n`ConstructorParameters`がAbstract classをサポート、Genericsにおける型の絞り込みの改善、Promiseオブジェクトを条件式に渡してしまうミスのチェックを追加。\nその他には、`.tsbuildinfo`のサイズ改善、watch時の初回ビルドの改善など。","relatedLinks":[]},{"category":"Headline","title":"Angular v12 is now available. It’s that time again, friends — we’re… | by Mark Techson | May, 2021 | Angular Blog","url":"https://blog.angular.io/angular-v12-is-now-available-32ed51fbfd49","tags":["Angular","ReleaseNote"],"content":"Angular 12リリース。\nView Engineは非推奨となりIvyがデフォルトへと移行、Legacy i18n Message IDsからの移行ツール、インラインSassのサポートなど。\nTypeScript 4.2へのアップデート、webpack 5の正式サポート、IE 11サポートの非推奨化など","relatedLinks":[{"title":"Release 12.0.0 · angular/angular","url":"https://github.com/angular/angular/releases/tag/12.0.0"},{"title":"Angular - Migrating legacy localization IDs","url":"https://angular.io/guide/migration-legacy-message-id"}]},{"category":"Headline","title":"V8 release v9.1 · V8","url":"https://v8.dev/blog/v8-release-91","tags":["V8","ReleaseNote"],"content":"V8 v9.1リリース。\nTop-level awaitのデフォルトサポート、`#foo in obj`のPrivate brand checksのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing Docusaurus 2 Beta | Docusaurus","url":"https://docusaurus.io/blog/2021/05/12/announcing-docusaurus-two-beta","tags":["React","document"],"content":"Docusaurus 2 Betaリリース","relatedLinks":[]},{"category":"Article","title":"Writing A Type Safe Store | Lachlan Miller","url":"https://lachlan-miller.me/articles/advanced-type-a-type-safe-store-for-vue-3","tags":["Vue","TypeScript","article"],"content":"Vueのステート管理ライブラリであるPiniaのType SafeなStoreの型定義の解説","relatedLinks":[{"title":"posva/pinia: 🍍 Intuitive, type safe, light and flexible Store for Vue using the composition api with DevTools support","url":"https://github.com/posva/pinia/"}]},{"category":"Article","title":"Next Gen CSS: @container | CSS-Tricks","url":"https://css-tricks.com/next-gen-css-container/","tags":["CSS","article"],"content":"`@container`についての記事。\n親要素には`contain`プロパティを指定する必要がある点、`@container`でのレスポンシブデザインについて","relatedLinks":[]},{"category":"Article","title":"Cross-browser tracking vulnerablity in Tor, Safari, Chrome and Firefox - FingerprintJS","url":"https://fingerprintjs.com/blog/external-protocol-flooding/","tags":["browser","security","privacy","article"],"content":"ブラウザからURLスキームでアプリを開くときの挙動を利用してフィンガープリントできるという話。\n未知のプロトコルを開く際にはダイアログでの確認やユーザインタラクションが必要となっている。\nしかし、それぞれのブラウザで既知のプロトコルや`about:blank`を使ったSOP(Same Origin Policy)での抜け道で、どのアプリがインストールされているかを判定できるという話","relatedLinks":[]},{"category":"Article","title":"DocBaseのフロントエンド改修をどのように進めたか – KRAY Inc.","url":"https://kray.jp/blog/how-to-docbase-renewal/","tags":["CoffeeScript","React","TypeScript","refacoring","article"],"content":"Backbone + Marionette + CoffeeScriptで書かれていたウェブサービスをReact + TypeScriptに一括で移行した話。\nE2Eを使ったテスト、構造を維持しながらReact化、コンポーネントへの分離などの移行の方法についてなど","relatedLinks":[]},{"category":"Article","title":"Babel is used by millions, so why are we running out of money? · Babel","url":"https://babeljs.io/blog/2021/05/10/funding-update.html","tags":["babel","article"],"content":"Babelの資金の状態、ロードマップ、寄付について。","relatedLinks":[{"title":"Babel Roadmap · Babel","url":"https://babeljs.io/docs/en/roadmap#babel-2021-roadmap"}]},{"category":"Article","title":"styled-componentsの採用と既存資産を捨てた理由 - Cybozu Inside Out | サイボウズエンジニアのブログ","url":"https://blog.cybozu.io/entry/2020/06/25/105457","tags":["CSS","React","article","sass"],"content":"Sassで書かれていたスタイルをCSS in JSに移行する話。\nstyled-componentsを使って書く場合にスタイリングとJSXを分離するためのルール、Sassの変数を抽出して移行するスクリプトについてなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"coderaiser/simport: Import like with require but using async","url":"https://github.com/coderaiser/simport","tags":["node.js","library"],"content":"ESMなNode.jsで`require`、`__filename`、`__dirname`などのshim機能を提供するライブラリ","relatedLinks":[]}]},{"meta":{"title":"2021-05-25のJS: IEの単体アプリとしてのサポート終了、WebContainers、User-Agent Client Hints","author":"azu","layout":"post","date":"2021-05-25T02:50:27.271Z","category":"JSer","tags":["node.js","Chrome","Tools","CSS","React"],"url":"https://jser.info/2021/05/25/ie-webcontainers-user-agent-client-hints/"},"items":[{"category":"Headline","title":"Recoil 0.3.0 | Recoil","url":"https://recoiljs.org/blog/2021/05/14/0.3.0-released/","tags":["React","JavaScript","library","ReleaseNote"],"content":"Recoil 0.3.0リリース。\nRecoilRootに`override`オプションの追加、selectorに`GetCallback`を追加。\n次の0.4で`snapshot.retain()`していないsnapshotを使うと例外が発生するようになる","relatedLinks":[]},{"category":"Headline","title":"The future of Internet Explorer on Windows 10 is in Microsoft Edge | Windows Experience Blog","url":"https://blogs.windows.com/windowsexperience/2021/05/19/the-future-of-internet-explorer-on-windows-10-is-in-microsoft-edge/","tags":["IE","news","MSEdge"],"content":"IE11のデスクトップアプリケーションとしてのサポートは2022年6月15日で終了し、MSEdgeのIEモードで引き続き2029年までサポートする予定。","relatedLinks":[{"title":"Internet Explorer は Microsoft Edge へ – Windows 10 の Internet Explorer 11 デスクトップアプリは 2022 年 6 月 15 日にサポート終了 - Windows Blog for Japan","url":"https://blogs.windows.com/japan/2021/05/19/the-future-of-internet-explorer-on-windows-10-is-in-microsoft-edge/"},{"title":"「Internet Explorer 11 デスクトップ アプリケーションのサポート終了」の発表に関連する FAQ - Windows Blog for Japan","url":"https://blogs.windows.com/japan/2021/05/19/internet-explorer-11-desktop-app-retirement-faq/"}]},{"category":"Headline","title":"Release v7.5.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v7.5.0","tags":["Chrome","performance","Tools","ReleaseNote"],"content":"Lighthouse 7.5.0リリース。\nSource Mapベースのファイルツリーを可視化するTreemap表示の追加、新しいCLSへの対応を追加など","relatedLinks":[]},{"category":"Headline","title":"Node v16.2.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v16.2.0/","tags":["node.js","ReleaseNote"],"content":"Node v16.2.0リリース。\n`import.meta.resolve`が`URL`オブジェクトをサポート、Workerが作成された際にtriggerされる`worker`イベントを`process`に追加など","relatedLinks":[]},{"category":"Headline","title":"Release v10.0.0 · TypeStrong/ts-node","url":"https://github.com/TypeStrong/ts-node/releases/tag/v10.0.0","tags":["node.js","TypeScript","ReleaseNote"],"content":"TypeScriptのコンパイルをRuntime時に行うts-node 10.0.0リリース。\n`--script-mode`の挙動をデフォルト化し、古い挙動を再現する`--cwd-mode`を追加。\nNode.js 10のサポート終了、`--show-config`の追加、`--transpiler`オプションでSWCを使ったtrasnpileに対応など。\nまたウェブサイトが更新されている。","relatedLinks":[{"title":"Third-party transpilers | ts-node","url":"https://typestrong.org/ts-node/docs/transpilers/"},{"title":"ts-node | ts-node","url":"https://typestrong.org/ts-node/"}]},{"category":"Article","title":"Chromium Blog: Update on User-Agent String Reduction in Chrome","url":"https://blog.chromium.org/2021/05/update-on-user-agent-string-reduction.html","tags":["Chrome","article"],"content":"ChromeのUser-Agent固定化のロードマップ。\nChrome 92で`navigator.userAgent`などのdeprecated化、reduced UA stringをオプトインで導入、デフォルト化など7段階でのマイグレーションフェーズについて","relatedLinks":[{"title":"User-Agent Reduction - The Chromium Projects","url":"https://www.chromium.org/updates/ua-reduction"}]},{"category":"Article","title":"Introducing Firefox&#039;s new Site Isolation Security Architecture - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2021/05/introducing-firefox-new-site-isolation-security-architecture/","tags":["Firefox","security","article"],"content":"FirefoxのSite Isolationのアーキテクチャについての記事。\neTLDベースのSiteごとにプロセス分け、メモリを相互に分離した状態でリソースをロードすることで、Spectreなどのサイドチャネル攻撃を防止する。\nまた、サブフレームもトップレベルが異なるSiteなら、別プロセスで読むこむようになっている。","relatedLinks":[]},{"category":"Article","title":"The Humble &lt;img&gt; Element And Core Web Vitals — Smashing Magazine","url":"https://www.smashingmagazine.com/2021/04/humble-img-element-core-web-vitals/","tags":["Image","performance","article"],"content":"`<img>`についてLCP、CLS、FIDのメトリクスに関する最適化の仕方についてのガイド","relatedLinks":[]},{"category":"Article","title":"Introducing WebContainers: Run Node.js natively in your browser","url":"https://blog.stackblitz.com/posts/introducing-webcontainers/","tags":["node.js","browser","webworker","WebAssembly","article"],"content":"Node.jsをブラウザで動かすWebContainersについて。\nNode.jsのランタイムをブラウザで動かし、ブラウザ自体をSandboxとしてNode.jsのコードをセキュアに実行するための仕組み。\nVirtual FSとNetworkingを実装し、各プロセスをWorkerとして起動してメッセージングすることでマルチプロセスのサポートしている。\nPOSIXなシェルとしてjshという実装と、npm/yarnクライアントとしてturboという実装を持っている","relatedLinks":[{"title":"stackblitz/webcontainer-core","url":"https://github.com/stackblitz/webcontainer-core"},{"title":"AngularAir - StackBlitz with Eric Simons and Dominic Elm - YouTube","url":"https://www.youtube.com/watch?v=5F9qH-ea5Qk"}]},{"category":"Article","title":"Migrate to User-Agent Client Hints","url":"https://web.dev/migrate-to-ua-ch/","tags":["Chrome","article","privacy"],"content":"`navigator.userAgent`などがDeprecatedとなり固定化されるため、その代わりとなるUser-Agent Client Hintsについて。\nJavaScriptのAPIとしての`navigator.userAgentData`と`navigator.userAgentData.getHighEntropyValues`。\nHTTPヘッダUA Client Hintを扱う`Accept-CH`と`Sec-CH-UA-*`について。\nまた、Client HintからレガシーなUA文字列を作成するライブラリについてなど","relatedLinks":[{"title":"Chromium Blog: Update on User-Agent String Reduction in Chrome","url":"https://blog.chromium.org/2021/05/update-on-user-agent-string-reduction.html"},{"title":"GoogleChromeLabs/uach-retrofill: This snippet illustrates how to reconstruct the legacy navigator.userAgent string value from the modern navigator.userAgentData values.","url":"https://github.com/GoogleChromeLabs/uach-retrofill"}]},{"category":"Article","title":"Renaming N-API to Node-API. This post was contributed by the… | by Node.js | May, 2021 | Medium","url":"https://nodejs.medium.com/renaming-n-api-to-node-api-27aa8ca30ed8","tags":["node.js","article"],"content":"Node.jsのネイティブアドオン用のAPIの名前をN-APIをNode-APIへ変更するという話。\n変更のモチベーションについて解説している","relatedLinks":[{"title":"Renaming N-API to Node-API. This post was contributed by the… | by Node.js | May, 2021 | Medium","url":"https://nodejs.medium.com/renaming-n-api-to-node-api-27aa8ca30ed8"}]},{"category":"WebsiteDocument","title":"オリジナルのJavaScriptライブラリを公開しよう","url":"https://zenn.dev/yusuke99/books/fcd96342f5cb1b468799","tags":["JavaScript","npm","Github","Actions","tutorial"],"content":"JavaScriptのライブラリをnpmに公開するチュートリアル。\nライブラリの実装とテスト、npmへの公開、GitHub ActionsでのCIからpublish、Scoped Packagesについてなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"argyleink/transition.css: Drop-in CSS transitions","url":"https://github.com/argyleink/transition.css","tags":["CSS","library"],"content":"いろいろなCSS transitionを集めたCSSライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"DOM Events","url":"https://domevents.dev/","tags":["DOM","event","Tools"],"content":"DOMイベントの流れをBubbling、Capture、Passiveなどのオプションごとに動きを可視化できるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rtk-incubator/rtk-query: Experimental data fetching and caching addon for Redux Toolkit","url":"https://github.com/rtk-incubator/rtk-query","tags":["redux","HTTP","library","React"],"content":"Redux Toolkitを使うデータ取得と状態管理をするQueryライブラリ。\n宣言的なAPIの定義、データの取得、キャッシュやリトライ、Prefetching、React Hooks、Open APIから自動生成などに対応している。\n将来的にはRedux Toolkitに同梱することを目標にしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ngneat/variabless: JS &amp; CSS - A Match Made in Heaven 💎","url":"https://github.com/ngneat/variabless","tags":["JavaScript","CSS","Tools"],"content":"JavaScriptからCSS Variablesの定義を含んだCSSを生成するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Web worker meets worker threads - threads.js","url":"https://threads.js.org/","tags":["node.js","library","webworker"],"content":"ブラウザのWeb WorkerとNode.jsの`worker_threads`を使ったWorker管理ライブラリ。\nasync functionとObservablesの対応、thread pools、webpack向けのpluginを持っている","relatedLinks":[]}]},{"meta":{"title":"2021-06-01のJS: Jest 27、vanilla-extract 1.0.0、Learn CSS","author":"azu","layout":"post","date":"2021-05-31T14:26:57.997Z","category":"JSer","tags":["TypeScript","CSS","Tools","testing","node.js"],"url":"https://jser.info/2021/05/31/jest-27-vanilla-extract-1.0.0-learn-css/"},"items":[{"category":"Headline","title":"sinon/CHANGELOG.md at master · sinonjs/sinon","url":"https://github.com/sinonjs/sinon/blob/master/CHANGELOG.md#1110--2021-05-25","tags":["JavaScript","testing","library","ReleaseNote"],"content":"sinon.js 11.1.0リリース。\nPromiseをFakeする`sinon.promise()`の実装など","relatedLinks":[]},{"category":"Headline","title":"Jest 27: New Defaults for Jest, 2021 edition ⏩ · Jest","url":"https://jestjs.io/blog/2021/05/25/jest-27","tags":["JavaScript","testing","node.js","library","ReleaseNote"],"content":"Jest 27リリース。\nデフォルトが大きく変わるリリースとなっていて、\n`testEnvironment`のデフォルトを`jsdom`から`node`へ変更、`jest-circus`のデフォルト化、fake timersのデフォルトを`@sinonjs/fake-timers`ベースの`modern`に変更している。\n機能追加として、失敗したテストをインタラクティブに実行できるように、inline snapshotsをprettierの依存なく実行できるようになど。\nまた、`done`の複数回呼び出しをエラーとしたり、Promiseを返すのと`done`の混在を禁止したり、TypeScriptの型を厳密化するといった変更も含まれる","relatedLinks":[{"title":"Release 27.0.0 · facebook/jest","url":"https://github.com/facebook/jest/releases/tag/v27.0.0"}]},{"category":"Headline","title":"Announcing TypeScript 4.3 | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-3/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.3リリース\nsetterにgetterとは異なる型を指定できるように、`override`キーワードの追加、Template String Typeの改善。\nPrivate Class Elements(fields/methods/accessors)のサポート、`static` Index Signatureのサポート。\n`ConstructorParameters`がAbstract classをサポート、Genericsにおける型の絞り込みの改善、Promiseオブジェクトを条件式に渡してしまうミスのチェックを追加。\nその他には、`.tsbuildinfo`のサイズ改善、watch時の初回ビルドの改善など。","relatedLinks":[]},{"category":"Headline","title":"Announcing Vendure v1.0 | Vendure E-commerce","url":"https://www.vendure.io/blog/2021/05/announcing-vendure-v1.0/","tags":["node.js","ReleaseNote","GraphQL"],"content":"GraphQL/TypeScriptベースのeコマースフレームワークであるVendure v1.0リリース。","relatedLinks":[{"title":"vendure-ecommerce/vendure: A headless GraphQL ecommerce framework for the modern web","url":"https://github.com/vendure-ecommerce/vendure"}]},{"category":"Headline","title":"Optimized images for Nuxt","url":"https://image.nuxtjs.org/","tags":["Vue","library"],"content":"Nuxt.js向けの画像最適化モジュール","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2021-05 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2021/05/29/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2021年5月のTC39ミーティングでStageの変更があったProposalのまとめ。\nTop-Level awaitとRegExp Match IndicesがStage 4となりES2022に含まれることが決まった","relatedLinks":[]},{"category":"Headline","title":"New Release: 2.13.0","url":"https://jshint.com/blog/2021-05-30/release-2-13-0/","tags":["JavaScript","Tools","ReleaseNote"],"content":"JSHint 2.13.0リリース。\n`export * as ns from`、`import.meta`、Dynamic `import()`、Optional Chaining、Nullish Coalescingのサポートなど","relatedLinks":[]},{"category":"Headline","title":"vanilla-extract — Zero-runtime Stylesheets-in-TypeScript.","url":"https://vanilla-extract.style/","tags":["CSS","JavaScript","TypeScript","Tools"],"content":"vanilla-extract v1.0リリース。\nTypeScriptでスタイルをJSとして`.css.ts`に書いて`class`属性に指定したものをコンパイルすると、CSSファイルを生成するフレームワークに依存しないツールキット。\nビルド時に静的に展開されるAPIと実行時に動作するDynamic API、webpackやViteなどの各種ツールに対応したプラグインが用意されている。","relatedLinks":[{"title":"🧁🍨 Mark Dalgleish on Twitter: ","url":"https://twitter.com/markdalgleish/status/1398158090294292482"}]},{"category":"Headline","title":"Lit 2.0: Meet Lit, all over again! – Lit","url":"https://lit.dev/blog/2021-04-21-lit-2.0-meet-lit-all-over-again/","tags":["JavaScript","WebComponents","library","ReleaseNote"],"content":"Lit 2.0 RCリリース。\n`lit-html`と`LitELement`を一つにまとめて`lit`パッケージの公開、ウェブサイトの刷新が行われている。\nファイルサイズやパフォーマンスの改善、SSRの対応などが含まれている","relatedLinks":[{"title":"Lit Launch Event - YouTube","url":"https://www.youtube.com/watch?v=f1j7b696L-E"},{"title":"Introducing ","url":"https://zenn.dev/takanorip/articles/640f9fe9c6c8ca"}]},{"category":"Article","title":"5 steps to faster web fonts /// Iain Bean","url":"https://iainbean.com/posts/2021/5-steps-to-faster-web-fonts/","tags":["CSS","fonts","article"],"content":"Web Fontsのローディングについての連載。\n`font-display`でのテキストの表示と切り替わるタイミングのまとめ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Learn CSS","url":"https://web.dev/learn/css/","tags":["CSS","tutorial"],"content":"CSSについて一通り扱うチュートリアル講座。\nBox Model、セレクタ、詳細度、CSSの単位などの基本的な概念から、GridやFlexboxなどのレイアウト、ColorやmarginなどのCSSプロパティの解説、擬似クラスや疑似要素などを扱う","relatedLinks":[]},{"category":"SoftwareLibrary","title":"xqq/mpegts.js: HTML5 MPEG2-TS Stream Player","url":"https://github.com/xqq/mpegts.js","tags":["JavaScript","video","library"],"content":"flv.jsをベースにしたMPEG-2 TS steram playerライブラリ。\nHTTPとWebSocketを使ったMPEG-2 TS streamの再生、低遅延、低スペックマシンでも再生できることを目的にしている。\nflv.jsベースであるため、FLV containerもサポートしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"wwwtyro/candygraph: Fast by default, flexible 2D plotting library.","url":"https://github.com/wwwtyro/candygraph","tags":["graphic","library","JavaScript"],"content":"パフォーマンスに目的を置いた2Dグラフ描画ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lume/autolayout: Apple&#039;s Auto Layout and Visual Format Language for JavaScript (using cassowary constraints)","url":"https://github.com/lume/autolayout","tags":["JavaScript","library"],"content":"Auto LayoutとVisual Format Languageの実装ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"plantain-00/type-coverage: A CLI tool to check type coverage for typescript code","url":"https://github.com/plantain-00/type-coverage","tags":["TypeScript","Tools"],"content":"TypeScriptの型カバレッジを出すツール","relatedLinks":[]},{"category":"Book","title":"WebAssembly: The Definitive Guide","url":"https://learning.oreilly.com/library/view/webassembly-the-definitive/9781492089834/","tags":["WebAssembly","book"],"content":"2021年12月発売予定\nWebAsseblyについての書籍","relatedLinks":[]}]},{"meta":{"title":"2021-06-08のJS: Lighthouse 8.0.0(スコア計算の変更)、Vue 3.1(@vue/compat)、 Mocha v9.0.0","author":"azu","layout":"post","date":"2021-06-08T02:48:58.962Z","category":"JSer","tags":["Chrome","node.js","TypeScript","browser","WebAssembly"],"url":"https://jser.info/2021/06/08/lighthouse-8.0.0-vue-3.1vuecompat-mocha-v9.0.0/"},"items":[{"category":"Headline","title":"Release v10.0.0 · puppeteer/puppeteer","url":"https://github.com/puppeteer/puppeteer/releases/tag/v10.0.0","tags":["Chrome","browser","ReleaseNote","library"],"content":"puppeteer 10.0.0リリース。\nNode.js 10のサポート終了、起動してから最初のページのロード待ちをするかどうかを決める`waitForInitialPage`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v8.0.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v8.0.0","tags":["Chrome","performance","Tools","ReleaseNote"],"content":"Lighthouse 8.0.0リリース。\nパフォーマンススコアの計算式の変更、レポートをメトリクス別にフィルターできるように、`csp-xss`のAuditの追加など。","relatedLinks":[{"title":"lighthouse/v8-perf-faq.md at master · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/blob/master/docs/v8-perf-faq.md"}]},{"category":"Headline","title":"Electron 13.0.0 | Electron Blog","url":"https://www.electronjs.org/blog/electron-13-0","tags":["Electron","ReleaseNote"],"content":"Electron 13.0.0リリース。\nChrome 91、Node.js 14.16.0、V8 9.1へアップデート。\n`process.contextIsolated`、`session.storagePat`、`process.contextId`の追加。\nWebContentsの`new-window`イベントがDeprecatedとなり`webContents.setWindowOpenHandler()`を推奨するようになるなど","relatedLinks":[]},{"category":"Headline","title":"Looking fine with Firefox 89 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2021/06/looking-fine-with-firefox-89/","tags":["Firefox","ReleaseNote"],"content":"Firefox 89リリース。\nMedia Queryの`forced-colors`、フォントロード時の視差を調整する`line-gap-override`/`ascent-override`/`descent-override`の実装。\nTop-level `await`をデフォルトで有効化、64bitマシンでArrayBufferが2GB以上のサイズを扱えるように、`PerformanceEventTiming`のサポートなど。","relatedLinks":[{"title":"Firefox 89 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/89"},{"title":"Firefox 89.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/89.0/releasenotes/"}]},{"category":"Headline","title":"Chromium Blog: Chrome 92: Web Apps as File Handlers, New JavaScript Features, and More","url":"https://blog.chromium.org/2021/06/chrome-92-web-apps-as-file-handlers-new.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 92 betaリリース。\nOrigin TrialとしてFile Handling API、Shared Element Transitions。\n`@font-face`の`size-adjust`、V8 9.2へのアップデート、SharedArrayBuffersがCross Origin Isolateされたページに限定されるなど","relatedLinks":[]},{"category":"Headline","title":"Release v9.0.0 · mochajs/mocha","url":"https://github.com/mochajs/mocha/releases/tag/v9.0.0","tags":["node.js","testing","JavaScript","ReleaseNote"],"content":"Mocha 9.0.0リリース。\nNode.js 10のサポート終了、ESMサポート、`--dry-run`オプションのサポート。\n非推奨だった`utils.lookupFiles()`の削除など","relatedLinks":[]},{"category":"Headline","title":"Node v16.3.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v16.3.0/","tags":["node.js","npm","ReleaseNote"],"content":"Node v16.3.0リリース。\nnpm 7.15.1へのアップデートでnpmのworkspaceコマンドが色々追加された","relatedLinks":[]},{"category":"Headline","title":"Release v3.1.0 Pluto · vuejs/vue-next","url":"https://github.com/vuejs/vue-next/releases/tag/v3.1.0","tags":["Vue","ReleaseNote"],"content":"Vue 3.1.0リリース。\nVue 2からのMigration Buildとして`@vue/compat`の追加。\n`app.config.isCustomElement`とコンポーネントの`delimiters`オプションを非推奨化してコンポーネントの`compilerOptions`オプションをサポート。\n`v-is`を非推奨化して`is=\"vue:xxx\"`のサポートなど","relatedLinks":[]},{"category":"Article","title":"What&#039;s New In DevTools (Chrome 92) - Chrome Developers","url":"https://developer.chrome.com/blog/new-in-devtools-92/","tags":["Chrome","debug","article"],"content":"Chrome 92のDevToolsの変更点について。\nCSS gridエディタ、REPL内で`const`の再定義ができるように、Source order viewerの追加。\nCORSのエラーメッセージの改善、NetworkのフィルターにWasm typeを追加、UA Client Hintの対応。\nExperimentsとしてChrome DevTools Protocolを見るProtocol Monitor、Puppeteer Recorderの追加など","relatedLinks":[]},{"category":"Article","title":"UI Security - Thinking Outside the Viewport | Microsoft Browser Vulnerability Research","url":"https://microsoftedge.github.io/edgevr/posts/ui-security-thinking-outside-the-viewport/","tags":["MSEdge","browser","security","article"],"content":"ブラウザUIのセキュリティバグを例に、UIにおけるセキュリティバグをどのようにチェックするかについて解説している記事","relatedLinks":[]},{"category":"Article","title":"Making JavaScript run fast on WebAssembly | Bytecode Alliance","url":"https://bytecodealliance.org/articles/making-javascript-run-fast-on-webassembly","tags":["JavaScript","WebAssembly","security","article"],"content":"Wasmで動くJavaScriptエンジンを作る話。\nWasmをサンドボックスとしてJavaScriptを実行できる点と、JavaScriptエンジンの初期化とRuntimeの高速化の手法について書かれている。","relatedLinks":[{"title":"bytecodealliance/wizer: The WebAssembly Pre-Initializer","url":"https://github.com/bytecodealliance/wizer"}]},{"category":"WebsiteDocument","title":"An introduction to WebAssembly for JavaScript Developers","url":"https://pascalpares.appspot.ovh/webassembly-for-javascript-developers/","tags":["WebAssembly","node.js","JavaScript","tutorial"],"content":"WebAssemblyのJavaScript APIについての解説記事。\nWasmファイルのロード、コンパイル、WasmからJSのコールバック関数の呼び出し、Dynamic Link、グローバル変数、文字列の渡し方、Shared Memory Bufferなどについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"progfay/benefit-from-end-of-ie: List of APIs that will be available due to IE termination","url":"https://github.com/progfay/benefit-from-end-of-ie","tags":["IE","WebPlatformAPI","document"],"content":"IEのみがサポートしていないAPIをまとめたもの。\nMDNのデータをベースにHTML、JS、CSS、SVGのAPIを一覧できる","relatedLinks":[]},{"category":"WebsiteDocument","title":"Node.js API Table","url":"https://nodejs-api-table.netlify.app/","tags":["node.js","API","document"],"content":"Node.jsのモジュールやAPIがどのバージョンで追加されたのかを一覧できるサイト。","relatedLinks":[{"title":"Next.js で Node.js の API がいつ入ったのかわかる表を作る","url":"https://zenn.dev/sosukesuzuki/articles/f00bc24600f2d8"}]},{"category":"SoftwareLibrary","title":"devongovett/dprint-node: A node API for the dprint TypeScript and JavaScript code formatter","url":"https://github.com/devongovett/dprint-node","tags":["JavaScript","Rust","library"],"content":"Rustで書かれたdprintを使ったコードフォーマッター","relatedLinks":[]},{"category":"SoftwareLibrary","title":"htmlplus/core: HTMLPLUS is a native, framework-less, and lightweight library that is purely developed with Javascript. All HTMLPLUS components are customizable and configurable.","url":"https://github.com/htmlplus/core","tags":["WebComponents","React","Vue","library"],"content":"Web Componentsで作られたUIライブラリ。\nReactとVue向けのバインディングも提供している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kawmra/typist-json: A simple runtime JSON type checker.","url":"https://github.com/kawmra/typist-json","tags":["TypeScript","JSON","library"],"content":"スキーマを定義するビルダー関数とチェッカーライブラリ。\n定義したスキーマをTypeScriptの型として利用できる。","relatedLinks":[{"title":"TypeScript 向けの軽量ランタイム JSON 型チェッカーを作った","url":"https://zenn.dev/kawmra/articles/0aad8dca56f1da"}]},{"category":"SoftwareLibrary","title":"EvandroLG/ts-audio: ts-audio is an agnostic library that makes it easy to work with AudioContext and create audio playlists in the browser","url":"https://github.com/EvandroLG/ts-audio","tags":["JavaScript","library","audio","TypeScript"],"content":"AudioContext APIを使った音楽再生ライブラリ。\n複数の音声の連続再生などをサポートしている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Testy/TestyTs: ✔️ Modern TypeScript testing framework.","url":"https://github.com/Testy/TestyTs","tags":["TypeScript","testing","library"],"content":"Decoratorを使ったTypeScriptテストフレームワーク","relatedLinks":[]}]},{"meta":{"title":"2021-06-15のJS: React 18 αリリース、Deno 1.11(Docker Images)、Plotly.js 2.0","author":"azu","layout":"post","date":"2021-06-15T00:52:12.189Z","category":"JSer","tags":["Tools","node.js","Image","testing","Chrome"],"url":"https://jser.info/2021/06/15/react-18-a-deno-1.11docker-images-plotly.js-2.0/"},"items":[{"category":"Headline","title":"Release v7.0.0 · d3/d3","url":"https://github.com/d3/d3/releases/tag/v7.0.0","tags":["JavaScript","SVG","d3.js","library","ReleaseNote"],"content":"D3.js v7.0.0リリース。\nESMの対応、nullの対応を変更、`d3.selectAll`などでArray-likeをArrayに変換して扱うように。\n機能追加として`d3.mode`、`d3.flatGroup`、`d3.flatRollup`、`transition.selectChild`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v0.7.0 · nextapps-de/flexsearch","url":"https://github.com/nextapps-de/flexsearch/releases/tag/0.7.0","tags":["JavaScript","search","library","ReleaseNote"],"content":"JavaScriptで書かれた全文検索エンジンのflexsearch 0.7.0リリース。\n一から書き直されている。\nメモリ消費量やパフォーマンスの改善、Bidirectional Contextのサポート、Node.jsの`worker_thread`の対応など。","relatedLinks":[{"title":"flexsearch/0.7.0.md at 0.7.0 · nextapps-de/flexsearch","url":"https://github.com/nextapps-de/flexsearch/blob/0.7.0/doc/0.7.0.md"}]},{"category":"Headline","title":"Deno 1.11 Release Notes | Deno Blog","url":"https://deno.com/blog/v1.11","tags":["deno","ReleaseNote"],"content":"Deno 1.11リリース。\nDocker Imageの追加、Web Crypto APIsの改善と`crypto.randomUUID`のサポート、Fetch APIが`AbortSignal`をサポート。\nまた`deno lint`がStableとなり、`deno compile`でDynamic Importのサポート、`Text{Encoder,Decodeer}Stream`のサポートなど。","relatedLinks":[{"title":"Deno 1.11.0 がリリースされたので新機能や変更点の紹介","url":"https://zenn.dev/magurotuna/articles/deno-release-note-1-11-0"}]},{"category":"Headline","title":"Release 2.16.0 · qunitjs/qunit","url":"https://github.com/qunitjs/qunit/releases/tag/2.16.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"QUnit 2.16.0リリース。\n`QUnit.test.each`メソッド、`failOnZeroTests`オプション、TAPレポーターの対応。\n`QUnit.module`でPromiseを返した場合に警告がでるようになるなど","relatedLinks":[]},{"category":"Headline","title":"🎉 Announcing Plotly.js 2.0! - Graphing Library / Plotly.js - Plotly Community Forum","url":"https://community.plotly.com/t/announcing-plotly-js-2-0/53675","tags":["JavaScript","chart","library","ReleaseNote"],"content":"Plotly.js 2.0リリース。\nIE 9/10のサポート終了、非推奨のAPI、`Plotly.plot()`や`plotly.d3`などの削除。\nCSPの`usafe-eval`への対応、Custom Bundleの作成方法の追加など","relatedLinks":[{"title":"Release v2.0.0 · plotly/plotly.js","url":"https://github.com/plotly/plotly.js/releases/tag/v2.0.0"}]},{"category":"Headline","title":"CSS Layout Generator","url":"https://layout.bradwoods.io/","tags":["CSS","Tools"],"content":"CSS Grid Layoutのジェネレーターツール。\nCSS Gridのプロパティを変更しながら、どのような表示になるかを確認できる","relatedLinks":[]},{"category":"Headline","title":"Release 5.0.0 · Unitech/pm2","url":"https://github.com/Unitech/pm2/releases/tag/5.0.0","tags":["node.js","Tools","ReleaseNote"],"content":"Nodeのプロセス管理ツールのpm2 5.0.0リリース。\nローカルのシステムモニタリングが新しくなり、サーバメトリクスの表示が追加された。\npm2.io へ送信するデータをJSON Patchベースの差分にすることで転送量の削減など","relatedLinks":[]},{"category":"Headline","title":"Introducing Astro: Ship Less JavaScript","url":"https://astro.build/blog/introducing-astro","tags":["JavaScript","Tools","ReleaseNote","performance"],"content":"JavaScriptを含まない静的サイトを生成できるSSGツール。\nIsland Architectureのようにインタラクティブな部分だけJavaScriptを含んだコンポーネントを利用できるようになっている。","relatedLinks":[{"title":"snowpackjs/astro: 🚀🧑‍🚀 Keep your eyes to the skies, astronauts!","url":"https://github.com/snowpackjs/astro"}]},{"category":"Headline","title":"The Plan for React 18 – React Blog","url":"https://reactjs.org/blog/2021/06/08/the-plan-for-react-18.html","tags":["React","ReleaseNote"],"content":"React 18のαリリースと変更予定について。\nAutomatic batchingと`flushSync`の追加、SuspenseのSSRサポートと`pipeToNodeWritable`の追加、Concurrentモードのopt-inサポート。\n新しいrender APIである`createDOM`の追加、バグを見つけるためにStrictModeではコンポーネントを2重にレンダリングするようなるなど。\nまた、ReactのWorking Groupのリポジトリが作成されている。","relatedLinks":[{"title":"Discussions · reactwg/react-18","url":"https://github.com/reactwg/react-18/discussions"},{"title":"Automatic batching for fewer renders in React 18 · Discussion #21 · reactwg/react-18","url":"https://github.com/reactwg/react-18/discussions/21"},{"title":"Upgrading to React 18 on the server · Discussion #22 · reactwg/react-18","url":"https://github.com/reactwg/react-18/discussions/22"},{"title":"New feature: startTransition · Discussion #41 · reactwg/react-18","url":"https://github.com/reactwg/react-18/discussions/41"},{"title":"Replacing render with createRoot · Discussion #5 · reactwg/react-18","url":"https://github.com/reactwg/react-18/discussions/5"},{"title":"Adding Strict Effects to StrictMode · Discussion #19 · reactwg/react-18","url":"https://github.com/reactwg/react-18/discussions/19"}]},{"category":"Headline","title":"Release v0.153.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.153.0","tags":["flowtype","ReleaseNote"],"content":"Flow 0.153.0リリース。\n`this`を使うクラスのメソッドを変数に入れて`this`のbindの解除をエラーとするように、`flow fix`コマンドで自動修正を適用できるように","relatedLinks":[{"title":"Sound Typing for “this” in Flow. In our most recent post, we alluded to… | by Daniel Sainati | Flow | Jun, 2021 | Medium","url":"https://medium.com/flow-type/sound-typing-for-this-in-flow-d62db2af969e"}]},{"category":"Article","title":"Introducing libSquoosh","url":"https://web.dev/introducing-libsquoosh/","tags":["node.js","Image","library","article"],"content":"リサイズや圧縮などの画像処理を行うSquooshをライブラリとして利用できるlibSquooshの紹介記事。","relatedLinks":[{"title":"squoosh/libsquoosh at dev · GoogleChromeLabs/squoosh","url":"https://github.com/GoogleChromeLabs/squoosh/tree/dev/libsquoosh"}]},{"category":"Article","title":"Introducing the Memory Inspector - Chrome Developers","url":"https://developer.chrome.com/blog/memory-inspector/","tags":["Chrome","article"],"content":"Chrome 91でDevToolsに追加されたMemory Inspectorについての記事。\nArrayBuffersのバイトをエンディアンを選択して見れる。またDWARFを使うことでC++やWasmのメモリも見れることについて","relatedLinks":[]},{"category":"Article","title":"Strykerを使ってTypeScriptでMutation Testingする","url":"https://zenn.dev/daikik/articles/8cd20776991a9c","tags":["JavaScript","testing","article"],"content":"Stryker-jsを使ったMutation Testingについて。","relatedLinks":[]},{"category":"Article","title":"Securing Your Website With Subresource Integrity | CSS-Tricks","url":"https://css-tricks.com/securing-your-website-with-subresource-integrity/","tags":["security","JavaScript","article"],"content":"JavaScriptを配布するCDNやS3 bucketなどが書き換えられた場合にウェブサイトへの軽減するためのSubresource Integrity (SRI)の使い方についての記事。","relatedLinks":[]},{"category":"Article","title":"What&#039;s coming in ESLint v8.0.0 - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2021/06/whats-coming-in-eslint-8.0.0","tags":["ESLint","article"],"content":"ESLint v8.0.0の変更予定について。\n破壊的な変更として、Node 10のサポート終了、`meta.hasSuggestions`と`meta.fixable`がそれぞれ必須に、`CLIEngine`の削除など。\nまたES2022のサポート、利用してない`eslint-disable`ディレクトリの`--fix`に対応などを予定している。","relatedLinks":[]},{"category":"Book","title":"From AVIF to WebP: A New Smashing Book By Addy Osmani — Smashing Magazine","url":"https://www.smashingmagazine.com/2021/06/image-optimization-book-release/","tags":["Image","book"],"content":"画像フォーマット、画像の圧縮、ロード方法、レンダリング、Core Web Vitalsなどについての書籍","relatedLinks":[]}]},{"meta":{"title":"2021-06-22のJS: undici 4.0.0(HTTPクライアント)、Next.js 11、Safari 15 Beta","author":"azu","layout":"post","date":"2021-06-22T00:30:43.354Z","category":"JSer","tags":["node.js","React","CSS","WebAssembly","redux"],"url":"https://jser.info/2021/06/22/undici-4.0.0http-next.js-11-safari-15-beta/"},"items":[{"category":"Headline","title":"Wasmer 2.0, Its a big deal!","url":"https://wasmer.io/posts/wasmer-2.0","tags":["WebAssembly","ReleaseNote"],"content":"WebAssembly RuntimeのWasmer　２．０リリース。\nSIMD、Reference Typesへの対応、パフォーマンスの改善など。","relatedLinks":[{"title":"Release 2.0.0 · wasmerio/wasmer","url":"https://github.com/wasmerio/wasmer/releases/tag/2.0.0"}]},{"category":"Headline","title":"Introducing Undici@4. After a few years since the first… | by Node.js | Jun, 2021 | Medium","url":"https://nodejs.medium.com/introducing-undici-4-1e321243e007","tags":["node.js","ReleaseNote"],"content":"Node.js向けのHTTPクライアントあるUndici 4リリース。\nNode.js 10のサポート終了、ウェブサイトの公開。\nHTTPパーサにllhttpのWasmビルドを利用、`maxRedirections`でのリダイレクトサポート、nockをインスパイアしたモックのサポートなど","relatedLinks":[{"title":"Release v4.0.0 - Unified API, Docs Site, WASM, Redirect and Mocking · nodejs/undici","url":"https://github.com/nodejs/undici/releases/tag/v4.0.0"},{"title":"Node.js Undici","url":"https://undici.nodejs.org/#/"}]},{"category":"Headline","title":"Release v1.0.0 · pmndrs/jotai","url":"https://github.com/pmndrs/jotai/releases/tag/v1.0.0","tags":["JavaScript","library","ReleaseNote","React"],"content":"React向けのステート管理ライブラリのJotai 1.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release v1.6.0 : RTK Query! · reduxjs/redux-toolkit","url":"https://github.com/reduxjs/redux-toolkit/releases/tag/v1.6.0","tags":["redux","library","ReleaseNote"],"content":"redux toolkit 1.6.0リリース。\n別プロジェクトとして開発していたRTK(Redux Toolkit) Queryが同梱された。","relatedLinks":[]},{"category":"Headline","title":"Blog - Next.js 11 | Next.js","url":"https://nextjs.org/blog/next-11","tags":["Next.js","ReleaseNote"],"content":"Next.js 11リリース。\nESLint連携、パフォーマンス改善、Scriptロードコンポーネントの`next/script`を追加、`next/image`で画像のサイズを検出して設定できるように、webpack 5がデフォルト化。\nCreate React Appからのマイグレーションツールも公開されている。","relatedLinks":[{"title":"Basic Features: ESLint | Next.js","url":"https://nextjs.org/docs/basic-features/eslint"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 126 with Safari 15 Features | WebKit","url":"https://webkit.org/blog/11727/release-notes-for-safari-technology-preview-126-with-safari-15-features/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 126リリース。\nSafari 15相当の変更を含む。\n`autocomplete=one-time-code`の対応、`theme-color`と`media`のサポート。\nJavaScriptではTop-Level `await`、WorkerでのESMサポート、Error Causeのサポートなど。\nMediaSession API、iPadでVP9とWebMのハードウェアアクセラレーションが有効化、WebMでOpusコーデックをサポートなど。\nWebAssemblyのStreaming compilationとReference typesのサポートなど。\nまた、WebGL 2とWeb Share Level 2のサポートなど。\nその他には、iOSとiPadOSでSafariの拡張をサポートし、`declarativeNetRequest` APIの実装など","relatedLinks":[{"title":"Safari 15 Beta Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/Safari-Release-Notes/safari-15-beta-release-notes"},{"title":"tc39/proposal-error-cause: TC39 proposal for accumulating errors","url":"https://github.com/tc39/proposal-error-cause"}]},{"category":"Headline","title":"Tailwind CSS v2.2 – Tailwind CSS","url":"https://blog.tailwindcss.com/tailwindcss-2-2","tags":["CSS","library","ReleaseNote"],"content":"Tailwind CSS v2.2リリース。\nJITモードの変更、CLIを書き直して`--watch`などのサポート。\nJITモードで、`before`/`after`/ `first-letter`/`first-line`などの疑似要素のサポート。\nまた、`selection`や`mark` variantのサポート、`color:`などのtypeをつけることで柔軟な値指定ができるようになるなど","relatedLinks":[{"title":"Release v2.2.0 · tailwindlabs/tailwindcss","url":"https://github.com/tailwindlabs/tailwindcss/releases/tag/v2.2.0#changes-and-deprecations"}]},{"category":"Headline","title":"Release 3.15.0 - 2021.06.21 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.15.0","tags":["JavaScript","polyfill","library","ReleaseNote"],"content":"core-js 3.15.0リリース。\nRegExpのnamed capture group、`dotAll`フラグのサポート、組み込み用のJavaScriptエンジン向けなどにAnnex Bの機能polyfillを追加など","relatedLinks":[]},{"category":"Article","title":"A Visual Guide to NodeJS Streams. In NodeJS, stream module provides the… | by Deepal Jayasekara | Jun, 2021 | Deepal’s Blog","url":"https://blog.insiderattack.net/a-visual-guide-to-nodejs-streams-9d2d594a9bf5","tags":["node.js","stream","article"],"content":"Node.jsのStreamについての解説記事。\nReaable. Writable, Duplex, Transform,  Piping Streamについてそれぞれ図とともに動作を紹介している。\nまた、back pressureとhighWaterMarkについて","relatedLinks":[]},{"category":"Article","title":"CSS System Colors - Jim Nielsen’s Blog","url":"https://blog.jim-nielsen.com/2021/css-system-colors/","tags":["CSS","article"],"content":"文字色と背景色のLight/Darkモードの切り替え対応はOSのシステムカラーを扱う`color-scheme: light dark;`とシステムカラーを指定できる`Canvas`値を使って対処する話","relatedLinks":[]},{"category":"Article","title":"Benchmarking JavaScript Memory Usage - WebPageTest Blog","url":"https://blog.webpagetest.org/posts/benchmarking-javascript-memory-usage/","tags":["JavaScript","article","performance"],"content":"`performance.measureUserAgentSpecificMemory()`でのメモリ使用量の取得と他のメトリクスとメモリ使用量に相関についての記事。\nページロード時においての、JavaScriptのサイズがメモリ使用量と相関関係の調査、各種フレームワークを利用しているサイトごとのメモリ使用量の調査など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"concrete-utopia/utopia: Design ❤️ Code","url":"https://github.com/concrete-utopia/utopia","tags":["React","Design","Tools"],"content":"ReactコンポーネントをGUIでPropsやスタイルを設定できるデザインツール。\nGUIで設定した内容はコードと同期する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vueuse/vueuse: Collection of essential Vue Composition Utilities for Vue 2 and 3","url":"https://github.com/vueuse/vueuse","tags":["JavaScript","Vue","library"],"content":"VueのComposition API向けのUtilityを集めたライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"plexinc/papr: MongoDB TypeScript-aware Models","url":"https://github.com/plexinc/papr","tags":["TypeScript","MongoDB","library"],"content":"Type SafeなMongoDB向けのモデルライブラリ。","relatedLinks":[{"title":"Papr: Type-safe Node.js models for MongoDB | Plex Labs","url":"https://medium.com/plexlabs/papr-type-safe-node-js-models-for-mongodb-c841e8b23429"}]}]},{"meta":{"title":"2021-06-29のJS: ES2021公開、Storybook 6.3、styled-componentsの仕組み","author":"azu","layout":"post","date":"2021-06-29T01:10:45.487Z","category":"JSer","tags":["ECMAScript","Tools","CSS","TypeScript","Markdown"],"url":"https://jser.info/2021/06/29/es2021-storybook-6.3-styled-components/"},"items":[{"category":"Headline","title":"\\[Release News\\] TOAST UI Editor 3.0 is here! | by TOAST UI | Jun, 2021 | Medium","url":"https://toastui.medium.com/release-news-toast-ui-editor-3-0-is-here-6ed2a09160e6","tags":["Markdown","editor","library","ReleaseNote","JavaScript"],"content":"MarkdownエディタのTOAST UI Editor 3.0リリース。\nProsemirrorベースに変更することでCodeMirror、squire、to-markの依存を削除。\nMarkdownの構文をカスタマイズができるように、`widgetRules`の追加、デザインの変更など","relatedLinks":[{"title":"tui.editor/v3.0-migration-guide.md at master · nhn/tui.editor","url":"https://github.com/nhn/tui.editor/blob/master/docs/v3.0-migration-guide.md"}]},{"category":"Headline","title":"Ecma International approves new standards - Ecma International","url":"https://www.ecma-international.org/news/ecma-international-approves-new-standards-4/","tags":["ECMAScript","news"],"content":"ECMAScript 2021が正式リリースされた","relatedLinks":[]},{"category":"Headline","title":"Release 3.0.0 · developit/mitt","url":"https://github.com/developit/mitt/releases/tag/3.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"Event EmitterライブラリのMitt 3.0リリース。\n`.off(type)`で同じtypeのすべてのlistenersを消せるように、TypeScriptの型の改善、`exports`フィールドの対応","relatedLinks":[]},{"category":"Headline","title":"Storybook 6.3","url":"https://storybook.js.org/blog/storybook-6-3/","tags":["JavaScript","debug","Tools","ReleaseNote"],"content":"Storybook 6.3リリース。\nメジャー、アウトラインなどの視覚的なデバッグ機能の追加、`@storybook/testing-vue`と`@storybook/testing-react`でのテストのサポート。\nAngular 12、Lit 2のサポート、webpack 5のサポートのStable化、Viteのサポート。\n`--modern`モードでESMでの実行できるようになるなど","relatedLinks":[{"title":"Storybook for Vite","url":"https://storybook.js.org/blog/storybook-for-vite/"}]},{"category":"Headline","title":"Release 7.6.0 · cypress-io/cypress","url":"https://github.com/cypress-io/cypress/releases/tag/v7.6.0","tags":["E2E","browser","testing","ReleaseNote","JavaScript"],"content":"Cypress 7.6.0リリース。\n`.type()`のデフォルトdelayを変更できるように、`cypress open`の改善、`cy.intercept`の`req`に`query`プロパティの追加。\nwebpack 5でハングしないように、`cy.intercept`でのマルチバイトの問題の修正など","relatedLinks":[]},{"category":"Headline","title":"Release 3.0.0 · micromark/micromark","url":"https://github.com/micromark/micromark/releases/tag/3.0.0","tags":["markdon","library","ReleaseNote"],"content":"CommonMark準拠のMarkdownパーサであるmicromark 3.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0 · solidjs/solid","url":"https://github.com/solidjs/solid/releases/tag/v1.0.0","tags":["JavaScript","ReleaseNote","library"],"content":"JSXを扱う宣言的なUIコンポーネントフレームワークのSolid 1.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release v5.41.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.41.0","tags":["webpack","library","ReleaseNote","ECMAScript","module"],"content":"webpack 5.41.0リリース。\n`experiments.outputModule: true`の実験フラグで、ECMAScript Modules形式の出力、Dynamic Importを使ったchunk読み込みなどの基本的な実装","relatedLinks":[]},{"category":"Article","title":"An updated timeline for Privacy Sandbox milestones","url":"https://blog.google/products/chrome/updated-timeline-privacy-sandbox-milestones/","tags":["Chrome","security","privacy","article"],"content":"ChromeのPrivacy Sandboxのマイルストーン更新。\nサードパーティCookieの廃止は二段階で、2022後半に移行APIをリリースし、2023年半ばからサードパーティCookieを段階的に廃止していく予定。","relatedLinks":[]},{"category":"Article","title":"Let&#039;s Learn About Aspect Ratio In CSS - Ahmad Shadeed","url":"https://ishadeed.com/article/css-aspect-ratio/","tags":["CSS","article"],"content":"CSSの`aspect-ratio`プロパティの使い方やサポートしてないブラウザへの対応についてなど","relatedLinks":[]},{"category":"Article","title":"\\[TypeScript\\] 用 ts-migrate 仙女棒讓 JS 專案瞬間 migrate 成 TS | by Hannah Lin | Hannah Lin | Jun, 2021 | Medium","url":"https://medium.com/hannah-lin/%E7%94%A8-ts-migrate-%E4%BB%99%E5%A5%B3%E6%A3%92%E8%AE%93-js-%E5%B0%88%E6%A1%88%E7%9E%AC%E9%96%93migrate-%E6%88%90-typescript-75610522f1a5","tags":["JavaScript","TypeScript","article"],"content":"`ts-migrate`を使ったJavaScriptからTypeScriptへの移行についての記事。\n`ts-migrate`の基本的な使い方、個別のプラグインやソースコードの一部だけを変換していく方法について","relatedLinks":[]},{"category":"Article","title":"Demystifying styled-components","url":"https://www.joshwcomeau.com/react/demystifying-styled-components/","tags":["JavaScript","CSS","article","jsx"],"content":"styled-componetsのミニクローンを作りながら仕組みについて学ぶ記事。\nCSSOMを使ったスタイルの操作、コンポーネントのスタイル合成などについて","relatedLinks":[]},{"category":"Article","title":"Temporal: getting started with JavaScript’s new date time API","url":"https://2ality.com/2021/06/temporal-api.html","tags":["JavaScript","ECMAScript","proposal","article"],"content":"ECMAScript Proposal Stage 3のTemporalについての解説記事。\nTimes、Time zones、Calendarsの概念について、基本的なTemporal APIの使い方、ユースケースごとの使い方についてなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"uhyo/eslint-plugin-import-access","url":"https://github.com/uhyo/eslint-plugin-import-access","tags":["TypeScript","ESLint","Tools"],"content":"JSDocの`@package`相当のチェックをするESLintルール","relatedLinks":[{"title":"eslint-plugin-import-accessではじめるディレクトリ単位カプセル化","url":"https://zenn.dev/uhyo/articles/eslint-plugin-import-access"}]},{"category":"SoftwareLibrary","title":"npm/libnpmexec: npm exec (npx) Programmatic API","url":"https://github.com/npm/libnpmexec","tags":["npm","library","ReleaseNote"],"content":"`npx exec`相当の処理をするライブラリ","relatedLinks":[]},{"category":"Book","title":"Release 3.0.0: ECMAScript 2021対応 · asciidwango/js-primer","url":"https://github.com/asciidwango/js-primer/releases/tag/v3.0.0","tags":["ECMAScript","JavaScript","book","ReleaseNote"],"content":"JavaScript入門書のJavaScript Primer 3.0リリース。\nECMAScript 2021の対応など","relatedLinks":[{"title":"ES2021に対応したJavaScript Primer 3.0を公開しました - JavaScript入門 | Web Scratch","url":"https://efcl.info/2021/06/28/jsprimer-3.0/"}]}]},{"meta":{"title":"2021-07-06のJS: TypeScript 4.4 Beta、immutable-js 4.0.0-rc.13、petite-vue","author":"azu","layout":"post","date":"2021-07-05T22:36:05.800Z","category":"JSer","tags":["node.js","Chrome","WebAssembly","アンケート","Markdown"],"url":"https://jser.info/2021/07/06/typescript-4.4-beta-immutable-js-4.0.0-rc.13-petite-vue/"},"items":[{"category":"Headline","title":"Release Support caching dependencies and LTS aliases · actions/setup-node","url":"https://github.com/actions/setup-node/releases/tag/v2.2.0","tags":["Github","Actions","node.js","ReleaseNote"],"content":"`actions/setup-node` 2.2.0リリース。 `lts/*`などのLTS構文のサポート、`cache`オプションで`npm`と`yarn`での依存キャッシュをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.4 Beta | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-4-beta/","tags":["Prototype.js","ReleaseNote"],"content":"TypeScript 4.4 Betaリリース。 Control Flow Analysisの改善、Index SignaturesにSymbolやTemplate Stringを利用できるように。\nCatch節のデフォルトを`unknown`型にする`useUnknownInCatchVariables`オプションの追加。\noptionalと`undefined`値の区別をする`exactOptionalPropertyTypes`オプションの追加。\ndeclarationの生成や`strict`モードでのビルドパフォーマンスの改善も含まれている","relatedLinks":[]},{"category":"Headline","title":"Release 4.0.0-rc.13 · immutable-js/immutable-js","url":"https://github.com/immutable-js/immutable-js/releases/tag/v4.0.0-rc.13","tags":["JavaScript","library","ReleaseNote"],"content":"imutable-js 4.0.0 RC12リリース。\nforkであった`immutable-js-oss`の変更内容をマージし、コミュニティによるメンテナンスを再開するリリース。","relatedLinks":[{"title":"Immutable.js is essentially unmaintained · Issue #1689 · immutable-js/immutable-js","url":"https://github.com/immutable-js/immutable-js/issues/1689"},{"title":"Integrate immutable-js-oss fork into main repository by jdeniau · Pull Request #1833 · immutable-js/immutable-js","url":"https://github.com/immutable-js/immutable-js/pull/1833"}]},{"category":"Headline","title":"vite/CHANGELOG.md at main · vitejs/vite","url":"https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md#240-2021-07-05","tags":["JavaScript","Tools","ReleaseNote"],"content":"Vite 2.4.0リリース。\n`new URL(url, import.meta.url)`のサポート、`server.fsServe`を`server.fs`にリネーム、`server.fs.strict`オプションの追加など","relatedLinks":[{"title":"Static Asset Handling | Vite","url":"https://vitejs.dev/guide/assets.html#the-public-directory"}]},{"category":"Article","title":"The State of WebAssembly 2021","url":"https://blog.scottlogic.com/2021/06/21/state-of-wasm.html","tags":["WebAssembly","article","アンケート"],"content":"WebAssemblyについての開発者アンケート。\nどの言語を使っているか、どの用途に利用しているか、求める機能などについて","relatedLinks":[]},{"category":"Article","title":"RenderingNG - Chrome Developers","url":"https://developer.chrome.com/blog/renderingng/","tags":["Chrome","blink","article"],"content":"ChromeのレンダリングエンジンであるBlinkの新しいアーキテクチャであるRenderingNGの主要プロジェクトのまとめ記事。\nCompositeAfterPaint、LayoutNG、BlinkNG、Viz、OffscreenCanvas、VideoNGなどについて","relatedLinks":[]},{"category":"Article","title":"Migrating from Capybara to Puppeteer - Engineering Blog - Wealthfront","url":"https://eng.wealthfront.com/2021/06/25/migrating-from-capybara-to-puppeteer/","tags":["puppeteer","Chrome","testing","article"],"content":"E2EテストをCapybaraからPuppeteerに移行した話。\nE2Eテストフレームワークの選択と、移行する目的であった実行時間の短縮について","relatedLinks":[]},{"category":"Article","title":"Designing a Dataflow Editor With TypeScript and React | Protocol Labs Research","url":"https://research.protocol.ai/blog/2021/designing-a-dataflow-editor-with-typescript-and-react/","tags":["TypeScript","React","article","ElasticSearch"],"content":"ReactとTypeScriptでデータフローエディタを作る際の設計についての記事。\nデータフローの状態の設計、スキーマオブジェクトから各Nodeの型定義を取り出す仕組みをGenericsを使って扱う方法について。","relatedLinks":[{"title":"joeltg/react-dataflow-editor","url":"https://github.com/joeltg/react-dataflow-editor"}]},{"category":"Article","title":"Encoding data for POST requests - JakeArchibald.com","url":"https://jakearchibald.com/2021/encoding-data-for-post-requests/","tags":["JavaScript","article"],"content":"Fetchのbodyに安全にエンコードしたデータを渡す方法について。\n`URLSearchParams`、`FormData`、`blob`、JSONを使った方法について紹介している","relatedLinks":[]},{"category":"Article","title":"Image To Text Conversion With React And Tesseract.js (OCR) — Smashing Magazine","url":"https://www.smashingmagazine.com/2021/06/image-text-conversion-react-tesseract-js-ocr/","tags":["JavaScript","article"],"content":"Tesseract.jsを使った画像のOCRとCanvasを使った下処理についての記事。","relatedLinks":[]},{"category":"WebsiteDocument","title":"vuejs/petite-vue: 5kb subset of Vue optimized for progressive enhancement","url":"https://github.com/vuejs/petite-vue","tags":["Vue","library","JavaScript"],"content":"VueサブセットのAPIとテンプレートをもったライブラリ。\nファイルサイズを小さくすることを目的にしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Saul-Mirone/milkdown: 🍼 Plugin driven WYSIWYG markdown editor.","url":"https://github.com/saul-mirone/milkdown/","tags":["Markdown","JavaScript","editor","library"],"content":"ProsemirrorとremarkベースのWYSIWYG markdownエディタライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"niksy/promise-any-ponyfill: \\`Promise.any\\` ponyfill.","url":"https://github.com/niksy/promise-any-ponyfill","tags":["JavaScript","Promises","polyfill"],"content":"`Promise.any`のpolyfillライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tinyhttp/malibu: 🏄 Framework-agnostic CSRF middleware for modern Node.js","url":"https://github.com/tinyhttp/malibu","tags":["node.js","library"],"content":"CSRF対策のexpress middleware。","relatedLinks":[]}]},{"meta":{"title":"2021-07-14のJS: Firefox 90、npm auditの問題、Access Guide","author":"azu","layout":"post","date":"2021-07-14T03:24:13.966Z","category":"JSer","tags":["node.js","Next.js","npm","TypeScript","Tools"],"url":"https://jser.info/2021/07/14/firefox-90-npm-audit-access-guide/"},"items":[{"category":"Headline","title":"html2canvas/CHANGELOG.md at master · niklasvh/html2canvas","url":"https://github.com/niklasvh/html2canvas/blob/master/CHANGELOG.md#100-2021-07-04","tags":["JavaScript","canvas","library","ReleaseNote"],"content":"HTMLをCanvasにしてスクリーンショットを取るhtml2canvas 1.0.0リリース","relatedLinks":[]},{"category":"Headline","title":"Release v8.0.0 · nestjs/nest","url":"https://github.com/nestjs/nest/releases/tag/v8.0.0","tags":["node.js","library","ReleaseNote"],"content":"Nest.js 8.0.0リリース。\nLoggerクラスの改善、API Versioningのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 8.9.2 · mermaid-js/mermaid","url":"https://github.com/mermaid-js/mermaid/releases/tag/8.9.2","tags":["JavaScript","diagram","library","ReleaseNote","security"],"content":"mermaid 8.9.2で `%%{init: {<JSON_OBJECT>}}%%` の設定記法を使ったXSS脆弱性とPrototype pollutionの脆弱性が修正されている。","relatedLinks":[{"title":"#1106238 Client-Side DOS via Mermaid Prototype Pollution vulnerability","url":"https://hackerone.com/reports/1106238"}]},{"category":"Headline","title":"Firefox 90.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/90.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 90リリース。\nES Proposal Stage 4のPrivate class fieldsをデフォルトでサポート、Stage 3のString/Arrayの`at()`をサポート。\nFTPサポートの削除、WheelEventの互換性を改善など","relatedLinks":[{"title":"Firefox 90 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/90"},{"title":"tc39/proposal-relative-indexing-method: A TC39 proposal to add an .at() method to all the basic indexable classes (Array, String, TypedArray)","url":"https://github.com/tc39/proposal-relative-indexing-method"}]},{"category":"Headline","title":"Release 2.27.0 · prisma/prisma","url":"https://github.com/prisma/prisma/releases/tag/2.27.0","tags":["TypeScript","node.js","MongoDB","ReleaseNote"],"content":"Node.js向けのORMであるPrisma 2.27.0リリース。\nMongoDBをプレビューサポート、M1 Macのサポート、pnpmでインストールできない問題を修正など","relatedLinks":[{"title":"Start from scratch with MongoDB (15 min) | Prisma Docs","url":"https://www.prisma.io/docs/getting-started/setup-prisma/start-from-scratch/mongodb-typescript-mongodb"}]},{"category":"Article","title":"How does Node.js load its built-in/native modules? | Joyee Cheung&#039;s Blog","url":"https://joyeecheung.github.io/blog/2021/07/06/how-does-node-js-load-its-builtins-native-modules/","tags":["node.js","article"],"content":"Node.js内のJavaScriptで書かれたビルトインモジュールは、Node.jsバイナリにどのように保存されて読み込まれているかについて。\nバイナリファイルの読み取り専用のデータセクションに保存されており、bootstrapでV8を使ってコンパイルやSnapshotsを扱う仕組みをもっている。","relatedLinks":[]},{"category":"Article","title":"Resource inlining in JavaScript frameworks","url":"https://web.dev/aurora-resource-inlining/","tags":["Next.js","Angular","CSS","performance","article"],"content":"Next.jsとAngularのGoogle FontsのCritical CSSのインライン化について。\nFontをロードするCSSをインライン化することでCLSの最適化ができるという話","relatedLinks":[]},{"category":"Article","title":"npm audit: Broken by Design — Overreacted","url":"https://overreacted.io/npm-audit-broken-by-design/","tags":["npm","node.js","library","opinion","article"],"content":"devDependenciesとして使うツールにおけるnpm auditの報告のほとんどがReDoSの脆弱性になってしまっている問題について。\n本番で動くdependenciesのみをチェックする`npm audit --production`、公開するパッケージをインライン化する方法とその問題、エコシステムへの問題提起的な記事","relatedLinks":[]},{"category":"Article","title":"TypeScript and native ESM on Node.js","url":"https://2ality.com/2021/06/typescript-esm-nodejs.html","tags":["TypeScript","npm","node.js","article"],"content":"TypeScriptでのESMの対応方法について。\n`package.json`の`\"type\": \"module\"`設定、`exports`フィールドと`typesVersions`フィールド、`import`するファイルの拡張子設定などについて","relatedLinks":[]},{"category":"Article","title":"jQueryからTypeScript・Reactまで - Viteで始めるモダンで高速な開発環境構築 - ICS MEDIA","url":"https://ics.media/entry/210708/","tags":["Tools","article"],"content":"Viteの基本的な使い方についての記事。\nライブラリ、TypeScript、画像などのアセットの利用、設定ファイル、IE11対応についてなど","relatedLinks":[]},{"category":"Article","title":"Firefox 90 supports Fetch Metadata Request Headers - Mozilla Security Blog","url":"https://blog.mozilla.org/security/2021/07/12/firefox-90-supports-fetch-metadata-request-headers/","tags":["Firefox","security","article"],"content":"Firefox 90でFetch Metadata Request Headersをサポート。\n`Sec-Fetch-Site`などの`Sec-Fetch-*`のリクエストヘッダをサポートしている","relatedLinks":[{"title":"Protect your resources from web attacks with Fetch Metadata","url":"https://web.dev/fetch-metadata/"}]},{"category":"WebsiteDocument","title":"Access Guide","url":"https://accessguide.io/","tags":["accessibility","document"],"content":"WCAG 2.1の解説サイト。\nどのように実装するか、どのようにテストするか、実際の例について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Javascript Decorators","url":"https://javascriptdecorators.org/","tags":["JavaScript","ECMAScript","proposal","Tools","debug"],"content":"ECMAScript ProposalのDecoratorsを試せるPlaygroundツール","relatedLinks":[{"title":"tc39/proposal-decorators: Decorators for ES6 classes","url":"https://github.com/tc39/proposal-decorators"}]},{"category":"SoftwareLibrary","title":"FrontLabsOfficial/vue-tiny-validate: 💯 Tiny (2.5KB minified) Vue Validate Composition","url":"https://github.com/FrontLabsOfficial/vue-tiny-validate","tags":["Vue","library"],"content":"Vue Composition API向けのバリデーションライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lucacasonato/dext.ts: The Preact Framework for Deno","url":"https://github.com/lucacasonato/dext.ts","tags":["deno","Next.js"],"content":"Deno向けのNext.jsをインスパイアしたPreactを使ったウェブフレームワーク。","relatedLinks":[]},{"category":"Book","title":"O&#039;Reilly Japan - 初めてのWebGL 2 第2版","url":"https://www.oreilly.co.jp/books/9784873119373/","tags":["WebGL","JavaScript","book"],"content":"2021年07月21日発売\nWebGLの入門書","relatedLinks":[]}]},{"meta":{"title":"2021-07-20のJS: Node.js 16.5.0(WHATWG Stream)、npm 7.20.0(`npm pkg`)、Ember 4のロードマップ","author":"azu","layout":"post","date":"2021-07-20T02:16:58.055Z","category":"JSer","tags":["node.js","Vue","ECMAScript","proposal","CSS"],"url":"https://jser.info/2021/07/20/node.js-16.5.0whatwg-stream-npm-7.20.0npm-pkg-ember-4/"},"items":[{"category":"Headline","title":"Node v16.5.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v16.5.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 16.5.0リリース。\nWHATWG Stream APIを試験的にサポート。","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0 · vuejs/composition-api","url":"https://github.com/vuejs/composition-api/releases/tag/v1.0.0","tags":["Vue","library","ReleaseNote"],"content":"Vue 2向けのComposition APIを提供する@vue/composition-api 1.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release v7.20.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v7.20.0","tags":["npm","ReleaseNote"],"content":"npm 7.20.0リリース。\n`package.json`の値を読み書きできる`npm pkg`コマンドの追加、`npm config`に`--location`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0 · riot/riot","url":"https://github.com/riot/riot/releases/tag/v6.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"Riot.js 6.0.0リリース。\nTypeScriptでcastがエラーとなる問題の修正、より厳密な型定義へ変更など","relatedLinks":[]},{"category":"Headline","title":"Deno 1.12 Release Notes | Deno Blog","url":"https://deno.com/blog/v1.12","tags":["deno","ReleaseNote"],"content":"Deno 1.12リリース。\nWeb Crypto APIの改善、REPLでTypeScriptのコードとimport文のサポート、`MessagePort`と`MessageChannel`のサポート。\n`deno test`に`--shuffle`と`--fail-test`の追加、`fetch`にProxyするための`client`オプションの追加。\n`WeakRef`のバグ修正、Chrome DevToolsの対応改善など","relatedLinks":[{"title":"Release v1.12.0 · denoland/deno","url":"https://github.com/denoland/deno/releases/tag/v1.12.0"},{"title":"Deno 1.12.0 がリリースされたので新機能や変更点の紹介","url":"https://zenn.dev/magurotuna/articles/deno-release-note-1-12-0"}]},{"category":"Headline","title":"ECMAScript proposal updates @ 2021-07 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2021/07/19/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2021年7月のTC39 MeetingでStageが変更されたProposalのまとめ。\nPrivate FieldsのBrand ChecksがStage 4へ、RealmsがStage 3となった","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · mongodb/node-mongodb-native","url":"https://github.com/mongodb/node-mongodb-native/releases/tag/v4.0.0","tags":["node.js","MongoDB","library","ReleaseNote"],"content":"MongoDB Node.js Driver 4.0リリース。\nMongoDB 5.0をサポート。\nTime Series Collectionsをサポート、SecondaryでSnapshotの読み取りをサポートなど","relatedLinks":[{"title":"Launched Today: MongoDB 5.0, Serverless Atlas, and the Evolution of our Application Data Platform | MongoDB","url":"https://www.mongodb.com/blog/post/launched-today-mongodb-5-0-serverless-atlas-evolution-application-data-platform"}]},{"category":"Article","title":"Vue 3 Migration Build: safely upgrade your app to Vue 3 (Pt. 1) | Vue Mastery","url":"https://www.vuemastery.com/blog/vue-3-migration-build/","tags":["Vue","article"],"content":"`@vue/compat`を使ったVue 3へのマイグレーションについての記事","relatedLinks":[]},{"category":"Article","title":"The Road to Ember 4.0","url":"https://blog.emberjs.com/the-road-to-ember-4-0/","tags":["Ember","JavaScript","article"],"content":"Ember 4.0のロードマップについて。\nEmber 4は2021年9月20日にリリース予定。\nEmberのメジャーアップデートには新しい機能は含まないため、DeprecatedなAPIの削除、Ember Classicが廃止となりOctaneへのアップデートを推奨。\nまた、IEのサポートを終了予定。","relatedLinks":[]},{"category":"Article","title":"The performance effects of too much lazy-loading","url":"https://web.dev/lcp-lazy-loading/","tags":["performance","article"],"content":"HTTP Archiveのデータによる`loading=lazy`はウェブサイトの17%で使われていて、その大部分はWordPressのサイトとなっている。\nWordPressのサイトはLazy LoadingをAbove the foldな画像に対しても行っていたため、Lazy Loadしない場合に比べてLCPが悪化している問題について。","relatedLinks":[]},{"category":"SlideVideo","title":"tc39\\_study\\_2 - Speaker Deck","url":"https://speakerdeck.com/jxck/tc39-study-2","tags":["ECMAScript","proposal","slide"],"content":"ECMAScript Proposal紹介の詰め合わせ的なスライド","relatedLinks":[]},{"category":"WebsiteDocument","title":"mrbbot/miniflare: 🔥 Fully-local Cloudflare Workers Simulator","url":"https://github.com/mrbbot/miniflare","tags":["cloudflare","debug"],"content":"Cloudflare Workersのローカルで動くシミュレータツール。\nローカル開発時に`wrangler dev`の代わりとして利用できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"elad2412/the-new-css-reset: The New Simple and Lighter CSS Reset","url":"https://github.com/elad2412/the-new-css-reset","tags":["CSS","library"],"content":"`unset`や`:where`などの新しい機能を使ったCSS resetライブラリ","relatedLinks":[{"title":"劇薬の The New CSS Reset | Web Design KOJIKA17","url":"https://kojika17.com/2021/07/css-for-strong-poison.html"}]},{"category":"SoftwareLibrary","title":"grafana/k6: A modern load testing tool, using Go and JavaScript - https://k6.io","url":"https://github.com/grafana/k6","tags":["golang","JavaScript","TEST"],"content":"GoとJavaScriptを使った負荷テストツール。\nJavaScriptでスクリプトを書いて、負荷/性能テストができる。","relatedLinks":[{"title":"Our exciting next step - k6 is now part of Grafana Labs!","url":"https://k6.io/blog/joining-grafana-labs/"}]}]},{"meta":{"title":"2021-07-27のJS: vscode-js-debug、 Privacy Sandbox Timeline、小さなブラウザの作り方","author":"azu","layout":"post","date":"2021-07-27T12:52:36.749Z","category":"JSer","tags":["node.js","browser","security","Tools","Chrome"],"url":"https://jser.info/2021/07/27/vscode-js-debug-privacy-sandbox-timeline-/"},"items":[{"category":"Headline","title":"Version 2.0 released : Node-RED","url":"https://nodered.org/blog/2021/07/20/version-2-0-released","tags":["node.js","ReleaseNote"],"content":"IoTデバイスなどを扱うビジュアルプログラミング環境のNode-RED 2.0.0リリース。","relatedLinks":[{"title":"Release 2.0.0: Milestone Release · node-red/node-red","url":"https://github.com/node-red/node-red/releases/tag/2.0.0"}]},{"category":"Article","title":"URLPattern brings routing to the web platform","url":"https://web.dev/urlpattern/","tags":["JavaScript","Chrome","WebPlatformAPI","article"],"content":"path-to-regexpのようにURLのパターンマッチを扱う`URLPattern`オブジェクトについて。\n基本的な使い方、キャプチャ、ブラウザサポートとPolyfillについて","relatedLinks":[]},{"category":"Article","title":"Easier browser debugging with Developer Tools integration in Visual Studio Code - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2021/07/16/easier-debugging-developer-tools-in-visual-studio-code/","tags":["VSCode","browser","debug","article"],"content":"VSCodeからChromeとMSEdgeのDebuggerに接続するvscode-js-debug拡張について。\nDAP(Debug Adapter Protocol)のProtocol Adapterを使い、VScodeからブラウザのデバッグに接続している。","relatedLinks":[{"title":"microsoft/vscode-js-debug: The VS Code JavaScript debugger","url":"https://github.com/microsoft/vscode-js-debug"}]},{"category":"Article","title":"Fastly Launches New Era of Highly-Secure Serverless JavaScript With Zero Cold Starts | Fastly","url":"https://www.fastly.com/press/press-releases/fastly-launches-new-era-of-highly-secure-serverless-javascript-with-zero","tags":["WebAssembly","cdn","JavaScript","article"],"content":"FastlyのCompute@EdgeがJavaScriptをサポート","relatedLinks":[{"title":"JS on Wasm with Nick Fitzgerald (JS Party #183) |","url":"https://changelog.com/jsparty/183"}]},{"category":"Article","title":"How to Eliminate Render-Blocking Resources: a Deep Dive","url":"https://sia.codes/posts/render-blocking-resources/","tags":["JavaScript","CSS","browser","performance","article"],"content":"レンダリングブロッキングの要素となるJavaScriptとCSSについて。\nレンダリングブロックされるとどのようにパフォーマンスへ影響があるのか、WebPageTestを使った確認方法、レンダリングブロッキングの削除方法についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"Privacy Sandbox Timeline","url":"https://privacysandbox.com/timeline/","tags":["Chrome","privacy","document"],"content":"Privacy Sandboxのロードマップとタイムライン","relatedLinks":[]},{"category":"WebsiteDocument","title":"nicoespeon/abracadabra: Automated refactorings for VS Code (JS &amp; TS) ✨ It&#039;s magic ✨","url":"https://github.com/nicoespeon/abracadabra","tags":["VSCode","refacoring","plugin","JavaScript"],"content":"JavaScriptとTypeScriptのリファクタリングを補助するVSCode拡張。\nWebStormのようにコードのQuick Fixを提供している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Tak-Iwamoto/ptera: Ptera is DateTime library for Deno","url":"https://github.com/Tak-Iwamoto/ptera","tags":["deno","JavaScript","library"],"content":"Deno向けの日付操作ライブラリ","relatedLinks":[{"title":"DenoのDateTimeライブラリPteraをリリースしました","url":"https://zenn.dev/tak_iwamoto/articles/8b32b27bd577b1"}]},{"category":"SoftwareLibrary","title":"ajitid/fzf-for-js: Do fuzzy matching using FZF algorithm in JavaScript","url":"https://github.com/ajitid/fzf-for-js","tags":["JavaScript","library","search"],"content":"コマンドラインツール向けの曖昧(あいまい)検索であるFZFのアルゴリズムをJavaScriptに移植したライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ES-Community/nsecure: Node.js security CLI / API that allow you to deeply analyze the dependency tree of a given package / directory","url":"https://github.com/ES-Community/nsecure","tags":["node.js","npm","security","Tools"],"content":"ディレクトリや特定のパッケージのnpmパッケージへの依存を分析するツール。\nコードをパースして、利用しているnpmパッケージのメタデータ、ライセンス、セキュリティ情報などの一覧を取得する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tangramxyz/tangram: Tangram is an all-in-one automated machine learning framework.","url":"https://github.com/tangramxyz/tangram","tags":["MachineLearning","library","Rust","JavaScript","ruby ","python","golang"],"content":"機械学習フレームワーク。\nコマンドラインで学習したモデルを作成し、各種言語のFFIなライブラリから予測ができる。\nJavaScriptにWasmビルドを公開している。\nまたモデルのパフォーマンスダッシュボードをブラウザで見れるようになっている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"udecode/plate: A plugin framework for building rich text editors with slate.","url":"https://github.com/udecode/plate","tags":["JavaScript","editor","React","library"],"content":"slateベースのリッチテキストエディタライブラリ。\nプラグインで機能を追加できるようになっていて、さまざまなプラグインが用意されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"actuallyakash/spacers: 🔳 when you need more \\_\\_space\\_\\_","url":"https://github.com/actuallyakash/spacers","tags":["JavaScript","library"],"content":"D&Dで要素に対してpaddingやmarginなどのスペースを設定できるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"davewasmer/devcert: Local HTTPS development made easy","url":"https://github.com/davewasmer/devcert","tags":["node.js","SSL","debug","Tools"],"content":"ローカルで開発用のHTTPSサーバの作成を補助するライブラリ。\n任意のドメインに対する証明書の作成、マシンへのルート証明書のインストールなどローカルでHTTPSサーバを起動するのを補助するツール。","relatedLinks":[]},{"category":"Book","title":"ちいさな Web ブラウザを作ってみよう","url":"https://browserbook.shift-js.info/","tags":["browser","book","Rust","security"],"content":"Rustでウェブブラウザを作りつつ、ブラウザのレンダリングの仕組み、全体の流れ、セキュリティについて学習する教材。","relatedLinks":[]}]},{"meta":{"title":"2021-08-03のJS: Yarn 3.0、Chrome 93 beta、cross origin iframeでのalert/prompt/confirmを削除","author":"azu","layout":"post","date":"2021-08-03T03:38:52.177Z","category":"JSer","tags":["React","node.js","Chrome","DOM","browser"],"url":"https://jser.info/2021/08/03/yarn3-chrome93-beta-deprecate-alert/"},"items":[{"category":"Headline","title":"Headless UI v1.4: The One With Tabs – Tailwind CSS","url":"https://blog.tailwindcss.com/headless-ui-v1-4","tags":["React","Vue","JavaScript","library","ReleaseNote"],"content":"Headless UI 1.4リリース。\nTagコンポーネントの追加、`Disclosures`と`Popover`のPanel内に`Button`を置くとPanelを閉じれるように","relatedLinks":[]},{"category":"Headline","title":"Yarn 3.0 🚀🤖 Performances, ESBuild, Better Patches, ... - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/arcanis/yarn-3-0-performances-esbuild-better-patches-e07","tags":["yarn","ReleaseNote"],"content":"Yarn 3.0リリース。\nNode.js 10のサポート終了、`.pnp.cjs`にリネーム、`@yarnpkg/pnpify`を3つのパッケージに分解など。\n`exports`フィールドのサポート、pnpmライクなハードリンクのサポート、シェル構文のサポート改善、 ESBuildのサポートなど","relatedLinks":[{"title":"berry/CHANGELOG.md at master · yarnpkg/berry","url":"https://github.com/yarnpkg/berry/blob/master/CHANGELOG.md#300"}]},{"category":"Headline","title":"Release 3.16.0 - 2021.07.30 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.16.0","tags":["JavaScript","polyfill","library","ReleaseNote"],"content":"core.js 3.16.0リリース。\nStage 3の`Array#findLast`、Stage 1の`Array#filterOut`と`Array#groupBy`のサポート。\nDenoのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node v16.6.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v16.6.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 16.6.0リリース。\nV8 9.2へアップデート、`http2`のセキュリティ修正など","relatedLinks":[{"title":"V8 release v9.2 · V8","url":"https://v8.dev/blog/v8-release-92"}]},{"category":"Headline","title":"Recoil 0.4 | Recoil","url":"https://recoiljs.org/blog/2021/07/30/0.4.0-release/","tags":["React","JavaScript","library","ReleaseNote"],"content":"Recoil 0.4リリース。\nキャッシュポリシーを`cachePolicy_UNSTABLE`で設定できるように、トランザクションをする`useRecoilTransaction_UNSTABLE`で利用できるように。\nTypeScriptの型改善など","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 93: Multi-Screen Window Placement, PWAs as URL Handlers, and More","url":"https://blog.chromium.org/2021/07/chrome-93-multi-screen-window-placement.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 93 betaリリース。\nOrigin Trialとして`Cross-Origin-Embedder-Policy：credentialless`、URL Handlersの追加など。\n`AbortSignal.abort()`メソッドのサポート、Stage 3のError causeと`Object.hasOwn`のサポート。\nClient Hint Headerの`Sec-CH-Prefers-Color-Scheme`の追加やUA Client Hintの更新など","relatedLinks":[]},{"category":"Headline","title":"1065085 - Implement window.\\{alert, prompt, confirm\\} removal from cross-origin iframes - chromium","url":"https://bugs.chromium.org/p/chromium/issues/detail?id=1065085","tags":["Chrome","security","DOM","news"],"content":"Chrome 92でcross origin iframeからのalert/dialog/promptが無効化された。\n回避方法として、Chrome 96まで有効なReverse Origin Trial、ダイアログUIを自作する方法、postMessageを使って親ドキュメントでダイアログを出す方法など。","relatedLinks":[{"title":"Remove alert(), confirm(), and prompt for cross origin iframes - Chrome Platform Status","url":"https://www.chromestatus.com/feature/5148698084376576"},{"title":"Proposal: Disallow cross-origin iframes usage of window.","url":"https://github.com/whatwg/html/issues/5407"},{"title":"google chrome - JavaScript dialogs alert(), confirm() and prompt() in cross origin iframe does not work any longer - Stack Overflow","url":"https://stackoverflow.com/questions/68492434/javascript-dialogs-alert-confirm-and-prompt-in-cross-origin-iframe-does-n"},{"title":"Chrome Enterprise release notes - Google Chrome Enterprise Help","url":"https://support.google.com/chrome/a/answer/7679408#92&zippy=%2Cchrome"},{"title":"Intent to Remove: Cross origin subframe JS Dialogs","url":"https://groups.google.com/a/chromium.org/g/blink-dev/c/hTOXiBj3D6A/m/gFXmgIz9AwAJ"},{"title":"Cross Origin iframe からの alert/confirm/prompt 呼び出しの無効化 | blog.jxck.io","url":"https://blog.jxck.io/entries/2021-08-02/3rd-party-iframe-dialog.html"}]},{"category":"Headline","title":"Release Version 16.7.0 · jsdom/jsdom","url":"https://github.com/jsdom/jsdom/releases/tag/16.7.0","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"jsdom 16.7.0リリース。\n`AbortSignal.abort()`のサポート、`getBoundingClientRect()`の返り値に`x`と`y`を追加。\n`<textarea>`の改行コードのノーマライゼーションを仕様に準拠するように変更など","relatedLinks":[{"title":"The WHATWG Blog — Newline normalizations in form submission","url":"https://blog.whatwg.org/newline-normalizations-in-form-submission"}]},{"category":"Article","title":"How do Chrome extensions impact browser performance?","url":"https://www.debugbear.com/blog/chrome-extension-performance-2021","tags":["browser","Extension","performance","article"],"content":"ブラウザ拡張がウェブサイトのパフォーマンスにどのように影響を与えているかについての記事。\nCPU負荷、初回のレンダリングへの影響、バックグラウンでのCPU処理、、メモリ消費量。\nまたAdBlocker系とデータ量やメモリ消費量の削減について","relatedLinks":[]},{"category":"Article","title":"WebView2 and Electron | Electron Blog","url":"https://www.electronjs.org/blog/webview2","tags":["Electron","windows","article"],"content":"ElectronとWindowsのWebView2のアーキテクチャ的な違いについて。","relatedLinks":[]},{"category":"Article","title":"GraphQLクライアントにurqlをおすすめしたい","url":"https://zenn.dev/adwd/articles/f4c5c5120467bb","tags":["JavaScript","GraphQL","article"],"content":"GraphQLクライアントライブラリのurqlについて。\nレスポンスをキャッシュの仕組みとキャッシュを破棄する仕組みについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"BlueBlazin/thislang: An implementation of a subset of javascript in that subset of javascript.","url":"https://github.com/BlueBlazin/thislang","tags":["JavaScript","AST","language"],"content":"JavaScriptでのJavaScript subsetの実装。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"arcanis/clipanion: Type-safe CLI library with no runtime dependencies","url":"https://github.com/arcanis/clipanion","tags":["JavaScript","node.js","console","library","TypeScript"],"content":"CLI向けのコマンドライン引数パーサライブラリ。\nネストされたコマンドのサポート、typanionと連携したバリデーション、ヘルプのサポートなど。\nYarnで利用されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"crcn/sift.js: Use Mongodb queries in JavaScript","url":"https://github.com/crcn/sift.js","tags":["JavaScript","library"],"content":"JavaScriptのオブジェクトに対してMongoDB Queryライクな構文や演算子で検索できるライブラリ","relatedLinks":[]}]},{"meta":{"title":"2021-08-10のJS: pnpm 6.12.0、webpack 5.49.0(import http resource)、Vue 3.2","author":"azu","layout":"post","date":"2021-08-10T03:10:09.601Z","category":"JSer","tags":["React","CSS","npm","book","MSEdge"],"url":"https://jser.info/2021/08/10/pnpm-6.12.0-webpack-5.49.0import-http-resource-vue-3.2/"},"items":[{"category":"Headline","title":"Release v6.12.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v6.12.0","tags":["npm","ReleaseNote"],"content":"pnpm 6.12.0リリース。\n`pnpm env use --global <version>`でNode.jsをインストールして利用できるように。\nNode.jsのバージョン管理ツールとしてpnpmを利用できるように","relatedLinks":[{"title":"Using pnpm as a Node.js version manager · Discussion #3434 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/discussions/3434"}]},{"category":"Headline","title":"Bootstrap 5.1.0 | Bootstrap Blog","url":"https://blog.getbootstrap.com/2021/08/04/bootstrap-5-1-0/","tags":["CSS","library","ReleaseNote"],"content":"Bootstrap 5.1.0リリース。\n新しいCSS Gridの仕組みをオプトインで使えるように、Placeholdersの追加、Horizontal collapseのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v5.49.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.49.0","tags":["webpack","ReleaseNote"],"content":"webpack 5.49.0リリース。\nimportでhttp(s)なURLをモジュールを読み込める`experiments.buildHttp`オプションの追加。\nダウンロードしたモジュールは`webpack.lock.data/**`以下に保存され、`webpack.lock`でのロックファイルで管理される。","relatedLinks":[{"title":"add ","url":"https://github.com/webpack/webpack/pull/13925"},{"title":"Experiments","url":"https://github.com/webpack/webpack/projects/9"}]},{"category":"Headline","title":"V8 release v9.3 · V8","url":"https://v8.dev/blog/v8-release-93","tags":["V8","JavaScript","ReleaseNote"],"content":"V8 9.3リリース。\nJITコンパイラのSparkplugにBatch Compilationを導入してコンパイル速度の改善。\n`Object.hasOwn`、Error Causeのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release V1.1.0 - Interrupting Cow · solidjs/solid","url":"https://github.com/solidjs/solid/releases/tag/v1.1.0","tags":["JavaScript","library","ReleaseNote"],"content":"Solid 1.1.0リリース。\nhydrateに対応した`createUniqueId`の追加、ObservableなどをSignalに変換する`from`の追加。\n`enabledScheduling`でConcurrent RenderingとTransition時の割り込み処理のサポート、`startTransition`の追加など","relatedLinks":[]},{"category":"Headline","title":"Vue 3.2 Released! | The Vue Point","url":"https://blog.vuejs.org/posts/vue-3.2.html","tags":["Vue","ReleaseNote"],"content":"Vue 3.2リリース。\n`<script setup>`と`<style>`での`v-bind`をStableに変更、`defineCustomElement`でCustom Elementを作成できるようになる。\nまたRuntimeとCompileのパフォーマンス改善、Node.js環境に依存しないSSRのStream APIの追加など","relatedLinks":[{"title":"vue-next/CHANGELOG.md at master · vuejs/vue-next","url":"https://github.com/vuejs/vue-next/blob/master/CHANGELOG.md#320-2021-08-09"}]},{"category":"Article","title":"Super Duper Secure Mode | Microsoft Browser Vulnerability Research","url":"https://microsoftedge.github.io/edgevr/posts/Super-Duper-Secure-Mode/","tags":["MSEdge","security","article"],"content":"V8のCVEのうち45%がJITに関連するものであり、それを防ぐためのJIT lessモードであるSuper Duper Secure Mode（SDSM）について。\nJITのありなしでのパフォーマンスの違いについてなど","relatedLinks":[]},{"category":"Article","title":"JavaScript needs more helper functions for iteration (map, filter, etc.) – where should we put them?","url":"https://2ality.com/2021/08/iteration-helpers.html","tags":["JavaScript","ECMAScript","article"],"content":"IterableなオブジェクトをIterationするためのアプローチについての記事","relatedLinks":[]},{"category":"Article","title":"Chrome DevToolsのRenderingタブを活用しよう | フロントエンドBlog | ミツエーリンクス","url":"https://www.mitsue.co.jp/knowledge/blog/frontend/202107/28_1056.html","tags":["Chrome","debug","article"],"content":"Chrome DevToolsのRenderingタブの機能紹介記事","relatedLinks":[]},{"category":"SlideVideo","title":"Preact 2021 - What if? @Trivago - Google スライド","url":"https://docs.google.com/presentation/d/1sZyETbDiacqAznlEGEpfyPz0q37Q-12bOB5Mq3OtyKQ/edit#slide=id.p","tags":["React","slide"],"content":"Preactの今後についてのスライド。\nIEのサポートを切ってworkaroundsコードの削除、再帰ではなくループを使うことでコールスタックの改善、コマンドパターンでの処理といった新しいレンダラーの構想について。\ndeoptimizationをなくすことでパフォーマンスを改善していく","relatedLinks":[]},{"category":"WebsiteDocument","title":"Replacing Sass · Discussion #44 · Shopify/polaris","url":"https://github.com/Shopify/polaris/discussions/44","tags":["CSS","opinion","issue"],"content":"ShopifyのDesign SystemであるPolarisにおけるCSSフレームワークの選定についての議論。\nSassを置き換えるためにTailwind CSS、CSS Modules、Stitches、vanilla-extractを比較している。\nvanilla-extractを有力候補として選択している。","relatedLinks":[{"title":"Solution analysis for Polaris Foundations - Google スプレッドシート","url":"https://docs.google.com/spreadsheets/d/1rxrRTlbNWiLVu-Q5IK7xh5O1FmWcjyAS2XN7jiPrhYM/edit#gid=0"}]},{"category":"Book","title":"O&#039;Reilly Japan - Reactハンズオンラーニング 第2版","url":"https://www.oreilly.co.jp/books/9784873119380/","tags":["React","book","JavaScript"],"content":"Learning React, 2nd Editionの翻訳本","relatedLinks":[]}]},{"meta":{"title":"2021-08-17のJS: Next.js 11.1、Rails 7で予定されているimport mapsベースのJSライブラリの利用","author":"azu","layout":"post","date":"2021-08-16T23:06:44.280Z","category":"JSer","tags":["node.js","Vue","performance","CSS","security"],"url":"https://jser.info/2021/08/17/next.js-11.1-rails-7import-mapsjs/"},"items":[{"category":"Headline","title":"August 2021 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/aug-2021-security-releases/","tags":["node.js","security","ReleaseNote"],"content":"Node.jsのセキュリティアップデート。\nそれぞれ対応するNode v12.22.5 (LTS)、 Node v14.17.5 (LTS)、Node v16.6.2がリリースされている。\nDNSライブラリc-aresのセキュリティ修正、`http2`のstreamを閉じた際のUse after freeの修正。\n`rejectUnauthorized`に`undefined`を渡すと期限切れの証明書を受け付けていた問題の修正など","relatedLinks":[]},{"category":"Headline","title":"Hopping on Firefox 91 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2021/08/hopping-on-firefox-91/","tags":["Firefox","ReleaseNote"],"content":"Firefox 91リリース。\nVisual Viewport API、Intl.DateTimeFormatの改善、Error Causeのサポートなど。\nまたGamepad APIがSecure Contextでのみ動作するようになる変更など","relatedLinks":[{"title":"Firefox 91.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/91.0/releasenotes/"},{"title":"Firefox 91 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/91"}]},{"category":"Headline","title":"Blog - Next.js 11.1 | Next.js","url":"https://nextjs.org/blog/next-11-1","tags":["Next.js","ReleaseNote"],"content":"Next.js 11.1リリース。\nオープンリダイレクタの脆弱性の修正、experimentalでNode.jsのESMをサポート。\n`node-fetch`のkeepAliveをデフォルトで有効化、Source Map/ESLint/`next/image`の改善など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.4 RC | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-4-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.4 RCリリース。\nControl Flow Analysisの改善、Index SignaturesにSymbolやTemplate Stringを利用できるように。\nCatch節のデフォルトを`unknown`型にする`useUnknownInCatchVariables`オプションの追加。\noptionalと`undefined`値の区別をする`exactOptionalPropertyTypes`オプションの追加。\nまた、ES Proposal Stage 3のclass static blockをサポート。\ndeclarationの生成や`strict`モードでのビルドパフォーマンスの改善も含まれている","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0 · vueuse/vueuse","url":"https://github.com/vueuse/vueuse/releases/tag/v6.0.0","tags":["Vue","ReleaseNote","library"],"content":"vueuse 6.0.0リリース。\nVue 3.2の`effectScope` APIに対応、`createSharedComposable`/`toReactive`/`useEventBus`の追加。\n`useStorage`にonErrorコールバックの追加など","relatedLinks":[]},{"category":"Article","title":"JavaScript Development: Making a Web Worker optional | by Tobias Uhlig | Aug, 2021 | ITNEXT","url":"https://itnext.io/javascript-development-making-a-web-worker-optional-f23a13490b28","tags":["JavaScript","webworker","article"],"content":"重たいロジックを別のWeb Workerで分けることには意味があるが、スレッドがほとんどアイドル状態の場合にWorkerを分けるとpostMessage分の遅延が発生してしまう。\nWorkerとして分けて実行していた処理を、同じAPIを維持しつつ同じスレッドで実行するように処理を変更するアプローチについて。\nneo.mjs 2.3.4ではどのように対応したかについて。","relatedLinks":[{"title":"neomjs/neo: The application worker driven frontend framework","url":"https://github.com/neomjs/neo"}]},{"category":"Article","title":"&lt;Lazy&gt; rendering in Vue to improve performance | by Martin Malinda | Vue.js Developers | Aug, 2021 | Medium","url":"https://medium.com/js-dojo/lazy-rendering-in-vue-to-improve-performance-dcccd445d5f","tags":["Vue","article","performance"],"content":"Vueでの遅延レンダリングを使ったパフォーマンス改善について。\nレンダリングのタイミングをずらす、Intersection Observerを使ってviewportに入るタイミングでレンダリング、無限リストの実装についてなど","relatedLinks":[]},{"category":"Article","title":"Slinkity","url":"https://slinkity.dev/","tags":["JavaScript","Tools","React","Vue","Svelte"],"content":"静的サイトジェネレータである11tyにReact/Vue/Svelteなどのコンポーネントをimportとして利用できるようにする拡張","relatedLinks":[]},{"category":"Article","title":"Modern web apps without JavaScript bundling or transpiling","url":"https://world.hey.com/dhh/modern-web-apps-without-javascript-bundling-or-transpiling-a20f2755","tags":["rails","JavaScript","article"],"content":"Rails 7.0でwebpacker(webpack)ではなくimport mapsベースのbundlerを使わないアプローチをデフォルトにすることを検討しているという話。","relatedLinks":[{"title":"rails/importmap-rails: Use ESM with importmap to manage modern JavaScript in Rails without transpiling or bundling.","url":"https://github.com/rails/importmap-rails/"},{"title":"Replace webpack with importmapped Hotwire as default js by dhh · Pull Request #42999 · rails/rails","url":"https://github.com/rails/rails/pull/42999"},{"title":"Alpha preview: Modern JavaScript in Rails 7 without Webpack - YouTube","url":"https://www.youtube.com/watch?v=PtxZvFnL2i0"}]},{"category":"Article","title":"Don’t attach tooltips to document.body - Atif Afzal","url":"https://atfzl.com/don-t-attach-tooltips-to-document-body","tags":["JavaScript","DOM","CSS","performance","article"],"content":"`document.body`直下にツールチップ表示用の要素を追加すると、多くの要素のスタイル更新処理が行われパフォーマンスの問題となった話。\nどのようにレイアウト計算の影響を確認したか、ツールチップを表示用の要素をラップすることでスタイル更新の影響範囲を小さくした話","relatedLinks":[]},{"category":"Article","title":"CSS Grid tooling in DevTools - Chrome Developers","url":"https://developer.chrome.com/blog/css-grid-tooling/","tags":["CSS","Chrome","debug","article"],"content":"Chrome DevToolsのCSS Gridのデバッグ機能と追加されたCDP(chrome devtools protocol)について。\nDevToolsのGridのオーバーレイ表示を永続化、DOMの変更を即時反映、ComputedなStyleでの要素検索を実現するために、CDPに対して新しいコマンドを実装したという話。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"craigmichaelmartin/pure-orm: A Node.js SQL toolkit for writing native SQL queries yielding pure business objects","url":"https://github.com/craigmichaelmartin/pure-orm","tags":["DB","node.js","library"],"content":"ORMライブラリ。\nBusiness Object(BO)とData Access Object(DAO)を使ってDBとのデータをやり取りする。\nDAOはクエリビルダーではなく、生に近いSQL構文を利用する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"microlinkhq/keyv: Simple key-value storage with support for multiple backends.","url":"https://github.com/microlinkhq/keyv","tags":["JavaScript","node.js","library"],"content":"redis/mongo/SQLite/MySQL/PostgreSQLなどの各種バックエンドに対応したKVSライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jlongster/absurd-sql: sqlite3 in ur indexeddb (hopefully a better backend soon)","url":"https://github.com/jlongster/absurd-sql","tags":["SQL","JavaScript","IndexedDB","library"],"content":"sql.jsのIndexedDBバックエンド","relatedLinks":[{"title":"A future for SQL on the web","url":"https://jlongster.com/future-sql-web"}]}]},{"meta":{"title":"2021-08-25のJS: browser-compat-dataにDenoを追加、Mobile First and Desktop First、create-react-appからNext.jsに移行","author":"azu","layout":"post","date":"2021-08-25T02:44:57.250Z","category":"JSer","tags":["React","testing","DOM","Next.js","webservice"],"url":"https://jser.info/2021/08/25/browser-compat-datadeno-mobile-first-and-desktop-first-create-react-appnext.js/"},"items":[{"category":"Headline","title":"Announcing React Native 0.65 · React Native","url":"https://reactnative.dev/blog/2021/08/17/version-065","tags":["React","iOS","Android"],"content":"React Native 0.65リリース。\nHermes 0.8にアップグレードし、Hadesというガベージコレクタの実装、ECMAScript i18n APIのサポート、Apple M1のサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Release v9.1.0 · mochajs/mocha","url":"https://github.com/mochajs/mocha/releases/tag/v9.1.0","tags":["node.js","testing","library","ReleaseNote"],"content":"Mocha 9.1.0リリース。\n`--fail-zero`、`--node-option`のサポート、`JSON`レポーターの追加など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 130 | WebKit","url":"https://webkit.org/blog/11958/release-notes-for-safari-technology-preview-130/","tags":["safari","ReleaseNote"],"content":"フラグ付きで`Array.prototype.findLast`と`Array.prototype.findLastIndex`のサポート、WebAudioでWebM/Opusコンテナのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · mdn/browser-compat-data","url":"https://github.com/mdn/browser-compat-data/releases/tag/v4.0.0","tags":["mdn","JavaScript","library","ReleaseNote"],"content":"MDNなどで使われるウェブ技術の互換性リストであるbrowser-compat-data 4.0.0リリース。\nスキーマに`preview`と`accepts_flags`の追加、Denoを追加、XPathとXSLTのデータが不完全であるため削除など","relatedLinks":[{"title":"Deno on MDN | Deno Blog","url":"https://deno.com/blog/deno-on-mdn"}]},{"category":"Headline","title":"The npm registry is deprecating TLS 1.0 and TLS 1.1 | The GitHub Blog","url":"https://github.blog/2021-08-23-npm-registry-deprecating-tls-1-0-tls-1-1/","tags":["npm","Github","security","news"],"content":"npm registryでTLS 1.0とTLS 1.1を非推奨化し、2021年9月29日でサポートを終了する予定。\nNode.js 0.10.0未満のバージョンを使っているケースやカスタムしたバイナリを使っているケースが対象となるがすでに99%はTLS 1.2を利用しているとのこと。","relatedLinks":[]},{"category":"Article","title":"The State Of Mobile First and Desktop First - Ahmad Shadeed","url":"https://ishadeed.com/article/the-state-of-mobile-first-and-desktop-first/","tags":["CSS","article"],"content":"CSSを書くときにMobileとDesktop向けのどちらを先に書くかについて。\nMobileとDesktopのどちらかを先に書いて、もう一方をMedia Queryで上書きしたときのコード量や拡張性の違いについて。\nまた、ベースとそれぞれを書いた場合やFlexboxやContainer Queryといった最近の機能を使って書いた場合についてなど","relatedLinks":[]},{"category":"Article","title":"mouseover 中に表示される DOM のデバッグ | blog.jxck.io","url":"https://blog.jxck.io/entries/2021-08-20/how-to-debug-mouseover.html","tags":["DOM","debug","article"],"content":"mouseover中に表示されるDOM要素を開発者ツールでデバッグする方法について","relatedLinks":[]},{"category":"Article","title":"&#039;return await promise&#039; vs &#039;return promise&#039; in JavaScript","url":"https://dmitripavlutin.com/return-await-promise-javascript/","tags":["Promises","JavaScript","article"],"content":"`return await promise`と`return promise`で動作が異なるケースについて。\n`try...catch`で囲まれている場合には、`await`によってthrowされると結果が異なる","relatedLinks":[]},{"category":"Article","title":"複数リポジトリ間におけるeslint・prettierの設定共通化 - LIVESENSE ENGINEER BLOG","url":"https://made.livesense.co.jp/entry/2021/08/24/083000","tags":["ESLint","article"],"content":"ESLintの設定を社内で共有管理するために、scoped packagesとして公開して利用方法について","relatedLinks":[]},{"category":"Article","title":"Why WASM is not the future of Babylon.js | by Babylon.js | Aug, 2021 | Medium","url":"https://babylonjs.medium.com/why-wasm-is-not-the-future-of-babylon-js-5832b09c9b10","tags":["WebAssembly","article","JavaScript"],"content":"WebAssemblyはC++などのネイティブな言語をコンパイルして利用するのが目的であるため、TypeScriptで書かれたBabylon.jsをWasmにする正当な理由がまだないという話。\nWasmとJS間のコミュニケーションコストやデバッグが難しい、メモリ管理なども含むためサイズが大きくなるなどの問題点について。\nまた、Babylon.jsの物理エンジンなどの一部領域ではWasmをすでに利用していることなどについても書かれている。","relatedLinks":[]},{"category":"Article","title":"From Create-React-App to Next | Kitty Giraudel","url":"https://kittygiraudel.com/2021/08/24/from-cra-to-next/","tags":["React","Next.js","article"],"content":"Create-React-Appで書かれていたアプリをNext.jsに移行した話。\nボイラープレート、`<head>`、ルーティング、コンポーネントのDynamic Import、Styling、CSR/SSR、Lintなどについて。\nまた`<Link>`以外はどちらの環境でも実行できたため、移行の動作確認として両方の環境で動かしてテストする方法について","relatedLinks":[]},{"category":"WebsiteDocument","title":"SpeedVitals - Optimize your Website for Web Vitals","url":"https://speedvitals.com/","tags":["webservice","performance"],"content":"ウェブサイトのパフォーマンス計測をしてCore Web Vitalsの改善方法を提示するウェブサービス。\n計測結果からLCPのスコアの改善方法、レイアウトシフトの視覚化など改善に関する情報を提示する","relatedLinks":[{"title":"Introducing SpeedVitals Alpha Version! - SpeedVitals","url":"https://blog.speedvitals.com/introducing-speedvitals/#more-20"}]},{"category":"WebsiteDocument","title":"@open-wc/semantic-dom-diff - npm","url":"https://www.npmjs.com/package/@open-wc/semantic-dom-diff","tags":["DOM","HTML","JavaScript","library"],"content":"DOM/HTMLのassertionライブラリ。\nHTML文字列を比較したテストができる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Testing | Next.js","url":"https://nextjs.org/docs/testing","tags":["Next.js","React","testing","document"],"content":"Next.jsにおけるテストについてのドキュメント。\nCypressを使ったE2EテストとJest + React Testing Libraryを使ったテストの方法について紹介している。","relatedLinks":[{"title":"Delba de Oliveira on Twitter: ","url":"https://twitter.com/delba_oliveira/status/1427307677709967362"}]},{"category":"SoftwareLibrary","title":"geist-org/react: Modern and minimalist React UI library.","url":"https://github.com/geist-org/react","tags":["React","library"],"content":"VercelのデザインをインスパイアしたReactのUIフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"johnsoncodehk/volar: ⚡ Fast Vue Language Support Extension","url":"https://github.com/johnsoncodehk/volar","tags":["Vue","TypeScript","VSCode","plugin"],"content":"Vue 3をサポートするVSCode向けの拡張機能。\n`.vue`ファイルのTypeScriptの型チェックやテンプレートのlanguage serverを提供する","relatedLinks":[]}]},{"meta":{"title":"2021-08-31のJS: TypeScript 4.4、PageSpeed InsightsのLab/Field data、Packemon(ライブラリ向けビルドツール)","author":"azu","layout":"post","date":"2021-08-30T22:46:59.689Z","category":"JSer","tags":["node.js","Chrome","TypeScript","browser","React"],"url":"https://jser.info/2021/08/31/typescript-4.4-pagespeed-insightslabfield-data-packemon/"},"items":[{"category":"Headline","title":"Node v16.8.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v16.8.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 16.8.0リリース。\n`stream.Duplex.from`、 `stream.Readable.isDisturbed(stream)`の追加。\n`util`モジュールに`toUSVString`の追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.4 | TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-4/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.4リリース。\nControl Flow Analysisの改善、Index SignaturesにSymbolやTemplate Stringを利用できるように。\nCatch節のデフォルトを`unknown`型にする`useUnknownInCatchVariables`オプションの追加。\noptionalと`undefined`値の区別をする`exactOptionalPropertyTypes`オプションの追加。\nまた、ES Proposal Stage 3のclass static blockをサポート。\n`tsc --help`の表示を改善、ビルドパフォーマンスの改善も含まれている","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 94 Beta: WebCodecs, WebGPU, Scheduling, and More","url":"https://blog.chromium.org/2021/08/chrome-94-beta-webcodecs-webgpu.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 94 Betaリリース。\nOrigin Trialとして、HTTP status code 103 Early Hintsを実験的にサポート。\nWebCodecs、`scheduler.postTask()`、`MediaStreamTrackGenerator`/`MediaStreamTrackProcessor`のサポート。\nSelf Profiling APIのサポートなど。\nまた、WebSQLがサードパーティコンテキストでは非推奨となり、`navigator.plugins`/ `navigator.mimeTypes`は固定された値を返すように変更されるなど","relatedLinks":[]},{"category":"Headline","title":"Announcing SWR 1.0 – SWR","url":"https://swr.vercel.app/blog/swr-v1","tags":["React","library","ReleaseNote"],"content":"データ取得するReact HooksライブラリのSWR 1.0リリース。\n`fallback`オプションの追加、Immutable Modeの追加、`provider`オプションの追加、`useSWRConfig`の追加。\nまた、Middlewareの対応、一部APIの変更、デフォルトの`fetcher`を定義しなくなるなど","relatedLinks":[]},{"category":"Headline","title":"Release 27.1.0 · facebook/jest","url":"https://github.com/facebook/jest/releases/tag/v27.1.0","tags":["node.js","JavaScript","testing","library","ReleaseNote"],"content":"Jest 27.1.0リリース。\n`snapshotFormat`オプションの追加、Node.js 16で追加された`node:` prefixのモジュールをサポートなど","relatedLinks":[{"title":"Modules: CommonJS modules | Node.js v16.8.0 Documentation","url":"https://nodejs.org/api/modules.html#modules_core_modules"}]},{"category":"Headline","title":"mongoose/CHANGELOG.md at master · Automattic/mongoose","url":"https://github.com/Automattic/mongoose/blob/master/CHANGELOG.md#600--2021-08-24","tags":["MongoDB","node.js","library","ReleaseNote"],"content":"mongoose 6.0リリース。\nMongoDB Driver 4.0サポート、`sanitizeFilter`と`Trusted()`メソッドの追加、`default`に関数を渡せるように、Documentの変更をProxyで検知できるように。\n破壊的な変更として、`createConnection(uri)`がthenableではなくなる、同じQueryを再実行はエラーにになる,`strictQuery`オプションを`strict`にリネーム。\nまた、デフォルトの挙動を変更に関連して不要となったオプションの削除やTypeScriptの型定義の変更など","relatedLinks":[{"title":"Mongoose v6.0.2: Migrating to Mongoose 6","url":"https://mongoosejs.com/docs/migrating_to_6.html"},{"title":"Introducing Mongoose 6.0.0 | www.thecodebarbarian.com","url":"https://thecodebarbarian.com/introducing-mongoose-6.html"}]},{"category":"Article","title":"Private Network Access update: Introducing a deprecation trial - Chrome Developers","url":"https://developer.chrome.com/blog/private-network-access-update/","tags":["Chrome","security","article"],"content":"Chromeでのnon-secureなウェブサイトからPrivate Network Accessを制限するロードマップについて。\nChrome 94でnon-secureなPublicウェブサイトからPrivate Networkへのリクエストを送れなくなり、逆Origin Trialを開始している。\nChrome 102で逆Origin Trialを終了し、完全に制限される。","relatedLinks":[]},{"category":"Article","title":"Introducing Portal Windows for Electron","url":"https://blog.tandem.chat/portal-windows/","tags":["React","Electron","article"],"content":"Tandemで利用しているElectronで他のウィンドウをミラーリングするライブラリについて。\n他のアプリのウィンドウをReactコンポーネントとして描画、スクリーンシェアなどに利用できる。","relatedLinks":[{"title":"cryptagon/portal-windows: Render and position native windows as simply as you render and position tooltips in your React app.","url":"https://github.com/cryptagon/portal-windows"}]},{"category":"Article","title":"Why lab and field data can be different (and what to do about it)","url":"https://web.dev/lab-and-field-data-differences/","tags":["Chrome","performance","article"],"content":"PageSpeed Insightsなどに表示されている定点観測データであるLab dataとRUMであるField dataについて。\nそれぞれのデータの違い、計測方法、キャッシュの状態、AMP/SXG、BFCacheなどの影響について。\nLabとFieldがどちらもある場合は、Field dataがよりユーザーの体験に近いことについて。","relatedLinks":[]},{"category":"Article","title":"Modern client-side routing: the App History API","url":"https://web.dev/app-history-api/","tags":["Chrome","WebPlatformAPI","article"],"content":"Chrome 95にてフラグ付きで実装されたApp History APIについて。\n問題のあるHistory APIを置き換えるAPI。\n`navigation`イベントでのナビゲーションの検知、`transitionWhile(promise)`での遷移中/成功/失敗の表現、ナビゲーションエラー時のロールバックなどの具体例について。\nまた、Historyの管理、状態の管理、FormのSubmitにおけるナビゲーションを扱える点についてなど","relatedLinks":[{"title":"WICG/app-history: The app history API provides a web application-focused way of managing same-origin same-frame history entries and navigations.","url":"https://github.com/WICG/app-history"}]},{"category":"Article","title":"NAN to Node-API Migration: A Short Story - NodeSource","url":"https://nodesource.com/blog/NAN-to-Node-API-migration-a-short-story","tags":["node.js","C++","article"],"content":"Node.jsのnative addonを開発時に利用するNANとNode-API(N-API)について。\nNode-APIはV8に依存しないnative addon開発のために追加され、NANからNode-APIに移行しながら、Node-APIの使い方について見ていく記事。","relatedLinks":[]},{"category":"WebsiteDocument","title":"GoogleChromeLabs/ProjectVisBug: FireBug for designers › Edit any webpage, in any state https://a.nerdy.dev/gimme-visbug","url":"https://github.com/GoogleChromeLabs/ProjectVisBug","tags":["browser","Extension","debug","Design"],"content":"デザイナー向けのDevTools","relatedLinks":[{"title":"VisBug","url":"https://visbug.web.app/"}]},{"category":"SoftwareLibrary","title":"Gotta pack &#039;em all! | Packemon","url":"https://packemon.dev/","tags":["JavaScript","TypeScript","browser","node.js","bundler","Tools","library"],"content":"ライブラリ向けのビルドツール。\nNode.js(mjs,cjs)、ブラウザ(ESM、UMD)向けのビルドを一括でできる。\nまた、設定に応じたpackage.jsonの書き換え、Babelを使ったESM向けのコード変換、mjsで利用できない機能をビルド時にチェック、パッケージのメタデータのバリデーションなどができる。","relatedLinks":[{"title":"azu/packemon-demo: Packemon demo package","url":"https://github.com/azu/packemon-demo"}]},{"category":"SoftwareLibrary","title":"5alidz/tiny-schema-validator: JSON schema validator","url":"https://github.com/5alidz/tiny-schema-validator","tags":["TypeScript","JavaScript","library"],"content":"Schemaを定義してバリデーションができるbuilderライブラリ。\n作成したSchemaオブジェクトはTypeScriptの型としても利用できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"unjs/unplugin: Unified plugin system for Vite, Rollup, and Webpack","url":"https://github.com/unjs/unplugin","tags":["vite","rollup","webpack","plugin","library"],"content":"Vite/Rollup/webpack pluginを同じコードから作成するライブラリ","relatedLinks":[]}]},{"meta":{"title":"2021-09-07のJS: Electron 14.0.0、node-fetch 3.0.0、replace-jquery","author":"azu","layout":"post","date":"2021-09-07T01:36:56.156Z","category":"JSer","tags":["node.js","Tools","TypeScript","CSS","UI"],"url":"https://jser.info/2021/09/07/electron-14.0.0-node-fetch-3.0.0-replace-jquery/"},"items":[{"category":"Headline","title":"Electron 14.0.0 | Electron Blog","url":"https://www.electronjs.org/blog/electron-14-0","tags":["Electron","ReleaseNote"],"content":"Electron 14.0.0リリース。\nChromium 93、Node.js 14.17.0、V8 9.3にアップデート。\n破壊的な変更として`app.allowRendererProcessReuse`オプションの削除、`worldSafeExecuteJavaScript`オプションを削除してデフォルト化。\n`remote`モジュールを削除し、`@electron/remote`という外部モジュール化など。","relatedLinks":[]},{"category":"Headline","title":"August 31 2021 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/aug-2021-security-releases2/","tags":["node.js","security","ReleaseNote"],"content":"Node.jsのセキュリティアップデート。\nOpenSSLとnpm 6.x系の脆弱性の修正が含まれていて、Node.js v12.22.6 (LTS)とNode.js v14.17.6 (LTS)がリリースされている。","relatedLinks":[{"title":"npmにも影響があるnode-tarのパストラバーサルの脆弱性 CVE-2021-32804 | yamory Blog","url":"https://yamory.io/blog/cve-2021-32804-node-tar-reproduce/"}]},{"category":"Headline","title":"Release Selenium 4.0.0 RC 1 · SeleniumHQ/selenium","url":"https://github.com/SeleniumHQ/selenium/releases/tag/selenium-4.0.0-rc-1","tags":["Selenium","ReleaseNote"],"content":"Selenium 4.0.0 RC 1リリース","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · node-fetch/node-fetch","url":"https://github.com/node-fetch/node-fetch/releases/tag/v3.0.0","tags":["node.js","Fetch","library","ReleaseNote"],"content":"node-fetch 3.0.0リリース。\nESMのサポート、Node.js 12未満のサポート終了、`timeout`オプションの削除、`highWaterMark`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"jQuery UI 1.13.0-rc.2 released | jQuery UI Blog","url":"https://blog.jqueryui.com/2021/09/jquery-ui-1-13-0-rc-2-released/","tags":["jQuery","UI","library","ReleaseNote"],"content":"jQuery UI 1.13.0-rc.2リリース。\n5年ぶりとなるリリース。\n最近jQueryとの互換性を改善する目的のリリースであるため、非互換な変更は含まない。","relatedLinks":[]},{"category":"Headline","title":"Stitches 1.0.0 — Stitches","url":"https://stitches.dev/blog/stitches-1.0.0","tags":["CSS","JavaScript","library","ReleaseNote"],"content":"CSS-in-JSフレームワークであるStitches 1.0.0リリース。","relatedLinks":[{"title":"Release v1.0.0 · modulz/stitches","url":"https://github.com/modulz/stitches/releases/tag/v1.0.0"}]},{"category":"Article","title":"ECMAScript proposal updates @ 2021-08 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2021/09/04/ecmascript-proposal-update","tags":["ECMAScript","proposal","article","news"],"content":"2021年8月のTC39ミーティングでのECMAScript Proposalの変更まとめ。\nClass Static Block、`hasOwn`、`.at()`がそれぞれStage 4となり、ES2022に入ることが決まった。","relatedLinks":[]},{"category":"Article","title":"JavaScriptのIterator / Generatorの整理","url":"https://zenn.dev/qnighy/articles/112af47edfda96","tags":["JavaScript","article"],"content":"IteratorとGeneratorについての解説記事","relatedLinks":[]},{"category":"SlideVideo","title":"ss2021 - 日本ソフトウェア科学会 プログラミング論研究会 (JSSST-SIGPPL) (Special Interest Group on Programming and Programming Languages)","url":"http://ppl.jssst.or.jp/index.php?ss2021","tags":["JavaScript","V8","blink","slide"],"content":"「JavaScript処理系とChromeブラウザの実装技術」についてのスライドまとめ。","relatedLinks":[]},{"category":"WebsiteDocument","title":"bundle - a quick npm package size checker","url":"https://bundle.js.org/","tags":["JavaScript","cdn","Tools","browser"],"content":"ブラウザ上でskypack.devとesbuild-wasmを使ってコードをbundleして、bundle sizeをチェックするツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"google/schema-dts: JSON-LD TypeScript types for Schema.org vocabulary","url":"https://github.com/google/schema-dts","tags":["JSON","TypeScript","library"],"content":"Schema.orgのvocabularyに対応したJSON-LDのTypeScript型定義ライブラリ。","relatedLinks":[{"title":"JSON-LD - JSON for Linking Data","url":"https://json-ld.org/"}]},{"category":"SoftwareLibrary","title":"asmcss/assembler: A modern UI framework","url":"https://github.com/asmcss/assembler","tags":["CSS","UI","library","JavaScript"],"content":"`x-style`という仮想プロパティをスタイルとして展開するUtility-firstなUIフレームワーク。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"niksy/isomorphic-timers-promises: \\`timers/promises\\` for client and server.","url":"https://github.com/niksy/isomorphic-timers-promises","tags":["JavaScript","browser","node.js","library","polyfill"],"content":"Node.jsの`timers/promises` polyfillライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"microsoft/ts-gyb: Generating native code interfaces from TypeScript","url":"https://github.com/microsoft/ts-gyb","tags":["TypeScript","Tools"],"content":"TypeScriptのinterfaceからmustache templatesを使ってコード生成するツール。\nTypeScriptのinterfaceから別の言語のboilerplateを生成する目的のツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sachinchoolur/replace-jquery: Automatically finds jQuery methods from existing projects and generates vanilla js alternatives.","url":"https://github.com/sachinchoolur/replace-jquery","tags":["JavaScript","jQuery","Tools"],"content":"jQueryに依存したコードから、利用しているjQueryのメソッドの代替コードを生成するツール。\n指定したjQueryのメソッドのみを含んだutilityコードを生成できる。","relatedLinks":[]},{"category":"Book","title":"React Cookbook","url":"https://learning.oreilly.com/library/view/react-cookbook/9781492085836/","tags":["React","book"],"content":"Reactについての書籍。\nルータ、ステート、GraphQL、UI、セキュリティ、テスト、アクセシビリティ、パフォーマンスなどのトピックごとに書かれたクックブック","relatedLinks":[]}]},{"meta":{"title":"2021-09-14のJS: Node v16.9.0(Corepack)、Spook.js(Same-Siteでのサイドチャネル攻撃)","author":"azu","layout":"post","date":"2021-09-14T01:00:58.637Z","category":"JSer","tags":["Tools","React","node.js","database","Ember"],"url":"https://jser.info/2021/09/14/node-v16.9.0corepack-spook.jssame-site/"},"items":[{"category":"Headline","title":"Node v16.9.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v16.9.0/","tags":["node.js","ReleaseNote"],"content":"Node v16.9.0リリース。\nプロジェクトごとにnpm/yarn/pnpmなどのパッケージマネージャを切り替えてインストールできるCorepackのサポート。\nV8 9.3へアップデートし`Object.hasOwn`とError Causeをサポート、`stream.compose`の追加など","relatedLinks":[{"title":"Corepack | Node.js v16.9.0 Documentation","url":"https://nodejs.org/dist/latest-v16.x/docs/api/corepack.html"},{"title":"V8 release v9.3 · V8","url":"https://v8.dev/blog/v8-release-93"}]},{"category":"Headline","title":"Release 3.0.1 · prisma/prisma","url":"https://github.com/prisma/prisma/releases/tag/3.0.1","tags":["database","JavaScript","library","ReleaseNote"],"content":"Prisma 3.0.1リリース。3からSemverにそったリリースとなった。\nReferential Actions、Named Constraints、Microsoft SQL/Azure SQL、Node-APIなどがGAとなった。\n破壊的な変更として`prisma db seed`の仕組みの変更、`null`をクエリに指定できなくして`JsonNull`/`DbNull`/`AnyNull`のいずれかを使うようにする変更も含まれる。","relatedLinks":[]},{"category":"Headline","title":"Ember 3.28 and 4.0 Beta Released","url":"https://blog.emberjs.com/ember-3-28-released/","tags":["Ember","ReleaseNote"],"content":"Ember 3.28 and 4.0 Betaリリース。","relatedLinks":[]},{"category":"Headline","title":"Prettier 2.4: new bracketSameLine option and TypeScript 4.4 support! · Prettier","url":"https://prettier.io/blog/2021/09/09/2.4.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 2.4リリース。\nTypeScript 4.4サポート、`jsxBracketSameLine`オプションを`bracketSameLine`オプションに置き換えなど","relatedLinks":[]},{"category":"Headline","title":"Nightwatch v2.0-alpha is Released | Nightwatch.js Blog","url":"https://nightwatchjs.org/blog/nightwatch-v2-alpha-is-released.html","tags":["E2E","JavaScript","library","ReleaseNote","Selenium"],"content":"Nightwatch v2.0-alphaリリース。\n`selenium-webdriver`を利用するように、WebDriver Actions APIのサポート、Chrome Dev Tools Protocolのサポート。\n`.ensure` assertionの追加、`perform()`などでWebDriver objectを直接扱えるように、Async/Awaitの対応改善など","relatedLinks":[]},{"category":"Headline","title":"Time for a review of Firefox 92 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2021/09/time-for-a-review-of-firefox-92/","tags":["Firefox","ReleaseNote"],"content":"Firefox 92リリース。\nCSSの`accent-color`と`size-adjust`をサポート、Stage 4 `Object.hasOwn`のサポートなど。\nまた、`selectionchange`イベントで`input`や`textarea`内の選択範囲の変更も検知するようになるなど","relatedLinks":[{"title":"Firefox 92 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/92"},{"title":"Firefox 92.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/92.0/releasenotes/"}]},{"category":"Headline","title":"Release Workbox v6.3.0 · GoogleChrome/workbox","url":"https://github.com/GoogleChrome/workbox/releases/tag/v6.3.0","tags":["ServiceWorker","library","JavaScript","ReleaseNote"],"content":"Workbox 6.3.0リリース。\n`integrity`属性が指定されているリソースに対するprecachingの修正、IDBの書き込みに`{ durability: 'relaxed' }`を使うように。\nBroadcastCacheUpdateに`notifyAllClients`オプションの追加、`Vary:`ヘッダに対するデバッグログを追加など","relatedLinks":[]},{"category":"Article","title":"What’s New With DevTools: Cross-Browser Edition — Smashing Magazine","url":"https://www.smashingmagazine.com/2021/09/devtools-cross-browser-edition/","tags":["browser","debug","article"],"content":"ブラウザごとの開発者ツールの機能紹介記事","relatedLinks":[]},{"category":"Article","title":"Migrating Notion&#039;s marketing site to Next.js","url":"https://www.notion.so/blog/migrating-notion-marketing-to-next-js","tags":["React","Next.js","article"],"content":"Notion マーケティングサイトをNext.jsへ移行した話。\nReactで書かれたアプリケーションのコードとマーケティングサイトのコードを共有することで組み込みのデモがうごかせるようになった話。\nルーティングでの切り替えとテスト、CSSの対応などについて","relatedLinks":[]},{"category":"Article","title":"JavaScript Eventing Deep Dive","url":"https://web.dev/eventing-deepdive/","tags":["JavaScript","DOM","article"],"content":"Event Capturing/Event Bubbling phaseの動きについての記事。\nそれぞれphaseにおいてEventの流れを止める`stopPropagation()`、`stopImmediatePropagation()`、`preventDefault()`の動作についての解説。","relatedLinks":[]},{"category":"Article","title":"Journey with Icons Continues","url":"https://antfu.me/posts/journey-with-icons-continues","tags":["JavaScript","React","Vue","article"],"content":"Viteでアイコンコンポーネントをオンデマンドでビルドして利用できるunplugin-iconsについて。\nアイコンのデータにはIconifyを使い、アイコンコンポーネントをロードした際にVite側でSVGベースのアイコンコンポーネントを作成して返す仕組みについて。","relatedLinks":[{"title":"Iconify - Unified icons framework","url":"https://iconify.design/"},{"title":"antfu/unplugin-icons: 🤹 Access thousands of icons as components on-demand universally.","url":"https://github.com/antfu/unplugin-icons"}]},{"category":"Article","title":"Introducing Flow Enums. As announced in an earlier post, Flow… | by George Zahariev | Flow | Sep, 2021 | Medium","url":"https://medium.com/flow-type/introducing-flow-enums-16d4239b3180","tags":["flowtype","article"],"content":"FlowTypeに導入された`enum`について","relatedLinks":[{"title":"TypeScript Enums vs. Flow Enums. The Flow team recently announced Flow… | by George Zahariev | Flow | Sep, 2021 | Medium","url":"https://medium.com/flow-type/typescript-enums-vs-flow-enums-83da2ca4a9b4"}]},{"category":"Article","title":"フロントエンドのテストは皆のためのもの | POSTD","url":"https://postd.cc/frontend-testing-is-for-everyone/","tags":["testing","article"],"content":"Front-End Testing is For Everyoneの翻訳記事。\nテストがチェックする範囲とチェックするツールについてまとめたもの。\nユニットテスト、結合テスト、E2Eテスト、アクセシビリティテスト、ビジュアルリグレッションテスト、パフォーマンステストについて書かれている。","relatedLinks":[{"title":"Front-End Testing is For Everyone | CSS-Tricks","url":"https://css-tricks.com/front-end-testing-is-for-everyone/"}]},{"category":"SlideVideo","title":"Spook.js","url":"https://www.spookjs.com/","tags":["Chrome","security","paper"],"content":"leaky.page が同じページ内での話だったの対して、ウェブサイト間や拡張機能間まで話を広げたSpectreについての論文。\nChromeはメモリを圧迫するとeTLD+1の範囲でプロセスがまとまる。まとまったプロセス内でV8の癖を使って投機的実行攻撃して別サイトのメモリデータを読み込むという話。","relatedLinks":[{"title":"Google Developers Japan: Spectre の影響を受けないウェブを作るための概念実証について","url":"https://developers-jp.googleblog.com/2021/03/a-spectre-proof-of-concept-for-spectre.html"}]},{"category":"SoftwareLibrary","title":"wizardpisces/tiny-sass-compiler: Another sass compiler write from scatch，runnable on both node and browser","url":"https://github.com/wizardpisces/tiny-sass-compiler","tags":["Sass","JavaScript","Tools","CSS"],"content":"JavaScriptで書かれたSassコンパイル。\nブラウザとNode.jsで動作する。","relatedLinks":[]},{"category":"Book","title":"TypeScriptハンズオン | 掌田津耶乃 | 工学 | Kindleストア | Amazon","url":"https://www.amazon.co.jp/dp/B09D76MB7B/","tags":["TypeScript","book"],"content":"ハンズオン形式のTypeScript入門書","relatedLinks":[{"title":"TypeScriptハンズオン - 秀和システム あなたの学びをサポート！","url":"https://www.shuwasystem.co.jp/book/9784798065335.html"}]}]},{"meta":{"title":"2021-09-21のJS: Deno 1.14リリース、ChromeのUser-Agent文字列削減スケジュール、Vue 2からVue 3への移行","author":"azu","layout":"post","date":"2021-09-21T02:25:53.504Z","category":"JSer","tags":["debug","Vue","Chrome","tutorial","CSS"],"url":"https://jser.info/2021/09/21/deno-1.14-chromeuser-agent-vue-2vue-3/"},"items":[{"category":"Headline","title":"Material-UI is now MUI! - MUI","url":"https://mui.com/blog/material-ui-is-now-mui/","tags":["UI","JavaScript","React","library","ReleaseNote"],"content":"マテリアルデザインのReact実装として開始したMaterial-UIがMUIへとリネームされた。\nこれに伴ってパッケージが`@material-ui`から`@mui`へと変更され、ウェブサイトもリニューアルされた。","relatedLinks":[]},{"category":"Headline","title":"Is Nuxt 3 Ready?","url":"https://nuxtjs.org/v3/","tags":["Vue","news","library"],"content":"Nuxt 3は2021年10月12日にリリース予定","relatedLinks":[]},{"category":"Headline","title":"Deno 1.14 Release Notes | Deno Blog","url":"https://deno.com/blog/v1.14","tags":["deno","ReleaseNote"],"content":"Deno 1.14リリース。\n`deno lint`と`deno fmt`がオプションをサポート、`URLPattern`のサポート。`fetch`がMutual TLSをサポートなど。\nまた、unstableな機能としてFile locking APIsのサポート、URL parsingや`std/http`モジュールのパフォーマンス改善など。\nその他には、TypeScript 44、V8 9.4へのアップデートなども含まれる。","relatedLinks":[{"title":"Deno 1.14.0 がリリースされたので新機能や変更点の紹介","url":"https://zenn.dev/magurotuna/articles/deno-release-note-1-14-0"}]},{"category":"Article","title":"Chromium Blog: User-Agent Reduction Origin Trial and Dates","url":"https://blog.chromium.org/2021/09/user-agent-reduction-origin-trial-and-dates.html","tags":["Chrome","article"],"content":"ChromeのUser-Agent変更のスケジュール。\nChrome 95からOrigin Trialを使ったオプトインで導入、Chrome 100から徐々に削減していき、からChrome 113でUAと関連APIのデータの削減が完了する予定。","relatedLinks":[]},{"category":"Article","title":"フロントエンド刷新のために DevTools を作って開発を捗らせる - Cybozu Inside Out | サイボウズエンジニアのブログ","url":"https://blog.cybozu.io/entry/2021/09/13/080000","tags":["google","debug","JavaScript","library","article"],"content":"Closure Tools向けのDevToolsについて","relatedLinks":[]},{"category":"Article","title":"Vueの再描画されたコンポーネントをハイライトするChrome拡張を作った","url":"https://zenn.dev/yuichkun/articles/e4e8c7e633439c","tags":["Vue","debug","Tools","article"],"content":"React DevToolsのように描画された要素をハイライトするVue向けのデバッグ拡張について","relatedLinks":[{"title":"yuichkun/vue-devtool-flash-updates: A handy tool that highlights re-rendered components.","url":"https://github.com/yuichkun/vue-devtool-flash-updates"}]},{"category":"Article","title":"Vue2のプロジェクトをVue3へマイグレーションする","url":"https://zenn.dev/azukiazusa/articles/c8d76eb56f5fd8","tags":["Vue","article","tutorial"],"content":"vue-cliを使っているプロジェクトをVue2からVue3へのマイグレーションするチュートリアル。\n`@vue/compat`、`eslint-plugin-vue`導入し、それぞれのAPIの変更に対応し、`@vue/comat`を取り除くまでの流れを解説している。","relatedLinks":[]},{"category":"Article","title":"The Future of CSS: Cascade Layers (CSS @layer) – Bram.us","url":"https://www.bram.us/2021/09/15/the-future-of-css-cascade-layers-css-at-layer/","tags":["CSS","article"],"content":"CSSの`@layer`について。\nCSSの詳細度解決の前段としてレイヤーを作成して、スタイルの定義ができるCascade Layersの仕様。\nレイヤーが詳細度より優先されるため、意図しないスタイルの上書きなどを制御しやすくなる","relatedLinks":[]},{"category":"Article","title":"Small Bundles, Fast Pages: What To Do With Too Much JavaScript | Calibre","url":"https://calibreapp.com/blog/bundle-size-optimization","tags":["JavaScript","performance","article"],"content":"JavaScriptのbundle sizeを小さく保つにどうするかについての記事。\nbundle sizeとパフォーマンスへの影響、bundle sizeの可視化、特定のパッケージの利用をESLintで禁止する方法、遅延ロード、Modern Browser向けのビルド分離などについて","relatedLinks":[]},{"category":"Article","title":"What&#039;s New In DevTools (Chrome 95) - Chrome Developers","url":"https://developer.chrome.com/blog/new-in-devtools-95/","tags":["Chrome","debug","article"],"content":"Chrome 95の開発者ツールの変更点について。\nCSS Unitの選択UIの追加、Isssuesタブの改善、Lighthouse 8.4のサポートなど","relatedLinks":[]},{"category":"SlideVideo","title":"iframe sandboxでユーザー入力スクリプトを実行する - Speaker Deck","url":"https://speakerdeck.com/syumai/iframe-sandboxdeyuzaru-li-sukuriputowoshi-xing-suru","tags":["JavaScript","security","slide"],"content":"iframeを使ったユーザー入力のスクリプト実行についてのスライド。\nCross OriginでのWindow Objectを使ってコードを実行して、postMessageでその結果を取得する方法について。\nまたpostMessageのoriginとsourceチェックについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"CSS Almanac | CSS-Tricks","url":"https://css-tricks.com/almanac/","tags":["CSS","dictionary","document"],"content":"CSSのリファレンス。\nCSSのセレクタ、プロパティごと解説がまとまっている","relatedLinks":[]},{"category":"WebsiteDocument","title":"Intro to D3.js","url":"https://yangdanny97.github.io/intro-to-d3/","tags":["d3.js","tutorial"],"content":"D3 v5+に対応したチュートリアル","relatedLinks":[]},{"category":"SoftwareLibrary","title":"typicode/xv: A simple, fast and small test runner with native ESM support","url":"https://github.com/typicode/xv","tags":["node.js","ECMAScript","module","testing","library"],"content":"ESMを扱うテストフレームワーク。\n各テストケースを`export`構文でexportして、そのテストケースを実行した結果を表示するCLIを提供する","relatedLinks":[]}]},{"meta":{"title":"2021-09-28のJS: Lit 2、Gatsby 4 beta、Partytown(Third-Party Script into Worker)","author":"azu","layout":"post","date":"2021-09-27T14:10:06.442Z","category":"JSer","tags":["React","WebComponents","node.js","Tools","Chrome"],"url":"https://jser.info/2021/09/27/lit-2-gatsby-4-beta-partytownthird-party-script-into-worker/"},"items":[{"category":"Headline","title":"Announcing Lit 2 stable release – Lit","url":"https://lit.dev/blog/2021-09-21-announcing-lit-2/","tags":["WebComponents","JavaScript","library","ReleaseNote"],"content":"Lit 2リリース。\nclassベースのDirectives API、非同期Directives、Reactive Controllersの追加。\n要素全体に対して影響を与えられるElement expressions、タグ名などに変数を使えるStatic expressionsの追加。\nまた、実験的にSSRのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node v16.10.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v16.10.0/","tags":["node.js","ReleaseNote"],"content":"Node v16.10.0リリース。\nコネクションごとに最大のリクエスト数を制限する`server.maxRequestsPerSocket`オプションの追加。\n`$HOME/.node_modules`などを探索しない`--no-global-search-paths`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Electron 15.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-15-0/","tags":["Electron","ReleaseNote"],"content":"Electron 15.0.0リリース。\nElectron 15から8週間ごとのメジャーアップデートとなる。\nChromium 94、Node.js 16.5.0、V8 9.4へアップデート、`nativeWindowOpen`のデフォルト値を`true`へ変更、`safeStorage` APIの追加など","relatedLinks":[{"title":"Release electron v15.0.0 · electron/electron","url":"https://github.com/electron/electron/releases/tag/v15.0.0"},{"title":"safeStorage | Electron","url":"https://www.electronjs.org/docs/latest/api/safe-storage/"}]},{"category":"Headline","title":"Chromium Blog: Chrome 95 Beta: Secure Payment Confirmation, WebAssembly Exception Handling and More","url":"https://blog.chromium.org/2021/09/chrome-95-beta-secure-payment.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 95 betaリリース。\nOrigin TrialとしてAccess HandleをFile System Access APIに追加。\nPerformance Observerに`droppedEntriesCount`の追加、EyeDropper APIの追加、`self.reportError()`の追加、`URLPattern`の追加など。\nまた、FTP URLのサポート終了、数字で終わるIPv4アドレスではないホスト名のサポートを廃止など","relatedLinks":[]},{"category":"Headline","title":"Miniflare is now an official part of the Workers ecosystem 🎉 · cloudflare/miniflare@e1cb97f","url":"https://github.com/cloudflare/miniflare/commit/e1cb97f9891b2818f4be5715ee467668a39f7f80","tags":["cloudflare","Tools","news","testing"],"content":"Cloudflare WorkersのsimulatorであるMiniflareがCloudflare公式となった","relatedLinks":[]},{"category":"Headline","title":"es-module-shims/CHANGELOG.md at 1.0.0 · guybedford/es-module-shims","url":"https://github.com/guybedford/es-module-shims/blob/1.0.0/CHANGELOG.md","tags":["ECMAScript","module","polyfill","ReleaseNote"],"content":"ES Module Shims 1.0.0リリース。\nlexerがWasmを利用していたため`unsafe-eval`のCSP設定が必要となっていたが、asm.jsビルドを使いデフォルトでCSPに対応した。\nまた、パフォーマンスについてはほぼ同等で、Safariに関してはasm.js版の方が早くなっている。","relatedLinks":[{"title":"feat: make the CSP asm.js build the main entry by guybedford · Pull Request #193 · guybedford/es-module-shims","url":"https://github.com/guybedford/es-module-shims/pull/193"},{"title":"feat: asm.js build by guybedford · Pull Request #86 · guybedford/es-module-lexer","url":"https://github.com/guybedford/es-module-lexer/pull/86"},{"title":"content-security-policy/CSP.md at master · WebAssembly/content-security-policy","url":"https://github.com/WebAssembly/content-security-policy/blob/master/proposals/CSP.md"}]},{"category":"Headline","title":"Manifest V2 support timeline - Chrome Developers","url":"https://developer.chrome.com/docs/extensions/mv3/mv2-sunset/","tags":["Chrome","Extension","news"],"content":"Chrome拡張のmanifest v3のロードマップ。\n2022年1月17日に新しくmanifest v2の拡張は申請できなくなる。\n2023年1月に既存のv2拡張は更新もできなくなる。","relatedLinks":[]},{"category":"Headline","title":"ESLint v8.0.0-rc.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2021/09/eslint-v8.0.0-rc.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v8.0.0-rc.0リリース。","relatedLinks":[{"title":"Migrating to v8.0.0 - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/docs/8.0.0/user-guide/migrating-to-8.0.0"}]},{"category":"Headline","title":"Stimulus 3","url":"https://world.hey.com/hotwired/stimulus-3-c438d432","tags":["JavaScript","rails","library","ReleaseNote"],"content":"Stimulus 3 リリース。\nパッケージ名が`stimulus`から`@hotwired/stimulus`へと変更された。\nAction Parametersのサポート、デフォルト値のサポート、`debug`オプションの追加など","relatedLinks":[{"title":"Comparing v2.0.0...v3.0.0 · hotwired/stimulus","url":"https://github.com/hotwired/stimulus/compare/v2.0.0...v3.0.0"}]},{"category":"Headline","title":"Introducing Gatsby 4 | Gatsby","url":"https://www.gatsbyjs.com/gatsby-4/","tags":["React","library","ReleaseNote"],"content":"Gatsby 4ベータリリース。\nHTMLの生成を実際にアクセスするときまで遅延するDeferred Static Generation(DSG)のサポート、SSRのサポート、parallel queryでのビルド時間の改善など","relatedLinks":[{"title":"Matteo Frana on Twitter: ","url":"https://twitter.com/matfrana/status/1442225069158248449"},{"title":"Run Gatsby 4 with DSG and SSR on Netlify today | Netlify","url":"https://www.netlify.com/blog/2021/09/16/run-gatsby-4-with-dsg-and-ssr-on-netlify-today/"}]},{"category":"Article","title":"Blazor Developers Can Now Create Custom Elements, Render Components from JavaScript -- Visual Studio Magazine","url":"https://visualstudiomagazine.com/articles/2021/09/16/aspnet-core-updates.aspx","tags":[".net","C#","WebComponents","article"],"content":".NET 6 RC1でBlazorがCustom Elementをサポートし、BlazorコンポーネントをCustom Elementとして利用できるようになった。","relatedLinks":[{"title":"Announcing .NET 6 Release Candidate 1 - .NET Blog","url":"https://devblogs.microsoft.com/dotnet/announcing-net-6-release-candidate-1/"},{"title":"AspLabs/src/BlazorCustomElements at main · aspnet/AspLabs","url":"https://github.com/aspnet/AspLabs/tree/main/src/BlazorCustomElements"}]},{"category":"Article","title":"Fullstack app with TypeScript, Next.js, Prisma &amp; GraphQL","url":"https://www.prisma.io/blog/fullstack-nextjs-graphql-prisma-oklidw1rhw","tags":["node.js","tutorial","article","prisma","Next.js","GraphQL"],"content":"Next.js/Prisma/GraphQLを使ったアプリケーション開発についてのチュートリアル。","relatedLinks":[]},{"category":"Article","title":"What&#039;s new in React 18? | Yagmur Cetin Tas","url":"https://yagmurcetintas.com/journal/whats-new-in-react-18","tags":["React","article"],"content":"React 18で予定されている変更の概要をまとめた記事","relatedLinks":[]},{"category":"SlideVideo","title":"Get Your Head Straight - Speaker Deck","url":"https://speakerdeck.com/csswizardry/get-your-head-straight","tags":["performance","slide","CSS"],"content":"パフォーマンスの問題を見つけるために`<head>`の中身を表示するct.cssについてのスライド。\n`<script>`や`<style>`について3rd partyであるかやブロッキングしてるかなどを可視化してくれる","relatedLinks":[{"title":"🧠 ct.css – Let’s take a look inside your ","url":"https://csswizardry.com/ct/"}]},{"category":"WebsiteDocument","title":"vite/packages/plugin-react at main · vitejs/vite","url":"https://github.com/vitejs/vite/tree/main/packages/plugin-react","tags":["React","vite","plugin"],"content":"ViteのReact Plugin。\n`@vitejs/plugin-react-refresh`を置き換えるプラグイン","relatedLinks":[]},{"category":"WebsiteDocument","title":"BuilderIO/partytown: Relocate resource intensive third-party scripts off of the main thread and into a web worker. 🎉","url":"https://github.com/BuilderIO/partytown","tags":["JavaScript","library","performance"],"content":"サードパーティスクリプトをWorker内で動かしてメインスレッドのブロッキングを防ぐライブラリ。\nWorker内でのDOM操作をProxyして、同期XHRで通信し、その通信をService Workerでインターセプトしてメインスレッドと非同期でやり取りした結果をWorkerに返している。","relatedLinks":[{"title":"Introducing Partytown 🎉: Run Third-Party Scripts From a Web Worker - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/adamdbradley/introducing-partytown-run-third-party-scripts-from-a-web-worker-2cnp"}]},{"category":"SoftwareLibrary","title":"gvergnaud/ts-pattern: 🎨 The exhaustive Pattern Matching library for TypeScript, with smart type inference.","url":"https://github.com/gvergnaud/ts-pattern","tags":["TypeScript","library"],"content":"TypeScriptでのパターンマッチライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cesanta/elk: A low footprint JavaScript engine for embedded systems","url":"https://github.com/cesanta/elk","tags":["JavaScript","Tools"],"content":"組み込み向けの小さなJavaScriptエンジン","relatedLinks":[]}]},{"meta":{"title":"2021-10-04のJS: Vite 2.6.0、Safari Technology Preview 133、TypeScript 4.5 Beta","author":"azu","layout":"post","date":"2021-10-04T12:21:35.500Z","category":"JSer","tags":["Chrome","performance","node.js","opinion","Tools"],"url":"https://jser.info/2021/10/04/vite-2.6.0-safari-technology-preview-133-typescript-4.5-beta/"},"items":[{"category":"Headline","title":"vite/CHANGELOG.md at main · vitejs/vite","url":"https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md#260-2021-09-29","tags":["vite","ReleaseNote"],"content":"Vite 2.6.0リリース。\nデフォルトのminifyをterserからesbuildに変更、script要素の`async`属性のサポート、\n`.astro`のサポート。\nまた、importしているファイルが別のファイルをimportするように連鎖しているケースで、連鎖的にimportされるファイルを事前にtransformする仕組みの追加など","relatedLinks":[{"title":"feat: default build.minify to esbuild by yyx990803 · Pull Request #5041 · vitejs/vite","url":"https://github.com/vitejs/vite/pull/5041"},{"title":"feat: async script module support, close #3163 by patak-js · Pull Request #4864 · vitejs/vite","url":"https://github.com/vitejs/vite/pull/4864"},{"title":"feat: support .astro files by drwpow · Pull Request #5038 · vitejs/vite","url":"https://github.com/vitejs/vite/pull/5038"},{"title":"feat: pre transform direct imports before requests hit the server by yyx990803 · Pull Request #5037 · vitejs/vite","url":"https://github.com/vitejs/vite/pull/5037"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 133 | WebKit","url":"https://webkit.org/blog/11975/release-notes-for-safari-technology-preview-133/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 133リリース。\nCSSの`calc()`内で`sin()`, `cos()`, `tan()`, `e`, `pi`のサポート。\nCSS Cascade Layersを実験的にサポート、ES Proposal Stage3の`Temporal`をフラグ付きで実装。\n`BroadcastChannel`の有効化、COOPとCOEPヘッダーをサポートし`self.crossOriginIsolated`時に`SharedArrayBuffer`を利用できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.5 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-5-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.5 Betaリリース。\n`module: node12`でのESMサポート、`.mjs`と`.cjs`に対応する拡張子として`.mts`と`.cts`の追加、`package.json`の`exports`フィールドに対応。\nTypeScriptがビルトインで持つ`lib`の型定義を`dependencies`としてロックできるように。\n`Awaited`型の追加、Top-Level awaitに対応した`module: es2022`のサポート、Condition Typesにおいて一部末尾最適化するように。\nimport名に対する`type` modifierのサポート、ES ProposalのPrivate Field Presence Checks、Import Assertionsのサポートなど","relatedLinks":[]},{"category":"Headline","title":"passport/CHANGELOG.md at master · jaredhanson/passport","url":"https://github.com/jaredhanson/passport/blob/master/CHANGELOG.md#050---2021-09-23","tags":["node.js","express","library","ReleaseNote"],"content":"Passport 0.5リリース。\n破壊的な変更として`IncomingMessage`をprototype拡張して`login()`などを追加するmonkey patchが削除された。\n代わりに`app.use(passport.initialize())`のようにmiddlewareとして拡張するように変更など","relatedLinks":[{"title":"Comparing v0.4.1...v0.5.0 · jaredhanson/passport","url":"https://github.com/jaredhanson/passport/compare/v0.4.1...v0.5.0"}]},{"category":"Headline","title":"Announcing React Native 0.66 · React Native","url":"https://reactnative.dev/blog/2021/10/01/version-066","tags":["React","Native","ReleaseNote"],"content":"React Native 0.66リリース。\nAndroidの新しいBluetooth権限に対応、M1 macのサポート改善、Hermes 0.9.0へのアップデート。\nNightlyビルドが`@nightly`のdist-tagで公開されるようになり`yarn upgrade react-native@nightly`でインストールができるようになるなど","relatedLinks":[]},{"category":"Article","title":"Chrome user device characteristics report - Chrome Developers","url":"https://developer.chrome.com/en/blog/device-characteristics/","tags":["Chrome","article","document"],"content":"Chromeの使用統計データから、RAM、コア数、ネットワークの接続種類、WebGLのハードウェアサポートについてのデータを国ごとにまとめたレポート。\nAndroid、Windows、ChromeOSにおいての統計データがまとめられている","relatedLinks":[{"title":"Chrome User Device Characteristics - Google ドキュメント","url":"https://docs.google.com/document/d/1BPz0UnQGotX0dACmJbHbbXFJa38jxmKhhNQ2RLj5Gms/edit"}]},{"category":"Article","title":"Explore JavaScript Dependencies With Lighthouse Treemap","url":"https://sia.codes/posts/lighthouse-treemap/","tags":["Chrome","debug","article","performance"],"content":"Lighthouse v7.5.0で追加されたLighthouse Treemapについて。\nSource Mapを使ってページのファイルサイズを一覧できる","relatedLinks":[{"title":"Release v7.5.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v7.5.0"}]},{"category":"Article","title":"Guidelines for choosing a Node.js framework - Simon Plenderleith","url":"https://simonplend.com/guidelines-for-choosing-a-node-js-framework/","tags":["node.js","JavaScript","library","article","opinion"],"content":"Node.jsのフレームワークを選ぶときに考えること、見るべきポイントについて。\nどのフレームワークを選ぶべきかコンテキストによって異なる。\nそのため、ユースケース、フレームワークの書き方、Promiseの対応、ドキュメント、コミュニティ、プロジェクトの健全性などの見方について書かれている。","relatedLinks":[]},{"category":"Article","title":"ESLint rules for migrating projects from CommonJS to ESM","url":"https://gist.github.com/Jaid/164668c0151ae09d2bc81be78a203dd5","tags":["ESLint","ECMAScript","module","CommonJS","article"],"content":"CommonJSではなくECMAScript Modulesを使うときに関係するESLintルールと設定まとめ。","relatedLinks":[]},{"category":"Article","title":"How to write about web performance | Read the Tea Leaves","url":"https://nolanlawson.com/2021/09/12/how-to-write-about-web-performance/","tags":["performance","article","opinion"],"content":"ウェブパフォーマンスの記事の難しさとベンチマークについて。\nブラウザのパフォーマンスについて書くときに、どのような点に気をつけて書くと良いのかについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Accessible Palette: Create color systems with consistent lightness and contrast","url":"https://accessiblepalette.com/","tags":["accessibility","color","Tools"],"content":"コントラスト比などのアクセシビリティに考慮した色を選ぶカラーパレットツール。","relatedLinks":[{"title":"Accessible Palette: stop using HSL for color systems | Wildbit","url":"https://wildbit.com/blog/2021/09/16/accessible-palette-stop-using-hsl-for-color-systems"}]},{"category":"SoftwareLibrary","title":"dolanmiu/docx: Easily generate .docx files with JS/TS with a nice declarative API. Works for Node and on the Browser.","url":"https://github.com/dolanmiu/docx","tags":["JavaScript","library"],"content":"JavaScriptでdocxファイルを生成するライブラリ。\nビルダー関数で組み立ててコンテンツを作成できる。","relatedLinks":[]}]},{"meta":{"title":"2021-10-12のJS: npm 8.0.0(Node.js 16に同梱)、jQuery Mobileの非推奨化/jQuery UIはメンテナンスモードへ、ESLint 8","author":"azu","layout":"post","date":"2021-10-12T03:42:43.147Z","category":"JSer","tags":["jQuery","security","TypeScript","Tools","npm"],"url":"https://jser.info/2021/10/12/npm-8.0.0node.js-16-jquery-mobilejquery-ui-eslint-8/"},"items":[{"category":"Headline","title":"Release v8.0.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v8.0.0","tags":["npm","ReleaseNote"],"content":"npm 8.0.0リリース。\nNode.js 10のサポート終了、Node.jsモジュール(`require(\"npm\")`)としてのサポートを終了など。\n2021-10-26にリリース予定のNode.js 16 LTSに含まれる","relatedLinks":[{"title":"deps: ","url":"https://github.com/nodejs/node/issues/40168"}]},{"category":"Headline","title":"Release v4.0.0 · immutable-js/immutable-js","url":"https://github.com/immutable-js/immutable-js/releases/tag/v4.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"immutable-js v4.0.0リリース。\nMITライセンスへ変更、TypeScriptとFlowの型を改善、ドキュメントの更新。\n破壊的な変更として、`merge`と`mergeDeep`の挙動変更、`Iterable`をCollectionにリネーム、APIの削除や追加などが含まれる。\nまた、CollectionがECMAScriptのIterable protocolの実装となるように変更など","relatedLinks":[]},{"category":"Headline","title":"Node v16.11.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v16.11.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v16.11.0リリース。\nnpm 8.0.0を同梱するように。","relatedLinks":[]},{"category":"Headline","title":"Lots to see in Firefox 93! - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2021/10/lots-to-see-in-firefox-93/","tags":["Firefox","ReleaseNote"],"content":"Firefox 93リリース。\nAVIFのサポート、ECMAScript Proposal Stage 4のStatic initialization blocksのサポート。\n`ElementInternals.shadowRoot`と `HTMLElement.attachInternals`のサポートなど","relatedLinks":[{"title":"Firefox 93 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/93"},{"title":"Firefox 93.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/93.0/releasenotes/"}]},{"category":"Headline","title":"jQuery UI 1.13.0 released | jQuery UI Blog","url":"https://blog.jqueryui.com/2021/10/jquery-ui-1-13-0-released/","tags":["jQuery","GUI","library"],"content":"jQuery UI 1.13.0リリース\njQuery 1.7以下のサポートを終了し、1.8以降の最新のバージョンを含むjQueryに対応。\nこのリリースをもってjQuery UIはメンテナンスモードとなり、今後はセキュリティやバグ修正のみとなる","relatedLinks":[{"title":"jQuery maintainers update and transition jQuery UI as part of overall modernization efforts | jQuery UI Blog","url":"https://blog.jqueryui.com/2021/10/jquery-maintainers-update-and-transition-jquery-ui-as-part-of-overall-modernization-efforts/"}]},{"category":"Headline","title":"jQuery maintainers continue modernization initiative with deprecation of jQuery Mobile - OpenJS Foundation","url":"https://openjsf.org/blog/2021/10/07/deprecation-of-jquery-mobile/","tags":["jQuery","mobile","ReleaseNote","library"],"content":"jQuery Mobileは2021-10-07をもってDeprecatedとなった。","relatedLinks":[]},{"category":"Headline","title":"Release v0.39.0 · nvm-sh/nvm","url":"https://github.com/nvm-sh/nvm/releases/tag/v0.39.0","tags":["npm","Tools"],"content":"Nodeバージョン管理ツールのnvm 0.39.0リリース。\nWSL/MSYS/Cygwin環境のWindowsをサポート","relatedLinks":[]},{"category":"Headline","title":"ESLint v8.0.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2021/10/eslint-v8.0.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint v8.0.0リリース。\n破壊的な変更としてNode 10のサポート終了\n、`codeframe`と`table`のフォーマッターをコアから削除、`eslint:recommended`の更新。\nまた、`ESLint`クラスを追加し`CLIEngine`クラスを削除、`eslint/lib`のエントリーポイントの削除など。\n機能追加としてES2020のサポート、使われていない`eslint-disable`コメントを削除できるようになるなど","relatedLinks":[{"title":"Migrating to v8.0.0 - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/docs/user-guide/migrating-to-8.0.0"}]},{"category":"Headline","title":"Release v5.0.0 · typescript-eslint/typescript-eslint","url":"https://github.com/typescript-eslint/typescript-eslint/releases/tag/v5.0.0","tags":["ESLint","TypeScript","ReleaseNote"],"content":"TypeScript ESLint 5.0.0リリース。\nESLint 8へアップデート、Node 10のサポート終了。\n`eslint-recommended`のルールを更新、ルールの変更、ASTの更新など","relatedLinks":[{"title":"ESLint v8.0.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2021/10/eslint-v8.0.0-released"}]},{"category":"Article","title":"Safe DOM manipulation with the Sanitizer API","url":"https://web.dev/sanitizer/","tags":["WebPlatformAPI","security","JavaScript","article"],"content":"Sanitizer APIのProposalについて。\nHTML文字列をサニタイズするAPIと`Element#setHTML`での設定方法について。\nDomPurifyなどとは異なりサニタイズしたHTML文字列ではなく、HTMLElementを返すAPIを持つ","relatedLinks":[]},{"category":"Article","title":"Web Streams Everywhere (and Fetch for Node.js) | CSS-Tricks","url":"https://css-tricks.com/web-streams-everywhere-and-fetch-for-node-js/","tags":["node.js","WHATWG","stream","article"],"content":"Web Streams APIについて。\n基本的な使い方、Node 17から利用できるNode.js Streamからの変換について","relatedLinks":[]},{"category":"SlideVideo","title":"Have Single-Page Apps Ruined the Web? | Transitional Apps with Rich Harris, NYTimes - YouTube","url":"https://www.youtube.com/watch?v=860d8usGC0o","tags":["JavaScript","opinion","video"],"content":"SPAとMPAについて。\nSPAにはパフォーマンスなどの欠点があるが、MPAにはナビゲーションやステートなどの欠点がある。\nアプリケーションはSPAとMPAで二分されるものではなく、Next.jsやSvelteKitなどは両方の長所をとるアプローチをしていて、それをTransitionalAppsと呼ぼう的な話","relatedLinks":[{"title":"Rich Harris on Twitter: ","url":"https://twitter.com/Rich_Harris/status/1446601175197880325"}]},{"category":"SoftwareLibrary","title":"lukeed/tsm: TypeScript Module Loader","url":"https://github.com/lukeed/tsm","tags":["TypeScript","ECMAScript","module","Tools"],"content":"Node.jsの`--loader`や`--require`に対応したTypeScriptのloaderライブラリ。\nts-nodeのように扱える。内部的にはesbuildを使っている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Core:Manipulation: Add basic TrustedHTML support by mgol · Pull Request #4927 · jquery/jquery","url":"https://github.com/jquery/jquery/pull/4927","tags":["jQuery","XSS","security","issue"],"content":"jQueryにTrusted Typesのサポートが実装された。\njQuery 4.0に含まれる予定","relatedLinks":[{"title":"Have Trusted Types API built directly into the jQuery Core Files · Issue #4409 · jquery/jquery","url":"https://github.com/jquery/jquery/issues/4409"}]}]},{"meta":{"title":"2021-10-20のJS: Parcel v2、Node v17.0.0、Nuxt 3 beta","author":"azu","layout":"post","date":"2021-10-20T03:47:20.958Z","category":"JSer","tags":["React","node.js","video","bundler","browser"],"url":"https://jser.info/2021/10/20/parcel-v2-node-v17.0.0-nuxt-3-beta/"},"items":[{"category":"Headline","title":"Announcing Parcel v2!","url":"https://parceljs.org/blog/v2/","tags":["JavaScript","bundler","ReleaseNote"],"content":"Parcel v2リリース。\nプラグインの仕組みを刷新、Tree Shakingをデフォルト化、SWCベースのJavaScriptコンパイラに変更、ModernとLegacyビルドの出し分け、Image optimizerの追加。\nbundleのインライン化、ライブラリ向けのビルドのサポート、開発時はリクエストされたタイミングで遅延ビルドできるようになるなど。\nその他にもSource MapライブラリをRustで書き直してパフォーマンス改善やファイル監視の仕組みの改善などが含まれている","relatedLinks":[{"title":"Migration","url":"https://parceljs.org/getting-started/migration/"}]},{"category":"Headline","title":"Deno 1.15 Release Notes | Deno Blog","url":"https://deno.com/blog/v1.15","tags":["deno","ReleaseNote"],"content":"Deno 1.15リリース。\nWeb Crypto APIの更新、FFIの改善、`deno uninstall`コマンドの追加、`deno lint --watch`の追加。\n`Deno.test`がネストしたテストケースをサポート、V8 9.5へアップデート、Node.js互換のモジュールを利用できる`--compat`フラグの追加など","relatedLinks":[{"title":"Deno v1.15で導入されたNode.js互換モードについて","url":"https://zenn.dev/uki00a/articles/node-compat-mode-introduced-in-deno-v1-15"}]},{"category":"Headline","title":"Nuxt - Introducing Nuxt 3 Beta","url":"https://nuxtjs.org/announcements/nuxt3-beta/","tags":["Vue","Next.js","ReleaseNote"],"content":"Nuxt 3 betaリリース。\nVue 3とViteへの対応。\n新しいサーバエンジンのNitro Engineを導入することで、通常のNode.jsサーバ、Serverless、Service Workerなど様々な形でデプロイできるようになっている。","relatedLinks":[]},{"category":"Headline","title":"GitHub Advisory Database now powers npm audit | The GitHub Blog","url":"https://github.blog/2021-10-07-github-advisory-database-now-powers-npm-audit/","tags":["npm","security","Github","news"],"content":"`npm audit`がGitHub Advisory Databaseをみるようになった","relatedLinks":[]},{"category":"Headline","title":"Release v7.0.0 · pinojs/pino","url":"https://github.com/pinojs/pino/releases/tag/v7.0.0","tags":["node.js","library","ReleaseNote"],"content":"pino 7.0.0リリース。\nログの処理を別Threadなどに渡せる`pino.transport()`の追加、`pino.multistream()`の追加、TypeScriptの型を同梱するようになるなど","relatedLinks":[{"title":"Welcome to pino@7.0.0 - and the era of worker","url":"https://www.nearform.com/blog/pino7-0-0-pino-transport-worker_thread-transport/"}]},{"category":"Headline","title":"Node v17.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v17.0.0/","tags":["node.js","ReleaseNote"],"content":"Node v17.0.0リリース。\n`readline`モジュールのPromise対応、OpenSSL 3.0へのアップデート、V8 9.5へアップデート、npm 8.0.0へのアップデート、スタックトレースにNodeバージョンを表示など。\nまたウェブ標準の`strcturedClone()`と`DOMException`をサポート","relatedLinks":[{"title":"Node.js 17 is here!. This blog was written by Bethany… | by Node.js | Node.js Collection | Oct, 2021 | Medium","url":"https://medium.com/the-node-js-collection/node-js-17-is-here-8dba1e14e382"},{"title":"Release v8.0.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v8.0.0"}]},{"category":"Article","title":"A Visual Guide to React Rendering - Cheat Sheet | Alex Sidorenko","url":"https://alexsidorenko.com/blog/react-render-cheat-sheet/","tags":["React","cheatsheet","article"],"content":"Reactのレンダリングのビジュアライズ","relatedLinks":[]},{"category":"SlideVideo","title":"RF21 – Naman Goel – Rethinking CSS - Introducing Stylex - YouTube","url":"https://www.youtube.com/watch?v=ur-sGzUWId4","tags":["facebook","React","CSS","video"],"content":"FacebookのAtomic CSSの実装であるStylexについての動画。\nStylexはReact-Nativeライクなスタイルの書き方をするツールキット、Atomic CSSによって線形的に増えるCSSの量を非線形にできる。\n2021年末にベータ版をリリースする予定。","relatedLinks":[{"title":"Facebook CSS-in-JS Solution Stylex Introduced at React Finland 2021","url":"https://www.infoq.com/news/2021/10/facebook-css-js-stylex/"}]},{"category":"SlideVideo","title":"React Finland 2021 - Talks - YouTube","url":"https://www.youtube.com/playlist?list=PL-a9lBflNu2opNHeISTnlHgGVlI7oGLXi","tags":["React","video"],"content":"React Finland 2021の動画一覧","relatedLinks":[{"title":"React Finland 2021 - Sessions - YouTube","url":"https://www.youtube.com/playlist?list=PL-a9lBflNu2rhk1vr3yr4mdRzzUb_nj5P"}]},{"category":"WebsiteDocument","title":"PrivacyTests.org: open-source tests of web browser privacy","url":"https://privacytests.org/","tags":["browser","privacy"],"content":"ブラウザごとのFinger PrintingやTracking対策などのPrivacy機能をまとめたサイト。","relatedLinks":[]},{"category":"WebsiteDocument","title":"oslabs-beta/sapling: Sapling - A convenient way to traverse your React app in VS Code","url":"https://github.com/oslabs-beta/sapling","tags":["VSCode","React","Extension"],"content":"Reactのコンポーネントツリーをエディタのサイドパネルに表示するVSCode拡張。\nRootとなるコンポーネントを含むファイルを選ぶと、そのコンポーネントが含むコンポーネントをツリーとして表示してくれる","relatedLinks":[{"title":"Sapling - Visual Studio Marketplace","url":"https://marketplace.visualstudio.com/items?itemName=team-sapling.sapling"},{"title":"Introducing Sapling: a VS Code Extension for Traversing React Component Hierarchy | by Team Sapling | Oct, 2021 | JavaScript in Plain English","url":"https://javascript.plainenglish.io/introducing-sapling-a-vs-code-extension-for-traversing-your-react-component-hierarchy-3ac94d95887e"}]},{"category":"Book","title":"Practical Svelte - Create Performant Applications with the Svelte Component Framework | Alex Libby | Apress","url":"https://www.apress.com/gp/book/9781484273739","tags":["Svelte","book"],"content":"Svelteを使ったウェブアプリケーション開発の入門書","relatedLinks":[]},{"category":"Book","title":"Sairyss/domain-driven-hexagon: Guide on Domain-Driven Design, Hexagonal architecture, best practices etc.","url":"https://github.com/Sairyss/domain-driven-hexagon","tags":["DDD","document","TypeScript"],"content":"ドメイン駆動設計(DDD)についてのガイド。\n主にDDDに関係する用語、設計、TypeScriptでのサンプルを用いた技術的な戦術についての解説をまとめたもの。","relatedLinks":[]}]},{"meta":{"title":"2021-10-27のJS: Yarn 3.1、Node.js 16.13.0(LTS)、Next.js 12","author":"azu","layout":"post","date":"2021-10-27T02:19:56.741Z","category":"JSer","tags":["Chrome","React","book","browser","performance"],"url":"https://jser.info/2021/10/27/yarn-3.1-node.js-16.13.0lts-next.js-12/"},"items":[{"category":"Headline","title":"Chromium Blog: Chrome 96 Beta: Conditional Focus, Priority Hints, and More","url":"https://blog.chromium.org/2021/10/chrome-96-beta-conditional-focus.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 96 betaリリース。\nChromeバージョン 100をテストできるフラグの追加。\nOrigin TrialとしてConditional Focus、Priority Hintsの追加。\nBFCacheがDeskopでも有効化、CSS `:autofill`擬似クラスとMedia Queryの`prefers-contrast`をサポート。\nHTTPS DNS Recordsのサポート、WebAssemblyのCSP対応で`wasm-unsafe-eval`をサポートなど","relatedLinks":[]},{"category":"Headline","title":"\\[Early Preview\\] New React Documentation by rachelnabors · Pull Request #3965 · reactjs/reactjs.org","url":"https://github.com/reactjs/reactjs.org/pull/3965","tags":["React","issue","document"],"content":"Reactの新しいドキュメントのベータ版がリリース","relatedLinks":[]},{"category":"Headline","title":"Security issue: compromised npm packages of ua-parser-js (0.7.29, 0.8.0, 1.0.0) - Questions about deprecated npm package ua-parser-js · Issue #536 · faisalman/ua-parser-js","url":"https://github.com/faisalman/ua-parser-js/issues/536","tags":["npm","security","issue","news"],"content":"マルウェアを含むua-parser-js 0.7.29/0.8.0/1.0.0が公開されていたため、\nそれぞれpatch versionとして0.7.30/0.8.1/1.0.1がリリースされた。","relatedLinks":[{"title":"Newly Found npm Malware Mines Cryptocurrency on Windows, Linux, macOS Devices","url":"https://blog.sonatype.com/newly-found-npm-malware-mines-cryptocurrency-on-windows-linux-macos-devices"}]},{"category":"Headline","title":"Yarn 3.1 🎃👻 Corepack, ESM, pnpm, Optional Packages ... - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/arcanis/yarn-31-corepack-esm-pnpm-optional-packages--3hak","tags":["yarn","ReleaseNote"],"content":"Yarn 3.1リリース。\n`yarn init -2`でCorepackの対応、PnPでのEMSサポート、`nodeLinker: pnpm`のサポート。\n`optionalDependencies`で指定したアーキテクチャだけをダウンロードする`supportedArchitectures`の設定を追加、`wrokspaces`コマンドに`--since`フラグの追加","relatedLinks":[{"title":"berry/CHANGELOG.md at master · yarnpkg/berry","url":"https://github.com/yarnpkg/berry/blob/master/CHANGELOG.md#310"},{"title":"Different strategy for installing platform-specific binaries · Issue #789 · evanw/esbuild","url":"https://github.com/evanw/esbuild/issues/789#issuecomment-901467782"}]},{"category":"Headline","title":"Release v1.2.0 - Masters of the Universe · solidjs/solid","url":"https://github.com/solidjs/solid/releases/tag/v1.2.0","tags":["jsx","ReleaseNote","library"],"content":"Solid v1.2.0リリース。\nCustom Rendererのサポート、`html`テンプレートリテラルでSpread構文のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node v16.13.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v16.13.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 16のLong Term Support (LTS)となる16.13.0がリリースされた。\n2024-04-30までメンテナンスされる。","relatedLinks":[]},{"category":"Headline","title":"Blog - Next.js 12 | Next.js","url":"https://nextjs.org/blog/next-12","tags":["Next.js","ReleaseNote"],"content":"Next.js 12リリース。\nSWCベースのビルドに対応、Middlwareの対応、React 18(Server-Side StreamingとReact Server Components)に対応。\nwebpackの`buildHttp`を使ったURL Importsに対応、クローラーbotに対するISRの最適化、AVIFの対応など","relatedLinks":[]},{"category":"Article","title":"Optimizing resource loading with Priority Hints","url":"https://web.dev/priority-hints/","tags":["Chrome","browser","article","performance"],"content":"Chrome 96 betaでのOrigin Trialで実装されたPriority Hintsについて。\n`importance`属性を使ってリソースロードの優先度のHintを定義できる。","relatedLinks":[]},{"category":"Article","title":"TypeScript 4.5 以降で ESM 対応はどうなるのか？","url":"https://zenn.dev/teppeis/articles/2021-10-typescript-45-esm","tags":["TypeScript","article"],"content":"TypeScriptのESM対応について。","relatedLinks":[]},{"category":"Article","title":"Monitor your web application with the Reporting API","url":"https://web.dev/reporting-api/","tags":["Chrome","browser","article"],"content":"Chrome 96から利用できる`Reporting-Endpoints`について。\n`Report-To`はDeprecatedとなり`Reporting-Endpoints`を使うようになる。\nCSPエラー、ネットワークエラー、ポリシーエラーのレポート先を指定できる","relatedLinks":[{"title":"Reporting API: Isolate reports per-document and support the Reporting-Endpoints header - Chrome Platform Status","url":"https://www.chromestatus.com/feature/5712172409683968"},{"title":"Migrate to Reporting API v1","url":"https://web.dev/reporting-api-migration/#migration-steps"}]},{"category":"Article","title":"New WebKit Features in Safari 15 | WebKit","url":"https://webkit.org/blog/11989/new-webkit-features-in-safari-15/","tags":["safari","article"],"content":"Safari 15の変更点について。\nWebExtensionsの対応、`theme-color`の対応、CSSの`aspect-ratio`、`list-style-type`に新しい属性値の追加など。\nJavaScriptのTop-Level `await`、Error Cause、Private class methodsの対応。\nまた、WebGL 2、Web Share API、1秒以内の制限付きで`requestAnimationFrame`を間に入れたユーザージェスチャが伝搬するようになるなど。\nその他には、iPadでのVP9/WebMのハードウェアアクセラレーション対応、Private Click Measurementの更新、`autocomplete=one-time-code`の対応など","relatedLinks":[]},{"category":"WebsiteDocument","title":"Core Web Vitals Checker | Calibre","url":"https://calibreapp.com/tools/core-web-vitals-checker","tags":["performance","Tools","Chrome"],"content":"Chrome User Experience Report (CrUX)のデータを元にWebVitalのスコアをチェックするツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"unjs/unstorage: 🌍 💾 Universal Storage Layer","url":"https://github.com/unjs/unstorage","tags":["JavaScript","library"],"content":"localForageなどのようにdriverを切り替え可能なKVSライブラリ。","relatedLinks":[{"title":"localForage/localForage: 💾 Offline storage, improved. Wraps IndexedDB, WebSQL, or localStorage using a simple but powerful API.","url":"https://github.com/localForage/localForage"},{"title":"azu/kvs: Lightweight key-value storage library for Browser, Node.js, and In-Memory.","url":"https://github.com/azu/kvs"}]},{"category":"Book","title":"Gatsby: The Definitive Guide","url":"https://learning.oreilly.com/library/view/gatsby-the-definitive/9781492087502/","tags":["JavaScript","React","book"],"content":"Gatsbyの入門書","relatedLinks":[]},{"category":"Book","title":"流麗なJavaScript 第3版 (no starch pressress) | マリン・ハーバーベーク, イノウ |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4802613377/","tags":["JavaScript","book"],"content":"Eloquent JavaScriptの翻訳本","relatedLinks":[]}]},{"meta":{"title":"2021-11-02のJS: Babel 7.16.0、AVA 4 RC1、ウェブサイトのセキュリティヘッダー","author":"azu","layout":"post","date":"2021-11-02T02:46:40.126Z","category":"JSer","tags":["TypeScript","node.js","Tools","WebComponents","Vue"],"url":"https://jser.info/2021/11/02/babel-7.16.0-ava-4-rc1-/"},"items":[{"category":"Headline","title":"Release Pinia v2.0.0 · posva/pinia","url":"https://github.com/posva/pinia/releases/tag/pinia%402.0.0","tags":["Vue","JavaScript","library"],"content":"Vueのステート管理ライブラリのPinia v2.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"7.16.0 Released: ESLint 8 and TypeScript 4.5 · Babel","url":"https://babeljs.io/blog/2021/10/29/7.16.0","tags":["babel","ReleaseNote"],"content":"Babel 7.16.0リリース。\n`@babel/preset-env`がClass static blocksを含むように、TypeScript 4.5のサポート。\npipeline operatorのHack topic tokenのオプションをサポート、ESLint 8のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0-alpha.0 · reduxjs/redux","url":"https://github.com/reduxjs/redux/releases/tag/v5.0.0-alpha.0","tags":["redux","JavaScript","TypeScript","ReleaseNote"],"content":"Redux 5.0.0 αリリース。\nコードベースをTypeScriptに書き換えている","relatedLinks":[]},{"category":"Headline","title":"Release AVA 4 Release Candidate 1 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v4.0.0-rc.1","tags":["node.js","testing","library","ReleaseNote"],"content":"AVA 4 RC1リリース。\n破壊的な変更としてNode 10のサポート終了、スナップショットファイルの形式変更、`t.cb()`と`t.end()`の削除など。\n`worker_threads`の対応、親ディレクトリの`ava.config`ファイルを探索するように、ESMの対応など","relatedLinks":[]},{"category":"Article","title":"Photoshop&#039;s journey to the web","url":"https://web.dev/ps-on-the-web/","tags":["Chrome","WebAssembly","article"],"content":"Photoshopをウェブで動かすためにGoogleとAdobeが取り組んだことについて。\nEmscriptenを使ってC++をWebAssemblyにコンパイルしたが、マルチスレッド/デバッグ/高性能なストレージが不足していたためそれを補う機能開発。\nまたWebComponentとLitを使ったUIについて","relatedLinks":[]},{"category":"Article","title":"Supercharge Your NodeJS With Rust | yield code();","url":"https://yieldcode.blog/supercharge-nodejs-with-rust/","tags":["node.js","Rust","article"],"content":"Neonを使いRustでNode APIを使ったNative Moduleを作り、Node.jsから利用する方法についての解説記事","relatedLinks":[]},{"category":"Article","title":"Reflection at Reflect: The Reflect and Proxy APIs | Reflect","url":"https://reflect.run/articles/reflection-at-reflect/","tags":["ECMAScript","proxy","article"],"content":"ReflectとProxyの基本的な使い方についての解説記事。","relatedLinks":[]},{"category":"Article","title":"Spectre の脅威とウェブサイトが設定すべきヘッダーについて","url":"https://blog.agektmr.com/2021/11/browser-security.html","tags":["browser","security","article","privacy"],"content":"ウェブサイトでのクロスサイト/クロスオリジンに関連するセキュリティヘッダーについて。\nSpectre後のサイドチャネル攻撃に関係するヘッダーの解説など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dominikg/tsconfck: A utility to find and parse tsconfig files without depending on typescript","url":"https://github.com/dominikg/tsconfck","tags":["TypeScript","library","toool"],"content":"`tsconfig.json`の探索や設定内容を取得するライブラリ。\n`extends`した内容も取得できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mizchi/mints","url":"https://github.com/mizchi/mints","tags":["TypeScript","Tools","library"],"content":"TypeScriptのコードから型を取り除くツール。\nファイルサイズの小さいTypeScript to JavaScriptのツールの作成を目的にしている。","relatedLinks":[{"title":"mints: 5.7kb の TypeScript コンパイラを作った","url":"https://zenn.dev/mizchi/articles/minimum-tsc-mints"}]},{"category":"SoftwareLibrary","title":"Spectrum Web Components","url":"https://opensource.adobe.com/spectrum-web-components/","tags":["adobe","WebComponents","library","JavaScript"],"content":"AdobeのデザインシステムであるSpectrumのWeb Components実装。\nLitをベースにしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"OptimalBits/bull: Premium Queue package for handling distributed jobs and messages in NodeJS.","url":"https://github.com/OptimalBits/bull","tags":["node.js","library"],"content":"Redisベースの分散JobキューNode.jsライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mithi/react-philosophies: 🧘 Things I think about when I write React code 🧘","url":"https://github.com/mithi/react-philosophies","tags":["React","document"],"content":"Reactを使ったコードを書くときに考えることについて書かれたドキュメント","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Polight/lego: 🚀 Web-components made lightweight &amp; Future-Proof.","url":"https://github.com/Polight/lego","tags":["JavaScript","WebComponents","library","Tools"],"content":"HTMLファイルに書いた`<template>`、`<script>`、`<style>`からCustom Elementを作成するツールとRuntimeライブラリ。","relatedLinks":[]}]},{"meta":{"title":"2021-11-09のJS: React Router v6、Angular v13、ChromeのRecord and Replay、TypeScriptへの段階的な移行","author":"azu","layout":"post","date":"2021-11-09T02:39:44.474Z","category":"JSer","tags":["React","TypeScript","Chrome","performance","node.js"],"url":"https://jser.info/2021/11/09/react-router-v6-angular-v13-chromerecord-and-replay-typescript/"},"items":[{"category":"Headline","title":"Release v11.0.0 · puppeteer/puppeteer","url":"https://github.com/puppeteer/puppeteer/releases/tag/v11.0.0","tags":["Chrome","library","ReleaseNote"],"content":"puppeteer 11.0.0リリース。\nOut of Processなiframeのwaitをサポートする`Page.waitForFrame()`と`frame.isOOPFrame()`の追加。\nHTTP Requestのinitiatorを取得できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Recoil 0.5 | Recoil","url":"https://recoiljs.org/blog/2021/11/03/0.5.0-release","tags":["React","library","ReleaseNote"],"content":"Recoil 0.5リリース。\nキャッシュをクリアできる`useRecoilRefresher_UNSTABLE()`の追加。\n`onSet`のコールバックに`isReset`を追加、`getLoadable()`/`getPromise()`/`getInfo_UNSTABLE()`の追加など","relatedLinks":[]},{"category":"Headline","title":"React Router v6 | Remix","url":"https://remix.run/blog/react-router-v6","tags":["React","library","ReleaseNote"],"content":"React Router v6リリース。\nReact Hooksベースで再実装、`<Route>`のネストの改善、`<Link to>`の値に相対パスの解釈を`<Route path>`を基準にするように変更など","relatedLinks":[{"title":"React Router v6 | Remix","url":"https://remix.run/blog/react-router-v6#upgrading-to-react-router-v6"},{"title":"React Router | Upgrading from v5","url":"https://reactrouter.com/docs/en/v6/upgrading/v5"}]},{"category":"Headline","title":"Announcing TypeScript 4.5 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-5-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.5 RCリリース。\n4.5 betaで導入されていたESM対応の`module: node12`はリリースが延期となった。","relatedLinks":[]},{"category":"Headline","title":"Nightwatch v2 is Now in Beta | Nightwatch.js Blog","url":"https://nightwatchjs.org/blog/nightwatch-v2-beta-is-available.html","tags":["E2E","testing","library","ReleaseNote"],"content":"Nightwatch v2リリース。\nChrome DevTools ProtocolとWebDriver BiDIのサポート、CucumberJSのサポートなど","relatedLinks":[]},{"category":"Headline","title":"V8 release v9.7 · V8","url":"https://v8.dev/blog/v8-release-97","tags":["V8","ReleaseNote"],"content":"V8 v9.7リリース。\nArrayとTypedArrayに`findLast`と`findLastIndex`の実装。","relatedLinks":[]},{"category":"Headline","title":"Angular v13 is now Available. We’re back with the brand new release… | by Mark Thompson (@marktechson) | Nov, 2021 | Angular Blog","url":"https://blog.angular.io/angular-v13-is-now-available-cce66f7bc296","tags":["Angular","ReleaseNote"],"content":"Angular 13リリース。\nIvyがデフォルトとなったためView Engineを削除、Angular Package Format(APF)が`exports`フィールドのサポート、IE 11のサポート終了。\nAngular CLIが永続ビルドキャッシュをサポート、テスト時にDOMのクリーンアップがデフォルト化など","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · markedjs/marked","url":"https://github.com/markedjs/marked/releases/tag/v4.0.0","tags":["Markdown","JavaScript","library","ReleaseNote"],"content":"markded 4.0.0リリース。\nESMの対応、default exportを削除したため`import { markded } from \"marked\"`のnamed importを利用するに変更など","relatedLinks":[]},{"category":"Article","title":"What&#039;s new in PageSpeed Insights","url":"https://web.dev/whats-new-pagespeed-insights/","tags":["google","performance","article"],"content":"新しいPageSpeed Insightsの画面解説。\n計測データとCrUXデータ(Lab)が混在していたが、CrUXのデータはOrigin Summaryというタブに分離された。\nCore Web Vitalsのスコア表示などが含まれる予定","relatedLinks":[]},{"category":"Article","title":"Malware found in coa and rc, two npm packages with 23M weekly downloads - The Record by Recorded Future","url":"https://therecord.media/malware-found-in-coa-and-rc-two-npm-packages-with-23m-weekly-downloads/","tags":["npm","security","article"],"content":"`coa`と`rc`パッケージにマルウェアが含まれていたバージョンがpublishされていた問題について。\n現在は無効化されているが、それぞれ次のバージョンが問題となっている。\n\n- coa: 2.0.3, 2.0.4, 2.1.1, 2.1.3, 3.0.1, 3.1.3\n- rc: 1.2.9, 1.3.9, 2.3.9\n\n- [Embedded malware in coa · GHSA-73qr-pfmq-6rp8 · GitHub Advisory Database](https://github.com/advisories/GHSA-73qr-pfmq-6rp8 \"Embedded malware in coa · GHSA-73qr-pfmq-6rp8 · GitHub Advisory Database\")\n- [Embedded malware in rc · GHSA-g2q5-5433-rhrf · GitHub Advisory Database](https://github.com/advisories/GHSA-g2q5-5433-rhrf \"Embedded malware in rc · GHSA-g2q5-5433-rhrf · GitHub Advisory Database\")","relatedLinks":[]},{"category":"Article","title":"Record, replay and measure user flows - Chrome Developers","url":"https://developer.chrome.com/docs/devtools/recorder/","tags":["Chrome","article","debug"],"content":"Chrome 97の開発者ツールにプレビュー実装されたRecorder panelについて。\nユーザー操作を記録し再生できる。またユーザーフローとPerformance計測を組み合わせられる。\n記録した内容は編集したり、Puppeteerスクリプトとして出力できる。","relatedLinks":[]},{"category":"Article","title":"TypeScriptのJSDocサポートでできること、できないこと","url":"https://zenn.dev/qnighy/articles/56917d9bf9077b","tags":["TypeScript","JavaScript","article"],"content":"TypeScriptのJSDocによる型アノテーションについての解説。\nTypeScriptとJSDocの型アノテーションでの表現力の違い、JSDocでの型アノテーションの書き方について","relatedLinks":[]},{"category":"Article","title":"A Comprehensive Guide To Error Handling In Node.js - Honeybadger Developer Blog","url":"https://www.honeybadger.io/blog/errors-nodejs/","tags":["JavaScript","node.js","article"],"content":"Node.jsのエラーハンドリングについての記事。\n例外、コールバック、Promise、EventEmitterそれぞれにおけるエラーのハンドリング。\nカスタムエラーでの分類、Operational ErrorとProgrammer Errorの違い。\nまたOperation Errorが発生したときの対処方法とProgrammer Errorの防止策について","relatedLinks":[]},{"category":"Article","title":"インクリメンタルに新しい技術を取り入れる方法。TypeScriptへの移行を例にしたプロセス","url":"https://tech.plaid.co.jp/karte-blocks-incremental-development/","tags":["JavaScript","TypeScript","node.js","React","Vue","article"],"content":"JavaScriptをTypeScriptを段階的に移行する方法について。\n最初からしっかりとした型をつける方法とゆるい型に変換してから型をつける方法の比較、マイグレーションの順番、型を使ったAPIバリデーション、VueからReactへの段階的な移行など。\nインクリメンタルな移行するときのポイントについて。","relatedLinks":[]},{"category":"Article","title":"Etsy’s Journey to TypeScript - Code as Craft","url":"https://codeascraft.com/2021/11/08/etsys-journey-to-typescript/","tags":["TypeScript","ESLint","article"],"content":"TypeScriptの採用戦略についての記事。\n厳密な型付けへの移行方法、typescript-eslintを使った一部の汎用型と構文の禁止、APIへの型付けについて。\nTypeScriptの型チェックのパフォーマンス問題のデバッグ、教育について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Web Performance Metrics Cheatsheet","url":"https://bitsofco.de/web-performance-metrics-cheatsheet/","tags":["performance","cheatsheet"],"content":"ウェブパフォーマンスのメトリクスチートシート。\n4つのステージにグループ分けし、それぞれに関連するメトリクスをまとめている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"urin/qrono: 🕥 Just right date time library","url":"https://github.com/urin/qrono","tags":["JavaScript","library"],"content":"Immutableな日付操作ライブラリ。\nUTCとローカル時間のみを扱うことで、夏時間のあいまいな時間を正確に扱う。","relatedLinks":[{"title":"こういうのでいいんだよ、な JavaScript日付時刻ライブラリ Qrono","url":"https://zenn.dev/urin/articles/6ca9cf8174fd92"}]},{"category":"SoftwareLibrary","title":"Shopify/hydrogen: React-based framework for building dynamic, Shopify-powered custom storefronts.","url":"https://github.com/Shopify/hydrogen","tags":["React","vite","library"],"content":"Shopifyのストアフロントを作成するReactベースのフレームワーク。\nViteとReactをベースにしていて、React ServerSide Componentsを利用している。","relatedLinks":[{"title":"Meet Hydrogen: A React Framework For Dynamic, Contextual And Personalized E-Commerce — Smashing Magazine","url":"https://www.smashingmagazine.com/2021/11/hydrogen-react-framework-dynamic-contextual-personalized-ecommerce/"}]},{"category":"Book","title":"JavaScript（第7版） | Ohmsha","url":"https://www.ohmsha.co.jp/book/9784873119700/","tags":["JavaScript","book"],"content":"2021年12月2日発売\nサイ本 7版の翻訳本","relatedLinks":[]}]},{"meta":{"title":"2021-11-18のJS: Node v17.1.0、Lighthouse 9.0.0(Audit User Flows)、TypeScriptで型チェッカーを作る","author":"azu","layout":"post","date":"2021-11-17T15:25:06.201Z","category":"JSer","tags":["node.js","TypeScript","Chrome","Tools","browser"],"url":"https://jser.info/2021/11/18/node-v17.1.0-lighthouse-9.0.0audit-user-flows-typescript/"},"items":[{"category":"Headline","title":"Node v17.1.0 (Current) | Node.js","url":"https://nodejs.org/uk/blog/release/v17.1.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 17.1.0リリース。\nES ModulesのImport AssertionによるJSONのimportができるように。","relatedLinks":[]},{"category":"Headline","title":"Release eslint-config-airbnb-v19.0.0 · airbnb/javascript","url":"https://github.com/airbnb/javascript/releases/tag/eslint-config-airbnb-v19.0.0","tags":["ESLint","config","ReleaseNote"],"content":"eslint-config-airbnb 19.0.0リリース。\nESLint 8のサポート","relatedLinks":[{"title":"eslint v8 support · Issue #2478 · airbnb/javascript","url":"https://github.com/airbnb/javascript/issues/2478"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 135 | WebKit","url":"https://webkit.org/blog/12040/release-notes-for-safari-technology-preview-135/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 135リリース。\nCSSの`accent-color`のサポート、`flex-basis: content`のサポート。\n`loading`属性を使った画像の遅延ロードをサポート。\n120Hzのディスプレイでは120Hzでスクロールアニメーションが動くように","relatedLinks":[]},{"category":"Headline","title":"wrangler 2.0 — a new developer experience for Cloudflare Workers","url":"https://blog.cloudflare.com/wrangler-v2-beta/","tags":["cloudflare","webworker","ReleaseNote"],"content":"Cloudflare WorkersのCLIであるwrangler 2.0リリース。\n`wrangler dev <filename>`で設定なしでデプロイ、開発できるように、`--public <path>`での静的アセットの指定をサポート。\n`--local`でMiniflareベースのオフラインで動くローカルモードをサポート","relatedLinks":[]},{"category":"Headline","title":"Release 0.6.0 – Info sections, bailouts, state change locations, open in editor and more · lahmatiy/react-render-tracker","url":"https://github.com/lahmatiy/react-render-tracker/releases/v0.6.0","tags":["React","debug","library","ReleaseNote"],"content":"Reactの意図しないレンダリングを見つけるデバッグツールのreact-render-tracker 0.6.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Electron 16.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-16-0","tags":["Electron","ReleaseNote"],"content":"Electron 16.0.0リリース。\nChromium 96、Node.js 16.9.1、V8 9.6へアップデート。\nWebHID APIのサポート、native modulesをビルドするためにnode-gypを使っているプロジェクトでは`--force-process-config`が必要となる変更になど","relatedLinks":[]},{"category":"Headline","title":"Announcing Serverless Framework v3 Beta","url":"https://www.serverless.com/blog/serverless-framework-v3-beta","tags":["serverless","node.js","ReleaseNote"],"content":"Serverless Framework v3 Betaリリース。\n`serverless`コマンドの出力の改善、`--verbose`のサポート、非推奨だったAPIの削除など","relatedLinks":[{"title":"Serverless Framework - Upgrading to v3","url":"https://www.serverless.com/framework/docs/guides/upgrading-v3"}]},{"category":"Headline","title":"Release v9.0.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v9.0.0","tags":["Chrome","performance","Tools","ReleaseNote"],"content":"Lighthouse v9.0.0リリース。\nNode 12のサポート終了、いくつかのauditを削除。\nページ遷移を含むAuditをとるAudit User Flowsをサポートなど","relatedLinks":[{"title":"Lighthouse user flows","url":"https://web.dev/lighthouse-user-flows/"}]},{"category":"Article","title":"Reconstructing TypeScript, part 0: intro and background","url":"https://jaked.org/blog/2021-09-07-Reconstructing-TypeScript-part-0","tags":["TypeScript","article","babel","AST"],"content":"TypeScriptの型チェッカーを実装しながら、TypeScriptの型について学ぶ連載記事。\nパーサにはBabelを使い、パースしたASTと型情報をチェックする型チェッカーを実装していく","relatedLinks":[]},{"category":"Article","title":"Mastering TypeScript Template Literal Types | by Jose Granja | Nov, 2021 | Better Programming","url":"https://betterprogramming.pub/mastering-typescript-template-literal-types-f4131a94ffb1","tags":["TypeScript","article"],"content":"Typescript 4.1 で追加されたTemplate Literal Typeについての解説記事。\n基本的な使い方、制限、Utility Type、`infer`と組み合わせた型を推論する書き方やMapped Typesとの組み合わせについてなど","relatedLinks":[]},{"category":"Article","title":"SharedArrayBuffer と過渡期な cross-origin isolation の話","url":"https://blog.agektmr.com/2021/11/cross-origin-isolation.html","tags":["browser","Chrome","article"],"content":"`SharedArrayBuffer`や高分解能Timerを利用するためにはcross origin isolationな状態が必要となる。\ncross origin isolationな状態にするための条件であるHTTPヘッダについての解説。","relatedLinks":[]},{"category":"Article","title":"Copy CSS as JavaScript - Chrome DevTools - Dev Tips","url":"https://umaar.com/dev-tips/249-copy-css-as-js/","tags":["Chrome","debug","article"],"content":"Chromeの開発者ツールでCSSプロパティをJavaScriptのCamelCaseなプロパティをもつオブジェクトとしてコピーできるようになった。\nCSSパネルからCSS in JSのObejct Stylesでコピーできる","relatedLinks":[]},{"category":"Article","title":"Less Absolute Positioning With Modern CSS - Ahmad Shadeed","url":"https://ishadeed.com/article/less-absolute-positioning-modern-css/","tags":["CSS","article"],"content":"CSSの`position: absolute`を使わなくても同等の表現ができるという紹介。\nGridを使った要素の重ね、`order`を使った表示順の変更、`aspect-ratio`を使った画像のアスペクト比の指定など。\nまた`position: absolute`を使った方が良いユースケースについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Bundle Scanner - Identify NPM libraries included in Javascript files","url":"https://bundlescanner.com/","tags":["npm","Tools","webservice"],"content":"指定したURLでどのようなJavaScriptファイルがあり、そのJavaScriptファイルから利用されているnpmモジュールを抽出するツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"niksy/node-stdlib-browser: Node standard library for browser.","url":"https://github.com/niksy/node-stdlib-browser","tags":["node.js","polyfill","library","browser"],"content":"Node.js Core Modulesのブラウザ向けpolyfillをまとめたライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"koskimas/kysely: A type-safe typescript SQL query builder","url":"https://github.com/koskimas/kysely","tags":["TypeScript","PostgreSQL","MySQL","library","node.js"],"content":"TypeScriptで書かれたSQLクエリビルダー。\nPostgreSQLとMySQLに対応したクエリの作成と実行ができる。\nSchemaを型として定義し、その型を元にクエリを構築できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gajus/liqe: Lightweight and performant Lucene-like parser and search engine.","url":"https://github.com/gajus/liqe","tags":["search","JavaScript","library"],"content":"検索演算子のパーサライブラリ","relatedLinks":[]}]},{"meta":{"title":"2021-11-23のJS: TypeScript 4.5、React 18 beta、Remix v1","author":"azu","layout":"post","date":"2021-11-23T14:07:26.950Z","category":"JSer","tags":["Tools","TypeScript","React","Chrome","debug"],"url":"https://jser.info/2021/11/23/typescript-4.5-react-18-beta-remix-v1/"},"items":[{"category":"Headline","title":"Announcing TypeScript 4.5 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-5/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.5リリース。\nTypeScriptがビルトインで持つ`lib`の型定義を`dependencies`としてロックできるように。\n`Awaited`型の追加、Top-Level awaitに対応した`module: es2022`のサポート、Condition Typesにおいて一部末尾最適化するように。\nimport名に対する`type` modifierのサポート、ES ProposalのPrivate Field Presence Checks、Import Assertionsのサポートなど","relatedLinks":[]},{"category":"Headline","title":"React 18 is now in beta · Discussion #112 · reactwg/react-18","url":"https://github.com/reactwg/react-18/discussions/112","tags":["React","ReleaseNote"],"content":"React 18 betaリリース。\n`useSyncExternalStore`(`useMutableSource`をリネーム)、`useId`、`useInsertionEffect`の追加など","relatedLinks":[]},{"category":"Headline","title":"Remix v1 | Remix","url":"https://remix.run/blog/remix-v1","tags":["React","library","ReleaseNote"],"content":"ReactベースのウェブフレームワークであるRemix v1リリース。\nCLI、ルーティング、ライフサイクルメソッド、React Hooksなどを提供する。\nクライアントサーバモデルで、サーバが返すデータをフィルターし、最小限のデータにすることを目的にした`loader`関数などを持つ。\nfly.ioやCloudflare Workersなどサーバ側をEdgeで動かすことを目的にしている。","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0 · sindresorhus/execa","url":"https://github.com/sindresorhus/execa/releases/tag/v6.0.0","tags":["node.js","library","ReleaseNote"],"content":"execa 6.0.0リリース。\nESMのみのサポートに変更、default exportを削除しnamed exportに変更など","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · emberjs/ember.js","url":"https://github.com/emberjs/ember.js/releases/tag/v4.0.0","tags":["Ember","ReleaseNote"],"content":"Ember 4.0.0リリース","relatedLinks":[{"title":"Ember 3.28 and 4.0 Beta Released","url":"https://blog.emberjs.com/ember-3-28-released"}]},{"category":"Article","title":"Chrome Devtools による フロントエンドパフォーマンスの計測","url":"https://zenn.dev/koki_tech/articles/9deb70d0a9befb","tags":["Chrome","debug","article"],"content":"Chromeの開発者ツールのパフォーマンスタブの読み方の図解","relatedLinks":[]},{"category":"Article","title":"Reimagine Atomic CSS","url":"https://antfu.me/posts/reimagine-atomic-css","tags":["CSS","article"],"content":"Atomic CSSについて。\n事前生成 + PurgeのTailwindのアプローチ、オンデマンド生成のWindi CSSについて。\nまた、Atomic CSSエンジンのUnoCSSを作っているという話。","relatedLinks":[]},{"category":"Article","title":"What&#039;s New In DevTools (Chrome 96) - Chrome Developers","url":"https://developer.chrome.com/blog/new-in-devtools-96/","tags":["Chrome","debug","article"],"content":"Chrome96の開発者ツールの変更点について。\nCSS Overviewパネルの追加、`prefers-contrast`とAuto Dark Themeのエミュレート機能の追加。\nNetworkパネルにPayloadタブの追加、試験的にReporting APIパネルを追加など","relatedLinks":[]},{"category":"Article","title":"Migrating from Puppeteer to Playwright | Checkly","url":"https://www.checklyhq.com/guides/puppeteer-to-playwright/","tags":["browser","testing","Tools","article"],"content":"PuppeteerからPlaywrightの移行方法についての記事。\nAPIの対応表、マイグレーション方法、Playwrightのauto-waiting、二つの違いについてなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"divriots/browser-vite: Vite in the browser.","url":"https://github.com/divriots/browser-vite","tags":["vite","ServiceWorker","Tools"],"content":"ViteをブラウザのService Workersで動かすプロジェクト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Bun - fast JavaScript &amp; CSS bundler","url":"https://bun.sh/","tags":["babel","webpack","Tools"],"content":"Zigで書かれたJavaScript/TypeScript/CSSに対応したTranspiler/Bundlerツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"d-kimuson/type-predicates-generator: generating predicates and assertion function by type definitions.","url":"https://github.com/d-kimuson/type-predicates-generator","tags":["TypeScript","library","Tools"],"content":"TypeScriptのコードからtype predicatesをするassertion関数を生成するツール","relatedLinks":[{"title":"TypeScriptの型定義から型ガードを自動生成する type-predicates-generator の紹介","url":"https://zenn.dev/kimuson/articles/type_predicates_generator"}]},{"category":"Book","title":"クリエイティブコーディングの教科書","url":"https://zenn.dev/baroqueengine/books/a19140f2d9fc1a","tags":["JavaScript","canvas","book"],"content":"JavaScriptとCanvasを使ったクリエティブコーディングについての電子書籍。\nCanvasでの描画、画像処理、探索アルゴリズム、アニメーション表現についてなど","relatedLinks":[]}]},{"meta":{"title":"2021-11-30のJS: Lighthouse 9.1.0、Storybook 6.4.0、DenoのNode.js互換モード","author":"azu","layout":"post","date":"2021-11-30T03:18:08.366Z","category":"JSer","tags":["Tools","node.js","CSS","Chrome","performance"],"url":"https://jser.info/2021/11/30/lighthouse-9.1.0-storybook-6.4.0-denonode.js/"},"items":[{"category":"Headline","title":"Release 3.0.0 · emscripten-core/emscripten","url":"https://github.com/emscripten-core/emscripten/releases/tag/3.0.0","tags":["WebAssembly","ReleaseNote","LLVM"],"content":"Emscripten 3.0.0リリース","relatedLinks":[]},{"category":"Headline","title":"Prettier 2.5: TypeScript 4.5 and MDX v2 comment syntax! · Prettier","url":"https://prettier.io/blog/2021/11/25/2.5.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 2.5リリース。\nTypeScript 4.5のサポート、MDX v2のコメント構文をサポート、HTMLの`class`属性を複数行に整形していたのを1行に戻す変更など","relatedLinks":[]},{"category":"Headline","title":"Release 8.4 “President Camio” · postcss/postcss","url":"https://github.com/postcss/postcss/releases/tag/8.4.0","tags":["CSS","JavaScript","Tools","ReleaseNote"],"content":"PostCSS 8.4リリース。\nWarningとErrorにRangeを指定できるように、プラグインが指定されていない場合にパース処理を実際にアクセスするまで遅延させるように。\nパッケージサイズの削減など","relatedLinks":[]},{"category":"Headline","title":"Release v9.1.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v9.1.0","tags":["Chrome","performance","Tools","ReleaseNote"],"content":"Lighthouse v9.1.0リリース。\nNext.js向けのauditを追加など","relatedLinks":[{"title":"feat: Add Stack Pack for Next.js by kyliau · Pull Request #66 · GoogleChrome/lighthouse-stack-packs","url":"https://github.com/GoogleChrome/lighthouse-stack-packs/pull/66"}]},{"category":"Headline","title":"Release 12.0.0 · puppeteer/puppeteer","url":"https://github.com/puppeteer/puppeteer/releases/tag/v12.0.0","tags":["Chrome","Firefox","library","ReleaseNote"],"content":"Puppeteer 12.0.0リリース。\nChromium 97.0.4692.0へアップデート、Firefoxで`userDataDir`の指定をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v6.4.0 · storybookjs/storybook","url":"https://github.com/storybookjs/storybook/releases/tag/v6.4.0","tags":["JavaScript","debug","Tools","ReleaseNote"],"content":"Storybook 6.4.0リリース。\nInteractions stories、ESLintプラグインの追加など","relatedLinks":[{"title":"storybook/addons/interactions at next · storybookjs/storybook","url":"https://github.com/storybookjs/storybook/tree/next/addons/interactions"},{"title":"storybookjs/eslint-plugin-storybook: Official ESLint plugin for Storybook","url":"https://github.com/storybookjs/eslint-plugin-storybook"}]},{"category":"Headline","title":"Release v5.0.0 · chalk/chalk","url":"https://github.com/chalk/chalk/releases/tag/v5.0.0","tags":["node.js","library","ReleaseNote"],"content":"Chalk 5.0.0リリース。\npure ESMに変更、default exportからnamed exportへ変更。\nまた、`keyword()`/`hsl()`/`hsv()`/`hwb()`/`ansi()`を削除、Template Literalを`chalk-template`パッケージに移行など","relatedLinks":[]},{"category":"Headline","title":"berstend/node-safe: 🤠 Make using Node.js safe again with Deno-like permissions","url":"https://github.com/berstend/node-safe","tags":["node.js","macOS","security","deno","library","Tools"],"content":"macOSのsandbox機能を利用してDenoライクなSandboxの仕組みを実装したNodeの実行ツール。\n`--allow-read`、`--allow-net`など許可リストを指定してスクリプト実行やnpm/yarn/npxにも対応している。","relatedLinks":[]},{"category":"Article","title":"CI 環境でのユニットテストの実行時間を2倍速くした話 (Jest + Mongo DB + Circle CI) - ミツモア Tech blog","url":"https://engineering.meetsmore.com/entry/2021/01/21/134930","tags":["node.js","jest","testing","article"],"content":"Jestでのユニットテストの実行時間の削減についての記事。\nテストの並列化、変更したファイルのみをテスト、Worker単位でのDBの初期化、CIでキャッシュについて","relatedLinks":[]},{"category":"Article","title":"Publish ESM and CJS in a single package","url":"https://antfu.me/posts/publish-esm-and-cjs","tags":["node.js","CommonJS","ECMAScript","module","article"],"content":"CommonJSとESMのデュアルフォーマットでのパッケージ公開について。\n`package.json`の`exports`フィールドでの使い分け、tsupとunbuildのビルドについて。\nESMでは利用できないCommonJSの`__dirname`などの補完方法について","relatedLinks":[]},{"category":"Article","title":"New – Real-User Monitoring for Amazon CloudWatch | AWS News Blog","url":"https://aws.amazon.com/jp/blogs/aws/cloudwatch-rum/","tags":["aws","webservice","performance","article"],"content":"CloudWatchでRUMを取得できるサービスがリリースされた。\nJavaScriptのタグを埋め込むことで、Web Vitalsなどのメトリクスデータなどを取得できる。","relatedLinks":[{"title":"aws-observability/aws-rum-web: Amazon CloudWatch RUM Web Client","url":"https://github.com/aws-observability/aws-rum-web"}]},{"category":"SlideVideo","title":"Deno のこれまでとこれから JSConf JP 2021","url":"https://kt3k.github.io/talk_jsconfjp2021/#1","tags":["deno","node.js","slide"],"content":"Denoの設計や採用事例についてのスライド。\nまた現在進めているNode.js互換モードについて。","relatedLinks":[{"title":"Improve Node Compat Mode · Issue #12577 · denoland/deno","url":"https://github.com/denoland/deno/issues/12577"}]},{"category":"SoftwareLibrary","title":"postcss-rs/postcss-rs: 🚀 Fast and 100% API compatible postcss replacer, built in Rust","url":"https://github.com/postcss-rs/postcss-rs","tags":["PostCSS","Rust"],"content":"PostCSSのRust実装","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Tamagui — React Native + Web UI kit","url":"https://tamagui.dev/","tags":["React","CSS","Design","Tools","library"],"content":"React NativeとWebに対応したスタイリングライブラリ。\nPropsでスタイルを渡し、コンパイル時にはAtomic CSSが生成されて、コンポーネントにはクラス名が指定される。","relatedLinks":[]}]},{"meta":{"title":"2021-12-08のJS: Rust + Node-APIのパッケージの公開、 #WebSpeedHackathon 、The 2021 Web Almanac","author":"azu","layout":"post","date":"2021-12-08T03:54:12.200Z","category":"JSer","tags":["Svelte","node.js","Tools","book","HTTP"],"url":"https://jser.info/2021/12/08/rust-node-api-webspeedhackathon-the-2021-web-almanac/"},"items":[{"category":"Headline","title":"Node v17.2.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v17.2.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 17.2.0リリース。\n`async_hooks`モジュールに`asyncWrapProviders`を追加、AbortSignalに`reason`を追加など","relatedLinks":[]},{"category":"Article","title":"Rust + Node-APIでクロスプラットフォーム向けnpmパッケージを公開する - 別にしんどくないブログ","url":"https://shisama.hatenablog.com/entry/2021/12/03/054437","tags":["Rust","node.js","article"],"content":"napi-rsを使ったRustで書いたコードをNode.jsのnative modulesとして利用する方法について。\nアーキテクチャごとのバイナリをpublishしoptionalDependenciesとして定義することで、`postinstall`を不要にする方法について。","relatedLinks":[]},{"category":"Article","title":"react-router 作り方","url":"https://zenn.dev/stin/articles/how-to-develop-react-router","tags":["React","history","library","article"],"content":"react-routerが内部的に利用している`history`ライブラリを使ったルータの作り方についての記事","relatedLinks":[]},{"category":"Article","title":"重いサイトを軽くしろ！年末年始は #WebSpeedHackathon 2021 に挑戦しよう | CyberAgent Developers Blog","url":"https://developers.cyberagent.co.jp/blog/archives/32747/","tags":["performance","example","article"],"content":"ウェブパフォーマンスを改善するハッカソン教材","relatedLinks":[{"title":"CyberAgentHack/web-speed-hackathon-2021","url":"https://github.com/CyberAgentHack/web-speed-hackathon-2021"}]},{"category":"Article","title":"Web Performance Calendar » HTTP compression","url":"https://calendar.perfplanet.com/2021/http-compression/","tags":["HTTP","performance","article"],"content":"ロスレスデータ圧縮の圧縮レベルと速度のバランスについて。\ngzip、brotli、zstd、圧縮レベルのトレードオフについて。\nまた、バイナリコンテンツの2重圧縮の問題などについて","relatedLinks":[]},{"category":"Article","title":"WebAssembly and Back Again: Fine-Grained Sandboxing in Firefox 95 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2021/12/webassembly-and-back-again-fine-grained-sandboxing-in-firefox-95/","tags":["WebAssembly","security","article"],"content":"Firefox 95に含まれるRLBoxというWebAssemblyを使ったSandboxの仕組みについて。\nプロセスの分離はオーバヘッドが大きくなりやすい。分離したいコードをWasmに変換し、Wasmをwasm2cでC言語に変換してネイティブコードへ変換し利用する。\nWasmを経由することで指定外のメモリ空間にアクセスできないことを保証している。","relatedLinks":[]},{"category":"SlideVideo","title":"JSConf JP 2021 Track A - YouTube","url":"https://www.youtube.com/playlist?list=PL42hYWKFRfN7cg6c3uM4_tAxbybVzG3ao","tags":["JavaScript","Conference","video"],"content":"JSConf JP 2021の動画一覧","relatedLinks":[{"title":"JSConf JP 2021 Track B - YouTube","url":"https://www.youtube.com/playlist?list=PL42hYWKFRfN7XWswj9wcC0j4191KNJuO3"},{"title":"JSConf JP 2021 Track C - YouTube","url":"https://www.youtube.com/playlist?list=PL42hYWKFRfN4l-KXE-2xzy95dRKPtCg0V"},{"title":"JSConf JP","url":"https://jsconf.jp/2021/"}]},{"category":"SlideVideo","title":"Svelte Summit Fall 2021 - YouTube","url":"https://www.youtube.com/playlist?list=PL8bMgX1kyZTg2bI9IOMgfBc8lrU3v2itt","tags":["Svelte","video","Conference"],"content":"Svelte Summit Fall 2021の動画まとめ","relatedLinks":[{"title":"Svelte Summit Fall 2021","url":"https://card.zenn.dev/?url=https%3A%2F%2Fwww.youtube.com%2Fplaylist%3Flist%3DPL8bMgX1kyZTg2bI9IOMgfBc8lrU3v2itt"}]},{"category":"WebsiteDocument","title":"primo-af/primo: a simpler, all-in-one way to develop and manage websites","url":"https://github.com/primo-af/primo","tags":["Svelte","CMS","OpenSource","software"],"content":"静的なサイトを管理、開発するためのCMSアプリ。\nSvelteベースで作られていて、デスクトップアプリでサイトを編集ができ、バックエンドはSupabaseベースのものが公開されている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Online CSS Analyzer - Project Wallace","url":"https://www.projectwallace.com/analyze-css","tags":["CSS","Tools","webservice"],"content":"URLを指定してサイトが利用しているCSSを解析するツール。\nサイズ、セレクタ数、詳細度、色、フォントの指定などについての分析結果を表示する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"denoland/dnt: Deno to npm package build tool.","url":"https://github.com/denoland/dnt","tags":["deno","node.js","Tools","library"],"content":"Deno向けに書かれたモジュールをNode.jsで利用できるように変換するツール。","relatedLinks":[{"title":"dnt というツールについて - Qiita","url":"https://qiita.com/kt3k/items/8947fddc9f580ba32307"}]},{"category":"SoftwareLibrary","title":"Open Props: sub-atomic styles","url":"https://open-props.style/","tags":["CSS","library"],"content":"CSS custom propertiesを使ったライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"BuilderIO/mitosis: Write components once, run everywhere. Compiles to Vue, React, Solid, Angular, Svelte, and more.","url":"https://github.com/BuilderIO/mitosis","tags":["jsx","JavaScript","library"],"content":"JSXベースコンポーネントを定義し、それをReact/Angular/Vue/Solid/Svelteなどの各種フレームワークを使ったコードへと変換できるツール。\nUIフレームワークの中間言語","relatedLinks":[]},{"category":"SoftwareLibrary","title":"plentico/plenti: Static Site Generator with Go backend and Svelte frontend","url":"https://github.com/plentico/plenti","tags":["Svelte","Tools","golang"],"content":"SvelteとGo言語を使った静的サイトジェネレータ","relatedLinks":[]},{"category":"Book","title":"The 2021 Web Almanac","url":"https://almanac.httparchive.org/en/2021/","tags":["book","browser","HTTP"],"content":"HTTP Archiveのデータ元にしたレポートであるWeb Almanacの2021年版。\nブラウザのテクノロジーやウェブの状態を確認できるレポート","relatedLinks":[]},{"category":"Book","title":"The Jamstack Book","url":"https://www.manning.com/books/the-jamstack-book","tags":["Jamstack","book"],"content":"2022年4月26日発売予定\nJamstackについての書籍","relatedLinks":[]}]},{"meta":{"title":"2021-12-15のJS: Tailwind CSS v3.0、create-react-app v5.0.0、CLSの改善","author":"azu","layout":"post","date":"2021-12-15T00:08:41.159Z","category":"JSer","tags":["node.js","CSS","safari","Tools","DOM"],"url":"https://jser.info/2021/12/15/tailwind-css-v3.0-create-react-app-v5.0.0-cls/"},"items":[{"category":"Headline","title":"Tailwind CSS v3.0 – Tailwind CSS","url":"https://tailwindcss.com/blog/tailwindcss-v3","tags":["CSS","library","ReleaseNote"],"content":"Tailwind CSS v3.0リリース。\nJust-in-Time Modeのエンジンを刷新、Box Shadow Colorの追加、CSS Scroll Snapのサポート、Multi-column layoutのサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Release 13.0.0 · puppeteer/puppeteer","url":"https://github.com/puppeteer/puppeteer/releases/tag/v13.0.0","tags":["Chrome","library","ReleaseNote"],"content":"puppeteer 13.0.0リリース。\n`already-handled`のtypoを修正","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 136 | WebKit","url":"https://webkit.org/blog/12137/release-notes-for-safari-technology-preview-136/","tags":["safari","ReleaseNote","WebExtension"],"content":"Safari Technology Preview 136リリース。\n`contain: paint`、`revert-layer`、`flex-basis: content`のサポート。\n`Temporal.Instant`の実装、WebExtensionのManifest V3をサポートなど","relatedLinks":[]},{"category":"Headline","title":"GitHub Actions: GitHub-hosted runners now run Node.js 16 by default | GitHub Changelog","url":"https://github.blog/changelog/2021-12-10-github-actions-github-hosted-runners-now-run-node-js-16-by-default/","tags":["Github","Actions","node.js","news"],"content":"GitHub ActionsのNode.jsのデフォルトがNode.js 16に変更","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · facebook/create-react-app","url":"https://github.com/facebook/create-react-app/releases/tag/v5.0.0","tags":["React","Tools","ReleaseNote"],"content":"create-react-app v5.0.0リリース。\nwebpack 5、Jest 27、ESLint 8、PostCSS 8へのアップデート。\ntailwind.config.jsのサポート、依存のバージョン固定を削除、Node 10と12のサポート終了など","relatedLinks":[]},{"category":"Headline","title":"New WebKit Features in Safari 15.2 | WebKit","url":"https://webkit.org/blog/12140/new-webkit-features-in-safari-15-2/","tags":["safari","ReleaseNote","WebAssembly"],"content":"Safari 15.2の変更点について。\nWasmで利用可能なメモリが4GBに拡張、COOP/COEP HTTPヘッダをサポートし、crossOriginIsolated時はSharedArrayBuffer/Wasmスレッドが利用可能に。\nCanvasで`colorSpace: \"display-p3\"`をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 5.0.0 – ESM support, CSS Selectors Level 4 · css/csso","url":"https://github.com/css/csso/releases/tag/v5.0.0","tags":["CSS","Tools","ReleaseNote"],"content":"CSS minifyのCSSO 5.0.0リリース。\nCSS Selectors Level 4のサポート、ESMとCJSでのdual moduleに変更など","relatedLinks":[]},{"category":"Article","title":"Improving CLS at BuzzFeed — Part 1 | BuzzFeed Tech","url":"https://tech.buzzfeed.com/improving-cumulative-layout-shift-at-buzzfeed-part-1-8b7ead2381dd","tags":["article","performance"],"content":"BuzzFeedでのWeb Vitalsの計測と改善についての連載記事。\nRUMとSynthetic MonitingでのCLSスコアのモニタリング、RUMのログからCLSを発生させている要素の特定と修正、サードパーティの埋め込みコンテンツによるCLSの改善など","relatedLinks":[{"title":"Improving CLS at BuzzFeed — Part 2 | BuzzFeed Tech","url":"https://tech.buzzfeed.com/improving-cumulative-layout-shift-at-buzzfeed-part-2-2a846adeb097"},{"title":"Improving CLS at BuzzFeed — Part 3 | BuzzFeed Tech","url":"https://tech.buzzfeed.com/improving-cumulative-layout-shift-at-buzzfeed-part-3-3a36240861e4"}]},{"category":"Article","title":"New in Node.js: \\`node:\\` protocol imports","url":"https://2ality.com/2021/12/node-protocol-imports.html","tags":["node.js","article"],"content":"`node:` protocolでのNode.jsのビルトインモジュールの参照について。","relatedLinks":[]},{"category":"Article","title":"Debug memory leaks with the Microsoft Edge Detached Elements tool - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2021/12/09/debug-memory-leaks-detached-elements-tool-devtools/","tags":["MSEdge","debug","article"],"content":"MSEdgeの開発者ツールのDetached Elementsについて。\nDOMツリーから切り離された要素を一覧でき、DOMのメモリリークをデバッグできる機能。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"capricorn86/happy-dom: A jsdom alternative with support for server side rendering of web components.","url":"https://github.com/capricorn86/happy-dom","tags":["JavaScript","DOM","node.js","library"],"content":"JSDOMのようにNode.jsでDOM APIを利用できるようにする目的のライブラリ。\nサーバサイドレンダリング向けのパッケージも公開されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Akryum/peeky: Test framework for curious minds 🐈️ Powered by Vite ⚡️","url":"https://github.com/Akryum/peeky","tags":["vite","testing","library"],"content":"Viteを使ったテストフレームワーク。\nテスト開発用のGUIをもっている","relatedLinks":[]}]},{"meta":{"title":"2021-12-20のJS: npm v8.3.0、core-js 3.20.0、 The State of CSS 2021","author":"azu","layout":"post","date":"2021-12-20T10:49:17.551Z","category":"JSer","tags":["npm","Tools","CSS","React","polyfill"],"url":"https://jser.info/2021/12/20/npm-v8.3.0-core-js-3.20.0-the-state-of-css-2021/"},"items":[{"category":"Headline","title":"Release v8.3.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v8.3.0","tags":["npm","ReleaseNote"],"content":"npm 8.3.0リリース。\n`overrides`フィールドでのパッケージの依存バージョンの上書きをサポートなど","relatedLinks":[{"title":"rfcs/0036-overrides.md at main · npm/rfcs","url":"https://github.com/npm/rfcs/blob/main/accepted/0036-overrides.md"}]},{"category":"Headline","title":"Release 3.20.0 - 2021.12.16 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.20.0","tags":["JavaScript","polyfill","ReleaseNote"],"content":"core-js 3.20.0リリース。\n`structuredClone`と`DOMException`の実装、Stage 3の`Array.prototype.groupByToMap`のサポート。\nStage 1の`String.cooked`、Stage 0の`Function.prototype.unThis`と`Function.{isCallable, isConstructor}`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Turborepo","url":"https://turborepo.org/","tags":["Tools","monorepo","npm"],"content":"monorepoのビルドツール。\nインクリメンタルビルド、ビルドキャッシュ、リモートキャッシングなどの機能を持っている。","relatedLinks":[{"title":"vercel/turborepo: The High-performance Build System for JavaScript ","url":"https://github.com/vercel/turborepo"},{"title":"Vercel acquires Turborepo to accelerate build speed and improve developer experience – Vercel","url":"https://vercel.com/blog/vercel-acquires-turborepo"}]},{"category":"Headline","title":"Deno 1.17 Release Notes","url":"https://deno.com/blog/v1.17","tags":["deno","ReleaseNote"],"content":"Deno 1.17リリース。\nImport assertionsのサポート、リモートモジュールの型チェックをスキップする`--no-check=remote`の追加、`AbortSignal#throwIfAborted`のサポート。\nまた、`Deno.test`のoverloads APIを追加、`--watch`フラグで外部ファイルのWatchをサポート。\nUnstableとして`Deno.connectTls()`がALPNの指定をサポート、timerがプログラムの終了をブロックさせなくする`Deno.unrefTimer`の追加など。","relatedLinks":[]},{"category":"Article","title":"Web Performance Calendar » CSS me not","url":"https://calendar.perfplanet.com/2021/css-me-not/","tags":["CSS","performance","article"],"content":"CSSファイルの肥大化を避けるために不要なCSSを検知する方法について。\nCSSファイルの読み込みをToggleするブックマークレット、Chrome開発者ツールのCoverageツール、UnCSSで各セレクタに`background-image`のログを仕込む方法について。","relatedLinks":[]},{"category":"Article","title":"Updates from the 87th meeting of TC39 - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/hemanth/updates-from-the-87th-meeting-of-tc39-44e4","tags":["ECMAScript","article","news"],"content":"2021年12月のTC39 MeetingによるECMAScriptのProposalステータスの変更点まとめ","relatedLinks":[]},{"category":"Article","title":"Deep-copying in JavaScript using structuredClone","url":"https://web.dev/structured-clone/","tags":["JavaScript","DOM","API","article"],"content":"`structuredClone`でのdeep cloneについて。\nshallow cloneとの比較、`structuredClone`でコピーできないデータの制限について。","relatedLinks":[]},{"category":"SlideVideo","title":"The State of CSS 2021","url":"https://2021.stateofcss.com/","tags":["CSS","Survey"],"content":"CSSについて開発者アンケートであるThe State of CSS 2021が公開された。\nCSSの機能、Pre/Post Processors、フレームワーク、CSS in JS、ツールやリソースなどの項目ごとのアンケート結果が公開されている","relatedLinks":[]},{"category":"SlideVideo","title":"React Conf 2021 Recap – React Blog","url":"https://reactjs.org/blog/2021/12/17/react-conf-2021-recap.html","tags":["React","video","Conference"],"content":"React Conf 2021の動画まとめ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Shopify/react-native-skia: High-performance React Native Graphics using Skia","url":"https://github.com/Shopify/react-native-skia","tags":["React","iOS","Android"],"content":"React Native向けのSkia bindingライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"t12t/a11y-components","url":"https://github.com/t12t/a11y-components","tags":["UI","accessibility","links"],"content":"アクセッシブルなコンポーネントについてのリンク集","relatedLinks":[]},{"category":"SoftwareLibrary","title":"quick-lint/quick-lint-js: quick-lint-js finds bugs in JavaScript programs","url":"https://github.com/quick-lint/quick-lint-js","tags":["JavaScript","ESLint","C++","Tools"],"content":"C++で書かれたJavaScriptのLintツール","relatedLinks":[{"title":"Faster, easier, friendlier: how quick-lint-js will take over ESLint","url":"https://quick-lint-js.com/blog/version-1.0/"}]}]},{"meta":{"title":"2021-12-30のJS: Ember 4.0(新機能なし)、CSS in 2022","author":"azu","layout":"post","date":"2021-12-30T11:54:19.470Z","category":"JSer","tags":["ECMAScript","node.js","CSS","Tools","Ember"],"url":"https://jser.info/2021/12/30/ember-4.0-css-in-2022/"},"items":[{"category":"Headline","title":"Ember 4.0 released","url":"https://blog.emberjs.com/ember-4-0-released/","tags":["Ember","ReleaseNote"],"content":"Ember 4.0リリース。\n新しい機能追加ではなく、非推奨の機能を削除するメジャーアップデート。\n3.xで非推奨となったAPIの削除、Ember CLIに`--ci-provider`のフラグを追加しデフォルトをGitHub Actionsに変更など","relatedLinks":[]},{"category":"Article","title":"Rust + wasmでJS向けの形態素解析ライブラリを作ってnpmで公開する","url":"https://zenn.dev/higumachan/articles/a42f1ee50bbb8d","tags":["Rust","npm","WebAssembly","article"],"content":"wasm-packを使ってRustライブラリをWasmに変換して利用するNode.jsライブラリを公開する方法について","relatedLinks":[]},{"category":"Article","title":"Node.jsのネイティブES Modulesサポートが抱える問題を解決するBabelプラグインを書いた","url":"https://zenn.dev/qnighy/articles/6267716578c76d","tags":["node.js","ECMAScript","module","babel"],"content":"ESMとCJS間のinteropを扱うBabelプラグインとコマンドラインツール。\nNode.jsのネイティブESMサポートは`__esModule`を扱わないため、Babelなどで変換されたCJSを扱うときに違いが発生する。この違いを吸収する目的のツール","relatedLinks":[{"title":"qnighy/node-cjs-interop: Babel plugin and helper functions for interoperation between Node.js native ESM and Babel ESM","url":"https://github.com/qnighy/node-cjs-interop"}]},{"category":"Article","title":"CSS in 2022 – Bram.us","url":"https://www.bram.us/2021/12/27/css-in-2022/","tags":["CSS","article"],"content":"2022年にブラウザがサポートしそうなCSSの機能紹介。\nContainer Queries、Cascade Layers、Color Functions、新しいViewport Units、`:has()`、` overscroll-behavior`。\nSubgrid、`accent-color`、Media Queryでの比較演算子など。\nまた、実験的な段階ものとしてNesting、`@scope`、`@when`、`@else`、Scroll-Linked Animations、`@property`などについても紹介している。","relatedLinks":[]},{"category":"Article","title":"ECMAScript2020言語仕様　私的日本語訳","url":"https://xn--ecmascript2020-tt9vf572amitfjlc.com/","tags":["ECMAScript","spec","translate","document"],"content":"ECMAScript 2020の仕様書の翻訳","relatedLinks":[{"title":"ECMAScript仕様輪読会 #1 - esspec","url":"https://scrapbox.io/esspec/ECMAScript%E4%BB%95%E6%A7%98%E8%BC%AA%E8%AA%AD%E4%BC%9A_%231"}]},{"category":"Article","title":"Node.js と ID について - Qiita","url":"https://qiita.com/martinheidegger/items/425112e84f7c12148d90","tags":["node.js","article","JavaScript","algorithm"],"content":"衝突しないIDやIDの生成についての記事。\nUUIDv4は衝突しないが、ID自体が長く、ソートに対応していない。\n時間軸を短く区切った時に衝突しにくくソート可能なUUIDv6とULIDについて。\nまた、人にとって読みやすいIDの生成やユーザーが定義するIDについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"facebookincubator/infima: A UI framework that provides websites with the minimal CSS and JS needed to get started with building a modern responsive beautiful website","url":"https://github.com/facebookincubator/infima","tags":["CSS","library","UI"],"content":"Docusaurusで開発されているCSSフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"zthxxx/react-dev-inspector: jump to local IDE code directly from browser React component by just a simple click","url":"https://github.com/zthxxx/react-dev-inspector","tags":["React","debug","Tools","library"],"content":"Reactコンポーネントにデバッグ情報を埋め込んで、ブラウザから直接エディタでコンポーネントを開くツール。\nBabelやwebpack、Viteなどのプラグインとして変換できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"unjs/mlly: 🤝 Missing ECMAScript module utils for Node.js","url":"https://github.com/unjs/mlly","tags":["ECMAScript","node.js","library","polyfill"],"content":"ECMAScript ModulesのUtilityライブラリ。\n`resolve`や`import()`でインポートできるモジュール名の判定、CommonJSで利用できた`__dirname`などのpolyfill","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Aslemammad/vite-plugin-cloudflare: 🔥Building Cloudflare workers is faster and easier using vite-plugin-cloudflare with node builtins like process and stream","url":"https://github.com/Aslemammad/vite-plugin-cloudflare","tags":["vite","cloudflare","Tools","library"],"content":"Viteとminiflareを使ったCloudflare Workersの開発ツール","relatedLinks":[]},{"category":"Book","title":"ステップアップJavaScript フロントエンド開発の初級から中級へ進むために（サークルアラウンド株式会社 佐藤 正志 小笠原 寛）｜翔泳社の本","url":"https://www.shoeisha.co.jp/book/detail/9784798169835","tags":["JavaScript","book"],"content":"2022年1月14日発売","relatedLinks":[]}]},{"meta":{"title":"2022-01-06のJS: AVA 4、Parcel 2.1.0、Solid 1.3.0","author":"azu","layout":"post","date":"2022-01-06T08:53:53.474Z","category":"JSer","tags":["React","testing","vite","Tools","node.js"],"url":"https://jser.info/2022/01/06/ava-4-parcel-2.1.0-solid-1.3.0/"},"items":[{"category":"Headline","title":"jasmine/4.0.0.md at main · jasmine/jasmine","url":"https://github.com/jasmine/jasmine/blob/main/release_notes/4.0.0.md","tags":["jasmine","JavaScript","testing","library","ReleaseNote"],"content":"Jasmine 4.0.0リリース\nES2017+をもつ実行環境のサポートとなるためIEのサポートを終了、RubyとPythonのパッケージは開発を終了など。\n`beforeAll`と`beforeEach`のエラーハンドリングの改善、globalにAPIを追加しない`noGlobals()`を追加など","relatedLinks":[{"title":"Upgrading","url":"https://jasmine.github.io/tutorials/upgrading_to_Jasmine_4.0"}]},{"category":"Headline","title":"What&#039;s new in Svelte: January 2022","url":"https://svelte.dev/blog/whats-new-in-svelte-january-2022","tags":["Svelte","ReleaseNote"],"content":"開発中のSvelteKitの変更点について。\n`precompress`オプションでのbrotli圧縮のサポート、`config.kit.prerender.concurrency`オプションを追加、CSSをJSより優先してpreloadするように。\nVite 2.7へのアップデート、設定を変更したときにサーバを自動的に再起動するようになるなど","relatedLinks":[]},{"category":"Headline","title":"helmet/CHANGELOG.md at main · helmetjs/helmet","url":"https://github.com/helmetjs/helmet/blob/main/CHANGELOG.md#500---2022-01-02","tags":["node.js","library","ReleaseNote"],"content":"helmet 5.0.0リリース。\nECMAScript Modules対応、\n`contentSecurityPolicy`オプションのデフォルト値を変更。\nCOEP、COOP、CORP、Origin-Agent-Clusterヘッダをデフォルトで有効化","relatedLinks":[]},{"category":"Headline","title":"Release AVA 4 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v4.0.0","tags":["node.js","testing","library","ReleaseNote"],"content":"AVA 4リリース。\n`worker_threads`を使った並列実行をデフォルト化、\nShared workersをStableに変更。\n親ディレクトリの`ava.config.*`ファイルを探索するように、Snapshotのフォーマット変更、前回失敗したテストファイルを最初にテストするように、ESMサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Ember 4.1 Released","url":"https://blog.emberjs.com/ember-4-1-released/","tags":["Ember","ReleaseNote"],"content":"Ember 4.1リリース。\n`@ember/service`が`service`をexportするように、`RouterService`に`refresh`を追加、`@cached`の有効化など。\nまた、`AutoLocation`クラスを非推奨化など","relatedLinks":[]},{"category":"Headline","title":"Release 1.2.0-beta.0 · vercel/swr","url":"https://github.com/vercel/swr/releases/tag/1.2.0-beta.0","tags":["React","library","ReleaseNote"],"content":"React向けのQueryライブラリであるSWR 1.2.0 betaリリース。\n`mutate`に即時的な更新をする`optimisticData`とエラーが発生した場合にロールバックする`rollbackOnError`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"parcel/CHANGELOG.md at v2 · parcel-bundler/parcel","url":"https://github.com/parcel-bundler/parcel/blob/v2/CHANGELOG.md#210---2021-01-05","tags":["JavaScript","Tools","ReleaseNote"],"content":"Parcel 2.1.0リリース。\n`node_modules`をデフォルトでtranspileするように変更。\nSharedArrayBufferを使ったグラフデータ構造に書き換えパフォーマンスの改善、開発時は遅延コンパイルすることでパフォーマンス改善、HMRのバグ修正など","relatedLinks":[]},{"category":"Headline","title":"solid/CHANGELOG.md at main · solidjs/solid","url":"https://github.com/solidjs/solid/blob/main/CHANGELOG.md#130---2021-1-5","tags":["JavaScript","React","library","ReleaseNote"],"content":"Solid 1.3.0リリース。\n`renderToStream` APIを追加し、HTML Streamingの対応、Error BoundariesをSSR時でも機能するように。\n`hydrate`関数が`renderId`をサポートし、複数のSolidアプリをそれぞれhydrateできるように、`createReaction` APIの追加など。\nまた実験的なAPIとして、`enableExternalSource`、`refetchResources`の追加など","relatedLinks":[]},{"category":"Article","title":"ブラウザバック時の表示を最適化する Yahoo!ニュースの取り組み事例 - Yahoo! JAPAN Tech Blog","url":"https://techblog.yahoo.co.jp/entry/2022010530253635/","tags":["JavaScript","article","browser"],"content":"ブラウザバックかどうかを判定して処理する方法とBFCacheを使ってブラウザバックされたかを判定して処理する方法について。\nバック時のスクロール位置の保存、BFCacheが有効となる条件、BFCacheにおけるログの問題などについて","relatedLinks":[]},{"category":"Article","title":"Vite in the browser - ‹div›RIOTS","url":"https://divriots.com/blog/vite-in-the-browser","tags":["vite","browser","article"],"content":"ブラウザ上でViteを動かすbrowser-viteの仕組みについて。\nHTTP serverをService Workerベースに変更、ファイルシステムの依存を削除しin-memoryで動かすように、Bundlerの仕組みをプラグインでサーバへ移動、クロスブラウザ対応。\nHMRで使われていたWebSocketsをpostMessageベースに変更などを行い、ブラウザ上でViteを動かしているという話。\nNode.jsをブラウザで動かすWebContainersとは異なり、Firefox/Chrome/Safariで動作するようになっている。","relatedLinks":[{"title":"divriots/browser-vite: Vite in the browser.","url":"https://github.com/divriots/browser-vite"}]},{"category":"SoftwareLibrary","title":"vitebook/vitebook: 🔥 Blazing fast alternative to Storybook. Powered by Vite.","url":"https://github.com/vitebook/vitebook","tags":["vite","debug","Tools"],"content":"ViteベースのStorybookの代替実装","relatedLinks":[]},{"category":"SoftwareLibrary","title":"DioxusLabs/dioxus: Elegant React-like library for building user interfaces for desktop, web, mobile, SSR, liveview, and more.","url":"https://github.com/dioxuslabs/dioxus","tags":["Rust","React","library"],"content":"RustでReactライクな宣言的なUI表現を持ったUIフレームワーク。\nRSX!マクロを使った宣言的なUI表現、React HooksライクなAPIを持つ。\nブラウザ向けにはWasmに変換し利用し、デスクトップやモバイルなどはWebViewとネイティブのRustを元に動作する。","relatedLinks":[{"title":"Introduction - Dioxus Documentation","url":"https://dioxuslabs.com/guide/"}]},{"category":"Book","title":"ざっくりつかむ　CSS設計 | マイナビブックス","url":"https://book.mynavi.jp/ec/products/detail/id=126973","tags":["CSS","book"],"content":"CSS設計手法やツールについての書籍","relatedLinks":[]}]},{"meta":{"title":"2022-01-11のJS: グローバルなサイトにおけるCore Web Vitals、2021 JavaScript Rising Stars、colors.jsのインシデント対応","author":"azu","layout":"post","date":"2022-01-11T03:01:30.504Z","category":"JSer","tags":["performance","browser","CSS","Tools","debug"],"url":"https://jser.info/2022/01/11/core-web-vitals-2021-javascript-rising-stars-colors.js/"},"items":[{"category":"Headline","title":"January 10th 2022 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/jan-2022-security-releases/","tags":["node.js","security","ReleaseNote"],"content":"Node.jsのセキュリティ修正が12.x, 14.x, 16.x, 17.x それぞれでリリースされている。\nSubject Alternative Name (SAN)に関する修正が2つ含まれていて、この修正は`--security-revert`フラグで戻すことができる。\nまた、Relative Distinguished Namesの扱いに関する修正や`console.table`のPrototype Pollutionの修正が含まれている","relatedLinks":[{"title":"Release 2022-01-10, Version 14.18.3 ","url":"https://github.com/nodejs/node/releases/tag/v14.18.3"}]},{"category":"Headline","title":"Chromium Blog: Chrome 98 Beta: Color Gradient Vector Fonts, Region Capture Origin Trial, and More","url":"https://blog.chromium.org/2022/01/chrome-98-beta-color-gradient-vector.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 98 betaリリース。\nCOLRv1 Color Gradient Vector Fontsのサポート、Chromeのバージョン100をテストできるフラグの追加。\nOrigin Trialとして、Region Captureの追加。\nその他では、`contains-intrinsic-size: auto`のサポート、`AudioContext.outputLatency`のサポート、`color-scheme`での`only`のサポート。\n`structuredClone()`のサポート、SubresourcesからPrivate Networkへのアクセス時にPreflight Requestが求められるように変更など","relatedLinks":[]},{"category":"Article","title":"Improving Core Web Vitals, A Smashing Magazine Case Study","url":"https://www.smashingmagazine.com/2021/12/core-web-vitals-case-study-smashing-magazine/","tags":["performance","article"],"content":"Core Web Vitalsの改善とCrUXのメトリクスを掘り下げた記事。\nLCPなどを改善したが、CrUXのデータが改善されなかった点を掘り下げていき、特定地域のデータによって統計データが歪んでいたことを特定した方法について。\nCDNがカバーしきれてない地域などが問題となっていたため、`SaveData`ヘッダと`prefers-reduced-data`を元にWeb Fontのロードを減らした話。","relatedLinks":[]},{"category":"Article","title":"2021 JavaScript Rising Stars","url":"https://risingstars.js.org/2021/en","tags":["JavaScript","library","Tools","article","Github"],"content":"JavaScript関係のツールやライブラリなどの2021年のGitHub Starでのランキング。\n各カテゴリごとのランキングやコメントも合わせて紹介されている。","relatedLinks":[{"title":"JavaScript ライジングスター 2021","url":"https://risingstars.js.org/2021/ja"}]},{"category":"Article","title":"Container Queries | 12 Days of Web","url":"https://12daysofweb.dev/2021/container-queries/","tags":["CSS","article"],"content":"CSS Container queryの定義、利用方法、ユースケースについて","relatedLinks":[]},{"category":"Article","title":"Introducing fuite: a tool for finding memory leaks in web apps | Read the Tea Leaves","url":"https://nolanlawson.com/2021/12/17/introducing-fuite-a-tool-for-finding-memory-leaks-in-web-apps/","tags":["browser","debug","article","Tools"],"content":"fuiteというメモリリークのデバッグツールについて。\nPuppeteerを使ってシナリオベースの操作をし、指定回数繰り返した結果のメモリリークを確認できる。\n実行時にBreak Pointを貼ってブラウザの処理を止め、Chrome DevToolsと接続して開発者ツールによってデバッグができる。","relatedLinks":[{"title":"nolanlawson/fuite: A tool for finding memory leaks in web apps","url":"https://github.com/nolanlawson/fuite"},{"title":"Fixing memory leaks in web applications | Read the Tea Leaves","url":"https://nolanlawson.com/2020/02/19/fixing-memory-leaks-in-web-applications/"},{"title":"Debugging a memory leak with fuite - YouTube","url":"https://www.youtube.com/watch?v=H0BHL2lo89M"}]},{"category":"Article","title":"Web Performance Calendar » JS Self-Profiling API In Practice","url":"https://calendar.perfplanet.com/2021/js-self-profiling-api-in-practice/","tags":["JavaScript","performance","article"],"content":"JavaScript Self-Profiling APIについての解説記事。\nサンプリングされたプロファイルを取るAPIとなっていて、RUMのような実際のエンドユーザーでの実行結果を取得できる。\nDocument Policyでの有効化、APIの使い方、ユースケース、プロファイルのデータ形式と取得データの制限などについて。\nCORSに対応していないCross-Origin ScriptsのJavaScript関数は、プロファイル上では見えないことやJS以外のデータがプロファイルに入らない点などについて。","relatedLinks":[{"title":"WICG/js-self-profiling: Proposal for a programmable JS profiling API for collecting JS profiles from real end-user environments","url":"https://github.com/WICG/js-self-profiling"}]},{"category":"Article","title":"Frontend Web Performance: The Essentials \\[0\\] | by Matthew Costello | Dec, 2021 | Medium","url":"https://medium.com/@matthew.costello/frontend-web-performance-the-essentials-0-61fea500b180","tags":["browser","performance","debug","article"],"content":"ウェブパフォーマンスやブラウザのレンダリングについての記事。\nChrome開発者ツールでLayout, Paint, Compositeとはどのようなレンダリングステップで行われているのかみていく記事。\nCSS Animationを例に、Chrome開発者ツールでそれぞれのレンダリングステップを可視化する方法について書かれている","relatedLinks":[]},{"category":"Article","title":"colorsなどのnpmパッケージに悪意あるコードが含まれている問題について","url":"https://zenn.dev/azu/articles/d56615b2e11ad1","tags":["npm","security","article"],"content":"colors.jsにDoS攻撃のコードを入れたものがpublishされていた問題について。\nnpmパッケージの直接的/間接的依存のチェック方法やYarnの`resolutions`、npm 8.3+の`overrides`でのバージョン固定方法について。","relatedLinks":[]},{"category":"SlideVideo","title":"shiguredo/media-processors: Media Processors","url":"https://github.com/shiguredo/media-processors","tags":["JavaScript","browser","video","audio","library"],"content":"背景ぼかしやノイズ抑制など処理をブラウザで行うライブラリ","relatedLinks":[]},{"category":"WebsiteDocument","title":"mozilla/glean: Modern cross-platform telemetry","url":"https://github.com/mozilla/glean","tags":["kotlin","swift","python","node.js","library","performance","Mozilla","Rust"],"content":"Rust/Kotlin/Swift/Python/JavaScript(ブラウザとブラウザ拡張とNode.js)/Qtに対応したクロスプラットフォームなTelemetry SDK","relatedLinks":[]},{"category":"SoftwareLibrary","title":"AntoineW/luge: Luge","url":"https://github.com/AntoineW/luge","tags":["CSS","JavaScript","library","animation"],"content":"HTMLに属性を指定することでアニメーションできるライブラリ","relatedLinks":[]},{"category":"Book","title":"New JavaScript features • JavaScript for impatient programmers (ES2022 edition)","url":"https://exploringjs.com/impatient-js/ch_new-javascript-features.html#new-in-es2022","tags":["ECMAScript","book"],"content":"JavaScript for impatient programmers (ES2022 edition)リリース。\nES2022のPrivate/Public Fields、Top-level await、Error Cause。\nArrayとStringの`.at()`メソッド、RegExp match indices、`Object.hasOwn()`メソッドについて追加されている。","relatedLinks":[]}]},{"meta":{"title":"JSer.info 11周年: 目標は2025年までに交換可能にする、JSer.info アンケート","author":"azu","layout":"post","date":"2022-01-16T00:00:00.000Z","category":"Article","tags":["JSer"],"url":"https://jser.info/2022/01/16/11-years/"},"items":[]},{"meta":{"title":"2022-01-18のJS: Parcel 2.2.0(Parcel CSS)、AngularJS(1.x) LTS終了、Faker.jsプロジェクト","author":"azu","layout":"post","date":"2022-01-18T02:42:06.641Z","category":"JSer","tags":["React","node.js","Tools","webpack","CSS"],"url":"https://jser.info/2022/01/18/parcel-2.2.0parcel-css-angularjs1.x-lts-faker.js/"},"items":[{"category":"Headline","title":"Release v5.66.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.66.0","tags":["webpack","ReleaseNote"],"content":"webpack 5.66.0リリース。\nNode.jsのESMからCJSをimportする際にnamed importできる形式で出力できる`libraryTarget: commonjs-static`を追加。\nCSSのネイティブサポートを目的とする実験的なフラグとして`experiments.css`を追加など","relatedLinks":[{"title":"webpack 5.66.0 add library type: commonjs-static","url":"https://gist.github.com/azu/eed67b26171fbb0643024ce3e1c85b35"}]},{"category":"Headline","title":"Announcing Parcel CSS: A new CSS parser, compiler, and minifier written in Rust!","url":"https://parceljs.org/blog/parcel-css/","tags":["JavaScript","CSS","bundler","ReleaseNote"],"content":"Parcel 2.2.0で、Rustで書かれたCSS parser/compiler/minifierが導入された。\nパフォーマンスやCSSのminifyのサイズなどが改善されている。","relatedLinks":[{"title":"Release v2.2.0 · parcel-bundler/parcel","url":"https://github.com/parcel-bundler/parcel/releases/tag/v2.2.0"},{"title":"Parcel CSS: A New CSS Parser, Transformer, and Minifier, a New CSS Parser | CSS-Tricks - CSS-Tricks","url":"https://css-tricks.com/parcel-css/"}]},{"category":"Headline","title":"Discontinued Long Term Support for AngularJS | by Mark Thompson (@marktechson) | Jan, 2022 | Angular Blog","url":"https://blog.angular.io/discontinued-long-term-support-for-angularjs-cc066b82e65a","tags":["Angular","JavaScript","news"],"content":"2021年12月31日でAngularJS(1.x)のLTSが終了した。\nこれ以降、AngularJSのメンテナンスは行われなくなる。","relatedLinks":[]},{"category":"Headline","title":"An update from the Faker team | Faker","url":"https://fakerjs.dev/update.html","tags":["JavaScript","library","news"],"content":"Faker.jsはコミュニティでのメンテナンスとなり`@faker-js/faker`としてForkされた。\nForkではVersion 6 alphaの開発を進めていて、TypeScriptに書き直し、ドキュメントサイトの公開されている。\nまた、Open Collectiveを使ったFundingについて","relatedLinks":[]},{"category":"Headline","title":"Release Rhino 1.7.14 · mozilla/rhino","url":"https://github.com/mozilla/rhino/releases/tag/Rhino1_7_14_Release","tags":["Java","JavaScript","library"],"content":"JavaでのJavaScript実装であるRhino 17.14リリース。\nPromiseの実装、BigIntの実装、Template Literalの実装、`String.raw`の実装、`globalThis`の実装、`**`演算子の実装など。\nまた、ES2019でのJSON supersetの変更やプロパティ名のショートハンドの対応なども含まれている。","relatedLinks":[]},{"category":"Headline","title":"Announcing NAPI-RS v2 | NAPI-RS Docs","url":"https://napi.rs/blog/announce-v2","tags":["Rust","node.js","library","ReleaseNote"],"content":"RustでNodeのNative Modulesを書けるNAPI-RS v2リリース。\n`#[napi]`マクロ、TypeScriptの型定義とJavaScriptのバインディングファイルの生成、`async fn`の対応など","relatedLinks":[]},{"category":"Headline","title":"Release Eleventy v1.0.0: First! · 11ty/eleventy","url":"https://github.com/11ty/eleventy/releases/tag/v1.0.0","tags":["Tools","ReleaseNote"],"content":"静的サイトジェネレータであるEleventy v1.0.0リリース","relatedLinks":[]},{"category":"Headline","title":"Release v13.0.0 · facebook/relay","url":"https://github.com/facebook/relay/releases/tag/v13.0.0","tags":["GraphQL","library","ReleaseNote"],"content":"relay 13.0.0リリース。\nrelay-compilerをRustで書き直して、パフォーマンスの改善やディレクティブの追加。\nrelay-configの削除など","relatedLinks":[{"title":"Introducing the new Relay compiler | Relay","url":"https://relay.dev/blog/2021/12/08/introducing-the-new-relay-compiler/"}]},{"category":"Article","title":"A Visual Guide to useEffect | Alex Sidorenko","url":"https://alexsidorenko.com/blog/useeffect/","tags":["React","article"],"content":"Reactの`useEffect`の動きをビジュアライズした連載記事","relatedLinks":[]},{"category":"Article","title":"A brief introduction of vite-plugin-federation | by Vueshenzhen | Jan, 2022 | Medium","url":"https://medium.com/@vueshenzhen/a-brief-introduction-of-vite-plugin-federation-9e998b2e43b","tags":["vite","plugin","article"],"content":"ViteでwebpackのModule Federationをするプラグインについて。\nwebpack側をremoteにして、webpackとの統合もできる。","relatedLinks":[{"title":"originjs/vite-plugin-federation: Module Federation for vite ","url":"https://github.com/originjs/vite-plugin-federation"}]},{"category":"Article","title":"Replit - Ace, CodeMirror, and Monaco: A Comparison of the Code Editors You Use in the Browser","url":"https://blog.replit.com/code-editors","tags":["JavaScript","editor","library","article"],"content":"JavaScriptで書かれたコードエディタライブラリであるAce、Monaco、CodeMirror 6を比較した記事","relatedLinks":[]},{"category":"Article","title":"Reactを取り巻く状態管理の潮流を学ぼう。HooksやServer Componentsなどの登場で何が変わるか - エンジニアHub｜Webエンジニアのキャリアを考える！","url":"https://eh-career.com/engineerhub/entry/2022/01/13/090000","tags":["React","JavaScript","article"],"content":"Reactの状態管理についての記事。\nReact外で管理するRedux/XState、React中で管理するRecoil、フロントの状態を一時的なキャッシュとして扱うQuery系のSWRやreact-queryについて","relatedLinks":[]},{"category":"Article","title":"JavaScriptのレガシー挙動を定めたAnnex Bをひたすら読む記事","url":"https://zenn.dev/qnighy/articles/1d96f2c0c662f6","tags":["ECMAScript","browser","spec","article"],"content":"ECMAScriptの仕様書で互換性のために非推奨のものとして定義されているAnnex Bについて","relatedLinks":[{"title":"Annex Bを読む、の補足と附録","url":"https://zenn.dev/qnighy/articles/550be3a1f42707"}]},{"category":"Article","title":"TypeScript解読アシスタント | TypeScript入門『サバイバルTypeScript』","url":"https://typescriptbook.jp/code-reading-assistant","tags":["TypeScript","Tools","document"],"content":"TypeScriptのコード中の構文の名前やリファレンスへのリンクを表示するツール","relatedLinks":[]},{"category":"Article","title":"Form Validation Using JavaScript&#039;s Constraint Validation API","url":"https://blog.openreplay.com/form-validation-using-javascript-s-constraint-validation-api","tags":["JavaScript","HTML","article"],"content":"FormのHTML要素、CSS、JavaScriptでのバリデーションについての記事。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"fox1t/turborepo-remote-cache: open-source implementation of the Turborepo custom remote cache server.","url":"https://github.com/fox1t/turborepo-remote-cache","tags":["monorepo","node.js","server"],"content":"Turboのremote cache serverのオープンソース実装","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ngneat/elf: 🧙‍♀️ A Reactive Store with Magical Powers","url":"https://github.com/ngneat/elf","tags":["JavaScript","library"],"content":"RxJSを使ったステート管理ライブラリ。\nAngularのAkitaの人が作っている。","relatedLinks":[{"title":"Welcome to elf Discussions! · Discussion #5 · ngneat/elf","url":"https://github.com/ngneat/elf/discussions/5#discussioncomment-1437521"}]},{"category":"Book","title":"Understanding JavaScript Promises","url":"https://ebooks.humanwhocodes.com/promises","tags":["Promises","book","JavaScript"],"content":"Promisesについての書籍","relatedLinks":[]}]},{"meta":{"title":"2022-01-24のJS: Safari TP 138、Vue 3のデフォルト化、Remix vs Next.js","author":"azu","layout":"post","date":"2022-01-24T11:20:56.215Z","category":"JSer","tags":["node.js","React","npm","HTTP","GraphQL"],"url":"https://jser.info/2022/01/24/safari-tp-138-vue-3-remix-vs-next.js/"},"items":[{"category":"Headline","title":"Release v0.25.0 · axios/axios","url":"https://github.com/axios/axios/releases/tag/v0.25.0","tags":["HTTP","JavaScript","library"],"content":"axios 0.25.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Node v17.4.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v17.4.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 17.4.0リリース。\nEventEmitterとAsyncResourceを連携する`EventEmitterAsyncResource`を追加、ReadableStreamに`map`と`filter`を追加など","relatedLinks":[{"title":"addaleax/eventemitter-asyncresource: AsyncResource integration for EventEmitter","url":"https://github.com/addaleax/eventemitter-asyncresource"}]},{"category":"Headline","title":"Announcing React Native 0.67 · React Native","url":"https://reactnative.dev/blog/2022/01/19/version-067","tags":["React","Native","ReleaseNote"],"content":"React Native 0.67リリース。\n`DatePickerAndroid`の削除、Hermes 0.9.0へアップデートなど","relatedLinks":[]},{"category":"Headline","title":"Deno 1.18 Release Notes","url":"https://deno.com/blog/v1.18","tags":["deno","ReleaseNote"],"content":"Deno 1.18リリース。\nWeb Cryptography APIの実装、`deno.json`を自動で参照するように、Error Causeをスタックトレースに反映。\n`Deno.test`のstep APIがstableに、FFI APIの改善、V8 snapshotsの圧縮方法をV8 zlibからlzとzstdに変更して起動速度の改善など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 138 | WebKit","url":"https://webkit.org/blog/12176/release-notes-for-safari-technology-preview-138/","tags":["safari","webkit","ReleaseNote"],"content":"Safari Technology Preview 138リリース。\n`:focus-visible`、Media Queryの`resolution`、CSS Containmentをデフォルトで有効化。\nService Workerの`NavigationPreloadManager`を有効化、Service Workerを経由したファイルダウンロードをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Vue 3 as the New Default | The Vue Point","url":"https://blog.vuejs.org/posts/vue-3-as-the-new-default.html","tags":["Vue","news"],"content":"2022年2月7日にVue 3が`vue@next`から`vue@latest`へと変更され、`vue`パッケージのStableバージョンとなる。\nこの変更に合わせてCDNでのlatestの参照先、ドキュメント、GitHubリポジトリも変更される。","relatedLinks":[]},{"category":"Headline","title":"Release v5.67.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.67.0","tags":["webpack","ReleaseNote"],"content":"webpack 5.67.0リリース。\nAssertModuleに`outputPath`オプションの追加。\n`output.trustedTypes: true`の場合は`eval-source-map`でもTrusted Typesに対応したコードを出力するようになど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.6 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-6-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.6 Betaリリース。\n型推論の改善がメインとなっている。再帰型、インターフェースへのインデックスアクセス、関数の引数における型推論の改善。\n`checkJs`が有効時に、JavaScriptの構文エラーのチェックを改善。\n`--generateTrace`で出力できるビルドのトレースデータを分析するための`@typescript/analyze-trace`パッケージの公開など","relatedLinks":[{"title":"@typescript/analyze-trace - npm","url":"https://www.npmjs.com/package/@typescript/analyze-trace"}]},{"category":"Article","title":"npm: A Free Guide for Beginners | CSS-Tricks - CSS-Tricks","url":"https://css-tricks.com/a-complete-beginners-guide-to-npm/","tags":["npm","tutorial"],"content":"npmとは何か、基本的な使い方についての連載記事","relatedLinks":[]},{"category":"Article","title":"Remix vs Next.js | Remix","url":"https://remix.run/blog/remix-vs-next","tags":["JavaScript","React","article"],"content":"Next.jsのEコマースを例に、RemixとNext.jsを比較した記事。\nアーキテクチャの違い、CDN Edgeでの実行、データの更新についての比較など","relatedLinks":[]},{"category":"Article","title":"Mocking With Undici Like a Pro","url":"https://fusebit.io/blog/undici-mocking/","tags":["JavaScript","testing","node.js","article"],"content":"Node.js向けのHTTPクライアントのUndiciのモックサポートについての記事。\n`MockAgent`使ったモックについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"WebAppPentestGuidelines/graphQLGuideLine","url":"https://github.com/WebAppPentestGuidelines/graphQLGuideLine","tags":["GraphQL","security","document"],"content":"GraphQLにおける脆弱性の診断ガイド。\nよくある問題としてIntrospection Queryが有効となっているケース、DoSとなるクエリ、レースコンディションなどについて解説している。\nまた診断や調査に使えるツールの紹介など","relatedLinks":[]},{"category":"WebsiteDocument","title":"Vanilla List • The Vanilla JavaScript Repository","url":"https://vanillalist.top/","tags":["npm","JavaScript","library","webservice"],"content":"依存がないライブラリのまとめサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mo.js","url":"https://mojs.github.io/","tags":["JavaScript","animation","library"],"content":"図形の描画とアニメーションのライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tinyplex/tinybase: A tiny, reactive JavaScript library for structured state and tabular data.","url":"https://github.com/tinyplex/tinybase","tags":["JavaScript","database","library"],"content":"テーブル的なデータ構造の状態管理ライブラリ","relatedLinks":[]},{"category":"Book","title":"Structure and Interpretation of Computer Programs | The MIT Press","url":"https://mitpress.mit.edu/books/structure-and-interpretation-computer-programs-1","tags":["JavaScript","program","book"],"content":"2022年4月 発売\nSICPのJavaScript版","relatedLinks":[{"title":"sicp.comp.nus.edu.sg/","url":"https://sicp.comp.nus.edu.sg/"}]}]},{"meta":{"title":"JSer.info 11周年アンケート結果の公開","author":"azu","layout":"post","date":"2022-01-31T06:23:00.000Z","category":"Article","tags":["JSer"],"url":"https://jser.info/2022/01/31/jser-info-11th-suvery-result/"},"items":[]},{"meta":{"title":"2022-02-01のJS: Recoil 0.6、pnpm 7.0.0 α、JSer.infoアンケート結果の公開","author":"azu","layout":"post","date":"2022-02-01T03:06:44.417Z","category":"JSer","tags":["TypeScript","React","cheatsheet","photoshop","webpack"],"url":"https://jser.info/2022/02/01/recoil-0.6-pnpm-7.0.0-a-jser.info/"},"items":[{"category":"Headline","title":"ESLint v8.8.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2022/01/eslint-v8.8.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 8.8.0リリース。\nLint結果に`eslint-disable`で抑制されたメッセージを取得できる`suppressedMessages`プロパティの追加","relatedLinks":[]},{"category":"Headline","title":"Recoil 0.6 | Recoil","url":"https://recoiljs.org/blog/2022/01/28/0.6.0-release","tags":["React","library","ReleaseNote"],"content":"Recoil 0.6リリース。\nReact 18に対応、`useRecoilCallback()`のコールバックに`refresh`関数の追加など。\n破壊的な変更として、`effects_UNSTABLE`を`effects`にリネームなど","relatedLinks":[{"title":"Release 0.6.0 · facebookexperimental/Recoil","url":"https://github.com/facebookexperimental/Recoil/releases/tag/0.6.0"}]},{"category":"Headline","title":"Release v2.0.0 · nightwatchjs/nightwatch","url":"https://github.com/nightwatchjs/nightwatch/releases/tag/v2.0.0","tags":["E2E","testing","library","ReleaseNote"],"content":"Nightwatch 2.0リリース。\nPlugin APIの追加、`nightwatch.conf.cjs`のサポート、chai expectのアップデート。\nAssertion/Element Command/Mouse ActionsのAPIの追加や`--devtools`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v7.0.0-alpha.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v7.0.0-alpha.0","tags":["npm","pnpm","rlee"],"content":"pnpm 7.0.0 αリリース。\n破壊的な変更として、`pnpm -r exec|run|add`の対象にRootを含まないように変更、`--filter`がglobを扱うように変更。\n`npm run <script>`に対して`--`なしで引数を渡せるように、Side effects cacheがデフォルトで有効化、`pnpm dlx`のaliasとして`pnpx`の追加など","relatedLinks":[]},{"category":"Headline","title":"V8 release v9.9 · V8","url":"https://v8.dev/blog/v8-release-99","tags":["V8","ReleaseNote"],"content":"V8 v9.9リリース。\nIntl.Locale APIにプロパティ追加、`Intl.supportedValuesOf`の追加など","relatedLinks":[]},{"category":"Article","title":"Ember v4 TypeScript Support Update","url":"https://blog.emberjs.com/ember-v4-typescript-support-update/","tags":["Ember","TypeScript","article"],"content":"EmberのTypeScriptの型定義について。\n現在は`@types`としてメンテナンスされていて、4.xの対応と変更点について。\nまた、TypeScriptの型定義をEmber自体に同梱することについての議論をしているという話。","relatedLinks":[{"title":"RFC: Official TypeScript support by chriskrycho · Pull Request #724 · emberjs/rfcs","url":"https://github.com/emberjs/rfcs/pull/724"}]},{"category":"Article","title":"How React server components work: an in-depth guide","url":"https://blog.plasmic.app/posts/how-react-server-components-work/","tags":["React","article"],"content":"React server components (RSC)の仕組みについての解説記事。\nReact server componentsとは何か、コンポーネントのシリアライズの仕組み、コンポーネントの取得とSuspense、RSCのデータ形式などについて","relatedLinks":[]},{"category":"Article","title":"How Prime Video updates its app for more than 8,000 device types - Amazon Science","url":"https://www.amazon.science/blog/how-prime-video-updates-its-app-for-more-than-8-000-device-types","tags":["JavaScript","WebAssembly","article"],"content":"Prime Videoアプリの特定の部分にWebAssemblyを利用したという話。\nレガシーデバイスやブラウザではWasmが利用できないため、JavaScript VMとWasm VMどちらでも実行できるようにしていて、そのアーキテクチャにどのように移行していったのかについて。","relatedLinks":[]},{"category":"Article","title":"100万行の大規模なJavaScript製システムをTypeScriptに移行するためにやったこと | CyberAgent Developers Blog","url":"https://developers.cyberagent.co.jp/blog/archives/34364/","tags":["TypeScript","article","refactoring"],"content":"JSDocを使ったTypeScriptへの移行について。\n依存関係を見て優先度をつけてのTypeScript化、`checkJs`オプションを使ったJavaScriptにJSDocベースの型付け、チームの知識共有についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"TypeScript: Cheat Sheets","url":"https://www.typescriptlang.org/cheatsheets","tags":["TypeScript","cheatsheet"],"content":"TypeScriptの構文や型についてのチートシート。\nControl Flow Analysis、Interface、Type、 Classについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"DataDog/build-plugin: Track your build performances like never before.","url":"https://github.com/DataDog/build-plugin","tags":["webpack","bundler","performance","plugin"],"content":"どのloader/plugin/依存関係などでビルド時間がかかっているかを表示するwebpackとesbuildのプラグイン。\nDatadogと連携する機能も持っている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"webtoon/psd: A lightweight Adobe Photoshop .psd/.psb file parser in typescript with zero-dependency for WebBrowser and NodeJS","url":"https://github.com/webtoon/psd","tags":["JavaScript","photoshop","library"],"content":"JavaScript製のPSD/PSBファイルパーサ。\nPSDファイルを読み込みPSDの画像とレイヤー情報などを取得、トラバース処理などができる。","relatedLinks":[]},{"category":"Book","title":"Learning TypeScript","url":"https://learning.oreilly.com/library/view/learning-typescript/9781098110321/","tags":["TypeScript","book"],"content":"2022年9月発売予定\nTypeScriptの入門書","relatedLinks":[]}]},{"meta":{"title":"2022-02-09のJS: Babel 7.17.0、Chrome 99 beta、Fetch API in Node.js","author":"azu","layout":"post","date":"2022-02-09T13:04:18.898Z","category":"JSer","tags":["node.js","babel","browser","VR","Chrome"],"url":"https://jser.info/2022/02/09/babel-7.17.0-chrome-99-beta-fetch-api-in-node.js/"},"items":[{"category":"Headline","title":"Node v14.19.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v14.19.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 14.19.0リリース。\nCorepackを14.xにもbackport、ICU 70.1へアップデート、native addonのロードを無効にできる`--no-addons`フラグの追加、ルート証明書のアップデートなど","relatedLinks":[]},{"category":"Headline","title":"7.17.0 Released: RegExp &#039;v&#039; mode and ... 🥁 decorators! · Babel","url":"https://babeljs.io/blog/2022/02/02/7.17.0","tags":["babel","ReleaseNote"],"content":"Babel 7.17.0リリース。\nDecorators Proposalを最新のものへ対応する`\"version\": \"2021-12\"`オプションの追加、Stage 2の正規表現リテラルの`v`フラグと`\\q`シーケンスのサポート。\nStage 2のPipe Operatorに`topicToken`として`^^`と`@@`を選択できるオプションの追加、`@babel/register`に実験的なworkerの実装を追加など","relatedLinks":[{"title":"tc39/proposal-regexp-set-notation: UTS18 set notation in regular expressions","url":"https://github.com/tc39/proposal-regexp-set-notation/"},{"title":"tc39/proposal-pipeline-operator: A proposal for adding a useful pipe operator to JavaScript.","url":"https://github.com/tc39/proposal-pipeline-operator"},{"title":"tc39/proposal-decorators: Decorators for ES6 classes","url":"https://github.com/tc39/proposal-decorators/"}]},{"category":"Headline","title":"Introducing Wolvic | Igalia","url":"https://www.igalia.com/2022/02/03/Introducing-Wolvic.html","tags":["browser","news","VR"],"content":"IgaliaがFirefox Realityを引き継ぐ形でXR向けのブラウザであるWolvicを公開予定。\nWolvicはOculusやHTC Viveなどで利用できるブラウザ。","relatedLinks":[{"title":"Update on Firefox Reality","url":"https://blog.mozilla.org/mozilla/update-on-firefox-reality/"},{"title":"Welcome to Wolvic","url":"https://wolvic.com/"},{"title":"Igalia/wolvic: A fast and secure browser for standalone virtual-reality and augmented-reality headsets.","url":"https://github.com/Igalia/wolvic"}]},{"category":"Headline","title":"Chromium Blog: Chrome 99: CSS Cascade Layers, a New Picker for Input Elements, and More","url":"https://blog.chromium.org/2022/02/chrome-99-css-cascade-layers-new-picker.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 99 betaリリース。\nCSS Cascade Layers、`showPicker()`のサポート。\nOrigin Trialsとしてmanifestの`user_preferences`フィールドの追加。\nCSSの`calc()`が`Infinity`や`NaN`をサポート、`color-scheme`が`only`キーワードをサポート、Canvas 2Dに機能を追加など。\nまた、Battery Status APIの削除、`font-family`から`-webkit-standard`のサポートを削除など","relatedLinks":[]},{"category":"Headline","title":"Release v27.5.0 · facebook/jest","url":"https://github.com/facebook/jest/releases/tag/v27.5.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Jest v27.5.0リリース。\n`expect.closeTo`の追加、`mockFn.mock.lastCall`の追加など","relatedLinks":[]},{"category":"Headline","title":"MDX 2 | MDX","url":"https://mdxjs.com/blog/v2/","tags":["Markdown","jsx","ReleaseNote"],"content":"MDX 2リリース。\n破壊的な変更として、ESM形式のみのサポート、`@mdx-js/*`パッケージの各種変更などが含まれる。\nHTMLタグ内のMarkdown記法のサポート、`{}`でのJavaScript式のサポートなど","relatedLinks":[{"title":"Migrating from v1 to v2 | MDX","url":"https://mdxjs.com/migrating/v2/"}]},{"category":"Headline","title":"Electron 17.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-17-0","tags":["Electron","ReleaseNote"],"content":"Electron 17.0.0リリース。\nChromium 98、Node.js 16.13.0、V8 9.8へアップデート。\n`webContents.getMediaSourceId()`の追加。\nまた、`desktopCapturer.getSource`がmain processのみから利用できるようになり、rendererからは削除された。","relatedLinks":[]},{"category":"Headline","title":"Node v16.14.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v16.14.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 16.14.0リリース。\nNode.js 17からのbackportが中心。\nimport assertions構文でのJSON importのサポート、`asyncWrapProviders`の公開、`EventEmitterAsyncResource`の追加。\n`AbortSignal.timeout()`の追加、`timers/promises`に`scheduler` APIの追加など","relatedLinks":[]},{"category":"Article","title":"Test IE mode in Microsoft Edge with Internet Explorer Driver - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2022/02/01/test-ie-mode-in-microsoft-edge-internet-explorer-driver/","tags":["MSEdge","IE","article"],"content":"MSEdgeのIE mode使ったテスト方法についての記事","relatedLinks":[]},{"category":"Article","title":"Introducing the Dialog Element | WebKit","url":"https://webkit.org/blog/12209/introducing-the-dialog-element/","tags":["safari","article","HTML"],"content":"Safari 15.4で実装される`<dialog>`要素についての解説。","relatedLinks":[]},{"category":"Article","title":"fetch() In Node.js Core: Why You Should Care","url":"https://fusebit.io/blog/node-fetch/","tags":["node.js","Fetch","article"],"content":"Node.js 17.5に実験フラグ付きでFetch APIが実装されたことについて。\nUnidiciベースの`fetch()`がなぜNode Coreに追加されたのかについて。\nNode.jsにおけるHTTPスタックの今後やユーザーがあまり意識せずにHTTP/2と3をサポートする方法における議論の一部としてUnidici/Fetchが扱われている","relatedLinks":[]},{"category":"Article","title":"A list of every web API in Deno","url":"https://deno.com/blog/every-web-api-in-deno","tags":["deno","article","WebPlatformAPI"],"content":"Denoが実装しているWeb APIの紹介記事","relatedLinks":[]},{"category":"Article","title":"In-depth of tnpm rapid mode - how we managed to be 10 second faster than pnpm - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/atian25/in-depth-of-tnpm-rapid-mode-how-could-we-fast-10s-than-pnpm-3bpp","tags":["npm","article","performance"],"content":"npmレジストリのミラーレジストリであるcnpmベースにしたtnpmというnpmレジストリ/ツールについて。\n高速なパッケージのインストールを実現するために、FUSEを利用した仕組みや一時的な変更に対応するためのOverlayFSを使った仕組みについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ngneat/falso: All the Fake Data for All Your Real Needs 🙂","url":"https://github.com/ngneat/falso","tags":["JavaScript","library"],"content":"さまざまな種類のダミーデータを作って返すライブラリ","relatedLinks":[]},{"category":"Book","title":"SOLID: The Software Design and Architecture Handbook","url":"https://solidbook.io/","tags":["JavaScript","book","DDD","architecture"],"content":"ソフトウェアアーキテクチャについての書籍。\nコードにはTypeScriptを使っていて、TDD、OOP、DDDについて扱っている。","relatedLinks":[]}]},{"meta":{"title":"2022-02-14のJS: Parcel 2.3.0、Vite 2.8.0、Angular Compilerがどのように動いているか、JavaScriptでDDD","author":"azu","layout":"post","date":"2022-02-14T13:44:43.741Z","category":"JSer","tags":["TypeScript","node.js","vite","ShellScript","bundler"],"url":"https://jser.info/2022/02/14/parcel-2.3.0-vite-2.8.0-angular-compiler-javascriptddd/"},"items":[{"category":"Headline","title":"Release 5.0.0 · google/zx","url":"https://github.com/google/zx/releases/tag/5.0.0","tags":["ShellScript","JavaScript","node.js","library"],"content":"zx 5.0.0リリース。\nYAMLのサポート、\n`.ts`のビルトインサポートを削除、Node.js 16未満のサポート終了など","relatedLinks":[]},{"category":"Headline","title":"Release v2.3.0 · parcel-bundler/parcel","url":"https://github.com/parcel-bundler/parcel/releases/tag/v2.3.0","tags":["JavaScript","bundler","ReleaseNote"],"content":"Parcel 2.3.0リリース。\nParcelでParcel自体のいくつかの依存関係を事前にbundleするように変更。\nNode Core ModulesのpolyfillやBabel/PostCSSの依存関係をオンデマンドでインストールするように変更など","relatedLinks":[{"title":"Reduce the number of npm dependencies needed by parcel by devongovett · Pull Request #7576 · parcel-bundler/parcel","url":"https://github.com/parcel-bundler/parcel/pull/7576"}]},{"category":"Headline","title":"Release v8.5.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v8.5.0","tags":["npm","ReleaseNote"],"content":"npm 8.5.0リリース。\nworkspace内でのnpm installなどのコマンドがコンテキストに基づいて実行されるように変更など","relatedLinks":[{"title":"RFC: npm workspaces: auto switch context based on cwd by ruyadorno · Pull Request #343 · npm/rfcs","url":"https://github.com/npm/rfcs/pull/343"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 140 | WebKit","url":"https://webkit.org/blog/12255/release-notes-for-safari-technology-preview-140/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 140リリース。\nCSSの`:has()`擬似クラスのサポート、`FetchEvent.handled`のサポート、`form.requestSubmit()`の有効化。\nscript要素がサポートしているtypeを判定する\n`HTMLScriptElement.supports(type)`の実装など","relatedLinks":[{"title":"Add FetchEvent.handled (#1397) by tingshao · Pull Request #1496 · w3c/ServiceWorker","url":"https://github.com/w3c/ServiceWorker/pull/1496"},{"title":"HTMLScriptElement.supports() - Web APIs | MDN","url":"https://developer.mozilla.org/en-US/docs/Web/API/HTMLScriptElement/supports"}]},{"category":"Headline","title":"Announcing TypeScript 4.6 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-6-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.6 RCリリース。\n再帰型、インターフェースへのインデックスアクセス、関数の引数における型推論の改善。\n`--target es2022`のサポート、`checkJs`が有効時のJavaScriptの構文エラーのチェックを改善。\n`--generateTrace`で出力できるビルドのトレースデータを分析するための`@typescript/analyze-trace`パッケージの公開など","relatedLinks":[]},{"category":"Headline","title":"vite/CHANGELOG.md at main · vitejs/vite","url":"https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md#280-2022-02-09","tags":["vite","ReleaseNote"],"content":"Vite 2.8.0リリース。\n`vite preview`のデフォルトportの変更、Workerとしてbundleする対象を`URL`使ったものへと変更、設定に`worker`オプションを追加など。\nまた、パッケージのファイルサイズの削減など","relatedLinks":[]},{"category":"Headline","title":"Release v28.0.0-alpha.0 · facebook/jest","url":"https://github.com/facebook/jest/releases/tag/v28.0.0-alpha.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Jest 28αリリース。\n27で`jest-circus`がデフォルトとなったため、JSDOMとjasmin2のenviromentをデフォルトでは含めないように変更。\n`package.json`の`exports`フィールドに対応など","relatedLinks":[]},{"category":"Headline","title":"ESLint v8.9.0 released - ESLint - Pluggable JavaScript linter","url":"https://eslint.org/blog/2022/02/eslint-v8.9.0-released","tags":["ESLint","ReleaseNote"],"content":"ESLint 8.9.0リリース。\n`env`に`es2016`/`es2018`/`es2019`/`es2022`オプションの追加、ES3のコードでは`\"use strict\"`を無視するように変更など","relatedLinks":[]},{"category":"Headline","title":"Firefox 97.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/97.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 97リリース。\nCSSの`cap`と`ic` unitをサポート、CSS cascade layersをデフォルトで有効化。\n`AbortController.abort()`/`AbortSignal.throwIfAborted()`/`AbortSignal.reason`プロパティのサポートなど","relatedLinks":[{"title":"Firefox 97 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/97"}]},{"category":"Headline","title":"Node v17.5.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v17.5.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 17.5.0リリース。\n`--experimental-fetch`フラグ付きでundiciベースのFetch APIの実装を追加、Streamにiterator-helper proposalの実装など","relatedLinks":[]},{"category":"Article","title":"How the Angular Compiler Works. The Angular Compiler (which we call… | by Alex Rickabaugh | Feb, 2022 | Angular Blog","url":"https://blog.angular.io/how-the-angular-compiler-works-42111f9d2549","tags":["Angular","TypeScript","article"],"content":"Angular Compilerがどのように動いているかについての解説記事。\nどのようにAngular componentのテンプレートの型チェックをして変換しているのかについて。","relatedLinks":[]},{"category":"Article","title":"Web パフォーマンスとプロダクト KPI の相関を可視化する話 2022ver - ドクターズプライム Official Blog","url":"https://blog.drsprime.com/entry/2022/02/10/170000","tags":["performance","JavaScript","Chrome","article"],"content":"Web VitalsのメトリクスをGoogle Analyticsに送信し、Google データポータルで可視化する方法について","relatedLinks":[]},{"category":"WebsiteDocument","title":"checkly/puppeteer-to-playwright: Puppeteer to Playwright conversion script","url":"https://github.com/checkly/puppeteer-to-playwright","tags":["puppeteer","Tools","refactoring"],"content":"Puppeter向けのスクリプトをPlaywright向けに変換するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"papyrs/stylo: Another kind of rich text editor","url":"https://github.com/papyrs/stylo","tags":["WebComponents","library","JavaScript"],"content":"ContentEditableベースのWYSIWYGなWeb Components","relatedLinks":[]},{"category":"SoftwareLibrary","title":"hikerpig/pintora: An extensible text-to-diagrams library that works in both browser and node.js","url":"https://github.com/hikerpig/pintora","tags":["JavaScript","library","graphic"],"content":"Mermaid.jsやPlantUMLのようにテキストでダイアグラムを書くライブラリ。\nSequence Diagram、Component Diagram、Activity Diagram、Mind Mapなどの形式に対応していて、プラグインでカスタマイズできる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Aslemammad/react-worker-components-plugin: ⚡ Something like react server components, but web workers instead of a server","url":"https://github.com/Aslemammad/react-worker-components-plugin","tags":["React","vite","plugin"],"content":"importしたReactコンポーネントをreact-worker-componentsを使ってWebWorkerで動かすように変換するViteプラグイン","relatedLinks":[{"title":"dai-shi/react-worker-components: React Worker Components simplify using Web Workers","url":"https://github.com/dai-shi/react-worker-components"}]},{"category":"Book","title":"Implementing DDD, CQRS and… by Alex Lawrence \\[PDF/iPad/Kindle\\]","url":"https://leanpub.com/implementing-ddd-cqrs-and-event-sourcing","tags":["JavaScript","TypeScript","DDD","book"],"content":"JavaScriptで書かれたDDD/CQRS/Event Sourcingについての書籍。\nドメイン駆動設計の理論的な話から、JavaScript/Node.jsを使った実装について。\nEvent Sourcingでは、ブラウザ上のUIと`EventSource`を使ったRead Modelについても扱っている","relatedLinks":[{"title":"Why my book uses Node.js and JavaScript - Alex Lawrence","url":"https://www.alex-lawrence.com/posts/why-my-book-uses-nodejs-and-javascript/"}]}]},{"meta":{"title":"2022-02-22のJS: Deno 1.19、Next.js 12.1、Monorepo Toolsまとめ","author":"azu","layout":"post","date":"2022-02-22T03:38:39.839Z","category":"JSer","tags":["node.js","React","monorepo","Tools","express"],"url":"https://jser.info/2022/02/22/deno-1.19-next.js-12.1-monorepo-tools/"},"items":[{"category":"Headline","title":"Release 5.0.0-beta.1 · expressjs/express","url":"https://github.com/expressjs/express/releases/tag/v5.0.0-beta.1","tags":["node.js","express","library","ReleaseNote"],"content":"Express 5.0.0 beta 1リリース。","relatedLinks":[]},{"category":"Headline","title":"The File System Access API with Origin Private File System | WebKit","url":"https://webkit.org/blog/12257/the-file-system-access-api-with-origin-private-file-system/","tags":["safari","JavaScript","IndexedDB"],"content":"Safariに実装されたFile System Acccess APIについて。\nOriginごとに分離されたPrivateなファイルシステムとなっていて、ブラウザ外からはアクセスできない。\nFile System Access APIの基本的な使い方について","relatedLinks":[{"title":"File System Access API - Web APIs | MDN","url":"https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API"}]},{"category":"Headline","title":"Release v9.4.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v9.4.0","tags":["Chrome","performance","ReleaseNote"],"content":"Lighthouse v9.4.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Deno 1.19 Release Notes","url":"https://deno.com/blog/v1.19","tags":["deno","ReleaseNote"],"content":"Deno 1.19リリース。\n`Deno.File`を`Deno.FsFile`にリネームし、`Deno.File`をdeprecatedに変更。\n依存関係をリポジトリ内のファイルとして管理する`deno vendor`コマンドの追加、`Deno.FsFile`や`Deno.Conn`などがWeb Streamsに対応。\n`CompressionStream`/`DecompressionStream`のサポート、`console.log`が循環参照の表示に対応、`Deno.listen`がUnix socketsに対応など。\nまた、unstableなAPIとして、`Deno.getUid`、`Deno.networkInterfaces`の追加など。","relatedLinks":[]},{"category":"Headline","title":"Release v1.2.0 · remix-run/remix","url":"https://github.com/remix-run/remix/releases/tag/v1.2.0","tags":["React","server","library","ReleaseNote"],"content":"Remix v1.2.0リリース。\n`serverBuildTarget`オプションを追加しデプロイターケットごとに最適化した出力となるように、`server`オプションでカスタムサーバを指定できるように。\nNodeのビルトインモジュールを使っている場合にshimが入るように、`serverDependenciesToBundle`でCJS向けの出力する際にESMパッケージをbundleできるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Blog - Next.js 12.1 | Next.js","url":"https://nextjs.org/blog/next-12-1","tags":["Next.js","ReleaseNote"],"content":"Next.js 12.1リリース。\nAPIサーバで`unstable_revalidate`を使ってISRのページをrevalidateできるように、`next/jest`の追加、SWCの改善とMinifyの対応。\n試験的な機能として`outputStandalone`オプションでNext.jsをサーバで動かすのに必要なファイルのみを出力できるように、React 18の対応など","relatedLinks":[]},{"category":"Headline","title":"Yarn 3.2 🚢🔮 Libc, Yarn Explain, Next Major, ... - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/arcanis/yarn-32-libc-yarn-explain-next-major--o22","tags":["yarn","ReleaseNote"],"content":"Yarn 3.2リリース。\n`optionalDependencies`に`libc`フィールドの追加、`yarn explain`コマンドの追加、UIの改善など。\n次のメジャーアップデートであるYarn 4.xの変更予定についても書かれている","relatedLinks":[]},{"category":"Article","title":"The State of JS 2021","url":"https://2021.stateofjs.com/en-US/","tags":["JavaScript","Survey"],"content":"State of JS 2021のアンケート結果が公開された。\n言語、フレームワーク、ツール、ライブラリを評価するときの基準、リソースなどについてのアンケート結果がまとめられている","relatedLinks":[]},{"category":"Article","title":"textareaをカスタマイズできるReact用のライブラリを作成しました","url":"https://zenn.dev/inokawa/articles/946ba7be927f44","tags":["JavaScript","React","article"],"content":"textarea要素に対してオーバーレイする要素をおいて、テキストの装飾やイベントを設定できるReactライブラリについて","relatedLinks":[{"title":"inokawa/rich-textarea: A small customizable textarea for React to colorize, highlight, decorate texts, offer autocomplete and much more.","url":"https://github.com/inokawa/rich-textarea"}]},{"category":"SoftwareLibrary","title":"JS framework for native web components | Minze","url":"https://minze.dev/","tags":["WebComponents","library"],"content":"WebCompoenntsを作成するためのフレームワーク。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jimmywarting/native-file-system-adapter: File system, based on the spec reference implementation","url":"https://github.com/jimmywarting/native-file-system-adapter/","tags":["node.js","library","polyfill"],"content":"File System Access APIのpolyfillライブラリ。\n対象をアダプタで切り替えることができ、Node.jsやDenoやIndexedDBなどをサポートしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ghiscoding/lerna-lite: automate your workspace version &amp; publish by using conventional-changelog-commits","url":"https://github.com/ghiscoding/lerna-lite","tags":["monorepo","Tools","library"],"content":"lernaから`version`/`publish`/`run`コマンドを取り出したfork。","relatedLinks":[{"title":"Lerna is largely unmaintained · Issue #2703 · lerna/lerna","url":"https://github.com/lerna/lerna/issues/2703#issuecomment-1036971049"}]},{"category":"SoftwareLibrary","title":"Monorepo Explained","url":"https://monorepo.tools/","tags":["monorepo","Tools","JavaScript","library"],"content":"monorepoの解説とツールの比較サイト。\nBazel/Gradle/Lage/Lerna/Nx/Rush/Turborepoについてキャッシュや分散タスクなどの各機能について比較している","relatedLinks":[]},{"category":"Book","title":"HTML解体新書-仕様から紐解く本格入門 | 太田 良典, 中村 直樹 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4862465277/","tags":["HTML","book","accessibility"],"content":"2022年4月15日発売\nHTMLやウェブアクセシビリティについての書籍","relatedLinks":[]}]},{"meta":{"title":"2022-03-01のJS: Redux Toolkit 1.8.0、Node.js 17.6.0、CSS Cascade Layers","author":"azu","layout":"post","date":"2022-02-28T12:49:04.690Z","category":"JSer","tags":["node.js","TypeScript","Tools","pnpm","Chrome"],"url":"https://jser.info/2022/02/28/redux-toolkit-1.8.0-node.js-17.6.0-css-cascade-layers/"},"items":[{"category":"Headline","title":"Release v6.32.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v6.32.0","tags":["pnpm","ReleaseNote"],"content":"pnpm 6.32.0リリース。\nインストールスクリプトを実行できるパッケージを指定する`onlyBuiltDependencies`の追加、`overrides`フィールドが`pnpm add`に対して反映されるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Astro 0.23 Release Notes | Astro","url":"https://astro.build/blog/astro-023/","tags":["JavaScript","library","ReleaseNote"],"content":"Astro 0.23リリース。\nHTML以外のビルドに対応、`set:html`と`set:text`ディレクティブの追加、`PUBLIC_` prefixの環境変数はフロントエンドへ公開するように変更。\nまた、次のバージョンではコンポーネント内のテキストを自動的にHTMLエスケープするよう変更予定。","relatedLinks":[]},{"category":"Headline","title":"Node v17.6.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v17.6.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 17.6.0リリース。\nStreamにIterator helperの`map`などをメソッドを追加すると壊れるモジュールがあったため、仕様への準拠を一時的にrevert。\n`--experimental-https-modules`のフラグ付きでHTTP URLをESMモジュールとしてロードできるように。\nまた`process.on(\"multipleResolves\", ...)`がDeprecatedとなった。","relatedLinks":[{"title":"stream: add map method to Readable: by benjamingr · Pull Request #40815 · nodejs/node","url":"https://github.com/nodejs/node/pull/40815"}]},{"category":"Headline","title":"Release v1.8.0 · reduxjs/redux-toolkit","url":"https://github.com/reduxjs/redux-toolkit/releases/tag/v1.8.0","tags":["redux","library","ReleaseNote"],"content":"Redux Toolkit v1.8.0-rc.0リリース。\n新しい非同期Middlewareとして`createListenerMiddleware`を追加、`configureStore`の型定義の改善など","relatedLinks":[{"title":"New experimental ","url":"https://github.com/reduxjs/redux-toolkit/discussions/1648"}]},{"category":"Article","title":"What&#039;s New In DevTools (Chrome 99) - Chrome Developers","url":"https://developer.chrome.com/blog/new-in-devtools-99/","tags":["Chrome","article","debug"],"content":"Chrome 99の開発者ツールの変更点について。\nWebSocketsのThrottilingに対応、Reporting APIのパネルを追加、ANSI escape codeを使ったコンソールログのスタイリングをサポートなど","relatedLinks":[]},{"category":"Article","title":"How to publish Deno modules to NPM","url":"https://deno.com/blog/dnt-oak","tags":["deno","node.js","npm","article"],"content":"Denoで書かれたライブラリをNode.js向けにnpmへ公開する方法について。\nHTTPフレームワークであるoakをdntを使ってNode.jsでも動かすように変換して公開した方法について","relatedLinks":[{"title":"denoland/dnt: Deno to npm package build tool.","url":"https://github.com/denoland/dnt/"},{"title":"feat: add experimental support for Node.js by kitsonk · Pull Request #479 · oakserver/oak","url":"https://github.com/oakserver/oak/pull/479"}]},{"category":"Article","title":"A Complete Guide to CSS Cascade Layers | CSS-Tricks - CSS-Tricks","url":"https://css-tricks.com/css-cascade-layers/","tags":["CSS","article"],"content":"CSS Cascade Layersの解説記事。\nCascade Layersの基本的な使い方、Important layers、Layerの優先度、sub layerについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"microsoft/TypeScript-Compiler-Notes: A repo containing notes about the TypeScript Compiler codebase","url":"https://github.com/microsoft/TypeScript-Compiler-Notes","tags":["TypeScript","document"],"content":"TypeScriptのコンパイラーについてのメモをまとめたリポジトリ。\n重要な変更のPRのまとめ、コンパイルプロセスの解説やContributeする方法ついてなど書かれている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"JoshuaKGoldberg/TypeStat: Converts JavaScript to TypeScript and TypeScript to better TypeScript.","url":"https://github.com/JoshuaKGoldberg/TypeStat","tags":["JavaScript","TypeScript","Tools"],"content":"JavaScriptのコードにTypeScriptの型をつけてTypeScriptのコードベースに変換するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"xataio/screenshot: A zero-dependency browser-native way to take screenshots powered by the native web MediaDevices API.","url":"https://github.com/xataio/screenshot","tags":["JavaScript","library","Image","browser"],"content":"`MediaDevices.getDisplayMedia`を使ったスクリーンショットライブラリ。\n画面の表示そのものをキャプチャ画像として取得できる","relatedLinks":[{"title":"Xata | New Open Source Library: Announcing @xata.io/screenshot","url":"https://www.xata.io/blog/introducing-screenshot/"}]},{"category":"SoftwareLibrary","title":"leafac/caxa: 📦 Package Node.js applications into executable binaries 📦","url":"https://github.com/leafac/caxa","tags":["node.js","Tools"],"content":"Node.jsアプリケーションを単一の実行バイナリにパッケージングするツール。\nNode.jsとアプリを含む自己解凍型アーカイブとして扱うことで、`fs`などへのpatchをせずにパッケージングしている","relatedLinks":[]},{"category":"Book","title":"vinodotdev/node-to-rust","url":"https://github.com/vinodotdev/node-to-rust/","tags":["JavaScript","Rust","book"],"content":"JavaScriptユーザ向けのRust入門書","relatedLinks":[]}]},{"meta":{"title":"2022-03-08のJS: TypeScript 4.6、Chrome 100 beta、新しいMDN","author":"azu","layout":"post","date":"2022-03-08T03:17:40.310Z","category":"JSer","tags":["TypeScript","React","node.js","webpack","bundler"],"url":"https://jser.info/2022/03/08/typescript-4.6-chrome-100-beta-mdn/"},"items":[{"category":"Headline","title":"Release v5.70.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.70.0","tags":["webpack","ReleaseNote"],"content":"webpack v5.70.0リリース。\nESMにおける`require.context`相当の機能として`import.meta.webpackContext`を追加。\nESMサポートの対象にNode.js 12を追加など","relatedLinks":[]},{"category":"Headline","title":"Release v0.14.24 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/v0.14.24","tags":["JavaScript","bundler","ReleaseNote"],"content":"esbuild v0.14.24リリース。\ntargetに`es2022`をサポート、`define`オプションインデックス指定の場合も置換できるように、`--mangle-quoted`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 141 | WebKit","url":"https://webkit.org/blog/12434/release-notes-for-safari-technology-preview-141/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 141リリース。\nCSS `overflow: clip`の有効化、import assertion構文をフラグ付きで実装、CSPの`wasm-unsafe-eval`を実装など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.6 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-6/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.6リリース。\nDestructuringとUnionの組み合わせ、再帰型、インターフェースへのインデックスアクセス、関数の引数における型推論の改善。\n`--target es2022`のサポート、`checkJs`が有効時のJavaScriptの構文エラーのチェックを改善。","relatedLinks":[]},{"category":"Headline","title":"Release v28.0.0-alpha.7 · facebook/jest","url":"https://github.com/facebook/jest/releases/tag/v28.0.0-alpha.7","tags":["jest","ReleaseNote"],"content":"Jest v28.0.0-alpha.7リリース。\n複数のマシンでテストを分割して実行できる`--shared`フラグの実装など","relatedLinks":[{"title":"feat: implement ","url":"https://github.com/facebook/jest/pull/12546"}]},{"category":"Headline","title":"Release v6.0.0-alpha.0 · styled-components/styled-components","url":"https://github.com/styled-components/styled-components/releases/tag/v6.0.0-alpha.0","tags":["React","CSS","library","ReleaseNote"],"content":"styled-components v6.0.0-alpha.0リリース。\nTypeScriptでの書き直し、stylis v4へのアップデート、Node.js 14未満のサポート終了など","relatedLinks":[{"title":"[","url":"https://github.com/styled-components/styled-components/pull/3241"}]},{"category":"Headline","title":"Release v10.7.0 · TypeStrong/ts-node","url":"https://github.com/TypeStrong/ts-node/releases/tag/v10.7.0","tags":["TypeScript","ReleaseNote","node.js"],"content":"ts-node v10.7.0リリース。\n`--esm`フラグと`ts-node-esm`バイナリを追加など","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 100 Beta: Reduced User-Agent Strings, Multi-Screen Window Placement, and More","url":"https://blog.chromium.org/2022/03/chrome-100-beta-reduced-user-agent.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 100 betaリリース。\nChrome 100がUA文字列を削減する前の最後のバージョン隣、101から段階的にUA文字列を削減していく。\nMulti-Screen Window Placement APIの追加、\nOrigin TrialとしてMedia Source ExtensionsをWorkerで動かせるように。\n`AbortSignal.prototype.throwIfAborted()`の追加、`HIDDevice forget()`の追加など。","relatedLinks":[{"title":"Chromium Blog: User-Agent Reduction Origin Trial and Dates","url":"https://blog.chromium.org/2021/09/user-agent-reduction-origin-trial-and-dates.html"}]},{"category":"Article","title":"A new year, a new MDN - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2022/03/a-new-year-a-new-mdn/","tags":["mdn","article"],"content":"MDNのデザインとロゴの更新について。\nまた、追加機能や追加コンテンツを提供する予定のMDN Plusというサブスクリプションサービスについて","relatedLinks":[{"title":"MDN Web Docs","url":"https://developer.mozilla.org/"}]},{"category":"Article","title":"Working together on Interop 2022 | WebKit","url":"https://webkit.org/blog/12288/working-together-on-interop-2022/","tags":["browser","article","testing","WebPlatformAPI"],"content":"ブラウザの相互運用性に取り組むInterop 2022について。\nApple/Google/Microsoft/Mozilla/Bocoup/Igaliaなどが協力して、ウェブプラットフォームでフォーカスしているエリアについての相互運用性の取り組みについて。\nWPTを使った計測やフォーカスしたエリアについての紹介など","relatedLinks":[{"title":"web-platform-tests dashboard","url":"https://wpt.fyi/interop-2022"},{"title":"Interop 2022: browsers working together to improve the web for developers","url":"https://web.dev/interop-2022/"},{"title":"Microsoft Edge and Interop 2022 - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2022/03/03/microsoft-edge-and-interop-2022/"},{"title":"Announcing Interop 2022 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2022/03/interop-2022/"},{"title":"Bocoup and Interop 2022 - web standards - Bocoup","url":"https://bocoup.com/blog/interop-2022"},{"title":"Igalia and Interop 2022 | Igalia","url":"https://www.igalia.com/news/interop2022.html"}]},{"category":"WebsiteDocument","title":"nodeshift/nodejs-reference-architecture: The Red Hat and IBM Node.js Reference architecture. The teams &#039;opinion&#039; on what components our customers and internal teams should use when building Node.js applications and guidance for how to be successful in production with those components.","url":"https://github.com/nodeshift/nodejs-reference-architecture","tags":["node.js","document","Docker"],"content":"Node.jsプロジェクトのアーキテクチャやライブラリの選定などについてのリファレンスをまとめたガイドライン。\nDockerやnpm周りの設定、ジャンルごとのライブラリやフレームワーク、運用回りのロギングやトレースなど一通りの内容がまとめられている","relatedLinks":[{"title":"Node.js Reference Architecture | Node.JS Reference Architecture","url":"https://nodeshift.dev/nodejs-reference-architecture/"}]},{"category":"Book","title":"フロントエンドのデザインパターン","url":"https://zenn.dev/morinokami/books/learning-patterns-1","tags":["JavaScript","architecture","book","React"],"content":"patterns.dev の翻訳本。\nReactやJavaScriptにおけるデザインパターンの解説","relatedLinks":[{"title":"Patterns.dev - Modern Web App Design Patterns","url":"https://www.patterns.dev/"}]}]},{"meta":{"title":"2022-03-15のJS:  React 18 RC、playwright v1.20.0、Safari 15.4の変更点","author":"azu","layout":"post","date":"2022-03-15T03:48:47.857Z","category":"JSer","tags":["React","node.js","TypeScript","ECMAScript","book"],"url":"https://jser.info/2022/03/15/react-18-rc-playwright-v1.20.0-safari-15.4/"},"items":[{"category":"Headline","title":"How to Upgrade to the React 18 Release Candidate – React Blog","url":"https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html","tags":["React","ReleaseNote"],"content":"React 18 RCリリース。\nIEのサポートを終了。\nReactDOMの`render` APIをDeprecatedとし、`createRoot` APIの利用を推奨するように。\nSSR APIの`renderToNodeStream`を非推奨化し、Suspenseをサポートした`renderToPipeableStream`と`renderToReadableStream`を追加。\n`setState`のステート更新を自動的にバッジ処理するようにし、オプトアウト用の`flushSync`APIを追加。\nまた、ReduxなどのReact外でステート管理するライブラリ向けに`userId`/`useSyncExternalStore`/`useInsertionEffect` APIを追加。\n開発時は`<StrictMode>`でunmountとmountでの再マウントをテストするように挙動を変更。\n`global.IS_REACT_ACT_ENVIRONMENT`でテスト環境かどうかを設定できるように。","relatedLinks":[]},{"category":"Headline","title":"Node v17.7.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v17.7.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v17.7.0リリース。\n`net.Socket`と`net.Server`に`noDelay`/`keepAlive`/`keepAliveInitialDelay`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v8.0.0 · vueuse/vueuse","url":"https://github.com/vueuse/vueuse/releases/tag/v8.0.0","tags":["Vue","library","ReleaseNote"],"content":"vueuse v8.0.0リリース。\n`@vueuse/core/nuxt`を削除し、代わりに`@vueuse/nuxt`を公開。\n`useTimeoutPoll`/`useDateFormat`/`useGamepad`/`useFileSystemAccess`/`useChangeCase`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v8.0.0 · breejs/bree","url":"https://github.com/breejs/bree/releases/tag/v8.0.0","tags":["node.js","library","ReleaseNote"],"content":"JobスケジューラーのBree 8.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release v1.20.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.20.0","tags":["browser","library","ReleaseNote"],"content":"playwright v1.20.0リリース。\nスクリーンショットAPIにアニメーションの無効化、特定の箇所を隠す`mask`オプションの追加。\n`expect().toMatchSnapshot()`がanomymouse snapshotsのサポート、`maxDiffPixels`と`maxDiffPixelRatio`オプションの追加。\nテストの設定にテストケースごとの並列化もする`fullyParallel`モードを追加など","relatedLinks":[]},{"category":"Headline","title":"New WebKit Features in Safari 15.4 | WebKit","url":"https://webkit.org/blog/12445/new-webkit-features-in-safari-15-4/","tags":["webkit","safari","ReleaseNote"],"content":"Safari 15.4の変更点について。\n`<dialog>`要素のサポート、CSSの`:has()`擬似クラス、Cascade Layers、CSS Containmentのサポート。\nViewport Unitsとして`lvh`や`svh`などのサポート、`:focus-visible`擬似クラスのサポート、`calc()`でのmath functionのサポート。\n非標準な`-webkit-` prefixをいくつかのCSSプロパティから削除。\nBroadcastChannel、`window.scroll`の`scroll-behavior`プロパティ、`structuredClone`、File System Access APIのサポート。\nES2022の`at()`メソッドと`Object.hasOwn()`メソッド、Stage 3のProposalである`findLast()`メソッドのサポートなど。\n`Intl`の実装を仕様に準拠するように更新、Web App Manifestの対応改善、`navigationPreload`のサポートなど。\n`requestVideoFrameCallback()`のサポート、CSP Lv3のサポート改善、XSS Auditorの削除など","relatedLinks":[]},{"category":"Article","title":"Learn PWA","url":"https://web.dev/learn/pwa/","tags":["PWA","tutorial"],"content":"PWAについて学べるチュートリアル。","relatedLinks":[]},{"category":"Article","title":"Typed Ember is now the Ember TypeScript Core Team!","url":"https://blog.emberjs.com/typed-ember-is-now-the-ember-type-script-core-team/","tags":["Ember","TypeScript","article"],"content":"EmberのTypeScriptサポートをコアのサブチームとして進めるという話。\nEmber CLIへの統合、Glintでのテンレプーと型チェック、Ember自体の型定義の改善、RFCのTypeScriptへの影響調査などを行うチーム","relatedLinks":[{"title":"0724-road-to-typescript","url":"https://emberjs.github.io/rfcs/0724-road-to-typescript.html"},{"title":"typed-ember/glint: TypeScript powered tooling for Glimmer templates","url":"https://github.com/typed-ember/glint"}]},{"category":"Article","title":"A Proposal For Type Syntax in JavaScript - TypeScript","url":"https://devblogs.microsoft.com/typescript/a-proposal-for-type-syntax-in-javascript/","tags":["TypeScript","ECMAScript","article"],"content":"TypeScriptチームが、実行時には消去可能なコメントとしての型構文をECMAScriptのProposalとして提案するという話","relatedLinks":[{"title":"giltayar/proposal-types-as-comments: ECMAScript proposal for type syntax that is erased - Stage 0","url":"https://github.com/giltayar/proposal-types-as-comments"}]},{"category":"Article","title":"JavaScript naming conflicts: How existing code can force proposed features to be renamed","url":"https://2ality.com/2022/03/naming-conflicts.html","tags":["JavaScript","ECMAScript","issue"],"content":"ECMAScriptの新しいProposalが既存のWebを壊すbreak the webがどのように起きるかについての解説記事。\nビルトインのprototoypeの変更、プロパティ名の競合、グローバル名の衝突、withによる衝突など","relatedLinks":[]},{"category":"Article","title":"WebGPU — All of the cores, none of the canvas — surma.dev","url":"https://surma.dev/things/webgpu/","tags":["WebGPU","article"],"content":"WebGPUについて解説記事。\nWebGLはOpenGLのラッパーであるが、WebGPUは独自の抽象化レイヤーを持っている、またWGSLというWebGPUのシェーディング言語について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"daisyUI — Tailwind CSS Components","url":"https://daisyui.com/","tags":["CSS","library"],"content":"UIコンポーネントの見た目を提供するTailwindプラグイン。\nクラス名にコンポーネントの指定することでUIを定義し、カスタムはクラス名にTailwindのUtilityを指定することで行う","relatedLinks":[]},{"category":"Book","title":"Micro State Management with React Hooks | Packt","url":"https://www.packtpub.com/product/micro-state-management-with-react-hooks/9781801812375","tags":["React","library","book"],"content":"Reactでのステート管理について書籍","relatedLinks":[]}]},{"meta":{"title":"2022-03-24のJS: Deno 1.20、Faker v6.0.0、Next.jsのアップデート","author":"azu","layout":"post","date":"2022-03-24T00:50:26.830Z","category":"JSer","tags":["Tools","node.js","TypeScript","HTML","Bluetooth"],"url":"https://jser.info/2022/03/24/deno-1.20-faker-v6.0.0-next.js/"},"items":[{"category":"Headline","title":"Prettier 2.6: new singleAttributePerLine option and new JavaScript features! · Prettier","url":"https://prettier.io/blog/2022/03/16/2.6.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 2.6.リリース。\nTypeScript 4.6のサポート、`parser`オプションに`acorn`を追加、`--no-plugin-search`フラグの追加、`.swcrc`ファイルを考慮するように修正など","relatedLinks":[]},{"category":"Headline","title":"Deno 1.20 Release Notes","url":"https://deno.com/blog/v1.20","tags":["deno","ReleaseNote"],"content":"Deno 1.20リリース。\nパフォーマンスの改善、`Accept-Encoding`を見て自動的にHTTP Response Bodyを圧縮するように。\n`deno bench`コマンド、`deno task`コマンド、`deno.json`が`importMap`オプションをサポート。\n`deno test`に`--trace-ops`フラグをつけた時のみデバッグ用の詳細な情報を表示するように変更。\n破壊的な変更として、WorkerとTestに対してパーミッションのデフォルト値が\"inherit\"だったのを\"none\"に変更など","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0 · faker-js/faker","url":"https://github.com/faker-js/faker/releases/tag/v6.0.0","tags":["JavaScript","library","testing","ReleaseNote"],"content":"Faker 6.0.0リリース。\nFakerがコミュニティでのメンテナンスになってから最初のメジャリリース。\nパッケージは`@faker-js/faker`として公開されている。ESMのサポート、TypeScriptの型定義の同梱など","relatedLinks":[{"title":"Migrating from Faker v5 to v6 | Faker","url":"https://fakerjs.dev/migration-guide-v5/"},{"title":"An update from the Faker team | Faker","url":"https://fakerjs.dev/update.html"}]},{"category":"Headline","title":"Node v17.8.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v17.8.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 17.8.0リリース。\n`PerformanceObserver`で`http`トレースができるようになるなど","relatedLinks":[{"title":"http: trace http(s) client by perf","url":"https://github.com/nodejs/node/pull/42345"}]},{"category":"Headline","title":"Parcel v2.4.0","url":"https://parceljs.org/blog/v2-4-0/","tags":["JavaScript","Tools","ReleaseNote"],"content":"Parcel v2.4.0リリース。\n@parcel/cssがデフォルト化された。\nそれに伴い、cssnano/autoprefixer/PostCSSの設定などが無視されるなどの変更が含まれる。","relatedLinks":[]},{"category":"Article","title":"An update on the New Architecture Rollout · React Native","url":"https://reactnative.dev/blog/2022/03/15/an-update-on-the-new-architecture-rollout","tags":["React","Native","article"],"content":"React Native 0.68.0では新しいArchitecture Templateが導入される。\nopt-inで導入でき、JavaScriptエンジンとしてHermesが有効化される。","relatedLinks":[]},{"category":"Article","title":"Upgrading Next.js for instant performance improvements – Vercel","url":"https://vercel.com/blog/upgrading-nextjs-for-instant-performance-improvements","tags":["Next.js","article"],"content":"Next.jsのデモアプリのNext.jsをアップデートしながら変更点を紹介しながらパフォーマンスがどのぐらい変わるかを紹介している記事。\n`getStaticProps`を使った初期データの取得の改善、`next/image`での画像最適化、Dynamic Routes/API Routesの利用、NextAuthの利用など。\nまた`next/dynamic`を使った動的インポート、Fontのインライン化や開発パフォーマンスの向上などについて","relatedLinks":[]},{"category":"Article","title":"PgTyped - Node.jsで型安全にSQLを管理するには | HiCustomer Lab - HiCustomer Developer&#039;s Blog","url":"https://tech.hicustomer.jp/posts/type-safe-sql-library-for-nodejs/","tags":["PostgreSQL","TypeScript","article"],"content":"SQLからTypeScriptの型とコードを生成するPgTypedについて。","relatedLinks":[{"title":"adelsz/pgtyped: pgTyped - Typesafe SQL in TypeScript","url":"https://github.com/adelsz/pgtyped"}]},{"category":"WebsiteDocument","title":"A11yAutomation","url":"https://a11y-automation.dev/","tags":["accessibility","document","Tools"],"content":"アクセシビリティの問題について項目ごとに解説とLint/自動テスト/手動テストでのチェック方法、関連するWCAGなどドキュメントがまとめられているサイト","relatedLinks":[]},{"category":"WebsiteDocument","title":"Shader Park","url":"https://shaderpark.com/","tags":["WebGL","webservice","JavaScript"],"content":"High Level APIで2D/3Dのシェーダーをインタラクティブに書けるプラットフォーム。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"wilsonzlin/minify-html: Extremely fast and smart HTML + JS + CSS minifier, available for Rust, Node.js, Python, Java, and Ruby","url":"https://github.com/wilsonzlin/minify-html","tags":["HTML","Bluetooth","library","Rust"],"content":"RustベースのHTML minifier。\nRust/Node/Java/Python/Ruby向けのパッケージも公開されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"twitterdev/twitter-api-typescript-sdk: A TypeScript SDK for the Twitter API","url":"https://github.com/twitterdev/twitter-api-typescript-sdk","tags":["twitter","node.js","library","JavaScript","TypeScript"],"content":"Twitterの公式JavaScript SDK","relatedLinks":[]}]},{"meta":{"title":"2022-03-29のJS: ES2022リリース候補版、Safari Technology Preview 142、Storybookの代替実装","author":"azu","layout":"post","date":"2022-03-29T03:02:54.858Z","category":"JSer","tags":["ECMAScript","React","debug","Tools","vite"],"url":"https://jser.info/2022/03/29/es2022-safari-technology-preview-142-storybook/"},"items":[{"category":"Headline","title":"Release ES2022 Candidate March 2022 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2022-candidate-2022-03","tags":["ECMAScript","ReleaseNote"],"content":"ECMAScript 2022 リリース候補版のリリース","relatedLinks":[]},{"category":"Headline","title":"Release ES Intl 2022 Candidate · tc39/ecma402","url":"https://github.com/tc39/ecma402/releases/tag/es2022-candidate","tags":["ECMAScript","i18n","ReleaseNote"],"content":"ECMAScript 2022 Internationalizatio APIのリリース候補版のリリース。","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 142 | WebKit","url":"https://webkit.org/blog/12522/release-notes-for-safari-technology-preview-142/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 142リリース。\nCSS Subgrid/CSS Container Queries/CSS Motion Pathをデフォルトで有効化。\nES Proposal Stage3のShadow Realmsをデフォルトで有効化、Shared Workersの実装。\n実験的な`<model>`要素の実装など","relatedLinks":[{"title":"explainers/README.md at main · WebKit/explainers","url":"https://github.com/WebKit/explainers/blob/main/model/README.md"}]},{"category":"Headline","title":"Decorators (sans metadata) to stage 3, per 2022.03.28 TC39 · tc39/proposals@eced71d","url":"https://github.com/tc39/proposals/commit/eced71d59d7c34e0f173fdec6b6fb477fc2e0371","tags":["ECMAScript","proposal","news"],"content":"ECMAScript ProposalのDecoratorがStage 3となった。","relatedLinks":[]},{"category":"Article","title":"Introducing Ladle | Ladle","url":"https://www.ladle.dev/blog/introducing-ladle/","tags":["JavaScript","React","Tools","debug","vite"],"content":"ViteベースのStorybook代替実装であるLadleについて。\nビルド時間の短縮といったパフォーマンスの改善などが主な目的で作られている","relatedLinks":[{"title":"tajo/ladle: 🥄 Develop, test and document your React components faster.","url":"https://github.com/tajo/ladle"}]},{"category":"Article","title":"Introducing MDN Plus: Make MDN your own - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2022/03/introducing-mdn-plus-make-mdn-your-own/","tags":["mdn","article"],"content":"MDN Plusについて。\nページの変更通知、ページのお気に入り機能、オフライン機能などが利用できるサブスクリプションの有料機能。\n現在はUSとCanadaで利用できる。","relatedLinks":[]},{"category":"Article","title":"Remixing React Router | Remix","url":"https://remix.run/blog/remixing-react-router","tags":["Remix","article"],"content":"RemixとReact Routerのリポジトリをマージする方針について。\nRemixをReact Routerのリポジトリへマージし、Remixというリポジトリ名に変更する予定について。","relatedLinks":[]},{"category":"Article","title":"npm-scripts を書く時の手癖 - mizdra&#039;s blog","url":"https://www.mizdra.net/entry/2022/03/24/093000","tags":["npm","node.js","article"],"content":"npm-scriptsの基本的なパターン、npm-run-allを使った複数のコマンドを実行するパターン、コードを使ったscriptを扱うパターンなどについての記事。","relatedLinks":[]},{"category":"Article","title":"Tao of Node - Design, Architecture &amp; Best Practices | Alex Kondov - Software Engineer","url":"https://alexkondov.com/tao-of-node/","tags":["node.js","article"],"content":"Node.jsでのウェブアプリケーション開発おけるプラクティスについての記事","relatedLinks":[]},{"category":"SlideVideo","title":"ブラウザ自動操作技術の深層へ、直接触れて学ぶ WebDriver と Chrome DevTools Protocol - Speaker Deck","url":"https://speakerdeck.com/hgsgtk/webdriver-cdp-using-php","tags":["testing","webdriver","Chrome","slide","php"],"content":"WebDriver APIとChrome DevTools Protocol(CDP)についてのスライド。\nそれぞれのAPIを使ってブラウザ操作を自動化する処理をどのように書くのかについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"tajo/ladle: 🥄 Develop, test and document your React components faster.","url":"https://github.com/tajo/ladle","tags":["JavaScript","React","debug","Tools","vite"],"content":"ViteベースのStorybookの代替実装","relatedLinks":[{"title":"Introducing Ladle | Ladle","url":"https://www.ladle.dev/blog/introducing-ladle/"}]},{"category":"SoftwareLibrary","title":"MattiasBuelens/web-streams-polyfill: Web Streams, based on the WHATWG spec reference implementation","url":"https://github.com/MattiasBuelens/web-streams-polyfill","tags":["browser","stream","polyfill"],"content":"Web Streamのpolyfillライブラリ","relatedLinks":[]}]},{"meta":{"title":"2022-04-06のJS: React 18、Vite 2.9.0、Firefoxの新しいパフォーマンスツール","author":"azu","layout":"post","date":"2022-04-06T00:31:54.356Z","category":"JSer","tags":["React","performance","Chrome","Firefox","HTML"],"url":"https://jser.info/2022/04/06/react-18-vite-2.9.0-firefox/"},"items":[{"category":"Headline","title":"React v18.0 – React Blog","url":"https://reactjs.org/blog/2022/03/29/react-v18.html","tags":["React","ReleaseNote"],"content":"React 18リリース。\nConcurrent Renderingに対応するための変更と新しいAPIが追加される。\nsetStateの呼び出しを自動的にバッチ化とopt-outするための`flushSync`を追加、ページ遷移時の状態を扱うTransition APIを追加。\nクライアントに`createRoot`/`hydrateRoot`、サーバに`renderToPipeableStream`/`renderToReadableStream`を追加。\n`<StrictMode>`が開発時は再マウントをテストする挙動に変更、`useId`/`useSyncExternalStore`/`useInsertionEffect`のHooksの追加など。","relatedLinks":[{"title":"How to Upgrade to React 18 – React Blog","url":"https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html"}]},{"category":"Headline","title":"Release v6.3.0 · remix-run/react-router","url":"https://github.com/remix-run/react-router/releases/tag/v6.3.0","tags":["React","library","ReleaseNote"],"content":"React Router 6.3.0リリース。\nv5からv6に移行を補助するための`react-router-dom-v5-compat`モジュールの追加","relatedLinks":[{"title":"Official v5 to v6 Migration Guide · Discussion #8753 · remix-run/react-router","url":"https://github.com/remix-run/react-router/discussions/8753"}]},{"category":"Headline","title":"Chromium Blog: Chrome 101: Federated Credential Management Origin Trial, Media Capabilities for WebRTC, and More","url":"https://blog.chromium.org/2022/03/chrome-101-federated-credential.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 101ベータリリース。\nUA文字列の削減の開始。\nOrigin TrialとしてFedCMの追加、Priority Hintsがデフォルトで有効化。\n`AudioContext.outputLatency`の実装、CSSの`ont-palette`プロパティの実装、MediaCapabilities APIがWebRTCをサポート。\nThird-Party contextでのWebSQLのサポートを削除など","relatedLinks":[{"title":"Chromium Blog: User-Agent Reduction Origin Trial and Dates","url":"https://blog.chromium.org/2021/09/user-agent-reduction-origin-trial-and-dates.html"}]},{"category":"Headline","title":"Announcing React Native 0.68 · React Native","url":"https://reactnative.dev/blog/2022/03/30/version-068","tags":["React","iOS","Android","ReleaseNote"],"content":"React Native 0.68リリース。\n依存関係のアップデート、opt-inでNew Architectureへの対応に対応。\nReact 18の対応は含まれていない。","relatedLinks":[]},{"category":"Headline","title":"Release 0.7.0 · facebookexperimental/Recoil","url":"https://github.com/facebookexperimental/Recoil/releases/tag/0.7.0","tags":["React","library","ReleaseNote"],"content":"Recoil 0.7.0リリース。\n`atom()`と`atomFamily()`に`default`オプションを追加、Snapshotに`getStoreID()`メソッドの追加など","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2022-03 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2022/04/03/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2022年3月のTC39 MeetingでのECMAScript ProposalのStage変更まとめ。\nType AnnotationsがStage 1に、DecoratorがStage 3となった。","relatedLinks":[{"title":"Updates from the 89th TC39 meeting - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/hemanth/updates-from-the-89th-tc39-meeting-5bkf"}]},{"category":"Headline","title":"vite/CHANGELOG.md at main · vitejs/vite","url":"https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md#290-2022-03-30","tags":["vite","ReleaseNote"],"content":"Vite 2.9.0リリース。\n依存関係のscanとpre-bundleの処理を改善、実験的にCSSのSource Mapのサポート、Web WorkerのSource Mapサポートの改善。\nGlob Importsに`{ as: 'raw' }`を追加し、`{ assert: { type: 'raw' }}`は非推奨化。\nPlugin向けの変更として、ClientとServer間をWebSocketsでやりとりできるAPIの追加など","relatedLinks":[]},{"category":"Headline","title":"Electron 18.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-18-0","tags":["Electron","ReleaseNote"],"content":"Electron 18.0.0リリース。\nChromium 100、Node.js 16.13.2、V8 10.0へアップデート。\nElectron 15で`nativeWindowOpen: true`がデフォルトとなったため、これを無効化するためだけに残されていた`nativeWindowOpen`オプションが削除された。","relatedLinks":[]},{"category":"Article","title":"Performance Tool in Firefox DevTools Reloaded - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2022/03/performance-tool-in-firefox-devtools-reloaded/","tags":["Firefox","performance","article"],"content":"Firefoxのパフォーマンスタブが新しくなる。\nプロファイルを記録し、そのパフォーマンスデータを https://profiler.firefox.com/ で表示と共有ができるようになる。","relatedLinks":[{"title":"Firefox Profiler","url":"https://profiler.firefox.com/"}]},{"category":"Article","title":"What&#039;s New In DevTools (Chrome 100) - Chrome Developers","url":"https://developer.chrome.com/blog/new-in-devtools-100/","tags":["Chrome","article"],"content":"Chrome 100の開発者ツールの変更点について。\n`@support`のサポート、Recorderで`data-test`属性などのサポート、記録済みのセレクタの変更をサポート。\n\"Droppped frames\"を\"Partially presented frames\"という表現に変更など","relatedLinks":[]},{"category":"Article","title":"When does React render your component?","url":"https://www.zhenghao.io/posts/react-rerender","tags":["React","article","performance"],"content":"Reactコンポーネントがいつレンダリングされるかについて書かれた記事。\nReactコンポーネントが再レンダリングされる条件、PropsとChildコンポーネントのレンダリング、Contextと再レンダリングについてなど","relatedLinks":[]},{"category":"Article","title":"Understanding Layout Algorithms","url":"https://www.joshwcomeau.com/css/understanding-layout-algorithms/","tags":["CSS","article"],"content":"CSSのレイアウトアルゴリズム(レイアウトモード)について。\nそれぞれのレイアウトアルゴリズムによって同じプロパティでもどのように処理されるかは異なる。プロパティはレイアウトアルゴリズムという関数に渡される引数のようなものという話。","relatedLinks":[]},{"category":"Article","title":"Locale Aware Sorting in JavaScript","url":"https://elijahmanor.com/byte/js-locale-sort","tags":["i18n","JavaScript","article"],"content":"`Intl.Collator`を使ったローカライズされた文字列のソートについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Shakerphobia","url":"https://shakerphobia.netlify.app/","tags":["JavaScript","Tools","bundler"],"content":"npmパッケージ時からimportするものを指定し、Tree Shaking後のbundle sizeを計測するツール","relatedLinks":[]},{"category":"WebsiteDocument","title":"nuxodin/dialog-polyfill: &quot;insert and thats it&quot;-dialog-polyfill","url":"https://github.com/nuxodin/dialog-polyfill","tags":["HTML","polyfill","JavaScript"],"content":"Dialog要素のpolyfillライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nicolo-ribaudo/jest-light-runner: A Jest runner that runs tests directly in bare Node.js, without virtualizing the environment.","url":"https://github.com/nicolo-ribaudo/jest-light-runner","tags":["jest","node.js","library"],"content":"Jest向けの軽量なRunner。\n`jest-runner`からテストケースごとのIsolationのサポートを取り除くことで、テストの実行をより早くしている。","relatedLinks":[]}]},{"meta":{"title":"2022-04-13のJS: TypeScript 4.7 Beta、RedwoodJS 1.0、Sanitizer API","author":"azu","layout":"post","date":"2022-04-12T22:59:47.573Z","category":"JSer","tags":["Tools","TypeScript","React","testing","book"],"url":"https://jser.info/2022/04/13/typescript-4.7-beta-redwoodjs-1.0-sanitizer-api/"},"items":[{"category":"Headline","title":"Astro 1.0 Beta Release | Astro","url":"https://astro.build/blog/astro-1-beta-release/","tags":["JavaScript","Tools","ReleaseNote"],"content":"Astro 1.0 betaリリース。\n2022年6月8日に正式リリースの予定。","relatedLinks":[]},{"category":"Headline","title":"Announcing Rome Formatter","url":"https://rome.tools/blog/2022/04/05/rome-formatter-release","tags":["JavaScript","Rust","Tools","ReleaseNote"],"content":"Rustに書き直されたRomeのFormatterがリリースされた。\nPrettierの挙動をベースにしていて、opt-inで構文エラーのコードに対する整形も対応している。","relatedLinks":[]},{"category":"Headline","title":"Release v8.0.0 · cucumber/cucumber-js","url":"https://github.com/cucumber/cucumber-js/releases/tag/v8.0.0","tags":["JavaScript","testing","ReleaseNote"],"content":"Cucumber.js 8.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Announcing RedwoodJS 1.0 and $1M Funding","url":"https://tom.preston-werner.com/2022/04/04/redwood-v1-and-funding.html","tags":["JavaScript","library","ReleaseNote","React","GraphQL","prisma","jest"],"content":"React/GraphQL/Prisma/Jest/Storybookを組み合わせたアプリケーションフレームワークであるRedwoodJS 1.0リリース。","relatedLinks":[{"title":"Redwood 1.0.0-rc.final is Available 🚀 - Announcements / Releases and Upgrade Guides - RedwoodJS Community","url":"https://community.redwoodjs.com/t/redwood-1-0-0-rc-final-is-available/2902"}]},{"category":"Headline","title":"Announcing TypeScript 4.7 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-7-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.7 betaリリース。\nNode.jsのECMAScript Moduleサポートを再び有効化、`moduleDetection`オプションの追加。\nCompuatedプロパティに対するコントロールフロー解析の改善、オブジェクトにおける関数の型推論の改善。Genericsの型を指定したaliasを定義できる Instantiation Expressionsをサポート。\n`infer`に対する`extends`での推論条件の追加をサポート、型が共変(`in`)/反変(`out`)/不変(`in out`)なのかを指定できるアノテーションを追加。\nモジュール解決持の探索方法をカスタマイズする`moduleSuffixes`オプションの追加、`import type`とReference Commentで`resolution-mode`を指定できるように。","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 143 | WebKit","url":"https://webkit.org/blog/12563/release-notes-for-safari-technology-preview-143/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 143リリース。\nCSS Container Queriesの改善、CSS Cascade Layersの改善。Web Animation APIの改善。\nPermissions APIをデフォルトで有効化、`inert`属性をデフォルトで有効化。","relatedLinks":[{"title":"HTMLElement.inert - Web API | MDN","url":"https://developer.mozilla.org/ja/docs/Web/API/HTMLElement/inert"}]},{"category":"Headline","title":"Turborepo 1.2 | Turborepo","url":"https://turborepo.org/blog/turbo-1-2-0","tags":["monorepo","Tools","ReleaseNote"],"content":"Turborepot 1.2リリース。\n対象をフィルターできる`--filter`フラグの追加、`--dry-run`フラグの追加。\nパフォーマンスの改善、キャッシュの整合性をHMACで検証できる`signature`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v8.0.0-rc.0 · reduxjs/react-redux","url":"https://github.com/reduxjs/react-redux/releases/tag/v8.0.0-rc.0","tags":["React","redux","library","ReleaseNote"],"content":"React-Redux v8.0.0-rc.0リリース。\n`@types/react-readux`に存在した`DefaultRootState`の型定義を削除など","relatedLinks":[]},{"category":"Headline","title":"goldbergyoni/javascript-testing-best-practices: 📗🌐 🚢 Comprehensive and exhaustive JavaScript &amp; Node.js testing best practices (April 2022)","url":"https://github.com/goldbergyoni/javascript-testing-best-practices","tags":["JavaScript","testing","news"],"content":"JavaScriptのテストについてのドキュメント。 テストの構造、バックエンド、フロントエンド、CIなどについて書かれているjavascript-testing-best-practicesがアップデートされた","relatedLinks":[]},{"category":"Headline","title":"Release 2.0.0-beta.0 · vercel/swr","url":"https://github.com/vercel/swr/releases/tag/2.0.0-beta.0","tags":["React","library","ReleaseNote"],"content":"SWR 2.0.0-beta.0リリース。\nリモートの副作用のあるリクエストを扱う`useSWRMutation`の追加。\n破壊的な変更としてFetcherには複数の引数として展開しないように変更など","relatedLinks":[]},{"category":"Article","title":"04.01.2022 - TypeScript/How the compiler compiles","url":"https://www.huy.rocks/everyday/04-01-2022-typescript-how-the-compiler-compiles","tags":["TypeScript","article"],"content":"TypeScript CompilerがどうやってTypeScritのコードをコンパイル、エラーを報告しているかについての解説記事","relatedLinks":[]},{"category":"Article","title":"ECMAScript proposal “Change Array by copy”: four new non-destructive Array methods","url":"https://2ality.com/2022/04/change-array-by-copy.html","tags":["ECMAScript","proposal","article"],"content":"ECMAScript Proposal Stage 3のChange Array by copyについて。\nArrayのメソッドには破壊的なメソッドが混ざっていたが、それに対応する非破壊的なメソッドを追加するProposal","relatedLinks":[]},{"category":"SlideVideo","title":"Making of: The Sanitizer API (Nullcon 2022) - Google スライド","url":"https://docs.google.com/presentation/d/1eLmIZkY7auD8xT-Q6AzBKM_ASFHH8Z5fMyfeoSbSH-k/view#slide=id.g82761e80df_0_1948","tags":["DOM","API","security","slide"],"content":"Sanitizer APIについてのスライド。 \nDOM XSSを防ぐSanitizer APIがサニタイズしたHTML文字列を返すAPIではない理由、`setHTML` APIについて","relatedLinks":[{"title":"Sanitizer API creating mock context-element can cause XSS when used in different context · Issue #42 · WICG/sanitizer-api","url":"https://github.com/WICG/sanitizer-api/issues/42"},{"title":"1669945 - Sanitizer bypass if the sanitized markup is assigned to srcdoc","url":"https://bugzilla.mozilla.org/show_bug.cgi?id=1669945"}]},{"category":"WebsiteDocument","title":"antfu/vue-starport: 🛰 Shared component across routes with animations","url":"https://github.com/antfu/vue-starport","tags":["Vue","library"],"content":"ページをまたいでで同じコンポーネントを表示、遷移アニメーションを行うVueコンポーネント。\n共有するコンポーネントをRootに引き上げることで、ページ間で同じコンポーネントのインスタンスを維持している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"AgnosticUI/agnosticui: AgnosticUI is a set of UI primitives that start their lives in clean HTML and CSS. These standards compliant components are then copied to our framework implementations in: React, Vue 3, Angular, and Svelte.","url":"https://github.com/agnosticui/agnosticui","tags":["UI","library"],"content":"UIコンポーネントフレームワーク。\nプレーンなJSからも利用でき、React/Angular/Svelte/Vueなどの各種UIフレームワーク向けのパッケージも公開されている。","relatedLinks":[]},{"category":"Book","title":"プロを目指す人のためのTypeScript入門　安全なコードの書き方から高度な型の使い方まで：書籍案内｜技術評論社","url":"https://gihyo.jp/book/2022/978-4-297-12747-3","tags":["TypeScript","book"],"content":"2022年4月22日発売\nTypeScriptの入門書","relatedLinks":[]}]},{"meta":{"title":"2022-04-18のJS: Lexical、React Testing Library v13.1.0、Dialog componentの作成","author":"azu","layout":"post","date":"2022-04-18T13:36:16.175Z","category":"JSer","tags":["React","HTML","JSON","TypeScript","polyfill"],"url":"https://jser.info/2022/04/18/lexical-react-testing-library-v13.1.0-dialog-component/"},"items":[{"category":"Headline","title":"Release 3.22.0 - 2022.04.15 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.22.0","tags":["JavaScript","polyfill","library","ReleaseNote"],"content":"core-js v3.22.0リリース。\nChange Array by copy proposalの仕様追従、`atob`/`btoa`の修正、compat dataの更新など","relatedLinks":[]},{"category":"Headline","title":"Release v1.4.0 · remix-run/remix","url":"https://github.com/remix-run/remix/releases/tag/v1.4.0","tags":["JavaScript","Remix","library","ReleaseNote"],"content":"Remix v1.4.0リリース。\n`remix`という単独のパッケージを参照させる\"magic imports\"という仕組みのために、`node_modules`を直接編集してたがpnpmなどで動かない問題があった。\nそのため、それぞれのパッケージを参照するようにするためのマイグレーションスクリプトの公開とそれに関連する変更が含まれている。","relatedLinks":[]},{"category":"Headline","title":"Release v8.0.0 · reduxjs/react-redux","url":"https://github.com/reduxjs/react-redux/releases/tag/v8.0.0","tags":["React","redux","library","ReleaseNote"],"content":"React-Redux v8.0.0リリース。\nコードベースをTypeScriptに書き換え、APIの互換性は維持している。\n`useSyncExternalStore`を使ったReact 18の対応、TypeScriptの型定義から`DefaultRootState`を削除、`connectAdvanced`の削除など","relatedLinks":[]},{"category":"Headline","title":"util: add parseArgs module by bcoe · Pull Request #42675 · nodejs/node","url":"https://github.com/nodejs/node/pull/42675","tags":["node.js","proposal","issue"],"content":"Node.jsにコマンドライン引数のパースをする`util.parseArgs`を追加するProposal","relatedLinks":[{"title":"pkgjs/parseargs: Polyfill of future proposal for ","url":"https://github.com/pkgjs/parseargs"}]},{"category":"Headline","title":"Release v13.1.0 · testing-library/react-testing-library","url":"https://github.com/testing-library/react-testing-library/releases/tag/v13.1.0","tags":["React","testing","library","ReleaseNote"],"content":"react-testing-library 13.1.0リリース。\nReact 18のHooksをテストするための`renderHook` APIを追加。","relatedLinks":[{"title":"feat: Add ","url":"https://github.com/testing-library/react-testing-library/pull/991"},{"title":"testing-library/react-hooks-testing-library: 🐏 Simple and complete React hooks testing utilities that encourage good testing practices.","url":"https://github.com/testing-library/react-hooks-testing-library#a-note-about-react-18-support"}]},{"category":"Headline","title":"Release 2.0.0-beta.1 · vercel/swr","url":"https://github.com/vercel/swr/releases/tag/2.0.0-beta.1","tags":["React","library","ReleaseNote"],"content":"SWR 2.0.0-beta.1リリース。\n`useSWR`が`isLoading`を返すように、`keepPreviousData`オプションの追加など","relatedLinks":[]},{"category":"Article","title":"New React 18 features and changes - Xebia","url":"https://xebia.com/new-react-18-features-and-changes/","tags":["React","article"],"content":"React 18の変更点についての解説。\nConcurrent renderer、createRoot/hydrateRootとonRecoverableErrorについて。\nAutomatic batchingとflushSync。\n新しく追加されたHooks APIであるuseTransition/useDeferredValue、useId、useSyncExternalStore、useInsertionEffectについて","relatedLinks":[]},{"category":"Article","title":"なぜ我々はsession.cookieを変更しなければならなかったのか - BASEプロダクトチームブログ","url":"https://devblog.thebase.in/entry/2022/04/13/114714","tags":["browser","privacy","article"],"content":"Public Suffix Listへの追加申請と、ブラウザに同梱されるタイミングの話。\nブラウザの復元機能によって、変更前と変更後の同名Cookieが存在してしまう問題とブラウザごとの挙動の違いについて。","relatedLinks":[]},{"category":"Article","title":"Building a dialog component","url":"https://web.dev/building-a-dialog-component/","tags":["HTML","article","accessibility"],"content":"`<dialog>`要素を使ったダイアログの作成とアクセシビリティについての記事。\nダイアログ表示とユーザー入力を無視する`inert`属性、`autofocus`属性、ESCキーでの非表示。\n`<dialog>`要素のスタイル、Header/Footerのデザイン、`overscroll-behavior`でのbody scroll lock、JavaScriptとの連携方法について","relatedLinks":[]},{"category":"Article","title":"Boost Resource Loading With fetchpriority, a New Priority Hint — Smashing Magazine","url":"https://www.smashingmagazine.com/2022/04/boost-resource-loading-new-priority-hint-fetchpriority/","tags":["HTML","performance","Fetch","article"],"content":"リソースロードの優先度を定義する`fetchpriority`属性について。","relatedLinks":[{"title":"WICG/priority-hints: A browser API to enable developers signal the priorities of the resources they need to download.","url":"https://github.com/WICG/priority-hints"},{"title":"HTMLIFrameElement.fetchpriority - Web APIs | MDN","url":"https://developer.mozilla.org/en-US/docs/Web/API/HTMLIFrameElement/fetchpriority"}]},{"category":"Article","title":"从 Turborepo 看 Monorepo 工具的任务编排能力 · Issue #13 · worldzhao/blog","url":"https://github.com/worldzhao/blog/issues/13","tags":["monorepo","article","JavaScript"],"content":"monorepoにおける依存関係の管理、タスクのスケジューリング、バージョン管理について。\nタスクの並列実行、トポロジカルソース、TurborepoとRushのアプローチ、リモートキャッシュについての解説。","relatedLinks":[]},{"category":"WebsiteDocument","title":"facebook/lexical: Lexical is an extensible text editor framework that provides excellent reliability, accessibility and performance.","url":"https://github.com/facebook/lexical","tags":["JavaScript","editor","library"],"content":"テキストエディタを作るためのJavaScriptフレームワーク。\nエディタの状態をdouble-bufferingで管理している。\n状態の変更をdiff/patchで表示に反映させる。\nまたcontentEditableを使っているが、外部からの変更をMutationObserverで監視し、エディタの状態を更新している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ThomasAribart/json-schema-to-ts: Infer TS types from JSON schemas 📝","url":"https://github.com/ThomasAribart/json-schema-to-ts","tags":["JSON","TypeScript","library"],"content":"JSON SchemaからTypeScriptの型へ変換するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Shopify/javy: JS to WebAssembly toolchain","url":"https://github.com/Shopify/javy","tags":["JavaScript","WebAssembly","Tools"],"content":"JavaScriptのコードを実行するWebAssembly。\nJavaScriptエンジンにはQuickJSを利用している。\nShopifyで利用されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ehmicky/wild-wild-path: 🤠 Object property paths with wildcards and regexps 🌵","url":"https://github.com/ehmicky/wild-wild-path","tags":["JavaScript","library"],"content":"`*`と正規表現でマッチしたオブジェクトのプロパティの取得と設定ができるライブラリ","relatedLinks":[]}]},{"meta":{"title":"2022-04-26のJS: Redux v4.2.0、Node.js 18、Jest 28","author":"azu","layout":"post","date":"2022-04-26T03:17:15.376Z","category":"JSer","tags":["node.js","Tools","TypeScript","WebAssembly","proposal"],"url":"https://jser.info/2022/04/26/redux-v4.2.0-node.js-18-jest-28/"},"items":[{"category":"Headline","title":"WebAssembly 2.0 First Public Working Drafts | W3C News","url":"https://www.w3.org/blog/news/archives/9509","tags":["WebAssembly","proposal","news"],"content":"WebAssembly 2.0 First Public Working Draftが公開された","relatedLinks":[]},{"category":"Headline","title":"Release v7.0.0 · inikulin/parse5","url":"https://github.com/inikulin/parse5/releases/tag/v7.0.0","tags":["HTML","JavaScript","library","ReleaseNote"],"content":"HTMLパーサのparse5 7.0.0リリース。\nESMモジュール化、TypeScriptで書き直し型定義を同梱するように、`parse5-serializer-stream`の削除など。\nまた、パフォーマンスが改善されている","relatedLinks":[]},{"category":"Headline","title":"Release packemon@2.0.0 · milesj/packemon","url":"https://github.com/milesj/packemon/releases/tag/packemon%402.0.0","tags":["npm","library","ReleaseNote"],"content":"ライブラリ向けのモジュールbundlerであるpackemon　2.0.0リリース。\nIE向けのビルドを削除、Node 14未満のサポート終了、\nSWCのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 3.12.0 · prisma/prisma","url":"https://github.com/prisma/prisma/releases/3.12.0","tags":["prisma","MongoDB","ReleaseNote"],"content":"Prisma 3.12.0リリース。\nMongoDBがGenerally Availableとなった","relatedLinks":[]},{"category":"Headline","title":"Release v4.2.0 · reduxjs/redux","url":"https://github.com/reduxjs/redux/releases/tag/v4.2.0","tags":["redux","library","ReleaseNote"],"content":"Redux v4.2.0リリース。\n`@reduxjs/toolkit`への移行を促すために、`createStore` APIをDeprecatedにして、`legacy_createStore` APIを追加。","relatedLinks":[{"title":"Mark ","url":"https://github.com/reduxjs/redux/issues/4325"},{"title":"Why Redux Toolkit is How To Use Redux Today | Redux","url":"https://redux.js.org/introduction/why-rtk-is-redux-today"}]},{"category":"Headline","title":"Deno 1.21 Release Notes","url":"https://deno.com/blog/v1.21","tags":["deno","ReleaseNote"],"content":"Deno 1.21リリース。\n明示的に型チェックをする`deno check`コマンドを追加し、次のリリースで`deno run`の型チェックはデフォルトでは無効にする予定。\n`globalThis.reportError`と`error`イベントをサポート、`deno repl`に`--eval-file`フラグを追加。\n`deno fmt`と`deno lint`がデフォルトでキャッシュされるように。\nUnstableなAPIとして、`Deno.spawn`/`Deno.spawnChild`/`Deno.spawnSync`の追加。\n`deno test`のBDDライクな`describe`や`it`などのメソッドを追加、STDに`spy`/`stub`/`assertSnapshot`/`FakeTime`を追加など","relatedLinks":[{"title":"Implement new two-tier subprocess API · Issue #11016 · denoland/deno","url":"https://github.com/denoland/deno/issues/11016"}]},{"category":"Headline","title":"Release v2.5.0 · parcel-bundler/parcel","url":"https://github.com/parcel-bundler/parcel/releases/tag/v2.5.0","tags":["JavaScript","Tools","bundler","ReleaseNote"],"content":"Parcel v2.5.0リリース。\nWebExtension Manifest v3をサポート、`__dirname`と`__filename`の変換を修正、`process.env`に対する`in`演算子をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node.js 18 is now available! | Node.js","url":"https://nodejs.org/en/blog/announcements/v18-release-announce/","tags":["node.js","ReleaseNote"],"content":"Node.js 18.0.0リリース。\n2022年10月にLTSとなる予定のメジャーバージョン。\n`fetch` API、Web Streams API、`Blob`/`broadcastChannel` APIなどウェブ標準をサポート。\n`node:test`モジュールの追加、`--node-snapshot-main`の追加、V8 10.1へアップデートなど。\nまた、`server.headersTimeout`と`server.requestTimeout`のデフォルト値の変更など","relatedLinks":[{"title":"Release 2022-04-19, Version 18.0.0 (Current), @BethGriggs · nodejs/node","url":"https://github.com/nodejs/node/releases/tag/v18.0.0"},{"title":"Node.js v18 の主な変更点 - 別にしんどくないブログ","url":"https://shisama.hatenablog.com/entry/2022/04/20/011103"}]},{"category":"Headline","title":"Nuxt - Announcing Nuxt 3 Release Candidate","url":"https://nuxtjs.org/announcements/nuxt3-rc/","tags":["Vue","library","ReleaseNote"],"content":"Nuxt 3 RCリリース。\nVue 3、TypeScript、Viteのサポート。\nサーバーエンジンのNitroとポータブルな出力の対応など","relatedLinks":[]},{"category":"Headline","title":"Jest 28: Shedding weight and improving compatibility 🫶 · Jest","url":"https://jestjs.io/blog/2022/04/25/jest-28","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Jest 28リリース。\nテストを分割して実行できる`--shard`オプションの追加、`exports`フィールドの対応、fakeTimersの改善、GitHub Actionsのreporters対応。\n`testEnvironmentOptions`をインラインコメントで定義できるように、`fetch`などのグローバル対応、ESM対応の改善など","relatedLinks":[]},{"category":"Article","title":"How Jotai Specifies Package Entry Points · Daishi Kato&#039;s blog","url":"https://blog.axlight.com/posts/how-jotai-specifies-package-entry-points/","tags":["node.js","library","article"],"content":"`exports`フィールドについての記事。\n`default`と`import`指定を使ったESMとCJSの対応、一部ツールのための`package.json`や`module`指定のfallback、TypeScriptの`.d.ts`の対応などについて。","relatedLinks":[]},{"category":"Article","title":"How We Migrated from Javascript and Flow to TypeScript at Osome - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/frolovdev/how-we-migrated-from-javascript-and-flow-to-typescript-at-osome-4661","tags":["TypeScript","flowtype","article"],"content":"JavaScriptとFlowTypeからTypeScriptへのマイグレーションをした話。\ndepcruiseでの依存グラフのチェック、Flow to TSとTS Migrateを使った移行、型がついたコードのカバレッジを調べるツールについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"unjs/nitro: ⚗️ Build and deploy universal JavaScript servers","url":"https://github.com/unjs/nitro","tags":["server","JavaScript","library"],"content":"Nuxt 3で利用されているサーバエンジン。\nディレクトリベースのルーティング、Vercel/AWS Lambada/Cloudflare Workersなどのプロバイダにデプロイできるサーバコード生成機能を持つ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"plantain-00/type-coverage: A CLI tool to check type coverage for typescript code","url":"https://github.com/plantain-00/type-coverage","tags":["TypeScript","Tools"],"content":"型がついている(`any`ではない)TypeScriptのコードカバレッジを出すツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"eolme/i18nano: Lightweight translation module with functionality similar to react-i18next","url":"https://github.com/eolme/i18nano","tags":["React","i18n","library"],"content":"React向けのi18nコンポーネント。\n言語ごとのファイルをDynamic Importでロードできるようになっている","relatedLinks":[]}]},{"meta":{"title":"2022-05-03のJS: Node.js 12はEOLとなりサポート終了、pnpm v7.0.0、Mocha v10.0.0、Cypress 9.6.0","author":"azu","layout":"post","date":"2022-05-03T02:23:29.525Z","category":"JSer","tags":["node.js","React","debug","HTML","Tools"],"url":"https://jser.info/2022/05/03/node.js-12eol-pnpm-v7.0.0-mocha-v10.0.0-cypress-9.6.0/"},"items":[{"category":"Headline","title":"Release 4.18.0 · expressjs/express","url":"https://github.com/expressjs/express/releases/tag/4.18.0","tags":["node.js","express","library","ReleaseNote"],"content":"express 4.18.0リリース。\n`res.download`に`root`オプションの追加、cookieに`priority`オプションの追加。\nまた、`res.status`にNumber以外を渡すケースををDeprecatedに変更など","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 102: Window Controls Overlay, a Host of Finished Origin Trials, PWAs as File Handlers and More","url":"https://blog.chromium.org/2022/04/chrome-102-window-controls-overlay-host.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 102 betaリリース。\nWindow Controls Overlay、`inert`属性、Navigation API、`hidden=until-found`のサポート。\nOrigin Private File System extension(OPFS)のAccessHandle APIのサポート。\nWebHIDに`exclusionFilters`オプションの追加、Private IPへのサブリソースリクエスト時にPreflightの発生と警告が出るように、WebRTCのSDP Plan Bを削除。","relatedLinks":[]},{"category":"Headline","title":"Remotion 3.0 | Remotion","url":"https://www.remotion.dev/blog/3-0","tags":["React","library","ReleaseNote"],"content":"Reactで動画を作成するRemotion 3.0リリース。\nエンコーディングのパフォーマンス改善、動画をレンダリングできる`renderMedia` API、エラー表示の改善、React 18のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 18.1.0 (April 26, 2022) · facebook/react","url":"https://github.com/facebook/react/releases/tag/v18.1.0","tags":["React","ReleaseNote"],"content":"React v18.1.0リリース。\nバグ修正が主な変更。\n`use-subscription`のshimの実装が`use-sync-external-store`をラップしただけの実装へと変更された。","relatedLinks":[]},{"category":"Headline","title":"Release v7.0.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v7.0.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v7.0.0リリース。\nNode.js 12のサポート終了、root packageは`pnpm -r exec`などの対象からデフォルトで除外するように変更。`--filter`がglobをサポート、`@types/*`を自動的にhoistしないようになるなど。","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · capricorn86/happy-dom","url":"https://github.com/capricorn86/happy-dom/releases/tag/v3.0.0","tags":["DOM","library","ReleaseNote"],"content":"Happy DOM 3.0.0リリース。\nTargetをES5からES2022に変更、WindowをVM contextとなるように変更など","relatedLinks":[]},{"category":"Headline","title":"Release v8.8.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v8.8.0","tags":["npm","ReleaseNote"],"content":"npm v8.8.0リリース。\n`file:`で指定されたプロジェクト外への依存をsymlinkではなくコピーでインストールできる`--install-links`フラグが追加された。","relatedLinks":[]},{"category":"Headline","title":"Cypress 9.6.0: Easily test multi-domain workflows with cy.origin","url":"https://cypress.io/blog/2022/04/25/cypress-9-6-0-easily-test-multi-domain-workflows-with-cy-origin/","tags":["browser","testing","library","ReleaseNote"],"content":"Cypress 9.6.0リリース。\nCypressはブラウザ内でテストを実行するためマルチドメインに関わるテストはSame Origin Policyで上手く行かないケースがあった。\nこれを解決するために`cy.origin` APIがフラグ付きで実装された。","relatedLinks":[{"title":"Release 9.6.0 · cypress-io/cypress","url":"https://github.com/cypress-io/cypress/releases/tag/v9.6.0"}]},{"category":"Headline","title":"Release v10.0.0 · mochajs/mocha","url":"https://github.com/mochajs/mocha/releases/tag/v10.0.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Mocha v10.0.0リリース。\nNode.js 12のサポート終了、IE11のサポート終了、AMD/RequireJSのサポート終了、Growlサポートの終了、`bin/mocha`を`bin/mocha.js`にリネームなど","relatedLinks":[]},{"category":"Article","title":"Non-interactive Elements with the inert attribute | WebKit","url":"https://webkit.org/blog/12578/non-interactive-elements-with-the-inert-attribute/","tags":["browser","HTML","article"],"content":"`inert`属性についての解説記事。\n今まではfocusは`tabindex`、クリックは`pointer-events`、選択範囲は`user-select`、`aria-hidden`などの各種対応が必要だったが、まとめて不活性として設定できる属性。","relatedLinks":[]},{"category":"Article","title":"“Tao of Node - Design, Architecture &amp; Best Practices” 日本語翻訳","url":"https://jqk.life/tao-of-node-japanese","tags":["node.js","article","translate"],"content":"https://alexkondov.com/tao-of-node/ の翻訳","relatedLinks":[]},{"category":"Article","title":"Node.js 18 Introduces Prefix-Only Core Modules","url":"https://fusebit.io/blog/node-18-prefix-only-modules/","tags":["node.js","article"],"content":"`node:test`のようにnode prefixを付けたコアモジュールを扱う理由についての解説記事。\n新しい名前を追加するときの対応コスト、Typosquattingのような攻撃を回避するため。","relatedLinks":[]},{"category":"WebsiteDocument","title":"The State of Frontend 2022","url":"https://tsh.io/state-of-frontend/","tags":["Survey","web ","JavaScript","CSS","document"],"content":"The Software Houseによるフロントエンドに関するアンケート結果。\nフレームワーク、ライブラリ、TypeScript、SSG、ホスティング、Microfrontend、テスト、アクセシビリティ、パフォーマンス、SEOなどの各項目についてのアンケート結果が公開されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"shuding/tilg: A magical React Hook that helps you debug components.","url":"https://github.com/shuding/tilg","tags":["React","debug","library"],"content":"React ComponnetのレンダリングやライフサイクルをデバッグできるHooksライブラリ。\nコンポーネントのPropsやStateの変化をログに出し、なぜ再レンダリングされたかをみれるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tdewolff/minify: Go minifiers for web formats","url":"https://github.com/tdewolff/minify","tags":["HTML","JavaScript","JSON","SVG","golang","Tools"],"content":"Go言語で実装されたHTML/JSON/JS/SVG/XMLのminifyツール。\nPythonとNode.js向けのバインディングが用意されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"frouriojs/notios","url":"https://github.com/frouriojs/notios","tags":["npm","Tools","debug"],"content":"npm run-scriptsをインタラクティブに複数実行、その実行状況やログを確認できるCUIを提供するツール。\nnpm-run-allのラッパーであるため、npm-run-allと同様のコマンドも提供している。","relatedLinks":[{"title":"Node.jsモノレポ開発のターミナルログ混雑解消のための新作CLIツールnotiosを紹介","url":"https://zenn.dev/luma/articles/nodejs-new-cli-tool-notios"}]}]},{"meta":{"title":"2022-05-11のJS: Node v18.1.0(node --test)、State of CSS 2022、Performance insights","author":"azu","layout":"post","date":"2022-05-11T14:32:25.191Z","category":"JSer","tags":["Tools","Chrome","node.js","monorepo","TypeScript"],"url":"https://jser.info/2022/05/11/node-v18.1.0node-test-state-of-css-2022-performance-insights/"},"items":[{"category":"Headline","title":"Node v18.1.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v18.1.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 18.1.0リリース。\n`WebAssembly.compileStreaming()`と`WebAssembly.instantiateStreaming()`の実装。\n`node:test`を使ったテストを実行する`node --test`フラグの追加","relatedLinks":[]},{"category":"Headline","title":"Announcement: Passing the torch · Issue #3121 · lerna/lerna","url":"https://github.com/lerna/lerna/issues/3121","tags":["monorepo","Tools","news"],"content":"lernaのメンテナンスはNxを開発してるNrwlが引き継ぐとアナウンスされた。","relatedLinks":[]},{"category":"Headline","title":"Babylon.js 5.0: Beyond the Stars. Our mission is to create one of the… | by Babylon.js | May, 2022 | Medium","url":"https://babylonjs.medium.com/babylon-js-5-0-beyond-the-stars-2d11d4c3d07","tags":["WebGL","WebGPU","library","ReleaseNote"],"content":"Babylon.js 5.0リリース。\nWebGPUのサポート、Animation Curve Editorのサポート、Performance Profilerの刷新、GUI Editorのベータサポートなど","relatedLinks":[]},{"category":"Headline","title":"WinterCG","url":"https://wintercg.org/","tags":["deno","node.js","cloudflare","community"],"content":"サーバやCDN Edge RuntimeのAPI標準化についてのワーキンググループ。\nDeno、Cloudflare、Vercel、Node.jsが参加している。","relatedLinks":[{"title":"A Community Group for Web-interoperable JavaScript runtimes","url":"https://blog.cloudflare.com/introducing-the-wintercg/"},{"title":"Announcing the Web-interoperable Runtimes Community Group","url":"https://deno.com/blog/announcing-wintercg"}]},{"category":"Headline","title":"Release 14.0.0 · puppeteer/puppeteer","url":"https://github.com/puppeteer/puppeteer/releases/tag/v14.0.0","tags":["puppeteer","ReleaseNote","Chrome"],"content":"Puppeteer v14.0.0リリース。\nNode.js 12のサポート終了。\nM1 Mac向けのChromiumをダウンロードする`PUPPETEER_EXPERIMENTAL_CHROMIUM_MAC_ARM=1`フラグの追加、ESMのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.22.19 · yarnpkg/yarn","url":"https://github.com/yarnpkg/yarn/releases/tag/v1.22.19","tags":["yarn","ReleaseNote"],"content":"yarn v1.22.19リリース。\nnpmのWebAuthn対応との互換性を修正","relatedLinks":[{"title":"Enhanced 2FA experience for your npm account | The GitHub Blog","url":"https://github.blog/2022-05-10-enhanced-2fa-experience-for-your-npm-account/"}]},{"category":"Headline","title":"wrangler 2.0 — a new developer experience for Cloudflare Workers","url":"https://blog.cloudflare.com/wrangler-v2-beta/","tags":["cloudflare","ReleaseNote"],"content":"Cloudflare WorkersのCLIであるwrangler 2.0がリリース。\n`wrangler.toml`の設定ファイルなしでも動作するように、`--local`でminiflareを使ってローカルでのエミュレートに対応、`wrangler dev`でのデバッグの対応など","relatedLinks":[{"title":"10 things I love about Wrangler v2.0","url":"https://blog.cloudflare.com/10-things-i-love-about-wrangler/"}]},{"category":"Headline","title":"Release v1.2.0 - support of yarn/pnpm \\`workspace:\\` protocol · ghiscoding/lerna-lite","url":"https://github.com/ghiscoding/lerna-lite/releases/tag/v1.2.0","tags":["JavaScript","monorepo","Tools","ReleaseNote"],"content":"lerna-lite v1.2.0リリース。\n`workspace:` protocolのサポート","relatedLinks":[]},{"category":"Article","title":"TypeScript におけるモジュール関連オプションの整理. TypeScript 4.7 で “module” という名前で始まる… | by Yosuke Kurami | May, 2022 | Medium","url":"https://quramy.medium.com/typescript-%E3%81%AB%E3%81%8A%E3%81%91%E3%82%8B%E3%83%A2%E3%82%B8%E3%83%A5%E3%83%BC%E3%83%AB%E9%96%A2%E9%80%A3%E3%82%AA%E3%83%97%E3%82%B7%E3%83%A7%E3%83%B3%E3%81%AE%E6%95%B4%E7%90%86-efdf860a7c4","tags":["TypeScript","article"],"content":"TypeScriptのモジュール周りのオプションについて","relatedLinks":[]},{"category":"Article","title":"Performance insights: Get actionable insights on your website&#039;s performance - Chrome Developers","url":"https://developer.chrome.com/docs/devtools/performance-insights/","tags":["Chrome","performance","article"],"content":"Chrome 102でDevToolsに導入されるPerformance insightsパネルについて。\nパフォーマンスとWeb Vitalsに関連する内容を整理して表示するパネル。","relatedLinks":[{"title":"Performance insights panel | DevTools Tips - YouTube","url":"https://www.youtube.com/watch?v=5PFmGeCZDvw"}]},{"category":"Article","title":"State of CSS 2022","url":"https://web.dev/state-of-css-2022/","tags":["CSS","article"],"content":"2022年にモダンブラウザがサポートして利用できるようになるCSSと今後利用できるようになるCSSについて。","relatedLinks":[]},{"category":"WebsiteDocument","title":"プライバシーサンドボックス - Chrome Developers","url":"https://developer.chrome.com/ja/docs/privacy-sandbox/","tags":["privacy","Chrome","translate"],"content":"Privacy Sandboxについての翻訳まとめ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Primitives – Radix UI","url":"https://www.radix-ui.com/","tags":["UI","React","library","accessibility"],"content":"React向けのUIフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kawamataryo/suppress-ts-errors: CLI tool to add comments to suppress type errors in TypeScript","url":"https://github.com/kawamataryo/suppress-ts-errors","tags":["TypeScript","Tools","Vue"],"content":"TypeScriptでコンパイルエラーとなる箇所に`@ts-expect-error`を追加できるツール。\n`strict: true`への移行時などに暫定的に型エラーを無視するためのツール","relatedLinks":[{"title":"TypeScriptを","url":"https://zenn.dev/ryo_kawamata/articles/suppress-ts-errors"}]},{"category":"SoftwareLibrary","title":"httptoolkit/mockrtc: Powerful friendly WebRTC mock peer &amp; proxy","url":"https://github.com/httptoolkit/mockrtc","tags":["WebRTC","testing","library","proxy"],"content":"WebRTCのモックサーバ、Proxy、テストライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"yisibl/resvg-js: A high-performance SVG renderer and toolkit, powered by Rust based resvg and napi-rs.","url":"https://github.com/yisibl/resvg-js","tags":["Rust","JavaScript","library"],"content":"Rust製のresvgベースのSVGライブラリ。\nNode.js向けのNative ModulesとWebAssembly版が用意されている。","relatedLinks":[]}]},{"meta":{"title":"2022-05-17のJS: Solid v1.4.0、playwright v1.22.0、Safari 15.5","author":"azu","layout":"post","date":"2022-05-16T22:08:06.185Z","category":"JSer","tags":["TypeScript","testing","safari","slide","SQLite"],"url":"https://jser.info/2022/05/17/solid-v1.4.0-playwright-v1.22.0-safari-15.5/"},"items":[{"category":"Headline","title":"Release v8.10.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v8.10.0","tags":["npm","ReleaseNote"],"content":"npm v8.10.0リリース。\n`--omit-lockfile-registry-resolved`フラグの追加。","relatedLinks":[]},{"category":"Headline","title":"Improving the HTTP Archive pipeline and dataset by 10x - Announcements - HTTP Archive","url":"https://discuss.httparchive.org/t/improving-the-http-archive-pipeline-and-dataset-by-10x/2372","tags":["HTTP","web ","BigQuery","news"],"content":"HTTP Archiveのアーキテクチャが変更され、データセットが10倍となるというアナウンス。\nデータ量が増えるためBigQueryのクエリ費用も増える可能性がある。またホームページからセカンダリページのクロールにも対応していく予定。","relatedLinks":[]},{"category":"Headline","title":"Node.js 16.x runtime now available in AWS Lambda | AWS Compute Blog","url":"https://aws.amazon.com/jp/blogs/compute/node-js-16-x-runtime-now-available-in-aws-lambda/","tags":["aws","Lambda","ReleaseNote"],"content":"AWS LambdaでNode.js 16が利用できるようになった","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.7 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-7-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.7 RCリリース。\nBetaからの変更として、Node.jsはEOLとなったため、`target`の指定は`node16`へと変更された。","relatedLinks":[{"title":"Announcing TypeScript 4.7 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-7-beta/"}]},{"category":"Headline","title":"Release v1.4.0 - Level Up! · solidjs/solid","url":"https://github.com/solidjs/solid/releases/tag/v1.4.0","tags":["JavaScript","library"],"content":"Solid v1.4.0リリース。\n`createStore`でトップレベルの配列をサポート、`deferStream`オプションの追加、`createResource`で常に最新の値を取得する`.latest`プロパティを追加。\nまた、Custom Renderersを複数組み合わせて利用できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v7.1.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v7.1.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v7.1.0リリース。\n`package.json`の`libc`フィールドのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.22.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.22.0","tags":["browser","testing","library","ReleaseNote"],"content":"playwright v1.22.0リリース。\nPlaywright TestにComponent Testingを試験的に実装、WAI-ARIA roleなどで要素を選択できるRole selectorの対応。\nまたScreenshot Assertionの安定性のためにデフォルトではアニメーションの無効化などの変更が含まれている。","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 145 | WebKit","url":"https://webkit.org/blog/12629/release-notes-for-safari-technology-preview-145/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 145リリース。\nContainer Queriesのサポート改善、`<dialog>`要素のダークモード対応、`setTimeout(fn, 0)`とした時に自動的に追加される1msのclampを削除。\nService Workersに`WindowClient.navigate()`と`WindowClient.openWindow()`の実装など","relatedLinks":[]},{"category":"Headline","title":"New WebKit Features in Safari 15.5 | WebKit","url":"https://webkit.org/blog/12669/new-webkit-features-in-safari-15-5/","tags":["safari","ReleaseNote"],"content":"Safari 15.5リリース。\nHTMLの`inert`属性のサポート、CSPで`worker-src`ディレクティブのサポート。\nその他には`background-attachement: fixed`のバグ修正、`position: sticky`のバグ修正、HLS再生時のバグ修正、WebGLのmultisamplingのバグ修正など","relatedLinks":[{"title":"Safari 15.5 Beta Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safari-release-notes/safari-15_5-release-notes"},{"title":"iOS 15 + WebGL 2 issue | Page 2 - Unity Forum","url":"https://forum.unity.com/threads/ios-15-webgl-2-issue.1176116/page-2"}]},{"category":"Article","title":"Meta Open Source is transferring Jest to the OpenJS Foundation","url":"https://engineering.fb.com/2022/05/11/open-source/jest-openjs-foundation/","tags":["JavaScript","testing","OpenSource","article","news"],"content":"JestがOpenJS Foundationに移管される。\nMeta社以外の人のContributionsが多くなったため。","relatedLinks":[{"title":"Jest Project Moves to OpenJS Foundation with Meta Open Source Contribution - OpenJS Foundation","url":"https://openjsf.org/blog/2022/05/11/openjs-foundation-welcomes-jest/"}]},{"category":"SlideVideo","title":"Webフロントエンド基礎研修 ~歴史から学ぶ、現場のスタンダードな開発~ - Google スライド","url":"https://docs.google.com/presentation/d/e/2PACX-1vSjF1cp8fAdMKwFkLmtFT66e-UCD6zanO5KLsuRFmWyZ-8c06YQmgWT750Aqai2JfqHRARYWlkDLfaB/pub#slide=id.gb7224c087c_0_0","tags":["HTML","JavaScript","CSS","slide"],"content":"SPA、React、TypeScript、SSR、CDNについての導入的なスライド。","relatedLinks":[]},{"category":"SlideVideo","title":"バンドル最適化マニアクス at tfconf - Speaker Deck","url":"https://speakerdeck.com/mizchi/bandoruzui-shi-hua-maniakusu-at-tfconf","tags":["JavaScript","performance","slide"],"content":"TreeShakingとDead Code Eliminationについてスライド。\nBundler(rollup)とMinifier(terser)がどのように定数展開や不要なコードを削除しているのかについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"JavascriptDB","url":"https://javascriptdb.com/","tags":["JavaScript","SQLite","library"],"content":"SQLiteを使ったORM的な要素が入ったJavaScript DB。\nデータを配列やオブジェクトとして読み書きでき、filterやpushなどのAPIがそのままDBの読み書きとなる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"i-net-software/JWebAssembly: Java bytecode to WebAssembly compiler","url":"https://github.com/i-net-software/JWebAssembly","tags":["Java","WebAssembly"],"content":"Java bytecodeをWebAssemblyにコンパイルするコンパイラー。\nJavaをブラウザで実行する目的","relatedLinks":[]},{"category":"SoftwareLibrary","title":"wooorm/starry-night: Syntax highlighting, like GitHub","url":"https://github.com/wooorm/starry-night","tags":["JavaScript","library"],"content":"textmate構文をサポートしたSyntax highlighterライブラリ。\ngithub/linguistの定義などを利用して、ファイルサイズは大きいがGitHubやエディタと同じようなハイライトを作成する目的","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dflex-js/dflex: The sophisticated Drag and Drop library you&#039;ve been waiting for 🥳","url":"https://github.com/dflex-js/dflex","tags":["JavaScript","library"],"content":"UIフレームワークに依存しないD&Dライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"alan2207/bulletproof-react: 🛡️ ⚛️ A simple, scalable, and powerful architecture for building production ready React applications.","url":"https://github.com/alan2207/bulletproof-react","tags":["React","architecture","document"],"content":"Reactアプリケーションに関するアーキテクチャガイド。\nプロジェクト構成、スタイル、ディレクトリ構造、コンポーネント、状態管理、テスト、エラー処理、セキュリティ、パフォーマンスなどについてのプラクティスをまとめたもの","relatedLinks":[]},{"category":"SoftwareLibrary","title":"esbuild-kit/tsx: Node.js runtime enhanced with esbuild for loading TypeScript &amp; ESM","url":"https://github.com/esbuild-kit/tsx","tags":["TypeScript","jsx","node.js","library"],"content":"esbuildを使ってTypeScript変換しながら実行するツール。\nESMとCJSをそれぞれ扱うloaderを持っていて、package.jsonの`type`フィールドによって自動でloaderを切り換えて扱える","relatedLinks":[]}]},{"meta":{"title":"2022-05-24のJS: Deno 1.22、Storybook 6.5(webpack Lazy Compilation)、Next.js Layouts RFC","author":"azu","layout":"post","date":"2022-05-24T03:06:17.234Z","category":"JSer","tags":["video","Tools","browser","testing","google"],"url":"https://jser.info/2022/05/24/deno-1.22-storybook-6.5webpack-lazy-compilation-next.js-layouts-rfc/"},"items":[{"category":"Headline","title":"Deno 1.22 Release Notes","url":"https://deno.com/blog/v1.22","tags":["deno","ReleaseNote"],"content":"Deno 1.22.0リリース。\nデフォルトの型チェックの対象が依存関係を含まないローカルのみとなる。\n`Deno.emit()`を削除、Worker内でも`Deno`名前空間がデフォルトで有効化、`--no-config`フラグの追加。\n`Navigator.userAgent`のサポート、`Response.json()`静的メソッドの追加など","relatedLinks":[{"title":"Release v1.22.0 · denoland/deno","url":"https://github.com/denoland/deno/releases/tag/v1.22.0"}]},{"category":"Headline","title":"Release v6.5.0 · storybookjs/storybook","url":"https://github.com/storybookjs/storybook/releases/tag/v6.5.0","tags":["JavaScript","debug","Tools","ReleaseNote"],"content":"Storybook v6.5.0リリース。\nwebpack 5のlazy compilationをサポート、React 18の`createRoot`のサポート、MDX2のサポート。\nまた、Viteの設定ファイルがある場合は、自動的にViteを使うように変更されている。","relatedLinks":[{"title":"storybook/MIGRATION.md at next · storybookjs/storybook","url":"https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#from-version-64x-to-650"}]},{"category":"Headline","title":"7.18.0 Released: Destructuring private elements and TypeScript 4.7 · Babel","url":"https://babeljs.io/blog/2022/05/19/7.18.0","tags":["babel","ReleaseNote"],"content":"Babel v7.18.0リリース。\nTypeScript 4.7のoptional variance(`in`/`out`)、instantiation expressionsなどに対応。\nStage 2のPrivate destructuringのサポート、`regenerator-runtime`を自動的にinline化する変更など","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · capricorn86/happy-dom","url":"https://github.com/capricorn86/happy-dom/releases/tag/v4.0.0","tags":["DOM","library","ReleaseNote"],"content":"Happy DOM v4.0.0リリース。\nVoid Elementのシリアライズバグを修正。\n`<img />`を`<img>`にシリアライズ、一方でSVG要素は`<circle />`を`<circle></circle>`へとシリアライズするように修正。","relatedLinks":[]},{"category":"Headline","title":"Release v2.2.0 · MithrilJS/mithril.js","url":"https://github.com/MithrilJS/mithril.js/releases/tag/v2.2.0","tags":["JavaScript","library","ReleaseNote"],"content":"mithril.js v2.2.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Node v18.2.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v18.2.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 18.2.0リリース。\nOpenSSLのセキュリティ修正、`http.Server`に`closeAllConnections`と`closeIdleConnections`を追加。\n`perf_hooks`に`PerformanceResourceTiming`のサポートを追加など","relatedLinks":[]},{"category":"Headline","title":"nvh95/jest-preview: Debug your Jest tests. Effortlessly.🛠🖼","url":"https://github.com/nvh95/jest-preview","tags":["jest","browser","testing","library"],"content":"Jestで実行中のテストに`debug()`関数を仕込むことで、実行中のテストが作成したHTMLをブラウザでプレビューしながらデバッグできるライブラリ。","relatedLinks":[]},{"category":"Headline","title":"adriancooney/puppeteer-heap-snapshot: API and CLI tool to fetch and query Chome DevTools heap snapshots.","url":"https://github.com/adriancooney/puppeteer-heap-snapshot","tags":["puppeteer","library","Tools"],"content":"Puppeteerを使いサイトへアクセスして、Heap Snapshotを取得し、そのSnapshotから特定のプロパティ名にマッチするオブジェクトを取り出すスクレイピングライブラリ。","relatedLinks":[{"title":"Web Scraping via Javascript Runtime Heap Snapshots - Adrian Cooney","url":"https://www.adriancooney.ie/blog/web-scraping-via-javascript-heap-snapshots"}]},{"category":"Headline","title":"Release electron v19.0.0 · electron/electron","url":"https://github.com/electron/electron/releases/tag/v19.0.0","tags":["Electron","ReleaseNote"],"content":"Electron v19.0.0リリース。\nChromium 102、V8 10.2、Node.js 16.14.2にアップデート。\nElectron 20からpreload scriptsは自動的にsandboxで実行される。\nそのため、`nodeIntegration: true` かつ `sandbox`が無指定の場合に警告が出るようになった。","relatedLinks":[]},{"category":"Headline","title":"Release v7.0.0 · faker-js/faker","url":"https://github.com/faker-js/faker/releases/tag/v7.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"Faker v7.0.0リリース。\ndefault exportを削除、ES2020をサポートしている環境をターゲットに変更、Node.js 12のサポート終了など","relatedLinks":[]},{"category":"Article","title":"The Surprising Truth About Pixels and Accessibility: should I use pixels or rems?","url":"https://www.joshwcomeau.com/css/surprising-truth-about-pixels-and-accessibility/","tags":["CSS","fonts","accessibility","article"],"content":"`px`と`rem`について。\n`px`指定はブラウザのデフォルトフォントサイズの影響を受けないが`rem`は影響を受ける。\n使う場所による違い、デフォルトフォントサイズを大きくして確認する方法、ルートのフォントサイズを小さくする問題についてなど","relatedLinks":[]},{"category":"Article","title":"Blog - Layouts RFC | Next.js","url":"https://nextjs.org/blog/layouts-rfc","tags":["Next.js","article","proposal"],"content":"Next.jsの新しいLayout RFCを解説する記事。\n`app/`というディレクトリでopt-inする形となり、`layout.js`と`page.js`というファイル名の命名規則使ったルーティングとレイアウトの仕組みについて。\nまた、この新しいLayout RFCではReact Server Componentsがデフォルトとなることについてなど","relatedLinks":[{"title":"RFC: Layouts · Discussion #37136 · vercel/next.js","url":"https://github.com/vercel/next.js/discussions/37136"}]},{"category":"SlideVideo","title":"Web at I/O 2022 - YouTube","url":"https://www.youtube.com/playlist?list=PLNYkxOF6rcIDKuCU73tmdRN_-mI3tKFPD","tags":["google","web ","video","Conference"],"content":"Google I/O 2022のWeb関係の動画まとめ","relatedLinks":[]},{"category":"SlideVideo","title":"Playwright 1.22: Component Tests (preview) Overview - YouTube","url":"https://www.youtube.com/watch?v=y3YxX4sFJbM","tags":["playwright","JavaScript","browser","testing","video"],"content":"Playwright v1.22で試験的に実装されたComponent Tests機能の解説動画。\nどのような仕組みでブラウザにコンポーネントをmountしているか、コンポーネントのテスト実行、デバッガーとの連携、キーボード入力やスクリーンショットの撮影などについて","relatedLinks":[{"title":"Release v1.22.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.22.0"}]},{"category":"SoftwareLibrary","title":"markdoc/markdoc: A powerful, flexible, Markdown-based authoring framework.","url":"https://github.com/markdoc/markdoc","tags":["Markdown","document","library"],"content":"Markdownベースのドキュメントオーサリングライブラリ。\nパーサ、バリデーション、カスタムタグなどを拡張に対応している。\nmarkdown-itのtokenize結果をもとにASTを組み立て、それをレンダリングするRendererを持つ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"honojs/hono: Ultrafast web framework for Cloudflare Workers. Fast, but not only fast.","url":"https://github.com/honojs/hono","tags":["cloudflare","library","JavaScript"],"content":"Cloudflare Workers向けのルーティングライブラリ","relatedLinks":[]}]},{"meta":{"title":"2022-06-01のJS: Lerna 5.0.0、TypeScript 4.7、wireit","author":"azu","layout":"post","date":"2022-06-01T03:58:35.704Z","category":"JSer","tags":["TypeScript","React","npm","bundler","flowtype"],"url":"https://jser.info/2022/06/01/lerna-5.0.0-typescript-4.7-wireit/"},"items":[{"category":"Headline","title":"Release v5.0.0 · lerna/lerna","url":"https://github.com/lerna/lerna/releases/tag/v5.0.0","tags":["JavaScript","monorepo","ReleaseNote"],"content":"lerna v5.0.0リリース。\nNx社にメンテナンスが移行してからの初のリリース。\nNode.js 12以下のサポート終了、auditの問題が出ていたパッケージのアップデートなど。","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.7 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-7/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.7リリース。\nNode.jsのECMAScript Moduleをサポート、`.mts`/`.cts`のサポート。\n`moduleDetection`オプションの追加。 Compuatedプロパティに対するコントロールフロー解析の改善、オブジェクトにおける関数の型推論の改善。\nGenericsの型を指定したaliasを定義できる Instantiation Expressionsをサポート、inferに対するextendsでの推論条件の追加をサポート。\n型が共変(in)/反変(out)/不変(in out)なのかを指定できるアノテーションを追加、モジュール解決時の探索方法をカスタマイズする`moduleSuffixes`オプションの追加。\n`import type`/`import()`/Reference Commentでresolution-modeを指定できるようになるなど","relatedLinks":[{"title":"TypeScript 4.7 と Native Node.js ESM | by Yosuke Kurami | May, 2022 | Medium","url":"https://quramy.medium.com/typescript-4-7-%E3%81%A8-native-node-js-esm-189753a19ba8"}]},{"category":"Headline","title":"Release v10.8.0 · TypeStrong/ts-node","url":"https://github.com/TypeStrong/ts-node/releases/tag/v10.8.0","tags":["TypeScript","node.js","library","ReleaseNote"],"content":"ts-node v10.8.0リリース。\nTypeScript 4.7で追加されたECMAScript Modules in Node.jsのサポート。\nimport時の拡張子をマッピングする`experimentalResolver`オプションの追加。\nNode.jsの`--experimental-specifier-resolution`フラグに対応する`experimentalSpecifierResolution`オプションの追加など","relatedLinks":[{"title":"Announcing TypeScript 4.7 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-7/"}]},{"category":"Headline","title":"Release v8.11.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v8.11.0","tags":["npm","ReleaseNote"],"content":"npm v8.11.0リリース。\n`npm birthday`をDeprecatedに変更。\n`npm pkg`コマンドがあるため`npm set-script`をDeprecatedに変更。\n`--global`と`--local`フラグをそれぞれDeprecatedとなり、`--location=global/local`の利用を推奨するようになるなど。","relatedLinks":[]},{"category":"Headline","title":"Parcel v2.6.0","url":"https://parceljs.org/blog/v2-6-0/","tags":["JavaScript","bundler","ReleaseNote"],"content":"Parcel 2.6.0リリース。\nReactのError overlayに対応、HMRとSource Mapが一緒に動作するように修正。\nCSSモジュールにローカルスコープ変数の概念を追加、未使用のCSS変数をツリーシェイクできるように。\nまた`var(--name from \"./vars.modulecss\")`のようにファイルから変数をimportする独自の構文を追加など。\nその他には、importがglobでのインポートできるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Ember 4.4 Released","url":"https://blog.emberjs.com/ember-released-4-4/","tags":["Ember","ReleaseNote"],"content":"{% raw %}\nEmber 4.4リリース。\n`{{unique-id}}`の有効化、`ember generate`で生成されるテストテンプレートのモジュールを変更可能に、`hasListeners`を公開APIに変更など\n{% endraw %}","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 103 Beta: Early Navigation Hints, a Host of Completed Origin Trials, and More","url":"https://blog.chromium.org/2022/05/chrome-103-beta-early-navigation-hints.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 103 Betaリリース。\nOrigin TrialとしてFederated Credentials Managementのサポート。\n103 Early Hints HTTPのサポート、`AbortSignal.timeout()`のサポート、Elementに対して`aria*`プロパティの追加。\n`deflate-raw`の圧縮型式をサポート、Form要素が`rel`属性のサポート。\nまた、Sandbox iframeでのcustom protocolのナビゲーションをブロックと`allow-top-navigation-to-custom-protocols`の追加など。","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0-alpha.1 · axios/axios","url":"https://github.com/axios/axios/releases/tag/v1.0.0-alpha.1","tags":["HTTP","library"],"content":"axios v1.0.0-alpha.1リリース。","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · mdn/browser-compat-data","url":"https://github.com/mdn/browser-compat-data/releases/tag/v5.0.0","tags":["JavaScript","JSON","library","mdn","ReleaseNote"],"content":"browser-compat-data 5.0.0リリース。\nESMの対応、TypeScriptの対応。\n`matches`の削除、`__meta`オブジェクトの追加、`upstream`フィールドの追加、`impl_url`の追加など","relatedLinks":[]},{"category":"Article","title":"Migrating millions of lines of code to TypeScript","url":"https://stripe.com/blog/migrating-to-typescript","tags":["flowtype","TypeScript","article"],"content":"AirtableのcodemodをベースにFlowTypeからTypeScriptへの切り替えをおこなった話。\nマイグレーションスクリプト、Lintやテストの下準備などを行いコードロックした1日でコードベースをまとめて移行したという話。","relatedLinks":[{"title":"The continual evolution of Airtable’s codebase: Migrating a million lines of code to TypeScript | by Caleb Meredith | The Airtable Engineering Blog | Medium","url":"https://medium.com/airtable-eng/the-continual-evolution-of-airtables-codebase-migrating-a-million-lines-of-code-to-typescript-612c008baf5c"}]},{"category":"Article","title":"Avoiding Puppeteer Antipatterns","url":"https://serpapi.com/blog/puppeteer-antipatterns/","tags":["JavaScript","puppeteer","article"],"content":"Puppeteerのアンチパターンについての記事。","relatedLinks":[]},{"category":"Article","title":"The balance has shifted away from SPAs | Read the Tea Leaves","url":"https://nolanlawson.com/2022/05/21/the-balance-has-shifted-away-from-spas/","tags":["JavaScript","HTML","opinion","article"],"content":"クライアントサイドルーティングを扱うものとしてのSPAは、ページ移動の問題がブラウザ側で解決されてきているので、ナビゲーション問題を解決するためだけにSPAである必要性はなるなるのではという話。\nブラウザ側のPaint holdingやBF Cacheなどの実装によってMPAでも問題なく高速なナビゲーションが可能になってきている点や、後続する記事ではSPAの長所や改善についても書かれている。\nまた、近年まではSPAを扱うフレームワークが主流だったが、AstroやQwikなどのMPAを扱うフレームワークも増えてきているため選択肢は変わってくるのではという話","relatedLinks":[{"title":"More thoughts on SPAs | Read the Tea Leaves","url":"https://nolanlawson.com/2022/05/25/more-thoughts-on-spas/"},{"title":"State is hard: why SPAs will persist | Read the Tea Leaves","url":"https://nolanlawson.com/2022/05/29/state-is-hard-why-spas-will-persist/"}]},{"category":"WebsiteDocument","title":"Component toolkit for creating live-running code editing experiences | Sandpack","url":"https://sandpack.codesandbox.io/","tags":["JavaScript","bundler","library","React"],"content":"CodeSandboxのライブコーディング向けのブラウザSandbox環境(エディタ/プレビュー)を作れるライブラリ。\nReact向けのコンポーネント、各種ライブラリ向けのテンプレート、書いたコードをCodesandbox上で開く機能を持っている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"google/wireit: Wireit upgrades your npm scripts to make them smarter and more efficient.","url":"https://github.com/google/wireit","tags":["npm","Tools"],"content":"Turborepoのようにnpm run-scriptsの依存関係を定義し、実行結果をキャッシュできるツール。\n差分があった時だけビルドするインクリメンタルビルド、ファイル変更を監視してのビルド、CIでのキャッシュの永続化の仕組みをもつ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Shopify/remote-ui","url":"https://github.com/Shopify/remote-ui","tags":["JavaScript","React","Vue","webworker","security","library"],"content":"UIの定義をWeb WorkerなどのUIスレッド以外で行い、メッセージパッシングして受け取ったオブジェクトからレンダリングすることでSandboxに利用できるツールキット。\nDOMライクなAPIやReact/Vue向けのAPIが用意されていて、ユーザーにUIツリーの定義を書いてもらい、それをレンダリングするホスト環境を別途実装できる。\nShopifyやStripe Appsで利用されている。","relatedLinks":[{"title":"Remote Rendering: Shopify’s Take on Extensible UI — Development (2022)","url":"https://shopify.engineering/remote-rendering-ui-extensibility"}]}]},{"meta":{"title":"2022-06-06のJS: Angular 14、Cypress 10、Vue 2.7 α","author":"azu","layout":"post","date":"2022-06-06T13:47:09.930Z","category":"JSer","tags":["npm","node.js","vite","Vue","Tools"],"url":"https://jser.info/2022/06/06/angular-14-cypress-10-vue-2.7-a/"},"items":[{"category":"Headline","title":"Node v18.3.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v18.3.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 18.3.0リリース。\n`util`モジュールに`parseArgs`を追加、`http`モジュールに`uniqueHeaders`オプションを追加など","relatedLinks":[{"title":"pkgjs/parseargs: Polyfill of proposal for ","url":"https://github.com/pkgjs/parseargs"}]},{"category":"Headline","title":"Angular v14 is now available!. We are excited to announce the release… | by Emma Twersky | Jun, 2022 | Angular Blog","url":"https://blog.angular.io/angular-v14-is-now-available-391a6db736af","tags":["Angular","ReleaseNote"],"content":"Angular 14リリース。\nプレビュー機能としてstandalone componentsの追加、Angular Formsの型付けの改善、エラーメッセージをproduction buildではエラーコードのみに変更。\nTypeScript 4.7のサポート、Angular CLIの改善など","relatedLinks":[]},{"category":"Headline","title":"Announcing Cypress 10 with Component Testing Beta!","url":"https://cypress.io/blog/2022/06/01/cypress-10-release/","tags":["E2E","testing","library","ReleaseNote"],"content":"Cypress 10リリース。\nCypress Appの刷新、Component Testingがベータになった。","relatedLinks":[]},{"category":"Headline","title":"Release v3.16.0 · mishoo/UglifyJS","url":"https://github.com/mishoo/UglifyJS/releases/tag/v3.16.0","tags":["JavaScript","library","Tools"],"content":"UflifyJS 3.16.0リリース。\n入力をES Modulesとして扱う`--module`フラグを追加など","relatedLinks":[]},{"category":"Headline","title":"vue/CHANGELOG.md at main · vuejs/vue","url":"https://github.com/vuejs/vue/blob/main/CHANGELOG.md#270-alpha1-2022-05-31","tags":["Vue","ReleaseNote"],"content":"Vue.js 2.7αリリース。\nVue 2.xの最後のminorリリース候補となり、Vue 2.7の正式リリースから18ヶ月後の2023年末にはVue 2.xはEOLとなる予定。\nComposition APIのフルサポート、ESMビルドに`ref`などのnamed exportを追加など","relatedLinks":[{"title":"Filip Rakowski 🇺🇦 on Twitter: ","url":"https://twitter.com/filrakowski/status/1532281407942365184"}]},{"category":"Headline","title":"npm security update: Attack campaign using stolen OAuth tokens | The GitHub Blog","url":"https://github.blog/2022-05-26-npm-security-update-oauth-tokens/","tags":["npm","security","news"],"content":"HerokuとTravis CIからGitHub OAuth Tokenの流出に関連して、npmが管理していたプライベートリポジトリからAWSへのアクセスキーが盗まれ、npmの一部情報が漏洩した。\n2015年のユーザー情報(ユーザー名/メールアドレス/パスワードハッシュ)、2021年のプライベートnpmパッケージのメタデータ、2022年の全てのプライベートパッケージの名前とバージョンが漏洩した。","relatedLinks":[]},{"category":"Headline","title":"Release Add support for lts/-n aliases · actions/setup-node","url":"https://github.com/actions/setup-node/releases/tag/v3.3.0","tags":["Github","Actions","ReleaseNote"],"content":"GitHub ActionsでNode.js環境を設定するactions/setup-node 3.3.0リリース。\n`node-version: lts/-1` のようにLTSの相対指定をサポート。\n3.2.0では、`current`と`latest`のaliasをサポートしている。","relatedLinks":[{"title":"Release Support caching dependencies and LTS aliases · actions/setup-node","url":"https://github.com/actions/setup-node/releases/tag/v2.2.0"},{"title":"Release Add current, node, latest aliases · actions/setup-node","url":"https://github.com/actions/setup-node/releases/tag/v3.2.0"}]},{"category":"Article","title":"Processing Arrays non-destructively: \\`for-of\\` vs. \\`.reduce()\\` vs. \\`.flatMap()\\`","url":"https://2ality.com/2022/05/processing-arrays-non-destructively.html","tags":["JavaScript","article"],"content":"Arrayのfilter/map/some/every/reduce/flatMapメソッドやfor ofなど、どれを使うべきかについて。\nそれぞれの機能の紹介といつ使うべきかについて","relatedLinks":[]},{"category":"Article","title":"JavaScript のメディアタイプと RFC 9239 | blog.jxck.io","url":"https://blog.jxck.io/entries/2022-05-31/text-javascript.html","tags":["JavaScript","article"],"content":"JavaScriptのMIME Typesについて","relatedLinks":[]},{"category":"Article","title":"Introducing Opportunities &amp; Experiments: Taking the Guesswork out of Performance - WebPageTest Blog","url":"https://blog.webpagetest.org/posts/introducing-opportunities-and-experiments/","tags":["performance","article"],"content":"WebPageTestにOpportunitiesとExperiments機能が追加された。\nOpportunitiesはパフォーマンスやアクセシビリティを改善する項目をサジェストし実際に適用して結果がどうなるかを計測できる機能。\nExperimentsはEdgeのProxyを通して一時的にサイトを書き換えて再計測できる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"pkg.land - find NPM alternative packages","url":"https://pkg.land/","tags":["npm","search","webservice"],"content":"npmパッケージの代替パッケージを検索できるサービス","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jridgewell/trace-mapping: Trace the original position through a source map","url":"https://github.com/jridgewell/trace-mapping","tags":["sourcemap","JavaScript","library"],"content":"source-mapパッケージと互換性のあるAPIを提供するライブラリ。\nsource-mapパッケージとは異なりWebAssemblyを利用せずに書かれている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Svelvet","url":"https://svelvet.io/","tags":["Svelte","diagram","library"],"content":"フローチャートを描画するSvelte component","relatedLinks":[]},{"category":"SoftwareLibrary","title":"histoire-dev/histoire: ⚡ Fast and beautiful interactive component playgrounds, powered by Vite","url":"https://github.com/histoire-dev/histoire","tags":["vite","Vue","Tools"],"content":"Viteを使ったStorybook的なツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"WebReflection/highlighted-code: A textarea builtin extend to automatically provide code highlights based on one of the languages available via highlight.js","url":"https://github.com/WebReflection/highlighted-code","tags":["JavaScript","library"],"content":"textareaにシンタックスハイライトをオーバーレイできるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cyco130/vavite: Develop server-side applications with Vite","url":"https://github.com/cyco130/vavite","tags":["vite","node.js","server","library"],"content":"Viteをサーバサイドに組み込むためのExpressなどに対応したMiddlewareやViteプラグイン。\nViteを使ってサーバサイドのコードのTranspile、Live Reload、SSRなどに対応するための仕組みをを提供する。\nまた、本番ビルド時には開発用のDevServerの参照を消すVite Pluginも提供している。","relatedLinks":[]},{"category":"Book","title":"Web Browser Engineering","url":"https://browser.engineering/","tags":["browser","python","book"],"content":"Pythonでブラウザのレンダリングエンジンを作りながらWebページの仕組みについて学ぶ本。\nHTMLのパース、レイアウト、CSSのパース、クリックの処理、Browser ChromeのUI実装、HTTPリクエストの処理、DOM APIの実装、CookieとSameSiteの実装。\nSkiaを使ったレンダリングとブレンディング、スケジューリング、アニメーションなどについて扱う","relatedLinks":[{"title":"Why Python? | Web Browser Engineering","url":"https://browser.engineering/blog/why-python.html"}]},{"category":"Book","title":"スラスラわかるJavaScript 新版（桜庭 洋之 望月 幸太郎）｜翔泳社の本","url":"https://www.shoeisha.co.jp/book/detail/9784798173269","tags":["JavaScript","bok"],"content":"2022年07月13日 発売\nJavaScriptの入門書","relatedLinks":[]}]},{"meta":{"title":"2022-06-15のJS: Safari 16 Beta、Fastify v4、Node.js 16のEOLの予定日の変更","author":"azu","layout":"post","date":"2022-06-15T03:43:11.216Z","category":"JSer","tags":["Tools","node.js","npm","browser","React"],"url":"https://jser.info/2022/06/15/safari-16-beta-fastify-v4-node.js-16eol/"},"items":[{"category":"Headline","title":"Release v11.9.0 · sverweij/dependency-cruiser","url":"https://github.com/sverweij/dependency-cruiser/releases/tag/v11.9.0","tags":["JavaScript","library","ReleaseNote"],"content":"dependency-cruiser 11.9.0リリース。\nMarkdownレポートをサポート","relatedLinks":[]},{"category":"Headline","title":"News from WWDC22: WebKit Features in Safari 16 Beta | WebKit","url":"https://webkit.org/blog/12824/news-from-wwdc-webkit-features-in-safari-16-beta/","tags":["safari","ReleaseNote"],"content":"Safari 16 Betaの変更点について。\nContainer Queries、Push API、Subgridのサポート。\nCSSの`overscroll-behavior`のサポート、Shared Workerのサポート、Formの`requestSubmit()`メソッドをサポートなど","relatedLinks":[{"title":"Safari 16 Beta Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safari-release-notes/safari-16-release-notes"}]},{"category":"Headline","title":"Release v1.5.0 · ghiscoding/lerna-lite","url":"https://github.com/ghiscoding/lerna-lite/releases/tag/v1.5.0","tags":["JavaScript","npm","Tools"],"content":"lerna-lite 1.5.0リリース。\nロックファイルを更新する`--sync-workspace-lock`フラグを追加など","relatedLinks":[]},{"category":"Headline","title":"Fastify v4 GA. After two years we are excited to… | by Fastify | Jun, 2022 | Medium","url":"https://medium.com/@fastifyjs/fastify-v4-ga-59f2103b5f0e","tags":["node.js","server","library","ReleaseNote"],"content":"Fastify 4.0.0リリース。\n`reply.send`を呼び出すの必須に、`setErrorHandler`の処理順の一貫性を改善、Pino v8へアップデート、`fastify.listen`の可変長引数を非推奨化など","relatedLinks":[{"title":"Release v4.0.0 · fastify/fastify","url":"https://github.com/fastify/fastify/releases/tag/v4.0.0"}]},{"category":"Headline","title":"Bringing forward the End-of-Life Date for Node.js 16 | Node.js","url":"https://nodejs.org/en/blog/announcements/nodejs16-eol/","tags":["node.js","news"],"content":"Node.js 16のEOLがOpenSSL 1.1.1のEOLと同日の2023年9月11日までに繰り上げられた。","relatedLinks":[]},{"category":"Headline","title":"PlasmoHQ/plasmo: The browser extension framework","url":"https://github.com/PlasmoHQ/plasmo","tags":["browser","Extension","library"],"content":"ブラウザ拡張向けのフレームワーク。\nReactとTypeScriptのサポート、Manifest V3、Live Reloading、`.env`のサポート、各拡張Storeへのデプロイの対応など","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2022-06 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2022/06/13/ecmascript-proposal-update","tags":["ECMAScript","news"],"content":"2022年6月のTC39ミーティングにおけるECMAScript Proposalのステータス変更のまとめ","relatedLinks":[]},{"category":"Headline","title":"Release 3.23.0 - 2022.06.14 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.23.0","tags":["JavaScript","library","polyfill","ReleaseNote"],"content":"core-js v3.23.0リリース。\n`Array.prototype.findLast`をstableに移動、`Array.prototype.groupBy`を`Array.prototype.group`にリネームなど","relatedLinks":[]},{"category":"Headline","title":"Prettier 2.7: new --cache CLI option and TypeScript 4.7 syntax! · Prettier","url":"https://prettier.io/blog/2022/06/14/2.7.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 2.7リリース。\n`--cache`フラグの追加、TypeScript 4.7のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 10.8.0 · preactjs/preact","url":"https://github.com/preactjs/preact/releases/tag/10.8.0","tags":["JavaScript","React","ReleaseNote"],"content":"Preact 10.8.0リリース。\nVitestとの互換性のためにSubpackagesへ`exports`フィールドを追加、`createRoot`/`hydrateRoot` APIのReactとの互換性を改善など","relatedLinks":[]},{"category":"Headline","title":"Release v1.6.0 · remix-run/remix","url":"https://github.com/remix-run/remix/releases/tag/v1.6.0","tags":["JavaScript","library","ReleaseNote","Remix"],"content":"Remix v1.6.0リリース。\n`remix`パッケージをDeprecatedとして、`@remix-run/*`の個別のパッケージからImportすることを推奨するように。","relatedLinks":[]},{"category":"Headline","title":"Release 7.0.0 · google/zx","url":"https://github.com/google/zx/releases/tag/7.0.0","tags":["shell","node.js","library","ReleaseNote"],"content":"zx 7.0.0リリース。\nTypeScriptでの書き直し、`within()`、`echo()` APIの追加。\n`--eval`フラグのサポート、REPLのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 18.2.0 (June 14, 2022) · facebook/react","url":"https://github.com/facebook/react/releases/tag/v18.2.0","tags":["React","library","ReleaseNote"],"content":"React v18.2.0リリース。\n`onRecoverableError`の第二引数にcomponent stackの情報を渡すように。\nHydrate時にブラウザの拡張機能などによってHTMLが変更されているとレンダリングが壊れる問題を修正など","relatedLinks":[]},{"category":"Article","title":"First-party cookie recipes","url":"https://web.dev/first-party-cookie-recipes/","tags":["browser","article"],"content":"First-Party Cookieを設定する際のCookieの属性の指定について。\n通常のFirst-Party Cookieとサブドメインを持つサイトのパターンについてそれぞれ解説が書かれている。\n`__Host` prefix、`Secure`属性、`Domain`属性を指定しないこと、`Path`属性、`HttpOnly`属性、`SameSite`属性についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"fastify/fastify-dx: A Full Stack Framework based on Fastify and Vite. Built for great developer experience without compromising on performance and stability.","url":"https://github.com/fastify/fastify-dx","tags":["node.js","debug","Tools"],"content":"FastifyとViteを使ったフレームワーク。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ranyitz/qnm: cli utility for querying the node\\_modules directory","url":"https://github.com/ranyitz/qnm","tags":["npm","Tools"],"content":"node_modulesにインストールされているパッケージのバージョンや最新のバージョンや公開日などの情報を表示できるコマンドラインツール。\nまた、パッケージのサイズや依存している個数なども表示できる","relatedLinks":[]}]},{"meta":{"title":"2022-06-21のJS: Internet Explorer 11のサポート終了、Vue 2.7 Beta、社内のReactコンポーネントのメンテナンス","author":"azu","layout":"post","date":"2022-06-21T03:02:39.168Z","category":"JSer","tags":["Tools","bundler","node.js","monorepo","React"],"url":"https://jser.info/2022/06/21/internet-explorer-11-vue-2.7-beta-react/"},"items":[{"category":"Headline","title":"Release v0.14.44 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.14.44","tags":["JavaScript","bundler","Tools","ReleaseNote"],"content":"esbuild 0.14.44リリース。\n`copy` loaderのサポート、package.jsonで定義したself-referencesのサポート。\n`tsconfig.json`の`alwaysStrict`がある場合に`\"use strcit\"`を追加するようになるなど","relatedLinks":[]},{"category":"Headline","title":"Deno 1.23 Release Notes","url":"https://deno.com/blog/v1.23","tags":["deno","ReleaseNote"],"content":"Deno 1.23.0リリース。\n`deno run`などでデフォルトでタイプチェックをしないように変更、`Deno.sleepSync`を削除、`deno task`が`--cwd`フラグをサポート。\n`deno task`がcat/xargs/redirectをサポート、CompressionStreamとDecompressionStreamが`\"deflate-raw\"`をサポート。\nTypeScript 4.7をサポートなど","relatedLinks":[{"title":"Release v1.23.0 · denoland/deno","url":"https://github.com/denoland/deno/releases/tag/v1.23.0"}]},{"category":"Headline","title":"Release v2.0.0 · redwoodjs/redwood","url":"https://github.com/redwoodjs/redwood/releases/tag/v2.0.0","tags":["node.js","JavaScript","library","ReleaseNote"],"content":"Redwood 2.0.0リリース。\n`import/order`のLintルールの変更、独自のインフラにデプロイする場合の設定の変更、`useRequireAuth`の挙動を変更など","relatedLinks":[]},{"category":"Headline","title":"Release 2.0.0-beta.4 · vercel/swr","url":"https://github.com/vercel/swr/releases/tag/2.0.0-beta.4","tags":["React","JavaScript","library","ReleaseNote"],"content":"SWR 2.0.0-beta.4リリース。\n`preload`関数の追加、`SWRConfig`で設定をoverrideできるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release Inferno v8.0.0 · infernojs/inferno","url":"https://github.com/infernojs/inferno/releases/tag/v8.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"Inferno v8.0.0リリース。\n`componentDidAppear`と`componentWillDisappear`の追加、`href=javascript:`に警告を表示するように。\n破棄的な変更としてIEのサポート終了、`inferno-component`パッケージの削除、`inferno-devtools`パッケージの削除など","relatedLinks":[]},{"category":"Headline","title":"Release Version 20.0.0 · jsdom/jsdom","url":"https://github.com/jsdom/jsdom/releases/tag/20.0.0","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"jsdom 20.0.0リリース。\nNode.js 14未満のサポート終了、`crypto.getRandomValues()`の実装、`addEventListener`が`signal`オプションのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v0.14.46 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.14.46","tags":["JavaScript","bundler","ReleaseNote"],"content":"esbuild v0.14.46リリース。\n構文ごとに機能のサポートを無効化するかを指定できるように、TypeScript 4.7のサポート、`--define`がoptional chianingをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0 · sindresorhus/ow","url":"https://github.com/sindresorhus/ow/releases/tag/v1.0.0","tags":["JavaScript","TypeScript","library","ReleaseNote"],"content":"関数でスキーマを定義してバリデーションするow 1.0.0リリース。\nNode.js 12のサポート終了、TypeScript 4.7が必須に、Pure ESM化など。","relatedLinks":[]},{"category":"Headline","title":"Internet Explorer 11 has retired and is officially out of support—what you need to know | Windows Experience Blog","url":"https://blogs.windows.com/windowsexperience/2022/06/15/internet-explorer-11-has-retired-and-is-officially-out-of-support-what-you-need-to-know/","tags":["IE","news"],"content":"Internet Explorerが2022年6月15日をもってサポートを終了となった。\n今後はIEを開くとMSEdgeへリダイレクトされるようになる。","relatedLinks":[]},{"category":"Headline","title":"Vue 2.7 is Now in Beta! | The Vue Point","url":"https://blog.vuejs.org/posts/vue-2-7-beta.html","tags":["Vue","ReleaseNote"],"content":"Vue 2.7 Betaリリース。\nVue 3からのバックポートとして`defineComponent()`、`h()`、`useSlot()`、`useAttrs()`、`useCssModules()`のサポート。\nまたESMビルドにはnamed exportとして提供されることについてや、Vue 3との動作の違いについてなど","relatedLinks":[]},{"category":"Article","title":"Notes on maintaining an internal React component library | Gabe&#039;s blog","url":"https://www.gabe.pizza/notes-on-component-libraries/","tags":["React","article"],"content":"社内でReactコンポーネントライブラリを作るときのプラクティスについての記事。\n間違った状態を受け入れる型を避ける、子となるコンポーネント自体にmarginを持たせない、コンポーネントのwidthは幅全体を占めるようにする。\nコンポーネントのPropsとして`className`や`style`は公開しないようにする、ElementのPropsを継承しないようにする。\n相互依存するコンポーネントにはReact Contextを使う、一緒に利用するコンポーネントはオブジェクトとしてまとめてexportする。\nメジャーアップデートと共にcodemodを提供する、開発者がどのように使ってるかを分析、ビジュアルリグレッションテストを設定するなど","relatedLinks":[]},{"category":"Article","title":"Using web streams on Node.js","url":"https://2ality.com/2022/06/web-streams-nodejs.html","tags":["node.js","stream","article"],"content":"Node.jsでのWeb Streamについての記事。\n基本的な使い方、Asynchronous Iterationとの組み合わせ、Streamへの変換、ReadableStream/WritableStream/TranformStream。\nStreamのbackpressure、バイナリを扱うByte Stream、`node:stream`が公開するヘルパー関数についてなど","relatedLinks":[]},{"category":"Article","title":"Lerna 5.1 — New website, new guides, new Lerna example repo, distributed caching support and speed! | by Juri Strumpflohner | Jun, 2022 | Nrwl","url":"https://blog.nrwl.io/lerna-5-1-new-website-new-guides-new-lerna-example-repo-distributed-caching-support-and-speed-64d66410bec7","tags":["JavaScript","Tools","monorepo","article"],"content":"Lerna 5.1について。\nNxコマンドと連携できる仕組みの追加、ドキュメントサイトの刷新など。\nまた今後のロードマップについて","relatedLinks":[{"title":"Release v5.1.0 · lerna/lerna","url":"https://github.com/lerna/lerna/releases/tag/v5.1.0"},{"title":"Running Tasks | Lerna","url":"https://lerna.js.org/docs/core-concepts/running-tasks"},{"title":"Lerna 2022 Plans · Discussion #3140 · lerna/lerna","url":"https://github.com/lerna/lerna/discussions/3140"}]},{"category":"Article","title":"AbortController is your friend","url":"https://whistlr.info/2022/abortcontroller-is-your-friend/","tags":["JavaScript","article"],"content":"AbortControllerについての記事。\nAbortControllerとAbortSignalの使い方について。\n`addEventListner`との組み合わせ、複雑な処理の停止、React Hooksでの利用、AbortSignalのヘルパー処理についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"JSConf Budapest 2022 - YouTube","url":"https://www.youtube.com/playlist?list=PL37ZVnwpeshGuMZrOZzEo8QLBjjpbtBGm#budapest2022","tags":["JavaScript","Conference","video"],"content":"JSConf Budapest 2022の動画一覧","relatedLinks":[{"title":"JSConf Budapest 2022","url":"https://jsconfbp.com/"}]},{"category":"WebsiteDocument","title":"A build system for the JavaScript ecosystem | moon","url":"https://moonrepo.dev/","tags":["monorepo","Tools"],"content":"Rustで書かれたJavaScriptなmonorepo向けのプロジェクト管理ツール。\nパッケージの依存グラフに基づいたタスクの実行、\nキャッシュ、リモートキャッシュ、インクリメンタルビルドなどの機能を提供する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"taozhi8833998/node-sql-parser: Parse simple SQL statements into an abstract syntax tree (AST) with the visited tableList and convert it back to SQL","url":"https://github.com/taozhi8833998/node-sql-parser","tags":["JavaScript","SQL","library"],"content":"SQLパーサ/ジェネレータライブラリ。\nBigQuery、DB2、Hive、MariaDB、MySQL、PostgresQL、SQLiteなどのSQLに対応している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"coder-mike/microvium: A compact, embeddable scripting engine for applications and microcontrollers for executing programs written in a subset of the JavaScript language.","url":"https://github.com/coder-mike/microvium","tags":["JavaScript","Tools","library"],"content":"組み込み向けのJavaScriptエンジン。\n64kBのメモリ制限やJavaScriptの機能も制限されているが、小さなメモリフットプリントで動かすのを目的としている","relatedLinks":[]}]},{"meta":{"title":"2022-06-28のJS: ECMAScript 2022、TypeScript 4.8 Beta、CodeMirror 6","author":"azu","layout":"post","date":"2022-06-28T03:46:30.520Z","category":"JSer","tags":["React","ECMAScript","ESLint","Angular","TypeScript"],"url":"https://jser.info/2022/06/28/ecmascript-2022-typescript-4.8-beta-codemirror-6/"},"items":[{"category":"Headline","title":"Ecma International approves new standards - Ecma International","url":"https://www.ecma-international.org/news/ecma-international-approves-new-standards-6/","tags":["ECMAScript","ReleaseNote"],"content":"ECMAScript 2022、ECMAScript 2022 Internationalization APIが正式にリリースされた。","relatedLinks":[]},{"category":"Headline","title":"\\[webkit-dev\\] WebKit is now on GitHub","url":"https://lists.webkit.org/pipermail/webkit-dev/2022-June/032312.html","tags":["webkit","Github","news"],"content":"WebKitのリポジトリがGitHubへ移行する","relatedLinks":[{"title":"WebKit/WebKit: Home of the WebKit project, the browser engine used by Safari, Mail, App Store and many other applications on macOS, iOS and Linux.","url":"https://github.com/WebKit/WebKit"}]},{"category":"Headline","title":"Announcing React Native 0.69 · React Native","url":"https://reactnative.dev/blog/2022/06/21/version-069","tags":["React","Native","ReleaseNote"],"content":"React Native 0.69リリース。\nReact 18のサポート、HermesとReact Native一緒にリリースする方針へ変更など","relatedLinks":[]},{"category":"Headline","title":"CodeMirror 6.0","url":"https://marijnhaverbeke.nl/blog/codemirror-6.html","tags":["JavaScript","editor","library","ReleaseNote"],"content":"CodeMirror 6がStableリリースされた。\n`codemirror`パッケージのStableが6となり、CodeMirror 5のリポジトリはLegacyとなった。","relatedLinks":[{"title":"codemirror/codemirror5: In-browser code editor (version 5, legacy)","url":"https://github.com/codemirror/codemirror5"},{"title":"CodeMirror","url":"https://codemirror.net/"}]},{"category":"Headline","title":"Release 2.5.0 · socketio/socket.io","url":"https://github.com/socketio/socket.io/releases/tag/2.5.0","tags":["WebSocket","library","ReleaseNote","security"],"content":"Socket.IO 2.5.0リリース。\nセキュリティ修正として`maxHttpBufferSize`のデフォルト値を100MBから1MBに変更など","relatedLinks":[]},{"category":"Headline","title":"Find and fix problems in your JavaScript code - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/","tags":["ESLint","news"],"content":"ESLintのウェブサイトがリニューアルされた","relatedLinks":[]},{"category":"Headline","title":"Release Version 14.0.0 · open-source-labs/reactime","url":"https://github.com/open-source-labs/reactime/releases/tag/v14.0.0","tags":["React","library","ReleaseNote","debug"],"content":"State管理のタイムトラベルデバッグツールのReactime v14.0.0リリース。\nReact Routerのステートをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · foliojs/fontkit","url":"https://github.com/foliojs/fontkit/releases/tag/v2.0.0","tags":["fonts","JavaScript","library","ReleaseNote","browser"],"content":"fontkit v2.0.0リリース。\nNode.js特有の機能に対する依存を削除し、ブラウザでも利用できるよう変更。\nBufferの代わりにUint8Array/TextEncoder/TextDecoderを利用するなど","relatedLinks":[]},{"category":"Headline","title":"Release v14.0.0 · angular-eslint/angular-eslint","url":"https://github.com/angular-eslint/angular-eslint/releases/tag/v14.0.0","tags":["Angular","ESLint","ReleaseNote"],"content":"Angular ESLint v14.0.0リリース。\nAngular 14のサポート、Node.js 12のサポート終了、インラインテンプレートをLintする際のVirtual filenameの変更など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.8 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-8-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.8 Betaリリース。\n`unknown`は`{} | null | undefined`と同様になり関連するコントロールフロー分析の改善、Template String Typesでの`infer`の改善。\n`--build`/`-watch`/`--incremental`におけるビルドパフォーマンスの改善、オブジェクトリテラルや配列リテラルを`==`や`===`で比較した場合にエラーとなるように。\nBinding patternの型推論の改善、`--watch`の安定性の改善など","relatedLinks":[]},{"category":"Article","title":"When You Should Prefer Map Over Object In JavaScript","url":"https://www.zhenghao.io/posts/object-vs-map","tags":["JavaScript","article"],"content":"MapとObjectの使い分けについての記事。\nObjectを使うときとObjectの問題、Mapの使い方とMapのベンチマーク。","relatedLinks":[]},{"category":"Article","title":"Sensemaking: Angular without SSR is faster than Next.js with SSR. I have the data.","url":"https://alexkrupp.typepad.com/sensemaking/2022/06/angular-without-ssr-is-faster-than-nextjs-with-ssr-i-have-the-data.html","tags":["Angular","React","performance","article","opinion"],"content":"Angular(SSRあり/なし)とNext.jsのショーケースに掲載されているサイトのパフォーマンス計測をして比較した記事。\n両方フレームワークのパフォーマンススコアの平均と中央値は大体同じ傾向となったという話","relatedLinks":[]},{"category":"WebsiteDocument","title":"astoilkov/main-thread-scheduling: Fast and consistently responsive apps using a single function call","url":"https://github.com/astoilkov/main-thread-scheduling","tags":["JavaScript","library"],"content":"Main Threadでの処理をUIの表示や操作をブロックせずに行うためのスケジューリングライブラリ。\nScheduling APIを意識したAPIとなっている。\n`requestIdleCallback()`や`postMessage()`などを使いキューを管理する。\nまた、`navigator.scheduling.isInputPending()`を使いユーザー入力をブロックしないようにタスクを実行できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"timocov/dts-bundle-generator: Tool to generate a single bundle of dts","url":"https://github.com/timocov/dts-bundle-generator","tags":["TypeScript","Tools"],"content":"TypeScriptの型定義をbundleするツール","relatedLinks":[]},{"category":"Book","title":"JavaScript Primer 4.0.0: ECMAScript 2022に対応したJS本 | Web Scratch","url":"https://efcl.info/2022/06/19/jsprimer-4/","tags":["JavaScript","ECMAScript","book","ReleaseNote"],"content":"JavaScript Primer 4.0.0リリース。\nES2022の対応とSandpackを使ったエディタが組み込まれた。","relatedLinks":[{"title":"Release v4.0.0: ES2022 · asciidwango/js-primer","url":"https://github.com/asciidwango/js-primer/releases/tag/v4.0.0"}]}]},{"meta":{"title":"2022-07-04のJS: Next.js 12.2、Fresh 1.0(Deno Web Framework)、Vue 2.7(2.xの最終minor)","author":"azu","layout":"post","date":"2022-07-04T12:32:13.426Z","category":"JSer","tags":["webkit","safari","deno","React","testing"],"url":"https://jser.info/2022/07/04/next.js-12.2-fresh-1.0deno-web-framework-vue-2.72.xminor/"},"items":[{"category":"Headline","title":"WebKit/standards-positions: WebKit&#039;s positions on emerging web specifications","url":"https://github.com/WebKit/standards-positions","tags":["webkit","proposal","safari","apple"],"content":"ウェブ標準のProposalに対するWebKitのポジションを管理するリポジトリ。","relatedLinks":[]},{"category":"Headline","title":"Blog - Next.js 12.2 | Next.js","url":"https://nextjs.org/blog/next-12-2","tags":["Next.js","ReleaseNote"],"content":"Next.js 12.2リリース。\nMiddlewareがStableに、On-Demand ISRのStableに。\nAPI RouteとSSRをCloudflare Workersを使ったEdgeで動かす`runtime`オプションを追加など。\n`next/image`の改善、SWCプラグインのサポート、React 18のサポート改善など","relatedLinks":[]},{"category":"Headline","title":"Fresh 1.0","url":"https://deno.com/blog/fresh-is-stable","tags":["deno","React","ReleaseNote"],"content":"DenoとPreactを使ったウェブフレームワークであるFresh 1.0リリース。","relatedLinks":[{"title":"Release 1.0.0 · denoland/fresh","url":"https://github.com/denoland/fresh/releases/tag/1.0.0"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 148 | WebKit","url":"https://webkit.org/blog/12992/release-notes-for-safari-technology-preview-148/","tags":["webkit","ReleaseNote","safari"],"content":"Safari Technology Preview 148リリース。\nCSSでは`:has()`擬似クラスのサポート改善、`text-indent`プロパティで`each-line`をサポート、`:modal`擬似クラスのサポートなど。\n`<link>`要素の`nonce`属性のサポート。\nITPでCookieのcapをScript-Writeable Storageと同じlast user interactionから7days、interactionない場合は24hで消えるように変更。","relatedLinks":[{"title":"text-indent - CSS: Cascading Style Sheets | MDN","url":"https://developer.mozilla.org/en-US/docs/Web/CSS/text-indent"},{"title":"Full Third-Party Cookie Blocking and More | WebKit","url":"https://webkit.org/blog/10218/full-third-party-cookie-blocking-and-more/"}]},{"category":"Headline","title":"Release v6.0.0 · capricorn86/happy-dom","url":"https://github.com/capricorn86/happy-dom/releases/tag/v6.0.0","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"Happy DOM v6.0.0リリース。\n複数windowに関する問題を修正、`Document.createRange()`/`Document.getSelection()`、`Text.splitText()`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Date and Time Pickers for All – React Spectrum Blog","url":"https://react-spectrum.adobe.com/blog/date-and-time-pickers-for-all.html","tags":["JavaScript","React","library","ReleaseNote","accessibility"],"content":"React AriaとReact Spectrumで日付入力のUIをサポート。\nアクセシビリティ、国際化、カスタマイズ性などを持った日付フィールド/カレンダーのUIコンポーネントを提供する。\nまた併せて複数のタイムゾーン/カレンダーシステム/ロケールをサポートした日付ライブラリも公開している。","relatedLinks":[{"title":"@internationalized/date – Internationalized","url":"https://react-spectrum.adobe.com/internationalized/date/index.html"}]},{"category":"Headline","title":"Release v1.23.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.23.0","tags":["JavaScript","browser","testing","library","ReleaseNote"],"content":"playwright v1.23.0リリース。\nharファイルを使ったNetwork Replay機能の追加、`<select multiple>`に対応する`toHavevalues()`の追加、テキストマッチの`ignoreCase`オプションを追加など","relatedLinks":[]},{"category":"Headline","title":"Release 4.0.0 · prisma/prisma","url":"https://github.com/prisma/prisma/releases/tag/4.0.0","tags":["JavaScript","database","library","ReleaseNote"],"content":"Prisma 4.0.0リリース。\n`extendedIndexes`/`filterJson`/`improvedQueryRaw`がGAに。\nNode.js 12のサポート終了、`DbNull`/`JsonNull`/`AnyNull`はobject型に変更、statement cache sizeのデフォルト値を変更など","relatedLinks":[{"title":"Upgrade to Prisma 4 | Prisma Docs","url":"https://www.prisma.io/docs/guides/upgrade-guides/upgrading-versions/upgrading-to-prisma-4"}]},{"category":"Headline","title":"Release v7.4.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v7.4.0","tags":["npm","pnpm","ReleaseNote"],"content":"pnpm v7.4.0リリース。\n依存関係にpatchファイルをあてる`patchedDependencies`フィールドと`pnpm patch`コマンドの追加。\nproductionの依存だけをインストールして、デプロイ用にコピーする`pnpm deploy`コマンドの追加など","relatedLinks":[]},{"category":"Headline","title":"Vue 2.7 &quot;Naruto&quot; Released | The Vue Point","url":"https://blog.vuejs.org/posts/vue-2-7-naruto.html","tags":["Vue","ReleaseNote"],"content":"Vue 2.7リリース。\nVue 2.xの最後のminorアップデートとなり、Vue 2は1年半後の2023年末にサポートが終了する予定。","relatedLinks":[]},{"category":"Article","title":"ブラウザ, Node, Cloudflareでも動くDenoモジュール開発","url":"https://zenn.dev/dajiaji/articles/c5340c38d11d4d","tags":["deno","node.js","cloudflare","library","article"],"content":"Deno向けのコードをベースにして、dntを使ってNode.js向けのパッケージを作成、Cloudflare Workersでの動作テストをするパッケージの開発について。","relatedLinks":[]},{"category":"Article","title":"jestでDBありのテストを高速化する | kohsweblog","url":"https://blog.koh.dev/2022-07-02-jest-speedup/","tags":["JavaScript","testing","performance","article"],"content":"Jestで実行するテストのパフォーマンス改善についての記事。\nローカルではmaxWorkers、CIはshardを使いテストを並列に実行することで、実行時間を短くする方法について","relatedLinks":[]},{"category":"Article","title":"縦書きHTMLにおける文字の向きはどのように定まるか - ドワンゴ教育サービス開発者ブログ","url":"https://blog.nnn.dev/entry/2022/07/01/180000","tags":["HTML","CSS","font","article"],"content":"縦書きHTMLの表示についての記事。\nCSSの`writing-mode`と`text-orientation`での文字の向きの扱い、フォントとVertical_Orientationごとの表示の差異、ブラウザの実装の差異などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"ニコニコ生放送 WebフロントエンドのKubernetes移行ハンドブック 2022 | ニコニコ生放送 Webフロントエンド Kubernetes移行ハンドブック 2022","url":"https://dwango.github.io/nicolive-kubernetes-migration-handbook-2022/","tags":["kubernetes","document"],"content":"Kubernatesにおけるフロントエンドの管理についてのガイド","relatedLinks":[{"title":"大規模サービスのBFFサーバーをKubernetesに移行した記事で書いていないこと","url":"https://zenn.dev/himenon/articles/0e049f65c462a1"}]},{"category":"SoftwareLibrary","title":"codemix/deprank: Use PageRank to find the most important files in your codebase.","url":"https://github.com/codemix/deprank","tags":["JavaScript","Tools"],"content":"dependency-cruiserを使って依存グラフを作りページランクを出すツール。","relatedLinks":[]}]},{"meta":{"title":"2022-07-14のJS: Bun(all-in-one JavaScript runtime)、Vite 3.0.0、600回目の更新","author":"azu","layout":"post","date":"2022-07-13T15:00:00.011Z","category":"JSer","tags":["Tools","node.js","CSS","TypeScript","HTML"],"url":"https://jser.info/2022/07/14/bunall-in-one-javascript-runtime-vite-3.0.0-600/"},"items":[{"category":"Headline","title":"vite/CHANGELOG.md at v3.0.0 · vitejs/vite","url":"https://github.com/vitejs/vite/blob/v3.0.0/packages/vite/CHANGELOG.md","tags":["vite","ReleaseNote"],"content":"Vite 3.0.0リリース。\nデフォルトのビルドターゲットをESMとDynamic Import/`import.meta`をサポートしてるブラウザに変更、オプションの変更や削除、デフォルトportを5173に変更。\nminifyに利用する`terser`パッケージへの依存をオプショナルへ変更、`import.meta.glob`の仕様変更、Wasmファイルのimport方法を変更など","relatedLinks":[]},{"category":"Headline","title":"July 7th 2022 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/july-2022-security-releases/","tags":["node.js","security","ReleaseNote"],"content":"Node.js 14/16/18のセキュリティリリース。","relatedLinks":[]},{"category":"Article","title":"応答性を示す新しい指標「INP」 | フロントエンドBlog | ミツエーリンクス","url":"https://www.mitsue.co.jp/knowledge/blog/frontend/202207/06_1002.html","tags":["JavaScript","performance","article"],"content":"ユーザー操作に対するインタラクションにかかった時間を計測するメトリクスであるINP(Interaction to Next Paint)について。\nFIDとは異なりページのロード後に関する値を計測する。\nCrUX、LighthouseのTimespanモード、Web Vitalsでの計測データの取り方についてなど","relatedLinks":[{"title":"Interaction to Next Paint (INP)","url":"https://web.dev/inp/"}]},{"category":"Article","title":"Announcing support for WASI on Cloudflare Workers","url":"https://blog.cloudflare.com/announcing-wasi-on-workers/","tags":["cloudflare","WebAssembly","article"],"content":"Cloudflare WorkersでWASIに対応したWebAssemblyファイルを実行するライブラリがサポートされたことについて","relatedLinks":[]},{"category":"Article","title":"Blogged Answers: How I Estimate NPM Package Market Share (and how Redux usage compares to other libraries) · Mark&#039;s Dev Blog","url":"https://blog.isquaredsoftware.com/2022/07/npm-package-market-share-estimates/","tags":["npm","React","redux","article"],"content":"npmパッケージのシェアを読み取るかについて、Reactとステート管理ライブラリを例に解説している記事。\nnpmパッケージのダウンロード数、GitHubの依存数を絶対数として見た時の問題点や相対的に見る方法についてなど","relatedLinks":[]},{"category":"Article","title":"Flutter前史: ChromeがFlutterになるまで","url":"https://zenn.dev/mjhd/articles/680a19ae893c1e","tags":["Flutter","history","article"],"content":"Flutterの歴史を振り返る動画について。\nBlinkのForkから始まり、JavaScriptからDartへの切り替え、DOMからCanvasへの切り替えなどについて","relatedLinks":[{"title":"Before Flutter | Rubber Duck Engineering | Episode #100 - YouTube","url":"https://www.youtube.com/watch?v=xqGAC5QCYuQ&list=TLGGp4ABzxMuimsxMjA3MjAyMg"},{"title":"Before Flutter - Google スライド","url":"https://docs.google.com/presentation/d/1Yhch7KkNC5wbkcsc9p5XkWouEha2hex65l6Pca_SqkM/edit#slide=id.g11cbab926eb_0_0"}]},{"category":"Article","title":"NestJS製GraphQLサーバの起動が遅かったので調査した話 - もうずっといなかぐらし","url":"https://katainaka0503.hatenablog.com/entry/2022/07/09/190340","tags":["TypeScript","Tools","article"],"content":"GraphQLのスキーマからTypeScriptのファイルを生成するツールのボトルネックを調べて修正した話。\n`0x`を使ったボトルネック分析、`ts-morph`でのTypeScript ASTの変換のパフォーマンス問題の修正についてなど","relatedLinks":[]},{"category":"Article","title":"Executing shell commands from Node.js","url":"https://2ality.com/2022/07/nodejs-child-process.html","tags":["node.js","article"],"content":"Node.jsの`node:child_process`モジュールでのコマンドの実行についての解説。\nspawnとexecの解説、spawnとexecの違い、Streamでの出力の読み取り、AbortControllerを使ったプロセスの終了、同期と非同期についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"jcubic/wayne: Service Worker Routing library for in browser HTTP requests","url":"https://github.com/jcubic/wayne","tags":["ServiceWorker","library"],"content":"Service Worker向けのルーティングライブラリ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Tailwind DX","url":"https://gimli.app/tailwinddx.html","tags":["Chrome","Extension","CSS","Tools"],"content":"Tailwind用のChrome拡張。\nTailwindのクラスをChrome DevTools上で変更できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"samchon/typescript-json: Runtime type checkers and 5x faster JSON.stringify()","url":"https://github.com/samchon/typescript-json","tags":["TypeScript","JSON","Tools","library"],"content":"ttypescriptなどを使ったコード変換とRuntimeを合わせたJSONライブラリ。\nTypeScriptの型を使ったRuntimeでの型チェック、`JSON.stringify`相当の処理を提供する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"oven-sh/bun: Incredibly fast JavaScript runtime, bundler, transpiler and package manager – all in one.","url":"https://github.com/oven-sh/bun","tags":["JavaScript","Tools","Bun "],"content":"JavaScriptCoreとZig言語を使って書かれたJavaScriptのRuntime。\nBundler/TSのTranspiler/Task Runerを同梱し、npm互換のパッケージマネージャーやNode-API(N-API)互換の実装、FetchなどのWeb APIの実装をもつ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"oguimbal/pg-mem: An in memory postgres DB instance for your unit tests","url":"https://github.com/oguimbal/pg-mem","tags":["JavaScript","node.js","PostgreSQL","library","testing","deno"],"content":"In-memoryのPostgresエミュレーターライブラリ。\nPostgresを使ったテストで利用する目的","relatedLinks":[]}]},{"meta":{"title":"2022-07-20のJS: Node.js 18.6.0、React NativeのHermesデフォルト化、AWSのデザインシステム","author":"azu","layout":"post","date":"2022-07-20T02:48:15.525Z","category":"JSer","tags":["node.js","React","document","Native","RegExp"],"url":"https://jser.info/2022/07/20/node.js-18.6.0-react-nativehermes-aws/"},"items":[{"category":"Headline","title":"Node v18.6.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v18.6.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 18.6.0リリース。\nESM Loader Hooksが更新され、複数の`--loader`を指定した場合の順番の変更。またloaderの実装は`shortCircuit`を返すのが必須となった。","relatedLinks":[{"title":"Custom ESM loaders: Who, what, when, where, why, how - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/jakobjingleheimer/custom-esm-loaders-who-what-when-where-why-how-4i1o"}]},{"category":"Headline","title":"luxon/CHANGELOG.md at master · moment/luxon","url":"https://github.com/moment/luxon/blob/master/CHANGELOG.md#300-2022-07-09","tags":["JavaScript","library","ReleaseNote"],"content":"luxon 3.0.0リリース。","relatedLinks":[{"title":"Add condition for system setZone by davkub · Pull Request #1206 · moment/luxon","url":"https://github.com/moment/luxon/pull/1206"}]},{"category":"Headline","title":"NestJS v9 is now available - Trilon Consulting","url":"https://trilon.io/blog/nestjs-9-is-now-available","tags":["node.js","library","ReleaseNote"],"content":"NestJS v9リリース。\nREPLの追加、`ConfigurableModuleBuilder`の追加、Durable providersの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v5.8.0 · nodejs/undici","url":"https://github.com/nodejs/undici/releases/tag/v5.8.0","tags":["node.js","library","ReleaseNote"],"content":"undici 5.8.0リリース。\nCRL injectionとCookie扱いに関するセキュリティ修正","relatedLinks":[]},{"category":"Headline","title":"Version 3.0 released : Node-RED","url":"https://nodered.org/blog/2022/07/14/version-3-0-released","tags":["node.js","library","ReleaseNote"],"content":"Node-RED 3.0 リリース。\nエディタのアップデート、aceに代わってmonaco editorがデフォルト化、`runtimeState`オプションの追加、`diagnostics`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"ESLint v8.20.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2022/07/eslint-v8.20.0-released/","tags":["ESLint","ReleaseNote"],"content":"ESLint 8.20.0リリース。\npreprocessorsにおけるパースエラーなどをLintエラーとして報告するようになるなど","relatedLinks":[]},{"category":"Headline","title":"yaakov123/hagana: NodeJS runtime protection for supply chain attacks","url":"https://github.com/yaakov123/hagana","tags":["node.js","security","library"],"content":"Node.jsの`fs`や`child_process`モジュールなどを上書きして、アクセスできるネットワークや実行できるコマンドなどを制限するライブラリ。\nデフォルトでは`node_modules`以下に含まれるサードパーティのライブラリに対して制限を追加する","relatedLinks":[]},{"category":"Article","title":"Applying SOLID principles in React | Konstantin Lebedev blog","url":"https://konstantinlebedev.com/solid-in-react/","tags":["React","article"],"content":"ReactとSOLID原則について","relatedLinks":[]},{"category":"Article","title":"Hermes as the Default · React Native","url":"https://reactnative.dev/blog/2022/07/08/hermes-as-the-default","tags":["React","Native","article"],"content":"React Native 0.70でHermesがデフォルトとなることについて。\nJavaScriptCoreとHermesの比較、ABI非互換性の問題、HermesへのECMAScript i18n APIサポートについてなど","relatedLinks":[]},{"category":"Article","title":"Vite 3 が採用した CJS Proxy による Dual Package 構成","url":"https://zenn.dev/teppeis/articles/2022-07-npm-dual-pacakge-cjs-proxy","tags":["ECMAScript","vite","node.js","article"],"content":"Viteが利用してるCJSとESMをdual packagesに対応する手法について。\nCJSからESMを扱うために、非同期な関数のexportはDynamic Importsを含むラッパーを公開し、同期的な関数のexportはesbuildなどでbundle済みのものを公開する","relatedLinks":[]},{"category":"SlideVideo","title":"rety: Live coding without the stress","url":"https://rety.verou.me/","tags":["JavaScript","library","presentation"],"content":"textareaなどに対するコーディングの動きを記録し、リプレイできるライブラリ。\nプレゼンテーションなどでライブコーディング的なデモを行う用途で作られている。","relatedLinks":[{"title":"LeaVerou/rety: Record typing on one or more editors and replay it at will, to simulate live coding","url":"https://github.com/leaverou/rety"}]},{"category":"WebsiteDocument","title":"Cloudscape – Cloudscape Design System","url":"https://cloudscape.design/","tags":["aws","Design","accessibility","document"],"content":"AWSで使われているデザインシステム。\nデザインシステムの原則を書いたドキュメント、Reactコンポーネント、利用する時のパターンから構成されている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Defensive CSS","url":"https://defensivecss.dev/","tags":["CSS","document"],"content":"CSSで幅を超えたときにデザインが崩れる問題への対応をまとめたサイト。\nFlexbox、画像サイズ、折り返し文字列。アイコンと文字の被り、背景画像の繰り返し、Viewportのサイズなどの問題について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tuplo/numberfmt: Number formatting using a text pattern and native Intl.NumberFormat()","url":"https://github.com/tuplo/numberfmt","tags":["JavaScript","library"],"content":"`Intl.NumberFormat`ベースの数値の整形ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"danielroe/magic-regexp: A compiled-away, type-safe, readable RegExp alternative","url":"https://github.com/danielroe/magic-regexp","tags":["RegExp","JavaScript","library"],"content":"正規表現を組み立てるビルダー関数を提供するライブラリ。\nまた、ビルダー関数を正規表現リテラルへと変換するNuxt/Vite/Next.js向けのプラグインなども公開している。","relatedLinks":[]}]},{"meta":{"title":"2022-07-26のJS: Safari 15.6、Deno 1.24、CSS behind Figma ","author":"azu","layout":"post","date":"2022-07-26T03:51:08.199Z","category":"JSer","tags":["CSS","safari","node.js","book","GraphQL"],"url":"https://jser.info/2022/07/26/safari-15.6-deno-1.24-css-behind-figma/"},"items":[{"category":"Headline","title":"Safari 15.6 Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safari-release-notes/safari-15_6-release-notes","tags":["safari","ReleaseNote"],"content":"Safari 15.6リリース。\nCSSの`:modal`擬似クラスのサポート、バグ修正など","relatedLinks":[{"title":"New WebKit Features in Safari 15.6 | WebKit","url":"https://webkit.org/blog/13009/new-webkit-features-in-safari-15-6/"}]},{"category":"Headline","title":"Deno 1.24 Release Notes","url":"https://deno.com/blog/v1.24","tags":["deno","ReleaseNote"],"content":"Deno 1.24リリース。\nコード出力やtype checkのパフォーマンス改善、`unhandledrejection`/`beforeunload`/`unload`イベントのサポート、`import.meta.resolve()`の追加。\nFFIの改善、`deno test --parallel`フラグのサポート、stdに`semver`モジュールを追加など","relatedLinks":[]},{"category":"Headline","title":"modfy/nominal: 🔒 The new way to do types in typescript.","url":"https://github.com/modfy/nominal","tags":["TypeScript","library"],"content":"TypeScriptでnominal typeを扱う型とユーティリティライブラリ","relatedLinks":[]},{"category":"Headline","title":"Release v7.6.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v7.6.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v7.6.0リリース。\n`node-linker`が有効時はデフォルトでONとなる`prefer-symlinked-executables`オプションの追加、`pnpm deploy`のバグ修正など","relatedLinks":[]},{"category":"Headline","title":"Release v1.24.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.24.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.24.0リリース。\n設定でウェブサーバを複数定義できるように、`test.describe`のタイトルを省略できるように、Component Testに`beforeMount`と`afterMount`のHookを追加など","relatedLinks":[]},{"category":"Headline","title":"Payload launches 1.0 | Blog | Payload CMS","url":"https://payloadcms.com/blog/payload-launches-version-1","tags":["CMS","ReleaseNote"],"content":"Headless CMSのPayload 1.0リリース。","relatedLinks":[{"title":"payloadcms/payload: Free and Open-source Headless CMS and Application Framework built with TypeScript, Node.js, React and MongoDB","url":"https://github.com/payloadcms/payload"}]},{"category":"Headline","title":"Updates from the 91st TC39 meeting - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/hemanth/updates-from-the-91th-tc39-meeting-779","tags":["ECMAScript","proposal","news"],"content":"2022-07のTC39ミーティングでのECMAScript Proposalのアップデート内容について。\nHashbangがStage 4へ、Import ReflectionがStage 2となるなど","relatedLinks":[]},{"category":"Headline","title":"Release v5.74.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.74.0","tags":["webpack","ReleaseNote"],"content":"webpack v5.74.0リリース。\n`resolve.extensionAlias`オプションの追加、Static Blockを含むES2022のコードをサポート、`ProvidePlugin`におけるTree Shakingのサポート。\nwatchのパフォーマンスの改善など","relatedLinks":[{"title":"Improve watch performance by using stable identities for Snapshot iterables by gluxon · Pull Request #15991 · webpack/webpack","url":"https://github.com/webpack/webpack/pull/15991"}]},{"category":"Headline","title":"Release 3.24.0 - 2022.07.25 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.24.0","tags":["JavaScript","polyfill","library","ReleaseNote","Bun"],"content":"core-js v3.24.0リリース。\nIterator helpers prosapoの仕様追従、新しいサポートターゲットとしてBun/Hermes/Oculus Browserの追加など","relatedLinks":[]},{"category":"Article","title":"The CSS behind Figma - Ahmad Shadeed","url":"https://ishadeed.com/article/figma-css/","tags":["CSS","figma","article"],"content":"FigmaのアプリそのものにおけるFlexboxとCSS Gridの使い方についてみていく記事。\nボタンの配置や位置合わせアイコンにおけるGridの利用法、レイヤーのツリー構造を表現するFlexboxの利用法について","relatedLinks":[]},{"category":"Article","title":"Avoiding &lt;img&gt; layout shifts: aspect-ratio vs width &amp; height attributes - JakeArchibald.com","url":"https://jakearchibald.com/2022/img-aspect-ratio/","tags":["HTML","article"],"content":"`<img>`とaspect-ratioの指定についての記事。\nCSSの`aspect-ratio`プロパティ、widthとheightを使ったaspect-ratioのhintについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"5t3ph/css-browser-support: Query for CSS brower support data, combined from caniuse and MDN, including version support started and global support percentages.","url":"https://github.com/5t3ph/css-browser-support","tags":["CSS","mdn","browser","library"],"content":"特定のCSSの機能をどのブラウザがサポートしているかを検索できるライブラリ。\nデータにはMDNとCan I useを利用している","relatedLinks":[]},{"category":"Book","title":"はじめに - NestJSの強化書 βversion","url":"https://docs.nest-book.jp/","tags":["node.js","library","book","GraphQL"],"content":"NestJSについての書籍。\nNestJSの特徴、機能、使い方について解説しているサイト。また、NestJSでGraphQLを扱う方法も解説している。","relatedLinks":[]}]},{"meta":{"title":"2022-08-02のJS: Privacy Sandboxのロードマップ更新、Docusaurus 2.0、Electron v20.0.0","author":"azu","layout":"post","date":"2022-08-02T00:23:15.529Z","category":"JSer","tags":["Tools","CSS","serverless","TypeScript","Vue"],"url":"https://jser.info/2022/08/02/privacy-sandbox-docusaurus-2.0-electron-v20.0.0/"},"items":[{"category":"Headline","title":"Release v9.0.0 · vueuse/vueuse","url":"https://github.com/vueuse/vueuse/releases/tag/v9.0.0","tags":["Vue","library","ReleaseNote"],"content":"vueuse v9.0.0リリース。\n`isSupported`を`Ref<boolean>`に変更、型名を`Use` prefixに統一。\n多くのUse関数の引数に関数を渡せるように、`@vueuse/math`パッケージの追加など","relatedLinks":[]},{"category":"Headline","title":"Node v18.7.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v18.7.0/","tags":["node.js","serverless"],"content":"Node.js 18.7.0リリース。\n`process.exit(code)`の`code`に数値以外を渡すケースをDeprecatedに変更、`CustomEvent`の実装、http serverに`dropRequest`イベントを実装など","relatedLinks":[]},{"category":"Headline","title":"Release v1.2.0 · video-dev/hls.js","url":"https://github.com/video-dev/hls.js/releases/tag/v1.2.0","tags":["HLS","JavaScript","library","ReleaseNote"],"content":"hls.js v1.2.0リリース。\nIE 11のサポート終了、CMAF CCのサポート、バグ修正や安定性の向上など","relatedLinks":[]},{"category":"Headline","title":"Expanding testing for the Privacy Sandbox for the Web","url":"https://blog.google/products/chrome/update-testing-privacy-sandbox-web/","tags":["Chrome","privacy","news"],"content":"Privacy Sandboxのロードマップの更新について。\nPrivacy Sandbox APIのリリースは2023年Q3まで延期され、サードパーティクッキーの段階的な廃止は2024年後半まで延期された。","relatedLinks":[]},{"category":"Headline","title":"losfair/blueboat: All-in-one, multi-tenant serverless JavaScript runtime.","url":"https://github.com/losfair/blueboat","tags":["JavaScript","serverless","cloudflare","Tools"],"content":"Cloudflare WorkersのようなV8 Isolatesでマルチテナント実行できるJavaScript実行環境。\nエンジンはRustで書かれていて、実行するJSスクリプトはFetch APIやRequest/Responseのようなウェブ標準互換のAPIが一部利用できる。","relatedLinks":[]},{"category":"Headline","title":"Announcing Docusaurus 2.0 | Docusaurus","url":"https://docusaurus.io/blog/2022/08/01/announcing-docusaurus-2.0","tags":["React","document","ReleaseNote"],"content":"静的サイトジェネレータのDocusaurus v2リリース。\nMDXのサポート、サイドバーの自動生成、プラグインシステム刷新、テーマの再構築など","relatedLinks":[]},{"category":"Headline","title":"Release electron v20.0.0 · electron/electron","url":"https://github.com/electron/electron/releases/tag/v20.0.0","tags":["Electron","ReleaseNote"],"content":"Electron v20.0.0リリース。\n`nodeIntegration: true`と`sandbox: false`の組み合わせを設定しない限り、RenderersがデフォルトSandbox化されるように変更など","relatedLinks":[]},{"category":"Article","title":"新しいビューポートの単位（sv\\*、lv\\*、dv\\*） | フロントエンドBlog | ミツエーリンクス","url":"https://www.mitsue.co.jp/knowledge/blog/frontend/202207/28_0755.html","tags":["CSS","article"],"content":"CSSのview portのunitについての記事","relatedLinks":[]},{"category":"Article","title":"Help pick a syntax for CSS nesting - Chrome Developers","url":"https://developer.chrome.com/blog/help-css-nesting/","tags":["CSS","article","アンケート"],"content":"CSSのネスト構文についてのアンケート。\nSCSS/Less/Stylusのようにネストをするケース、`@nest`を使うケース、ブラケットを使うケースについての意見を募集している","relatedLinks":[]},{"category":"SlideVideo","title":"🌕 moonでのmonorepo管理とpackemonでのCJS/ESMのdual package","url":"https://azu.github.io/slide/2022/moa/moon-packemon.html","tags":["monorepo","Tools","slide","JavaScript"],"content":"monorepo管理ツールのmoonとCJS/MJS対応のライブラリビルドツールのpackemonについてのスライド","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ronami/HypeScript: 🐬 A simplified implementation of TypeScript&#039;s type system written in TypeScript&#039;s own type system","url":"https://github.com/ronami/HypeScript","tags":["TypeScript","Tools"],"content":"TypeScriptの型システムをTypeScriptの型で実装したもの。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ehmicky/safe-json-value: ⛑️ JSON serialization should never fail","url":"https://github.com/ehmicky/safe-json-value","tags":["JavaScript","library","JSON"],"content":"例外を投げないJSONのシリアライズを提供するライブラリ。\nシリアライズできないときは`error`プロパティにエラーを入れ、例外となる値は結果から除外するなどしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Skeleton","url":"https://skeleton.brainandbonesllc.com/","tags":["Svelte","CSS","library"],"content":"SvelteとTailwindを使ったUIコンポーネントライブラリ","relatedLinks":[]},{"category":"Book","title":"TypeScriptとReact/Next.jsでつくる 実践Webアプリケーション開発：書籍案内｜技術評論社","url":"https://gihyo.jp/book/2022/978-4-297-12916-3","tags":["Next.js","TypeScript","book"],"content":"2022年7月22日 発売。\nNext.jsの入門本","relatedLinks":[]}]},{"meta":{"title":"2022-08-09のJS: Chrome 105 Beta、npm v8.16.0(npm query)、Import Maps","author":"azu","layout":"post","date":"2022-08-09T04:04:13.003Z","category":"JSer","tags":["React","mail","performance","DOM","puppeteer"],"url":"https://jser.info/2022/08/09/chrome-105-beta-npm-v8.16.0npm-query-import-maps/"},"items":[{"category":"Headline","title":"Release v7.0.0 · riot/riot","url":"https://github.com/riot/riot/releases/tag/v7.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"Riot.js v7.0.0リリース。\nESM bundleの改善、runtime `slots`の追加、bundleサイズの改善など","relatedLinks":[]},{"category":"Headline","title":"Release Inferno v8.0.0 · infernojs/inferno","url":"https://github.com/infernojs/inferno/releases/tag/v8.0.0","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"Inferno v8.0.0リリース。\nコンポーネントのライフサイクルメソッドに`componentWillMove`/`componentDidAppear`/`componentWillDisappear`を追加、`javascript:`へのリンクに対して警告を追加、TypeScriptの型定義の改善など","relatedLinks":[]},{"category":"Headline","title":"Release v16.0.0 · puppeteer/puppeteer","url":"https://github.com/puppeteer/puppeteer/releases/tag/v16.0.0","tags":["puppeteer","ReleaseNote"],"content":"Puppeteer v16.0.0リリース。\nCDP(Chrome DevTools Protocol)のauto-attachメカニズムを使うことで、PageやFrameへの接続の安定性を改善するなど","relatedLinks":[]},{"category":"Headline","title":"Release v2.7.0 · parcel-bundler/parcel","url":"https://github.com/parcel-bundler/parcel/releases/tag/v2.7.0","tags":["JavaScript","bundler","ReleaseNote"],"content":"Parcel v2.7.0リリース。\nプラグイン設定ファイルの拡張子`.cjs`が利用できるように、React Freshで`@emotion/react`をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 105 Beta: Custom Highlighting, Fetch Upload Streaming, and More","url":"https://blog.chromium.org/2022/08/chrome-105-beta-custom-highlighting.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 105 betaリリース。\nCustom Highlight APIの実装、Container Queryの実装、`:has`擬似クラスの実装、Fetch Upload Streamingの実装など。\n`navigator.mediaDevices.getDisplayMedia`に`systemAudio`オプションの追加、HTML Sanitizer APIの追加、`import.meta.resolve()`メソッドの追加、`Response.json()`メソッドの追加。\nWebSQLがSecure Context以外では利用できなくなるように、Cookieのドメイン属性に非Ascii文字のサポートの廃止など","relatedLinks":[]},{"category":"Headline","title":"Release bun v0.1.7 · oven-sh/bun","url":"https://github.com/oven-sh/bun/releases/tag/bun-v0.1.7","tags":["Bun","JavaScript","ReleaseNote"],"content":"Bun 0.1.7リリース。\n`bun init`コマンドの追加、`bun install`がprivate npm registryのサポート、`bun installl`がプロジェクトルートの`prepare`などのlifecycle hookに対応など","relatedLinks":[]},{"category":"Headline","title":"Release v8.16.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v8.16.0","tags":["npm","ReleaseNote"],"content":"npm v8.16.0リリース。\nCSSセレクタライクなクエリで依存関係を検索できる`npm query`コマンドの追加など","relatedLinks":[{"title":"Introducing the new npm Dependency Selector Syntax | GitHub Changelog","url":"https://github.blog/changelog/2022-08-03-introducing-the-new-npm-dependency-selector-syntax/"}]},{"category":"Article","title":"Everything You Need to Know About JavaScript Import Maps - Honeybadger Developer Blog","url":"https://www.honeybadger.io/blog/import-maps/","tags":["ECMAScript","JavaScript","article"],"content":"Import Mapsについての記事。\nImport Mapsの使い方、動的なImport Mapsの作り方、ファイル名のハッシュとキャッシュ、同じモジュールの複数バージョンの利用、CDNの利用など","relatedLinks":[]},{"category":"Article","title":"500ms to 1.7ms In React: A Journey And A Checklist | Orizens","url":"https://orizens.com/blog/500ms-to-1-7ms-in-react-a-journey-and-a%20checklist/","tags":["React","performance","article"],"content":"Reactアプリのパフォーマンスをどう改善していくかについて。\nコンポーネントの分割、メモ化、プロファイラーを使ったCustom Hooksの問題の追い方について","relatedLinks":[]},{"category":"Article","title":"Parsing command line arguments with \\`util.parseArgs()\\` in Node.js","url":"https://2ality.com/2022/08/node-util-parseargs.html","tags":["node.js","article"],"content":"Node.js 18.3.0で追加された`utils`モジュールの`parseArgs`関数について","relatedLinks":[{"title":"Util | Node.js v18.7.0 Documentation","url":"https://nodejs.org/api/util.html#utilparseargsconfig"}]},{"category":"Article","title":"Checking if a JavaScript native function is monkey patched · mmazzarolo.com","url":"https://mmazzarolo.com/blog/2022-07-30-checking-if-a-javascript-native-function-was-monkey-patched/","tags":["JavaScript","article"],"content":"JavaScriptでネイティブ関数がmonkey patchによって上書きされているかを判定する方法について。","relatedLinks":[]},{"category":"Article","title":"LINE MUSIC のパフォーマンスを向上させた Vue3 マイグレーション","url":"https://engineering.linecorp.com/ja/blog/vue3-migration-with-improved-line-music-performance/","tags":["Vue","performance","article","refactoring"],"content":"Vue 2.xからVue 3へのアップグレード方法とbundle sizeの変化についての記事。","relatedLinks":[]},{"category":"WebsiteDocument","title":"sofn-xyz/mailing: Build, test, send emails with React","url":"https://github.com/sofn-xyz/mailing","tags":["JavaScript","React","mail","library"],"content":"Reactコンポーネントを使ってメールコンテンツの開発ができるツールキット。\nMJMLをベースにしていて、ローカルでメールのレンダリング結果を見ながらコンポーネントベースでメールコンテンツを作成できる","relatedLinks":[{"title":"MJML - The Responsive Email Framework","url":"https://mjml.io/"}]},{"category":"SoftwareLibrary","title":"mjmlio/mjml: MJML: the only framework that makes responsive-email easy","url":"https://github.com/mjmlio/mjml","tags":["mail","JavaScript","library"],"content":"MJMLマークアップ言語を元にレスポンシブなメールを作成できるフレームワーク","relatedLinks":[]}]},{"meta":{"title":"2022-08-18のJS: Astro 1.0、Node.js 16.17.0、DenoとBunの今後の予定","author":"azu","layout":"post","date":"2022-08-18T03:43:10.701Z","category":"JSer","tags":["Tools","TypeScript","node.js","deno","safari"],"url":"https://jser.info/2022/08/18/astro-1.0-node.js-16.17.0-denobun/"},"items":[{"category":"Headline","title":"Astro 1.0 | Astro","url":"https://astro.build/blog/astro-1/","tags":["JavaScript","Tools","ReleaseNote"],"content":"Astro 1.0リリース。\nSSR Buildsの追加、画像の最適化をする`<Image>`と`<Picture>`の追加、MDXサポート、Vite 3.0へアップグレード","relatedLinks":[{"title":"Astro 1.0 Beta Release | Astro","url":"https://astro.build/blog/astro-1-beta-release/"}]},{"category":"Headline","title":"Release v0.15.0 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.15.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"esbuild v0.15.0リリース。\nYarnのpnpをサポート","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.8 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-8-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.8 RCリリース。\n`strictNullChecks`が有効時に`unknown`は`{} | null | undefined`と同様になり関連するコントロールフロー分析の改善、Template String Typesでの`infer`の改善。 `--build`/`-watch`/`--incremental`におけるビルドパフォーマンスの改善、オブジェクトリテラルや配列リテラルを`==`や`===`で比較した場合にエラーとなるように。\nBinding patternの型推論の改善、`--watch`の安定性の改善など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 151 | WebKit","url":"https://webkit.org/blog/13093/release-notes-for-safari-technology-preview-151/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 151リリース。\nCSSの`color-mix()`関数のサポート、media queryの`scan`をサポート、`:dir`擬似クラスのサポート。\niframeのlazy loadingをデフォルト化、XHRのabortを仕様に準拠するように修正など","relatedLinks":[]},{"category":"Headline","title":"Node v16.17.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v16.17.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 16.17.0リリース。\n`util.parseArgs`、ESM Loader Hooks API、`node:test`モジュール、Web Crypto APIの互換性改善のbackport","relatedLinks":[]},{"category":"Headline","title":"Release v0.22.0 · vitest-dev/vitest","url":"https://github.com/vitest-dev/vitest/releases/tag/v0.22.0","tags":["vite","testing","ReleaseNote"],"content":"vitest 0.22.0リリース。\nカバレッジツールとして`c8`と`istanbul`を選択できるようになり、`@vitest/coverage-c8`と`@vitest/coverage-istanbul`がPeerDependencyへと変更するなど","relatedLinks":[]},{"category":"Headline","title":"Big Changes Ahead for Deno","url":"https://deno.com/blog/changes","tags":["deno","news"],"content":"Denoの今後について。\nFFIの改善、`npm:` URLを使ってnpmモジュールをインストールできるようになり互換性の向上、コードからドキュメントを自動生成できるようになるアップデートを予定している","relatedLinks":[]},{"category":"Headline","title":"Release 3.0.0-alpha.0 · prettier/prettier","url":"https://github.com/prettier/prettier/releases/tag/3.0.0-alpha.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"prettier 3.0.0-alpha.0リリース。\nESMの対応、Node.js 12のサポート終了、Public APIの非同期か、`trailingComma`のデフォルト値が`all`へ変更など","relatedLinks":[]},{"category":"Article","title":"Objects, Functions, and Type Narrowing | Learning TypeScript","url":"https://www.learningtypescript.com/articles/objects-functions-and-type-narrowing?s=t","tags":["TypeScript","article"],"content":"TypeScriptのNarrowingについて。\n変数オブジェクトのプロパティ、関数呼び出し、関数の引数における型のNarrowingの挙動について","relatedLinks":[]},{"category":"Article","title":"Will Bun JavaScript Take Node&#039;s Crown","url":"https://semaphoreci.com/blog/javascript-bun","tags":["node.js","deno","Bun","JavaScript","benchmark","article"],"content":"Node.js/Deno/Bunのベンチマーク比較記事","relatedLinks":[]},{"category":"Article","title":"Why is CrUX data different from my RUM data?","url":"https://web.dev/crux-and-rum-differences/","tags":["Chrome","performance","article"],"content":"CrUXとRUMの違い、CrUXの統計データについて。","relatedLinks":[]},{"category":"Article","title":"outline is your friend - Manuel Matuzović","url":"https://www.matuzo.at/blog/2022/focus-outline/","tags":["CSS","article"],"content":"CSSの`outline`プロパティについての記事。","relatedLinks":[]},{"category":"Article","title":"The blind programmers who created screen readers - The Verge","url":"https://www.theverge.com/23203911/screen-readers-history-blind-henter-curran-teh-nvda","tags":["accessibility","software","history","article"],"content":"スクリーンリーダのJAWSとNVDAがどのような経緯で作られたのかの歴史についての記事","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pemistahl/grex-js: A JavaScript / WebAssembly library for generating regular expressions from user-provided test cases","url":"https://github.com/pemistahl/grex-js","tags":["JavaScript","RegExp","library"],"content":"文字列の配列からそれにマッチする正規表現を生成するライブラリ","relatedLinks":[]}]},{"meta":{"title":"2022-08-25のJS:  Oven: the company behind Bun、CSS `:has()`","author":"azu","layout":"post","date":"2022-08-25T06:33:06.679Z","category":"JSer","tags":["node.js","TypeScript","redux","cloudflare","grpc"],"url":"https://jser.info/2022/08/25/oven-the-company-behind-bun-css-has/"},"items":[{"category":"Headline","title":"Release v1.9.0-alpha.0 · reduxjs/redux-toolkit","url":"https://github.com/reduxjs/redux-toolkit/releases/tag/v1.9.0-alpha.0","tags":["redux","library","ReleaseNote"],"content":"Redux Toolkit v1.9.0-alpha.0リリース。\n`merge` mutationの追加、`createReducer`にオブジェクトを渡すスタイルをDeprecatedへ変更、`createAsyncThunk.withTypes()`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v2.7.0 · cloudflare/miniflare","url":"https://github.com/cloudflare/miniflare/releases/tag/v2.7.0","tags":["cloudflare","node.js","library","ReleaseNote"],"content":"miniflare 2.7.0リリース。\n`fetch`リクエストをモックするAPIの追加、Durable ObjectをflushするAPIの追加など","relatedLinks":[]},{"category":"Headline","title":"Oven: the company behind Bun","url":"https://oven.sh/","tags":["Bun","news","company"],"content":"BunはOvenという会社を立ち上げ、資金調達をした。\n今後のロードマップとして、Bunを動かすエッジサーバのホスティング、Node.js向けに書かれたフレームワークのサポートの改善、半年以内にStable版を出すことを目標にしている。","relatedLinks":[]},{"category":"Headline","title":"Node v18.8.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v18.8.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 18.8.0リリース。\nユーザーランドでのスナップショットを作成/復元できる`--build-snapshot`と`--snapshot-blob`の追加。現時点ではCJS/ESMはサポートしてないため、一つのファイルのみを扱える。","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 152 | WebKit","url":"https://webkit.org/blog/13137/release-notes-for-safari-technology-preview-152/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 152リリース。\nECMAScript Proposal Stage 3のSymbols as WeakMap keysの実装、Compression Streams APIの実装など","relatedLinks":[]},{"category":"Headline","title":"Release v1.25.0 · denoland/deno","url":"https://github.com/denoland/deno/releases/tag/v1.25.0","tags":["deno","ReleaseNote"],"content":"Deno v1.25.0リリース。\n`deno init`コマンドの追加、Unstableな機能として`npm:` prefixでnpmパッケージをロードできるようになるなど","relatedLinks":[]},{"category":"Article","title":"Buf | Connect-Web: It&#039;s time for Protobuf and gRPC to be your first choice in the browser","url":"https://buf.build/blog/connect-web-protobuf-grpc-in-the-browser","tags":["grpc","TypeScript","article"],"content":"gRPCのクライアントライブラリであるconnect-webについて。\nProtocol BufferからTypeScriptのクライアントコードを生成して利用できる。","relatedLinks":[{"title":"bufbuild/connect-web: Simple, reliable, interoperable. A better gRPC-Web.","url":"https://github.com/bufbuild/connect-web"}]},{"category":"Article","title":"Working with file system paths on Node.js","url":"https://2ality.com/2022/07/nodejs-path.html","tags":["node.js","URL","article"],"content":"Node.jsの`path`モジュール、minimatchでのglobについての解説。\nまた、URLとファイルパスの変換について","relatedLinks":[]},{"category":"Article","title":"Running WordPress in the Browser","url":"https://wasmlabs.dev/articles/wordpress-in-the-browser/","tags":["wordpress","SQLite","WebAssembly","article"],"content":"WebAssemblyを使ってWordPressをブラウザで動かす話。\nPHPとSQLiteをそれぞれEmscriptenを使ってWasmへとコンパイルし、WordPressを動かす。\nService Workerを使ったループバックの実装についてなど","relatedLinks":[]},{"category":"Article","title":"Typescipt is terrible for library developers: We spend a disproportionate amount of time on types","url":"https://erock.prose.sh/typescript-terrible-for-library-developers","tags":["TypeScript","article","opinion"],"content":"ライブラリにおけるTypeScriptの型の複雑さについて。\nデバッグ、複雑さ、テスト、メンテナンスの難しさについて","relatedLinks":[]},{"category":"Article","title":"Using :has() as a CSS Parent Selector and much more | WebKit","url":"https://webkit.org/blog/13096/css-has-pseudo-class/","tags":["CSS","article"],"content":"CSSの`:has()`擬似クラスについて。\n親セレクターとしての利用、Gridの利用、`>`との違い、sibling combinators(`~`と`+`)との組み合わせなどについて","relatedLinks":[]},{"category":"SlideVideo","title":"Building a Typechecker from scratch | Dmitry Soshnikov | Education","url":"https://www.dmitrysoshnikov.education/p/typechecker","tags":["TypeScript","video","tutorial"],"content":"JavaScriptで型チェッカーを一から作成していく講座","relatedLinks":[]},{"category":"SoftwareLibrary","title":"react-pdf-viewer/react-pdf-viewer: A React component to view a PDF document","url":"https://github.com/react-pdf-viewer/react-pdf-viewer","tags":["React","PDF","library"],"content":"pdf.jsを使ったPDFビューアReactコンポーネント","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rayepps/radash: Functional utility library - modern, simple, typed, powerful","url":"https://github.com/rayepps/radash","tags":["JavaScript","library"],"content":"lodashのようなユーティリティコレクションライブラリ。\nそれぞれの関数が独立していて、シンプルなコードとして読めるように書かれている","relatedLinks":[{"title":"Lodash is dead. Long live Radash. | by Ray Epps | Vanguards of Code | Aug, 2022 | Medium","url":"https://medium.com/vanguards-of-code/lodash-is-dead-long-live-radash-d9d52abf428b"}]}]},{"meta":{"title":"2022-08-30のJS: ESLint 8.23.0(eslint.config.js)、TypeScript 4.8、Solid v1.5.0","author":"azu","layout":"post","date":"2022-08-30T02:43:20.580Z","category":"JSer","tags":["browser","TypeScript","node.js","ESLint","jQuery"],"url":"https://jser.info/2022/08/30/eslint-8.23.0eslint.config.js-typescript-4.8-solid-v1.5.0/"},"items":[{"category":"Headline","title":"Jest 29: Snapshot format changes · Jest","url":"https://jestjs.io/blog/2022/08/25/jest-29","tags":["JavaScript","library","ReleaseNote"],"content":"Jest 29リリース。\nNode 12のサポート終了、`snapshotFormat`オプションの変更、`jsdom`のアップデート","relatedLinks":[]},{"category":"Headline","title":"ESLint v8.23.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2022/08/eslint-v8.23.0-released/","tags":["ESLint","ReleaseNote"],"content":"ESLint 8.23.0リリース。\nopt-inで新しい設定ファイルである`eslint.config.js`が利用できるように。\n`no-fallthrough`と`no-warning-comments`にオプションを追加など","relatedLinks":[]},{"category":"Headline","title":"jQuery 3.6.1 Maintenance Release | Official jQuery Blog","url":"https://blog.jquery.com/2022/08/26/jquery-3-6-1-maintenance-release/","tags":["jQuery","ReleaseNote"],"content":"jQuery 3.6.1リリース。\nfocusの問題の修正、`addClass`に空文字がある場合の問題の修正、CSS Property ValueをCSSの仕様に準拠してホワイトスペースをトリムするように修正など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.8 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-8/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.8リリース。\n`strictNullChecks`が有効時に`unknown`は`{} | null | undefined`と同様になり関連するコントロールフロー分析の改善、Template String Typesでの`infer`の改善。 `--build`/`-watch`/`--incremental`におけるビルドパフォーマンスの改善、オブジェクトリテラルや配列リテラルを`==`や`===`で比較した場合にエラーとなるように。\nBinding patternの型推論の改善、`--watch`の安定性の改善など","relatedLinks":[]},{"category":"Headline","title":"Release v1.5.0 - Batch to the Future · solidjs/solid","url":"https://github.com/solidjs/solid/releases/tag/v1.5.0","tags":["JavaScript","library","DOM","ReleaseNote"],"content":"Solid v1.5.0リリース。\n`batch`での処理を修正、`createResource`に`ssrLoadFrom`オプションの追加とResourceに対してロード状態を表現する`state`フィールドを追加。\nSSRのパフォーマンス改善、パッケージの`exports`フィールドに対応など","relatedLinks":[]},{"category":"Article","title":"Why your website should be under 14kB in size | endtimes.dev","url":"https://endtimes.dev/why-your-website-should-be-under-14kb-in-size/","tags":["HTTP","performance","article"],"content":"TCP slow startにより14600 bytes(約14kb)でラウンドトリップが発生するため、14kbより大きい場合にラウンドトリップ分の遅延が起きるという話。\nHTTP/3 QUICでもほぼ同じサイズでの輻輳制御が推奨されている。","relatedLinks":[]},{"category":"Article","title":"Installing and running Node.js bin scripts","url":"https://2ality.com/2022/08/installing-nodejs-bin-scripts.html","tags":["node.js","article"],"content":"Node.jsパッケージでインストールするコマンドについての記事。\nインストール方法、どこへインストールされるか、ローカルのパッケージのリンク、npxとキャッシュについてなど","relatedLinks":[]},{"category":"Article","title":"SpiderMonkey Newsletter (Firefox 104-105) | SpiderMonkey JavaScript/WebAssembly Engine","url":"https://spidermonkey.dev/blog/2022/08/29/newsletter-firefox-104-105.html","tags":["Firefox","JavaScript","article"],"content":"Firefox 104と105でのSpinderMonkeyの変更点について。\nStage 3のShadowRealmsの実装、Stage 4の `findLast`と`findLastIndex`の実装、Intlの`formatRange`などで引数の大小に関する仕様変更に追従など。\nまた、モジュールの実装の改善を進め、Workerでの`type: module`の実装やImport Mapsの実装に取り組んでいる。","relatedLinks":[]},{"category":"Article","title":"New Recipes for 3rd Party Cookies – text/plain","url":"https://textslashplain.com/2022/07/27/new-recipes-for-cookies/","tags":["browser","privacy","article"],"content":"サードパーティクッキーに関する流れで提案されているCookies周りの仕様について。\nOriginとSubFrameの組み合わせでCookieの保存先を分割する`Partitioned`属性、Storage Access API、IdP向けのFedCM API。\nまた、Cookieはストレージの中でも特殊で、HTTPOnlyやCookieをデバイスから盗む攻撃を防止するTLS Token Bindingなど特別な機能があることについてなど","relatedLinks":[]},{"category":"Article","title":"今時の CSRF 対策ってなにをすればいいの？ | Basicinc Enjoy Hacking!","url":"https://tech.basicinc.jp/articles/231","tags":["browser","security","article"],"content":"CSRF攻撃に対する多層防御として利用できる対策手法について。\nCSRFトークン、カスタムリクエストヘッダ、SameSite Cookie、Double Submit Cookie、Originリクエストヘッダ、Sec-Fetchリクエストヘッダについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"httptoolkit/brotli-wasm: A reliable compressor and decompressor for Brotli, supporting node &amp; browsers via wasm","url":"https://github.com/httptoolkit/brotli-wasm","tags":["JavaScript","library","WebAssembly"],"content":"Node.jsとブラウザをサポートしてBrotliのCompress/Decompressライブラリ。\nWebAssemblyを利用している","relatedLinks":[]},{"category":"WebsiteDocument","title":"apify/crawlee: Crawlee—A web scraping and browser automation library for Node.js that helps you build reliable crawlers. Fast.","url":"https://github.com/apify/crawlee","tags":["JavaScript","browser","library","node.js"],"content":"ウェブサイトのクローラーフレームワーク。\nリンクを辿るクローリング、ページから情報を取得するスクレイピングを行うライブラリ。\n実際のブラウザを模倣する動作、セッションプール、Cheerio/Puppeteer/Playwrightを使ったスクレピングなどクローラー向けの機能セットをもつ","relatedLinks":[{"title":"Crawlee: the web scraping and browser automation library | Apify Blog","url":"https://blog.apify.com/announcing-crawlee-the-web-scraping-and-browser-automation-library/"}]},{"category":"SoftwareLibrary","title":"nadeesha/ts-prune: Find unused exports in a typescript project. 🛀","url":"https://github.com/nadeesha/ts-prune","tags":["TypeScript","Tools"],"content":"TypeScriptのコードから使用されていないexportsを検出するツール","relatedLinks":[{"title":"ep.129『不要な export をまとめて掃除！みんながほしかった CLI ts-prune』 | UIT INSIDE - LINE UIT の開発者による「最新のフロントエンド」をキャッチアップできる Podcast","url":"https://uit-inside.linecorp.com/episode/129"}]}]},{"meta":{"title":"2022-09-06のJS: Rollup v3の変更点、 Chrome 106 Beta、npmベストプラクティス","author":"azu","layout":"post","date":"2022-09-05T15:01:32.595Z","category":"JSer","tags":["node.js","browser","testing","document","CSS"],"url":"https://jser.info/2022/09/06/rollup-v3-chrome-106-beta-npm/"},"items":[{"category":"Headline","title":"Release v6.0.0 beta 1 · styled-components/styled-components","url":"https://github.com/styled-components/styled-components/releases/tag/v6.0.0-beta.1","tags":["JavaScript","CSS","library","ReleaseNote"],"content":"styled-components v6.0.0-beta.1リリース。\nTypeScriptでの書き直し、stylis v4へのアップデート、Node.js 12のサポート終了などが含まれる","relatedLinks":[]},{"category":"Headline","title":"Release v5.5.0 · lerna/lerna","url":"https://github.com/lerna/lerna/releases/tag/v5.5.0","tags":["monorepo","JavaScript","Tools","ReleaseNote"],"content":"lerna v5.5.0リリース。\npnpm workspacesのサポート","relatedLinks":[]},{"category":"Headline","title":"\\[v3.0 Release branch\\] by lukastaegert · Pull Request #4549 · rollup/rollup","url":"https://github.com/rollup/rollup/pull/4549","tags":["rollup","ReleaseNote"],"content":"Rollup 3.0の変更点について。\nNode.js 12のサポート終了、ブラウザ向けのパッケージを`@rollup/browser`に分離、非推奨のメソッドの削除。\n`output.interop`に`compat`を追加、`--bundleConfigAsCjs`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v0.23.0 · vitest-dev/vitest","url":"https://github.com/vitest-dev/vitest/releases/tag/v0.23.0","tags":["vite","ReleaseNote"],"content":"vitest v0.23.0リリース。\nCJSとの互換性の改善、`retry`オプションの追加、`vitest bench`コマンドの追加、coverageのjson reporterの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v7.10.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v7.10.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v7.10.0リリース。\n`resolution-mode`に`time-based`の追加、`pnpm env remove`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v5.0.0","tags":["JavaScript","node.js","testing","ReleaseNote"],"content":"AVA v5.0.0 preリリース。\nNode.js 12以下のサポート終了、TypeScript 4.7未満のサポート終了など","relatedLinks":[]},{"category":"Headline","title":"TestCafe v2.0.0 Released | Framework | Release Notes","url":"https://testcafe.io/404018/release-notes/framework/2022-8-31-testcafe-v2-0-0-released","tags":["browser","testing","E2E","ReleaseNote"],"content":"TestCafe 2.0.0リリース。\nTypeScriptのアップデート、JavaScriptのエラーを無視するオプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Chromium Blog: Chrome 106 Beta: New CSS Features, WebCodecs and WebXR Improvements, and More","url":"https://blog.chromium.org/2022/09/chrome-106-beta-new-css-features.html","tags":["Chrome","ReleaseNote"],"content":"Chrome 106 Betaリリース。\nOrigin Trialsとしてiframeの`anonymous`属性、Pop-Up APIの追加。\nAndroid WebViewでのClient Hintsをサポート、CSSの単位として`ic`をサポート、`Intl.NumberFormat` v3 APIをサポート、`WebCodecs`の`dequeue`イベントのサポートなど。\nCookieのドメイン属性の非ASCII文字を削除、HTTP/2 Pushのサポートの削除など","relatedLinks":[]},{"category":"Article","title":"Modern alternatives to BEM - daverupert.com","url":"https://daverupert.com/2022/08/modern-alternatives-to-bem/","tags":["CSS","architecture","article"],"content":"CSSに`@layer`やWeb Componentsなどの新しい概念が増えたことで、CSSの設計がどのように変わっていくかについて。","relatedLinks":[]},{"category":"Article","title":"Anonymous iframe origin trial: Easily embed iframes in COEP environments - Chrome Developers","url":"https://developer.chrome.com/blog/anonymous-iframe-origin-trial/","tags":["browser","article"],"content":"`Cross-Origin-Embedder-Policy: require-corp`と`Cross-Origin-Opener-Policy: same-origin`のレスポンスヘッダを返すサイトではないと、クロスオリジン分離してiframeとして埋め込めない。\nこの問題を解決するために、iframe要素に`anonymous`属性について","relatedLinks":[]},{"category":"Article","title":"Things not available when someone blocks all cookies","url":"https://blog.tomayac.com/2022/08/30/things-not-available-when-someone-blocks-all-cookies/","tags":["JavaScript","browser","article"],"content":"Cookieをブロックした状態で呼び出すと例外が発生するAPIについて\nlocalStorage、IndexedDB、Service Workers、Cookie APIなどについて","relatedLinks":[]},{"category":"Article","title":"Implementing Promisable setTimeout | yield code(); - Dmitry Kudryavtsev","url":"https://yieldcode.blog/post/implementing-promisable-set-timeout","tags":["JavaScript","article"],"content":"`setTimeout`のPromise版の実装とAbortControllerを使ったキャンセルについて。\nまた、Node.jsの`timers/promises`について。","relatedLinks":[]},{"category":"Article","title":"実践 Node.js Native ESM — Wantedlyでのアプリケーション移行事例 | Wantedly Engineer Blog","url":"https://www.wantedly.com/companies/wantedly/post_articles/410531","tags":["node.js","ECMAScript","module","article"],"content":"Node.jsのNative ESM対応について。\nESMとCJSの非互換性の問題と対処についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"layerhub-io/react-design-editor: Image, Presentation and Video editor. React design editor using fabric.js. Canva clone","url":"https://github.com/layerhub-io/react-design-editor","tags":["React","video","editor","library"],"content":"Reactで書かれたプレゼン、動画編集のエディタライブラリ。Canvaクローン。","relatedLinks":[]},{"category":"WebsiteDocument","title":"package-manager-best-practices/npm.md at main · ossf/package-manager-best-practices","url":"https://github.com/ossf/package-manager-best-practices/blob/main/published/npm.md","tags":["npm","security","document"],"content":"npmのセキュリティに関するベストプラクティスについてのドキュメント。\nCIの構成、依存関係の管理、ロックファイル、パッケージのリリース、レジストリについてなど","relatedLinks":[{"title":"npm Best Practices for the Supply-Chain - Open Source Security Foundation","url":"https://openssf.org/blog/2022/09/01/npm-best-practices-for-the-supply-chain/"}]},{"category":"WebsiteDocument","title":"flomesh-io/pipy: Pipy is a programmable proxy for the cloud, edge and IoT.","url":"https://github.com/flomesh-io/pipy","tags":["JavaScript","proxy","C++","software"],"content":"C++で書かれたプログラマブルなProxy。\nスクリプティング言語としてJavaScriptで記述できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"frehner/modern-guide-to-packaging-js-library","url":"https://github.com/frehner/modern-guide-to-packaging-js-library","tags":["node.js","JavaScript","library","document"],"content":"JavaScriptライブラリを公開するときのガイド。\nESM/CJS/UMD形式の公開、Tree Shakingに対応する、minifyをしない、Source Mapをつける、外部ライブラリをコピーして含めないなど。\nまたpackage.jsonのフィールドについての解説など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bluwy/whyframe: Develop components in isolation","url":"https://github.com/bluwy/whyframe","tags":["JavaScript","library","UI"],"content":"iframe内にマークアップを描画するコンポーネントライブラリ。\nSvelte、Vue、Reactなど各種UIフレームワークに対応している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tinylibs/tinyspy: 🕵🏻‍♂️ minimal fork of nanospy, with more features","url":"https://github.com/tinylibs/tinyspy","tags":["JavaScript","testing","library"],"content":"依存のないspyライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"BetterTyped/hyper-fetch: ⚡ Backend agnostic fetching framework for any javascript environment - queues, caching, persistence, builders, commands, offline and more!","url":"https://github.com/BetterTyped/hyper-fetch","tags":["JavaScript","library","Fetch"],"content":"UniversalなFetchライブラリ。\nBuilder APIで特定のエンドポイントを叩くコマンドを作成して利用する。\nキャッシュ、キュー管理、キャンセル、Prefetchingなどをサポートしている。","relatedLinks":[]}]},{"meta":{"title":"2022-09-13のJS: Next.js 12.3、npm 9 preリリース、Safari 16","author":"azu","layout":"post","date":"2022-09-13T01:09:57.911Z","category":"JSer","tags":["Tools","React","node.js","npm","safari"],"url":"https://jser.info/2022/09/13/next.js-12.3-npm-9-pre-safari-16/"},"items":[{"category":"Headline","title":"Announcing React Native 0.70 · React Native","url":"https://reactnative.dev/blog/2022/09/05/version-070","tags":["React","Native","ReleaseNote"],"content":"React Native, 0.70.0リリース。\nHermesがデフォルトエンジンへと変更、iOSとAndroidでのCodegenの設定の統合、Androiのビルド環境の改善など","relatedLinks":[]},{"category":"Headline","title":"7.19.0 Released: Stage 3 decorators and more RegExp features! · Babel","url":"https://babeljs.io/blog/2022/09/05/7.19.0","tags":["babel","JavaScript","ReleaseNote"],"content":"Babel 7.19.0リリース。\ndecoratorsとrecordAndTupleのデフォルト設定を変更、Stage 3のdecoratorsに対応するversionの追加、Duplicate named capturing groupsのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v2.8.0 · cloudflare/miniflare","url":"https://github.com/cloudflare/miniflare/releases/tag/v2.8.0","tags":["cloudflare","JavaScript","Tools","ReleaseNote"],"content":"miniflare 2.8.0リリース。\nVitestのサポート、`getMiniflareWaitUntil()`の追加、Web Streamsの互換性を修正、Queuesのエミュレートをサポートなど","relatedLinks":[]},{"category":"Headline","title":"preactjs/signals","url":"https://github.com/preactjs/signals","tags":["JavaScript","React","library","performance"],"content":"PreactやReactで利用できるステート管理ライブラリ。\nRefのような値を含むシグナルオブジェクトを扱い、Propsとして渡しても途中のコンポーネントは再レンダリングをしない。\n一方で、値が変化したときにそのSignalを利用しているコンポーネントを再描画できるようにレンダリングの処理をHookする。","relatedLinks":[{"title":"Introducing Signals | Preact: Fast 3kb React alternative with the same ES6 API. Components ","url":"https://preactjs.com/blog/introducing-signals/"}]},{"category":"Headline","title":"Release v2.1.0 · nuxt/content","url":"https://github.com/nuxt/content/releases/tag/v2.1.0","tags":["Vue","library","ReleaseNote"],"content":"Nuxt Content 2.1.0リリース\nDocument Drivenモードの追加、`<Markdown>`が非推奨となり代わりの`<ContentSlot />`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 153 | WebKit","url":"https://webkit.org/blog/13148/release-notes-for-safari-technology-preview-153/","tags":["webkit","safari","ReleaseNote"],"content":"Safari Technology Preview 153リリース。\nimport-assertionとJSONモジュールのサポート、`Temporal.PlainDateTime`をフラグ付きで実装。\nShadowDOMのImperative Slot APIを実装、`navigator.permissions.query`をWorkerでサポートなど","relatedLinks":[{"title":"webcomponents/Imperative-Shadow-DOM-Distribution-API.md at gh-pages · WICG/webcomponents","url":"https://github.com/WICG/webcomponents/blob/gh-pages/proposals/Imperative-Shadow-DOM-Distribution-API.md"}]},{"category":"Headline","title":"Blog - Next.js 12.3 | Next.js","url":"https://nextjs.org/blog/next-12-3","tags":["Next.js","ReleaseNote"],"content":"Next.js 12.3リリース。\nTypeScriptの自動インストールに対応、`.env`などの変更にFast Refreshが対応、`next/future/image`コンポーネントの改善。\n実験的なオプションとして`unoptimized`の追加、SWCでコードを圧縮する`swcMinify`の追加など","relatedLinks":[]},{"category":"Headline","title":"Node v18.9.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v18.9.0/","tags":["node.js","ReleaseNote"],"content":"Node.js 18.9.0リリース。\n`diagnostics_channel`がprocess/workerをサポート、`os.machine()`メソッドの追加など","relatedLinks":[]},{"category":"Headline","title":"jasmine/4.4.0.md at main · jasmine/jasmine","url":"https://github.com/jasmine/jasmine/blob/main/release_notes/4.4.0.md","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Jasmine 4.4.0リリース。\nテストスイートのパフォーマンス改善","relatedLinks":[]},{"category":"Headline","title":"Release v9.0.0-pre.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v9.0.0-pre.0","tags":["npm","ReleaseNote"],"content":"npm v9.0.0-pre.0リリース。\nNode.js 12のサポート終了。\nworkspacesでsemverのrangeを指定できるように、`npm birthday`コマンド、`npm bin`コマンドの削除、`npm pkg`コマンドがあるため`npm set-script`を削除。\nローカルパッケージをsymbolic linkではなくパッケージとしてインストールする`install-links`オプションのデフォルト値を`true`に変更など","relatedLinks":[]},{"category":"Headline","title":"WebKit Features in Safari 16.0 | WebKit","url":"https://webkit.org/blog/13152/webkit-features-in-safari-16-0/","tags":["safari","ReleaseNote"],"content":"Safari 16の変更について。\nAVIF形式のサポート、Passkeysのサポート、Web Inspector Extensionsをサポート、CSSのContainer Queries、Subgridのサポート。\n`display: contents`のアクシビリティの改善\n、Motion Path、Overscroll Behavior, Shared Workersのサポート。\n`<form>.requestSubmit()`、`showPicker()`のサポート。","relatedLinks":[{"title":"Safari 16 Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safari-release-notes/safari-16-release-notes"}]},{"category":"Article","title":"雰囲気でパッケージマネージャーを作ろう","url":"https://zenn.dev/sa2knight/articles/d473ca2894b659","tags":["JavaScript","node.js","article","npm"],"content":"npmのレジストリからパッケージをインストールするパッケージマネージャーを作りながら、パッケージマネージャーについて学ぶ記事","relatedLinks":[]},{"category":"Article","title":"Bytecode Alliance","url":"https://bytecodealliance.org/articles/wasmtime-10-performance","tags":["WebAssembly","article"],"content":"WebAssemblyのコンパイラであるCraneliftとランタイムであるWasmtimeについて。\nどのようにWasmの実行を最適化するかについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"hand-dot/react-inspector: Easily detect React components source code from Chrome!","url":"https://github.com/hand-dot/react-inspector","tags":["React","debug","Tools"],"content":"クリックしたReactコンポーネントのソースコードをエディタで開くChrome拡張","relatedLinks":[{"title":"React開発を快適にするChrome拡張を公開したので見てください！","url":"https://zenn.dev/hand_dot/articles/a1523d8b0449ad"}]},{"category":"WebsiteDocument","title":"GradeJS | Production Webpack Bundle Analyzer","url":"https://gradejs.com/","tags":["webpack","Tools","webservice"],"content":"URLのサイトのwebpackのproduction buildから、どのライブラリとバージョンが含まれているかを分析するツール","relatedLinks":[]},{"category":"WebsiteDocument","title":"facebookincubator/memlab: A testing framework for finding JavaScript memory leaks and analyzing heap snapshots","url":"https://github.com/facebookincubator/memlab","tags":["JavaScript","debug","Tools","puppeteer"],"content":"ウェブアプリケーションのメモリリークをシナリオベースで見つけるデバッグツール。\nシナリオを定義し、Puppeteerを使ったブラウザアクセスした前後のヒープスナップショットからメモリリークしているオブジェクトを見つけるツールとビューア。","relatedLinks":[{"title":"MemLab: An open source framework for finding JavaScript memory leaks","url":"https://engineering.fb.com/2022/09/12/open-source/memlab/"}]},{"category":"SoftwareLibrary","title":"frameable/el: Minimal JavaScript application framework / WebComponents base class","url":"https://github.com/frameable/el","tags":["WebComponents","library"],"content":"Web Componentsベースのウェブアプリケーションフレームワーク。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"AlexeyBoiko/DgrmJS: DgrmJS is a JavaScript library for creating SVG flow diagrams. The main goal of the library is to set up workflows in BPM (Business Process Management) systems. Works on desktop and mobile, has no dependency, 3.5 KB gzipped.","url":"https://github.com/AlexeyBoiko/DgrmJS","tags":["SVG","diagram","library","JavaScript"],"content":"SVGのフローダイアグラムエディタライブラリ","relatedLinks":[]}]},{"meta":{"title":"2022-09-21のJS:  Redwood 3.0.0、npmの新しい機能、Wasmtime 1.0","author":"azu","layout":"post","date":"2022-09-21T13:55:37.678Z","category":"JSer","tags":["Tools","TypeScript","node.js","testing","React"],"url":"https://jser.info/2022/09/21/redwood-3.0.0-npm-wasmtime-1.0/"},"items":[{"category":"Headline","title":"Redwood 3.0.0 is now available! - Announcements / Releases and Upgrade Guides - RedwoodJS Community","url":"https://community.redwoodjs.com/t/redwood-3-0-0-is-now-available/3989","tags":["JavaScript","node.js","ReleaseNote"],"content":"Redwood v3.0.0リリース。\nNode.js 12のサポート終了、プリレンダリングの対応、TypeScriptのStrict Modeに対応、Fastify v4/Jest 29/Prisma v4へのアップデート。\nまた、WebAuthでのログイン/サインアップのサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Release v9.4.0 · TypeStrong/ts-loader","url":"https://github.com/TypeStrong/ts-loader/releases/tag/v9.4.0","tags":["TypeScript","webpack","ReleaseNote"],"content":"ts-loader v9.4.0リリース。\n`.cjs`, `.mjs`, `.cts`, `.mts`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Qwik and Qwik City have reached beta! 🎉","url":"https://www.builder.io/blog/qwik-and-qwik-city-have-reached-beta","tags":["JavaScript","library","ReleaseNote"],"content":"QwikとQwikを使ったメタフレームワークのQwik Cityが1.0 betaとなった。","relatedLinks":[]},{"category":"Headline","title":"React Router 6.4 Release | Remix","url":"https://remix.run/blog/react-router-v6.4","tags":["React","JavaScript","library","ReleaseNote"],"content":"React Router 6.4リリース。","relatedLinks":[]},{"category":"Headline","title":"Bytecode Alliance","url":"https://bytecodealliance.org/articles/wasmtime-1-0-fast-safe-and-production-ready","tags":["WebAssembly","ReleaseNote"],"content":"WebAssemblyのruntimeであるWasmtime 1.0リリース","relatedLinks":[]},{"category":"Headline","title":"Release v1.26.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.26.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.26.0リリース。\nAssertionへのオプションの追加、`--pass-with-no-tests`フラグ、`--ignore-snapshots`フラグの追加など。\nまた、`waitUntil: domcontentloaded`のiframeに対する挙動が変更されている","relatedLinks":[]},{"category":"Article","title":"Announcing the Official TypeScript Types Public Preview","url":"https://blog.emberjs.com/announcing-official-typescript-types-public-preview/","tags":["Ember","TypeScript","article"],"content":"Ember 4.8.0 Beta 2以降ではTypeScriptの型定義が同梱される。\nプレビュー期間では`import 'ember-source/types';`で読み込み、安定したら完全に切り替え、semverポリシーに則って公開される","relatedLinks":[]},{"category":"Article","title":"The Basics of Remix | CSS-Tricks - CSS-Tricks","url":"https://css-tricks.com/the-basics-of-remix/","tags":["JavaScript","React","article"],"content":"Remixについての紹介記事","relatedLinks":[]},{"category":"SlideVideo","title":"Infobip - Shift Conference (2022) - Google スライド","url":"https://docs.google.com/presentation/d/1r3cen2_8CyJX8xBLGxfgPQzkyrBcHTKOujfNHbWexig/edit#slide=id.g15408d936a2_0_3766","tags":["npm","security","slide"],"content":"最近実装やRFCが出ているnpm関係のセキュリティ機能とソフトウェアサプライチェーンについてスライド。\n`--before`での指定日以前のバージョンのインストール、Package Distributions、`npm query`コマンド。\nまた、バリデーションの強化として`npm audit signatures`、sigstoreの対応、Audit policiesについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"lost-pixel/lost-pixel: Holistic visual regression testing framework for modern web 🖼 First class integration with Storybook, Ladle &amp; other frontend libraries.","url":"https://github.com/lost-pixel/lost-pixel","tags":["JavaScript","testing","Tools","Github","Actions"],"content":"Storybookなどに対応したビジュアルリグレッションテストツール。\nGitHub Actionsを使ってスナップショットの更新ができる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ts-safeql/safeql: Validate and auto-generate TypeScript types from raw SQL queries in PostgreSQL.","url":"https://github.com/ts-safeql/safeql","tags":["SQL","ESLint","Tools","library","TypeScript"],"content":"TypeScriptで書いたSQL文に対して実際のデータベースと接続したLintするESLintプラグイン。\nPostgreSQL, Prisma, Sequelize, pg, postgresなどの対応している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tinylibs/tinybench: 🔎 A simple, tiny and lightweight benchmarking library!","url":"https://github.com/tinylibs/tinybench","tags":["JavaScript","benchmark","library"],"content":"ベンチマークライブラリ。\nコールバック関数内で指定した処理の実行時間を比較できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"anonrig/fast-querystring: A faster alternative to legacy node:querystring module","url":"https://github.com/anonrig/fast-querystring","tags":["JavaScript","node.js","library"],"content":"`querystring`と同様のAPIをもつクエリストリングを扱うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tokencss/tokencss","url":"https://github.com/tokencss/tokencss","tags":["CSS","Tools","Design","PostCSS"],"content":"Design Tokensの定義とそれCSSから利用するためのプリプロセッサを提供するツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"skovhus/jest-codemods: Codemods for migrating to Jest https://github.com/facebook/jest 👾","url":"https://github.com/skovhus/jest-codemods","tags":["jest","JavaScript","testing","Tools"],"content":"Jestへの移行を補助するcodemod集。\nAva,Chai,expect.js,jasmine,mocha.should.js,tape,sinon.js からの移行ツールが用意されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"parcel-bundler/lightningcss: An extremely fast CSS parser, transformer, bundler, and minifier written in Rust.","url":"https://github.com/parcel-bundler/lightningcss","tags":["Rust","CSS","library"],"content":"Parcelで利用されているCSSのParser, Transformer, Minifier。\nRustで書かれている","relatedLinks":[]}]},{"meta":{"title":"2022-09-29のJS: TypeScript 4.9 Beta、workerd(Cloudflare Workers runtime)、Web Almanac 2022","author":"azu","layout":"post","date":"2022-09-29T03:01:10.645Z","category":"JSer","tags":["node.js","TypeScript","security","book","browser"],"url":"https://jser.info/2022/09/29/typescript-4.9-beta-workerdcloudflare-workers-runtime-web-almanac-2022/"},"items":[{"category":"Headline","title":"September 22nd 2022 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/september-2022-security-releases/","tags":["node.js","ReleaseNote","security"],"content":"Node.jsのセキュリティ修正としてv14.20.1 (LTS)、v16.17.1 (LTS)、v18.9.1 (Current)がリリースされた。\n`--inspect`におけるDNS rebinding、HTTP Request Smuggling、WebCryptoのWeak randomnessの問題の修正など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.9 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-9-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.9 betaリリース。\n型キャストはせずに型の一致をチェックできる`satisfies`演算子の追加、`in`演算子での型の絞り込みの改善、`== NaN`をコンパイルエラーに変更など。\n`--watch`でのファイル監視のデフォルトを`useFsEvents`に変更、`exports`フィールドの`typeVersions`の優先度を修正など","relatedLinks":[{"title":"Typescript’s new ‘satisfies’ operator | by Cefn Hoile | Aug, 2022 | Medium","url":"https://medium.com/@cefn/typescript-satisfies-6ba52e74cb2f"}]},{"category":"Headline","title":"Introducing workerd: the Open Source Workers runtime","url":"https://blog.cloudflare.com/workerd-open-source-workers-runtime/","tags":["cloudflare","ReleaseNote","C++"],"content":"Cloudflare WorkersのJavaScript/WebAssembly runtimeであるworkerdが公開された。\nMiniflareでJSを使って実装していた部分もworkerdを使うものが公開されている。\nworkerd自体はSandboxではないが、SSRF防止するためのBindingとFetchの仕組みなども持っている。","relatedLinks":[{"title":"Release v3.0.0-next.1 · cloudflare/miniflare","url":"https://github.com/cloudflare/miniflare/releases/tag/v3.0.0-next.1"},{"title":"cloudflare/workerd","url":"https://github.com/cloudflare/workerd"}]},{"category":"Headline","title":"Release Add support for engines.node and Volta · actions/setup-node","url":"https://github.com/actions/setup-node/releases/tag/v3.5.0","tags":["Actions","node.js","ReleaseNote","Github"],"content":"GitHub Actionsのsetup-node 3.5.0リリース。\n`package.json`の`engines.node`とVoltaで指定したNode.jsのバージョンをサポート","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 154 | WebKit","url":"https://webkit.org/blog/13207/release-notes-for-safari-technology-preview-154/","tags":["safari","serverless"],"content":"Safari Technology Preview 154リリース。\nCSS `:dir`の有効化、`InputEvent.isComposing`のサポート、Scroll To Text Fragmentの有効化など","relatedLinks":[]},{"category":"Headline","title":"Release v0.5.0 · facebook/lexical","url":"https://github.com/facebook/lexical/releases/tag/v0.5.0","tags":["JavaScript","React","ReleaseNote"],"content":"lexical v0.5.0リリース。\nNotionライクなDraggable Blocksのサポート、LexicalTablePluginの安定化、Shadow Rootの対応など。\n一部のAPIには破壊的な変更も含まれている","relatedLinks":[]},{"category":"Article","title":"Next.js Layouts RFC in 5 minutes – Vercel","url":"https://vercel.com/blog/next-js-layouts-rfc-in-5-minutes","tags":["Next.js","article"],"content":"Next.jsのLayouts RFCについての解説記事","relatedLinks":[]},{"category":"Article","title":"The Anatomy of an Isolate Cloud","url":"https://deno.com/blog/anatomy-isolate-cloud","tags":["deno","V8","article"],"content":"Deno DeployのIsolationのアプローチについて。\nV8のプロセスが独立していて、Runnerがリクエストに対して起動中のプロセス or プロセスを起動して実行する。\n基本的にはV8 Sandboxに依存していて、fsやnetの制限を設けている","relatedLinks":[]},{"category":"Article","title":"Introducing Ezno","url":"https://kaleidawave.github.io/posts/introducing-ezno/","tags":["Rust","TypeScript","article","opinion"],"content":"Rustで実装しているTypeScript互換の型チェッカーとコンパイラであるEnzoについて。","relatedLinks":[]},{"category":"SlideVideo","title":"Zod Tutorial | Total TypeScript","url":"https://www.totaltypescript.com/tutorials/zod","tags":["TypeScript","tutorial","video"],"content":"TypeScriptを使ったスキーマバリデーションライブラリのzodのチュートリアル動画。\nそれぞれ練習問題を見ながら進めていくないようになっている","relatedLinks":[]},{"category":"SlideVideo","title":"SPAセキュリティ超入門 | ドクセル","url":"https://www.docswell.com/s/ockeghem/K2PPNK-phpconf2022","tags":["JavaScript","browser","XSS","SQL","security","slide"],"content":"SPAにおいてよく起きるセキュリティの問題についてのスライド。\nクライアントサイドでのみバリデーションしている場合の認可制御不備、任意のHTMLを描画してしまうことによるXSS、CSRFについてなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gioboa/vite-module-federation: Module Federation with Vite now is possible","url":"https://github.com/gioboa/vite-module-federation","tags":["vite","plugin"],"content":"Module FederationをするVite Plugin","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Japa - A simple yet powerful testing framework for Node.js","url":"https://japa.dev/docs","tags":["JavaScript","node.js","testing","library"],"content":"Node.js向けのテストフレームワーク。\n`node`コマンドでテストが実行できる。\n基本的なテスト機能に加え、パラメタライズドテスト、テストへのタグ付けとフィルタリングなどをもつ。\nまたプラグインの仕組みをサポートしており、失敗したテストのみを再実行やTypeScriptの型チェックのテストなどをプラグインでサポートしている。","relatedLinks":[]},{"category":"Book","title":"The 2022 Web Almanac","url":"https://almanac.httparchive.org/en/2022/","tags":["web ","book","browser","JavaScript","CSS","HTML"],"content":"Web Almanacの2022年版が公開された。\nHTTP Archiveのデータを元にしたウェブのステータスをまとめたレポート。\nHTML/CSS/JSなどやアクセシビリティ/セキュリティ/サードパーティなど幅広いデータを扱ってる","relatedLinks":[]},{"category":"Book","title":"Shell scripting with Node.js","url":"https://exploringjs.com/nodejs-shell-scripting/","tags":["node.js","book","ShellScript"],"content":"Node.jsでshell scriptingを扱う書籍","relatedLinks":[]}]},{"meta":{"title":"2022-10-05のJS: Deno 1.26、axios v1.0.0、Optimize long tasks","author":"azu","layout":"post","date":"2022-10-05T02:58:23.681Z","category":"JSer","tags":["TypeScript","tutorial","browser","WebAssembly","node.js"],"url":"https://jser.info/2022/10/05/deno-1.26-axios-v1.0.0-optimize-long-tasks/"},"items":[{"category":"Headline","title":"Deno 1.26 Release Notes","url":"https://deno.com/blog/v1.26","tags":["deno","ReleaseNote"],"content":"Deno 1.26リリース。\nCache APIのサポート、`--allow-sys`フラグの追加、`node_modules`ディレクトリを扱う`--node-modules-dir`フラグの追加し`--compat`フラグを削除。\nまたNode.jsコアモジュールへの互換性の改善、`Deno.serve()` APIなどパフォーマンス改善、TypeScrtipt 4.8へのアップデートなど","relatedLinks":[]},{"category":"Headline","title":"Astro 1.4.0 Release | Astro","url":"https://astro.build/blog/astro-140/","tags":["astro","ReleaseNote"],"content":"Astro 1.4.0リリース。\n`Astro.cookies`の追加、pnpmの対応改善、CSSの詳細度がpublic/import/styleタグで同じ場合の優先度の決定。\nVueでのJSXのサポートなど","relatedLinks":[]},{"category":"Headline","title":"watch: add initial implementation for \\`node --watch\\` by MoLow · Pull Request #44366 · nodejs/node","url":"https://github.com/nodejs/node/pull/44366","tags":["node.js","issue"],"content":"Node.jsに`--watch`フラグが追加された。\nnodemonのようにファイルが変更されたらプロセスを再起動する","relatedLinks":[]},{"category":"Headline","title":"Release v9.0.0-pre.3 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v9.0.0-pre.3","tags":["npm","ReleaseNote"],"content":"npm v9.0.0-pre.3リリース。\n`package.json`に`files`がある場合に、`npm pack`はrootにあるgitignoreとnpmignoreを無視するように変更など","relatedLinks":[]},{"category":"Headline","title":"tools/CHANGELOG.md at main · rome/tools","url":"https://github.com/rome/tools/blob/main/CHANGELOG.md#0100","tags":["JavaScript","Tools","ReleaseNote"],"content":"Rome 0.10.0リリース。\nパフォーマンスの改善、ignoreにGlobを利用できるように、FormatterとLinterの対応ルールの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0 · axios/axios","url":"https://github.com/axios/axios/releases/tag/v1.0.0","tags":["JavaScript","library","HTTP"],"content":"axios v1.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Node v18.10.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v18.10.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v18.10.0リリース。\n`ReadableByteStream.tee()`の追加など","relatedLinks":[]},{"category":"Headline","title":"Electron 21.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-21-0","tags":["Electron","ReleaseNote"],"content":"Electron 21.0.0リリース。\nChromium 106、Node.js 16.16.0、V8 10.6へのアップデート。\n`webFrameMain.origin`と`WebContents.ipc`の追加、NSPanelライクな動作のサポートなど。\nまたV8 Memory Cageが有効化され、off-heapを示すArrayBuffersは許可されなくなった。","relatedLinks":[{"title":"Electron and the V8 Memory Cage | Electron","url":"https://www.electronjs.org/blog/v8-memory-cage"}]},{"category":"Article","title":"Ten Years of TypeScript - TypeScript","url":"https://devblogs.microsoft.com/typescript/ten-years-of-typescript/","tags":["TypeScript","article"],"content":"TypeScript10周年の記事。\nTypeScriptが誕生してから10年が経過した。","relatedLinks":[]},{"category":"Article","title":"Optimize long tasks","url":"https://web.dev/optimize-long-tasks/","tags":["JavaScript","browser","performance","article"],"content":"50ms以上かかるlong tasksを分解し、ユーザーの入力と表示の更新を妨げないように最適化する方法についての記事。\nタスクの分解と`navigator.scheduling.isInputPending()`での実行タイミングの判定、`schedulerpostTask` APIについて","relatedLinks":[]},{"category":"Article","title":"Postgres WASM by Snaplet and Supabase","url":"https://supabase.com/blog/postgres-wasm","tags":["PostgreSQL","WebAssembly","article"],"content":"PostgreSQLのWebAssemblyビルドについて\nPostgreSQLそのものをWasmへとビルドするのは難しかったため、VMを作りそれをx86エミュレータで実行する。\nまた、WebSocketsを使ったProxyや起動時間の最適化やイメージサイズの削減についてなど","relatedLinks":[]},{"category":"Article","title":"Client-side WebAssembly WordPress with no server – Make WordPress Core","url":"https://make.wordpress.org/core/2022/09/23/client-side-webassembly-wordpress-with-no-server/","tags":["wordpress","WebAssembly","article"],"content":"WordPressのWebAssemblyビルドについて。\nPHPをWasmにビルドしWordpressを実行する。\nブラウザからのリクエストはService WorkerでProxyする。\nWordPressをブラウザで確認できるので、WordPressの開発や確認がしやすくなる目的","relatedLinks":[]},{"category":"Article","title":"Type-Level TypeScript — Introduction","url":"https://type-level-typescript.com/","tags":["TypeScript","tutorial"],"content":"TypeScriptの型に関するチュートリアル。\n型について解説と各チャプターで練習問題が用意されている。","relatedLinks":[]},{"category":"Article","title":"Closing a 30 pixel gap between native and web - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2022/09/27/closing-pixel-gap-native-web-window-controls-overlay/","tags":["Chrome","MSEdge","UI","browser","article"],"content":"Window Controls Overlayについて。\nブラウザウィンドウのタイトルバーの領域もPWAアプリで利用できる仕組み","relatedLinks":[]},{"category":"WebsiteDocument","title":"Learn Accessibility","url":"https://web.dev/learn/accessibility/","tags":["HTML","accessibility","tutorial"],"content":"ウェブアクセシビリティについて学べるチュートリアル","relatedLinks":[]}]},{"meta":{"title":"2022-10-12のJS: Rollup v3、Volar 1.0(Vue LSP)、Satori(HTML + CSS = SVG)","author":"azu","layout":"post","date":"2022-10-12T07:49:16.919Z","category":"JSer","tags":["React","Ember","audio","ESLint","ECMAScript"],"url":"https://jser.info/2022/10/12/rollup-v3-volar-1.0vue-lsp-satorihtml-css-svg/"},"items":[{"category":"Headline","title":"Release 2.0.0-rc.0 · vercel/swr","url":"https://github.com/vercel/swr/releases/tag/2.0.0-rc.0","tags":["React","JavaScript","library","ReleaseNote"],"content":"SWR 2.0.0-rc.0リリース。\n破壊的変更としてmutationにおけるエラーが他のmutationやuseSWRに反映されないように変更。また、mutationがエラーをthrowするかを抑制できる`throwOnError`オプションを追加など","relatedLinks":[]},{"category":"Headline","title":"ESLint v8.25.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2022/10/eslint-v8.25.0-released/","tags":["ESLint","ReleaseNote"],"content":"ESLint v8.25.0リリース。\n新しい設定ファイルでは、`.eslintignore`ファイルはサポートしなくなり、設定ファイル内の`ignores`フィールドで無視するファイルを指定するようになる変更。","relatedLinks":[]},{"category":"Headline","title":"Chrome 107 beta - Chrome Developers","url":"https://developer.chrome.com/blog/chrome-107-beta/","tags":["Chrome","ReleaseNote"],"content":"Chrome 107 betaリリース。\n`grid-template`でのtransitionのサポート、Screen Capture APIの改善、Resource Timingに`renderBlockingStatus`を追加。\nPermissions policyのorigin指定に`*`を利用可能に、`<form>`要素が`rel`属性のサポートなど。\nOrigin TrialsとしてDeclarative PendingBeacon API、Permissions policyのunloadのサポートなど。\nまた`Expect-CT` HTTPヘッダを非推奨化など","relatedLinks":[{"title":"resource-timing/Render","url":"https://github.com/abinpaul1/resource-timing/blob/render-blocking-status-explainer/Explainer/Render_Blocking_Status.md"}]},{"category":"Headline","title":"Release v7.0.0 · capricorn86/happy-dom","url":"https://github.com/capricorn86/happy-dom/releases/tag/v7.0.0","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"Happy DOM v7.0.0リリース。\n`CSSStyleDeclaration`のサポート改善、`Window.getComputedStyle()`のサポート改善、`CSSStyleSheet`のサポート改善など","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · rollup/rollup","url":"https://github.com/rollup/rollup/releases/tag/v3.0.0","tags":["rollup","ReleaseNote"],"content":"Rollup v3.0.0リリース。\n破壊的な変更として、プラグインのAPIの変更、オプションの変更、デフォルトで`import()`を維持するように変更、chunkのアルゴリズムの変更など。\nまた、デフォルトでNode.jsのESMサポートとの相互運用性を改善、import assertionsのサポート、など","relatedLinks":[{"title":"rollup.js migration","url":"https://rollupjs.org/guide/en/#migration"}]},{"category":"Article","title":"Evolving Ember’s Major Version Process","url":"https://blog.emberjs.com/evolving-embers-major-version-process/","tags":["Ember","article"],"content":"Emberはメジャーリリース(破壊的変更)を少なくするという方針であったため、メジャーリリースの間隔が長くなっていた。この間隔が長くなると非推奨の機能に取り除くタイミングがわかりにくくなるなどの弊害があった。\nそのため、予測可能なリズムとして6周ごとにマイナーリリース、18ヶ月ごとにメジャーリリースとする。\nまた`X.10`以降にはDeprecationを増やさない、メジャーリリースはDeprecationを削除するのみというルールと取り入れ、開発者がDeprecationにいつ対応するべきかを明確にする。","relatedLinks":[]},{"category":"Article","title":"Intl.Segmenter で和文の改行をいい感じにしてみる","url":"https://zenn.dev/notfounds/articles/58c465d4029dc1","tags":["ECMAScript","i18n","article"],"content":"`Intl.Segmenter`を使った分かち書きを考慮した改行の実装について。\nまた、JavaScriptエンジンの実装による違いとHydrationでの差異を無視する方法について","relatedLinks":[]},{"category":"Article","title":"10 best practices to containerize Node.js web applications with Docker | Snyk Blog","url":"https://snyk.io/blog/10-best-practices-to-containerize-nodejs-web-applications-with-docker/","tags":["node.js","Docker","article"],"content":"DockerベースのNode.jsのウェブアプリケーションのプラクティスについて。\nDocker Imageの作成、Gracefull Shutdownの対応、不要な情報の削除などについて","relatedLinks":[]},{"category":"Article","title":"Volar 1.0 &quot;Nika&quot; Released! | The Vue Point","url":"https://blog.vuejs.org/posts/volar-1.0.html","tags":["Vue","VSCode","Extension","article"],"content":"Volar 1.0リリース。\n`<template lang=\"pug\">`のbuilt-inサポートを終了しプラグイン化。\n`vue-tsc`が`--watch`と`--declaration --emitDeclarationOnly`をサポート。\nコアモジュールがVueなどのフレームワークに依存しなくなるなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"slash9494/react-modern-audio-player: 🔊 Simple, accessible and flexible audio player","url":"https://github.com/slash9494/react-modern-audio-player","tags":["React","audio","library"],"content":"Reactで書かれた音楽プレイヤーコンポーネント","relatedLinks":[]},{"category":"SoftwareLibrary","title":"leeoniya/uFuzzy: A tiny, efficient fuzzy search that doesn&#039;t suck","url":"https://github.com/leeoniya/uFuzzy","tags":["JavaScript","search ","library"],"content":"ファイルサイズが小さなあいまい検索ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vercel/satori: Enlightened library to convert HTML and CSS to SVG","url":"https://github.com/vercel/satori","tags":["HTML","CSS","SVG","JavaScript","library"],"content":"HTMLとCSSからSVGを生成するライブラリ。\nyoga-layoutを使いCSSのサブセットを実装していて、ブラウザのレンダリングエンジンを使わずにSVGへと変換できる","relatedLinks":[{"title":"Introducing OG Image Generation: Fast, dynamic social card images at the Edge – Vercel","url":"https://vercel.com/blog/introducing-vercel-og-image-generation-fast-dynamic-social-card-images"}]},{"category":"SoftwareLibrary","title":"fp-ts/core","url":"https://github.com/fp-ts/core","tags":["functional","JavaScript","library"],"content":"関数型プログラミング向けのTypeScriptライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"stepci/stepci: API Testing and Monitoring made simple","url":"https://github.com/stepci/stepci","tags":["JavaScript","API","testing","Tools"],"content":"言語に依存しないWeb APIのテストツール。\nyamlでAPIのテストの定義を書き、テストを実行できる。","relatedLinks":[]}]},{"meta":{"title":"2022-10-19のJS: Bun v0.2、Lerna v6、ECMAScript Decorator","author":"azu","layout":"post","date":"2022-10-19T03:25:49.663Z","category":"JSer","tags":["Tools","slide","ECMAScript","document","jest"],"url":"https://jser.info/2022/10/19/bun-v0.2-lerna-v6-ecmascript-decorator/"},"items":[{"category":"Headline","title":"Release v29.2.0 · facebook/jest","url":"https://github.com/facebook/jest/releases/tag/v29.2.0","tags":["jest","testing","library","ReleaseNote"],"content":"Jest v29.2.0リリース。\nSeed値を設定できるように、`readInitialConfig` APIの追加など。","relatedLinks":[]},{"category":"Headline","title":"Releases · puppeteer/puppeteer","url":"https://github.com/puppeteer/puppeteer/releases/tag/v19.0.0","tags":["puppeteer","ReleaseNote"],"content":"Puppeteer v19.0.0リリース。\nダウンロードしたブラウザを`~/.cache/puppeteer`に保存するように変更、`puppeteer.devices`の削除など","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0 · lerna/lerna","url":"https://github.com/lerna/lerna/releases/tag/v6.0.0","tags":["monorepo","JavaScript","library","ReleaseNote"],"content":"lerna v6.0.0リリース。\n`lerna run`にNxを使うように、`lerna add-caching`コマンドの追加、`lerna repair`コマンドの追加など","relatedLinks":[{"title":"Lerna reborn — What’s new in v6?. Lerna v6 is out!! Here’s everything you… | by Juri Strumpflohner | Oct, 2022 | Nrwl","url":"https://blog.nrwl.io/lerna-reborn-whats-new-in-v6-10aec6e9091c"}]},{"category":"Headline","title":"Astro 1.5.0 Release | Astro","url":"https://astro.build/blog/astro-150/","tags":["astro","ReleaseNote"],"content":"Astro 1.5.0リリース。\nAdaptorが`astro preview`をサポートできるように、`@astrojs/node`が`mode: 'standarlone'`をサポート。\nAPIContextに`site`/`generator`/`url`/`clientAddress`/`props`/`redirect`フィールドを追加など","relatedLinks":[{"title":"[","url":"https://github.com/withastro/astro/pull/5046"}]},{"category":"Headline","title":"Node v18.11.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v18.11.0/","tags":["node.js","ReleaseNote"],"content":"Node v18.11.0リリース。\n`node --watch`でのファイル変更とプロセスの再起動に対応など","relatedLinks":[]},{"category":"Headline","title":"Release Bun v0.2.0 · oven-sh/bun","url":"https://github.com/oven-sh/bun/releases/tag/bun-v0.2.0","tags":["Bun","ReleaseNote"],"content":"Bub v0.2.0リリース。\n`bun --hot`でのHot Relaodingの対応、`Bun.spawn`の追加、ReadableStreamのサポート改善、`package.json`の`imports`フィールドのサポートなど","relatedLinks":[]},{"category":"Article","title":"First-class Vite support in Storybook","url":"https://storybook.js.org/blog/first-class-vite-support-in-storybook/","tags":["JavaScript","article"],"content":"Storybook 7ではViteをファーストクラスサポートとして追加することについて","relatedLinks":[]},{"category":"Article","title":"JavaScript metaprogramming with the 2022-03 decorators API","url":"https://2ality.com/2022/10/javascript-decorators.html","tags":["JavaScript","ECMAScript","proposal","article"],"content":"ECMAScript Proposal Stage 3のDecoratorについて記事。\nDecoratorの歴史、Decoratorができることや構文、Decoratorのユースケースなどについて","relatedLinks":[]},{"category":"Article","title":"Intl Explorer","url":"https://www.intl-explorer.com/","tags":["ECMAScript","i18n","JavaScript","document"],"content":"ECMAScript Internationalization APIの`Intl` APIについてのサイト。\nAPIごとに実行結果を確認できる","relatedLinks":[]},{"category":"SlideVideo","title":"Vue2 Vue3 マイグレーション 令和最新 最強 - Google スライド","url":"https://docs.google.com/presentation/d/e/2PACX-1vS1Drke3qV5WoYkpwk06FL3Zr0VZz7s4usDrJlM4AozNmxcfOM1xHCS9sxK1idD6O7v7vAKEy7NMVLv/pub#slide=id.p","tags":["Vue","slide"],"content":"Vue2からVue3へのマイグレーションについてのスライド。\nComposition APIへの移行、Vue3非対応のライブラリの問題、Vue 3の破壊的な変更点について。\nまた、移行戦略や移行して残った課題についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"リリースから5年、Webフロントエンドの経年劣化と向き合う - Speaker Deck","url":"https://speakerdeck.com/keiya01/ririsukara5nian-webhurontoendonojing-nian-lie-hua-toxiang-kihe-u","tags":["React","JavaScript","slide"],"content":"SPA + SSRで作られていたメディア系サイトをMPAへリファクタリングする話。\nreact-router v3とReduxを外しながら、A/Bテストでメトリクスを取りながら移行。\nまた、開発環境の改善についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"Patterns","url":"https://web.dev/patterns/","tags":["document","browser","JavaScript"],"content":"ウェブアプリでよくあるパターンについてまとめたサイト。\nクリップボードの処理、ファイルの処理、レイアウト、アニメーション、音声や動画の再生などについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"marcj/TypeRunner: High-performance TypeScript compiler","url":"https://github.com/marcj/TypeRunner","tags":["TypeScript","C++","Tools"],"content":"C++で書かれたTypeScriptの型チェッカーのPoC","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nachoaldamav/ultra: JavaScript package manager","url":"https://github.com/nachoaldamav/ultra","tags":["npm","pnpm","Tools"],"content":"pnpmライクなnpmパッケージマネジャー。\nロックファイルとキャッシュファイルがあるときのインストールパフォーマンスを目的としている。","relatedLinks":[]}]},{"meta":{"title":"2022-10-25のJS: Node.js 19、npm 9、Safari 16.1(Web Push)","author":"azu","layout":"post","date":"2022-10-25T14:21:44.919Z","category":"JSer","tags":["safari","node.js","browser","npm","Rust"],"url":"https://jser.info/2022/10/25/node.js-19-npm-9-safari-16.1web-push/"},"items":[{"category":"Headline","title":"Release Notes for Safari Technology Preview 156 | WebKit","url":"https://webkit.org/blog/13394/release-notes-for-safari-technology-preview-156/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 156リリース。\n`Intl.DurationFormat`の実装、`Temporal` APIの改善、`import.meta.resolve()`とImport Mapsの実装。\n`Clear-Site-Data` HTTPヘッダのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v9.0.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v9.0.0","tags":["npm","ReleaseNote"],"content":"npm v9.0.0リリース。\nNode.js 12のサポート終了、認証方法を扱う`--auth-type`のデフォルトを`\"web\"`に変更。\n`package.json`に`files`フィールドが定義されている場合はルートにある`.gitignore`や`.npmignore`を無視するように変更。\nエラーとクラッシュのログを区別し、`--json`をつけた場合でもクラッシュのログはJSONとして出力しないように変更。\n`npm access`、`npm birthday`、`npm set-script`、`npm bin`コマンドの削除など","relatedLinks":[{"title":"enhancement: cli should distinguish between stdout and stderr · Issue #4724 · npm/cli","url":"https://github.com/npm/cli/issues/4724"}]},{"category":"Headline","title":"Release v1.6.0 - Castle in the Sky · solidjs/solid","url":"https://github.com/solidjs/solid/releases/tag/v1.6.0","tags":["JavaScript","library","ReleaseNote"],"content":"Solid v1.6.0リリース。\nPartial Hydrationのサポート、コンポーネントにPropsとして渡すSpread Syntaxの改善など","relatedLinks":[]},{"category":"Headline","title":"Node v19.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v19.0.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v19.0.0リリース。\n開発バージョンとなる奇数バージョン。\n`node --watch`の追加、HTTP/1.1で`keepAlive`がデフォルト化、WebCryptoがStableへと変更。\n依存関係をV8 10.7、llhttp 8.1.0、npm 8.19.2へアップデート。\nまた、`--require`フラグのESM版である`--import`フラグの追加なども行われています。","relatedLinks":[{"title":"Node.js 19 is now available! | Node.js","url":"https://nodejs.org/en/blog/announcements/v19-release-announce/"}]},{"category":"Headline","title":"Tailwind CSS v3.2: Dynamic breakpoints, multi-config, and container queries, oh my! - Tailwind CSS","url":"https://tailwindcss.com/blog/tailwindcss-v3-2","tags":["CSS","library","ReleaseNote"],"content":"Tailwind CSS 3.2リリース。\n`@config`でのconfigの読み込みをサポート。\n`@supports`相当の`support-[]` variantを追加、WAI-ARIA属性に対応するvariantの追加、Data属性に対応するvariantの追加、`max-*` variantの追加。\nプラグインにmatchVariant APIを追加、Container Queryに対応するプラグインの追加など","relatedLinks":[{"title":"Release v3.2.0 · tailwindlabs/tailwindcss","url":"https://github.com/tailwindlabs/tailwindcss/releases/tag/v3.2.0"}]},{"category":"Headline","title":"Release v3.0.0 · svg/svgo","url":"https://github.com/svg/svgo/releases/tag/v3.0.0","tags":["SVG","library"],"content":"SVGO v3リリース。\nNode 12のサポート終了、設定やプラグインのAPIの変更などが含まれる","relatedLinks":[]},{"category":"Headline","title":"Release 3.26.0 - 2022.10.24 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.26.0","tags":["JavaScript","ECMAScript","proposal","library","polyfill","ReleaseNote"],"content":"core-js v3.26.0リリース。\nStage 2のwell-formed unicode stringsの実装、iterator helpers proposalの仕様変更に追従、`self`のpolyfillを追加など","relatedLinks":[]},{"category":"Headline","title":"Vite 4 · Discussion #10570 · vitejs/vite","url":"https://github.com/vitejs/vite/discussions/10570","tags":["vite","issue"],"content":"Vite 4のマイルストーンについてのDiscussion","relatedLinks":[]},{"category":"Headline","title":"WebKit Features in Safari 16.1 | WebKit","url":"https://webkit.org/blog/13399/webkit-features-in-safari-16-1/","tags":["safari","ReleaseNote"],"content":"Safari 16.1の変更点について。\nWeb Pushのサポート、AVIF形式のサポート、PassKeysのサポート、Scroll to Text Fragmentのサポート。\n`getDisplayMedia()`で特定のウィンドウをキャプチャできるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0 · fingerprintjs/BotD","url":"https://github.com/fingerprintjs/BotD/releases/tag/v1.0.0","tags":["browser","JavaScript","library","ReleaseNote"],"content":"Bot検知ライブラリ/サービスのBotD 1.0.0リリース。","relatedLinks":[]},{"category":"Article","title":"No spooky cookies - Chrome Developers","url":"https://developer.chrome.com/en/blog/no-spooky-cookies/","tags":["Chrome","browser","privacy","article"],"content":"Partitioned Cookieについて。\n`Partitioned`属性を付与したCookieはトップレベルのサイトごとに分離されて保存、送信されるようになる。\nサードパーティクッキーの段階的な廃止の一部となる仕組み","relatedLinks":[{"title":"Cookies Having Independent Partitioned State specification","url":"https://www.ietf.org/archive/id/draft-cutler-httpbis-partitioned-cookies-00.html"}]},{"category":"Article","title":"Cloudflare Workers and micro-frontends: made for one another","url":"https://blog.cloudflare.com/better-micro-frontends/","tags":["MicroFrontend","article"],"content":"Cloudflare WorkersとQwikを使ったMicroFrontendのサンプル実装。\n各フラグメントを返すWorkerがあり、メインのWorkerからフラグメントのWorkerにリクエストする形で取得したものを結合してSSRする。\n各フラグメントとなるWorkerは独立してデプロイできるようになっている。","relatedLinks":[{"title":"Cloudflare Workersとマイクロフロントエンド","url":"https://zenn.dev/laiso/articles/972b9d82030542"}]},{"category":"SoftwareLibrary","title":"oscartbeaumont/rspc: A blazingly fast and easy to use TRPC-like server for Rust.","url":"https://github.com/oscartbeaumont/rspc","tags":["Rust","TypeScript","library"],"content":"RustとTypeScript間のIPCをtRPCライクに型付けありで行えるライブラリ。\nReactやSolid、Tauriに対応したクライアントライブラリも提供している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"thebinarysearchtree/flyweight: An ORM for SQLite","url":"https://github.com/thebinarysearchtree/flyweight","tags":["SQLite","node.js","library"],"content":"Node.js向けのSQLite ORM","relatedLinks":[]}]},{"meta":{"title":"2022-11-02のJS: Node.js 18.12.0 LTS、Babel 7.20.0、TypeScript 4.9 RC","author":"azu","layout":"post","date":"2022-11-02T01:40:40.691Z","category":"JSer","tags":["CSS","TypeScript","opinion","React","book"],"url":"https://jser.info/2022/11/02/node.js-18.12.0-lts-babel-7.20.0-typescript-4.9-rc/"},"items":[{"category":"Headline","title":"Node v18.12.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v18.12.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v18.12.0リリース。\nNode.js 18のLTSとなるバージョン。\nNode.js 18のLTSは2025年4月までメンテナンスされる予定。","relatedLinks":[]},{"category":"Headline","title":"vite/CHANGELOG.md at main · vitejs/vite","url":"https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md#320-2022-10-26","tags":["vite","ReleaseNote"],"content":"Vite 3.2.0リリース。\nLibrary Modeで複数のエントリーポイントをサポート、`build.modulePreload`オプションの追加、ErrorOverlayのスタイルをカスタマイズできるようになるなど","relatedLinks":[]},{"category":"Headline","title":"7.20.0 Released: Deno target and TypeScript 4.9 · Babel","url":"https://babeljs.io/blog/2022/10/27/7.20.0","tags":["babel","ReleaseNote"],"content":"Babel v7.20.0リリース。\nTypeScript 4.9のサポート、`@babel/preset-env`の`targets`としてDenoをサポート。\n合わせてbabel-loader 9.0.0をリリースし、webpack5未満のサポート終了とNode.js 12以下のサポート終了など","relatedLinks":[]},{"category":"Headline","title":"Deno 1.27: Major IDE Improvements","url":"https://deno.com/blog/v1.27","tags":["deno","ReleaseNote"],"content":"Deno v1.27リリース。\nnpmパッケージの`@types`を利用できるように、Node-APIのサポート、Lockファイルのフォーマット変更など。\n`navigator.language` Web APIの実装、V8 10.8へ更新など","relatedLinks":[]},{"category":"Headline","title":"Release v7.0.0 · pixijs/pixijs","url":"https://github.com/pixijs/pixijs/releases/tag/v7.0.0","tags":["JavaScript","canvas","library","ReleaseNote"],"content":"PixiJS v7.0.0リリース。\nIEのサポート終了、polyfillの削除、InteractionManagerを削除しEventSystemをデフォルト化、`peerDependencies`を利用しないように変更など","relatedLinks":[{"title":"v7 Migration Guide · pixijs/pixijs Wiki","url":"https://github.com/pixijs/pixijs/wiki/v7-Migration-Guide"}]},{"category":"Headline","title":"Release v3.0.279 · mozilla/pdf.js","url":"https://github.com/mozilla/pdf.js/releases/tag/v3.0.279","tags":["PDF","JavaScript","library","ReleaseNote"],"content":"pdf.js v3.0.279リリース。\nメジャーアップデートとなるリリースでEditor modeの追加、DeprecatedとなっているAPIの削除など","relatedLinks":[]},{"category":"Headline","title":"Release v1.9.0-rc.0 · reduxjs/redux-toolkit","url":"https://github.com/reduxjs/redux-toolkit/releases/tag/v1.9.0-rc.0","tags":["redux","ReleaseNote"],"content":"Redux Toolkit v1.9.0-rc.0リリース。\n`autoBatchEnhancer`の追加、`fetchBaseQuery`でglobal optionを渡せるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 4.9 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-9-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.9 RCリリース。\n型キャストはせずに型の一致をチェックできる`satisfies`演算子の追加、`in`演算子での型の絞り込みの改善、`accessor`キーワードのサポート、`== NaN`をコンパイルエラーに変更など。\n`--watch`でのファイル監視のデフォルトを`useFsEvents`に変更、値と型を同じ`exports`フィールドの`typeVersions`の優先度を修正など","relatedLinks":[]},{"category":"Headline","title":"Mixing It Up: Remix Joins Shopify to Push the Web Forward — Development (2022)","url":"https://shopify.engineering/remix-joins-shopify","tags":["Remix","news"],"content":"ShopifyがRemixを買収し、RemixはShopifyの下で開発を継続する。\nShopifyのHydrogenにもRemixのdata loadingパターンを組み込むなどの変更をしていく予定。\nまた、同時にVanilla ExtractのCreatorであるMark DalgleishもRemixに参加する予定となっている。","relatedLinks":[{"title":"Remixing Shopify | Remix","url":"https://remix.run/blog/remixing-shopify"},{"title":"Roadmap • Hydrogen: Shopify’s headless commerce framework","url":"https://hydrogen.shopify.dev/roadmap/"},{"title":"🧁 Mark Dalgleish on Twitter: ","url":"https://twitter.com/markdalgleish/status/1587519372771217409"}]},{"category":"Article","title":"Why We&#039;re Breaking Up with CSS-in-JS - DEV Community 👩‍💻👨‍💻","url":"https://dev.to/srmagura/why-were-breaking-up-wiht-css-in-js-4g9b","tags":["CSS","JavaScript","article","opinion"],"content":"CSS-in-JSのランタイムパフォーマンス問題についての記事。","relatedLinks":[]},{"category":"Article","title":"Airbnb&#039;s Trip to Linaria | The Airbnb Tech Blog","url":"https://medium.com/airbnb-engineering/airbnbs-trip-to-linaria-dc169230bd12","tags":["CSS","article","opinion"],"content":"AirbnbでCSS-in-JSとしてreact-with-stylesを開発し使っていたが、パフォーマンスとメンテナンス性の問題から、Linariaへ移行していくという話","relatedLinks":[{"title":"airbnb/react-with-styles: Use CSS-in-JavaScript with themes for React without being tightly coupled to one implementation","url":"https://github.com/airbnb/react-with-styles"}]},{"category":"Article","title":"【脱ランタイムCSS in JS】styled-componentsを別のCSS in JSに自動置換するCLIツールの開発","url":"https://zenn.dev/yukiyada/articles/0ac6ef8d566b96","tags":["CSS","article","Tools"],"content":"styled-componentsをlinariaやvanilla-extractに移行するツールの仕組みについての記事","relatedLinks":[]},{"category":"WebsiteDocument","title":"sqlite3 wasm docs: About the sqlite3 WASM/JS Subproject","url":"https://sqlite.org/wasm/doc/trunk/about.md","tags":["SQLite","JavaScript","WebAssembly","library"],"content":"sqlite3をWebAssemblyとJavaScriptを使ってブラウザで動かすことを目的にした公式のサブプロジェクト。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dudykr/stc: Speedy TypeScript type checker","url":"https://github.com/dudykr/stc","tags":["TypeScript","Rust"],"content":"Rustで書かれたTypeScriptの型チェッカー","relatedLinks":[{"title":"Open-sourcing the new TypeScript type checker","url":"https://kdy1.dev/posts/2022/10/open-sourcing-stc"}]},{"category":"Book","title":"Fluent React \\[Book\\]","url":"https://www.oreilly.com/library/view/fluent-react/9781098138707/","tags":["React","book"],"content":"2024年3月発売予定\nReactについての書籍","relatedLinks":[]}]},{"meta":{"title":"2022-11-09のJS: Safari Technology Preview 157、hapi v21.0.0、Rome v10(Stable)","author":"azu","layout":"post","date":"2022-11-09T03:08:56.671Z","category":"JSer","tags":["React","Remix","node.js","Vue","vite"],"url":"https://jser.info/2022/11/09/safari-technology-preview-157-hapi-v21.0.0-rome-v10stable/"},"items":[{"category":"Headline","title":"vuetifyjs/vuetify: 🐉 Material Component Framework for Vue","url":"https://github.com/vuetifyjs/vuetify/releases/tag/v3.0.0","tags":["Vue","library","ReleaseNote"],"content":"Vuetify v3.0.0リリース。\n現時点では`vuetify@next`でインストールできる。","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0-alpha.0 · vitejs/vite","url":"https://github.com/vitejs/vite/releases/tag/v4.0.0-alpha.0","tags":["vite","ReleaseNote"],"content":"Vite v4.0.0-alpha.0リリース。\nrollup 3にアップグレード","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 157 | WebKit","url":"https://webkit.org/blog/13575/release-notes-for-safari-technology-preview-157/","tags":["safari","webkit","ReleaseNote"],"content":"Safari Technology Preview 157リリース。\nCSSの`@font-feature-settings`のサポート、ES2022のclass static initialization blocksのサポート、WebCodecs APIのサポート改善。\n`Sec-Fetch-Site` HTTPヘッダのサポート、Aレコードを使ったthird-party CNAME Cloakingに対するCookieの7日間制限を実装など。","relatedLinks":[]},{"category":"Headline","title":"Release v21.0.0 · hapijs/hapi","url":"https://github.com/hapijs/hapi/releases/tag/v21.0.0","tags":["node.js","server","library","ReleaseNote"],"content":"hapi 21.0.0リリース。\nNode.js 12のサポート終了、JSONPのサポート終了し、Node.js 18のサポートの追加など。\nまたhapiのプラグインなどはhapi v20+以上のみをサポートするようになる変更も含まれている","relatedLinks":[{"title":"21.0.0 Release Notes · Issue #4386 · hapijs/hapi","url":"https://github.com/hapijs/hapi/issues/4386"}]},{"category":"Headline","title":"Deprecate array prototype extensions","url":"https://rfcs.emberjs.com/id/0848-deprecate-array-prototype-extensions/","tags":["Ember","proposal"],"content":"Ember.jsでの配列のprototype拡張をしないようにするProposal。\nEmber.js 4.9.0ではprototype拡張をデフォルトで無効とする変更を入れる予定となっている","relatedLinks":[{"title":"Release Release 4.9.0-beta.0 · ember-cli/ember-cli","url":"https://github.com/ember-cli/ember-cli/releases/tag/v4.9.0-beta.0"}]},{"category":"Headline","title":"Announcing Rome v10 — first stable release of our fast linter and formatter for JavaScript and TypeScript","url":"https://rome.tools/blog/2022/11/08/rome-10.html","tags":["JavaScript","Rust","Tools","ReleaseNote"],"content":"Rome v10リリース。\nRustに書き換えてからの初のStableリリース。\nPrettierライクなFormatterとESLintライクなルールを含むLinterが利用できる","relatedLinks":[]},{"category":"Headline","title":"Changelog | Cypress Documentation","url":"https://docs.cypress.io/guides/references/changelog#11-0-0","tags":["JavaScript","browser","testing","E2E","ReleaseNote"],"content":"Cypress 11.0.0リリース。\nコンポーネントテストのStable化、V8スナップショットを使った起動パフォーマンスの改善、`cy.*Cookie()` APIでドメインを指定できるように。\n破壊的な変更として、コンポーネントのテストに関連するAPIや設定の変更など","relatedLinks":[]},{"category":"Headline","title":"Nov 3 2022 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/november-2022-security-releases/","tags":["node.js","seuc","ReleaseNote"],"content":"Node.jsのセキュリティアップデートとしてそれぞれのバージョンが更新された\n\n- Node.js v14.21.1 (LTS)\n- Node.js v16.18.1 (LTS)\n- Node.js v18.12.1 (LTS)\n- Node.js v19.0.1 (Current)","relatedLinks":[]},{"category":"Article","title":"React Router-ing Remix | Remix","url":"https://remix.run/blog/react-routering-remix","tags":["React","Remix","article"],"content":"React RouterにRemixのData APIを移動した話。\n破壊的な変更なしにどのように処理を移動しているかについて。Feature Flagを使いビルド時に処理を削って互換性を担保しつつ、新しい機能を試せるようにしていることについてなど。","relatedLinks":[{"title":"React Router 6.4 Release | Remix","url":"https://remix.run/blog/react-router-v6.4"}]},{"category":"Article","title":"Full Stack Components | Epic Web Dev by Kent C. Dodds","url":"https://www.epicweb.dev/full-stack-components","tags":["Remix","React","article"],"content":"Remixの`useFetcher`を使った保留状態をもつUIコンポーネントの実装について","relatedLinks":[]},{"category":"Article","title":"What is a realm in JavaScript? · Gal Weizman","url":"https://weizman.github.io/page-what-is-a-realm-in-js/","tags":["JavaScript","ECMAScript","security","article"],"content":"Realmとは何かという解説記事。","relatedLinks":[]},{"category":"Article","title":"個人ブログの Next.js v13 移行でやったことまとめ","url":"https://zenn.dev/panda_program/scraps/6c66f160636969","tags":["Next.js","JavaScript","article"],"content":"Next.js 13へのアップデートについての記事。\n`pages/`から`app/`への移行をした場合のコンポーネントの変更、外部ツールの対応などについて","relatedLinks":[]}]},{"meta":{"title":"2022-11-17のJS:  Parcel v2.8.0、Deno 1.28(`npm:`の対応)、Gatsby 5、Nuxt 3","author":"azu","layout":"post","date":"2022-11-17T01:59:31.120Z","category":"JSer","tags":["node.js","security","browser","parcel","bundler"],"url":"https://jser.info/2022/11/17/parcel-v2.8.0-deno-1.28npm-gatsby-5-nuxt-3/"},"items":[{"category":"Headline","title":"Parcel v2.8.0","url":"https://parceljs.org/blog/v2-8-0/","tags":["parcel","bundler","JavaScript","Tools","ReleaseNote"],"content":"Parcel 2.8.0リリース。\n大規模なアプリケーションでのビルド時間とバンドルサイズの削減、HMRのincrementl buildのパフォーマンス改善、Tree Shakingの改善によるバンドルサイズの削減など","relatedLinks":[{"title":"Release v2.8.0 · parcel-bundler/parcel","url":"https://github.com/parcel-bundler/parcel/releases/tag/v2.8.0"}]},{"category":"Headline","title":"Release v98 · ije/esm.sh","url":"https://github.com/ije/esm.sh/releases/tag/v98","tags":["ECMAScript","module","cdn","ReleaseNote"],"content":"ES Module CDNの esm.sh がTree Shakingをサポート","relatedLinks":[]},{"category":"Headline","title":"Deno 1.28: Featuring 1.3 Million New Modules","url":"https://deno.com/blog/v1.28","tags":["deno","ReleaseNote"],"content":"Deno v1.28リリース。\nnpmパッケージのインストールと実行ができる`npm:`をStableに変更、ロックファイルの自動検出に対応。\nまた、unstable APIとして`Deno.Command`を追加、V8 10.9へのアップデートなど","relatedLinks":[]},{"category":"Headline","title":"Node v19.1.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v19.1.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v19.1.0リリース。\n`node:test`が`mock`オブジェクトをサポート、`fs.watch`に`recursive`オプションを追加など","relatedLinks":[]},{"category":"Headline","title":"Gatsby 5: The Fastest Gatsby Yet | Gatsby","url":"https://www.gatsbyjs.com/blog/gatsby-5/","tags":["React","ReleaseNote","library"],"content":"Gatsby 5リリース。\nSlice APIの追加、React Server Componentsを使ったPartial Hydrationの対応、Script Componentのサポートなど","relatedLinks":[{"title":"Migrating from v4 to v5 | Gatsby","url":"https://www.gatsbyjs.com/docs/reference/release-notes/migrating-from-v4-to-v5/"}]},{"category":"Headline","title":"Release v11.1.0 · cypress-io/cypress","url":"https://github.com/cypress-io/cypress/releases/tag/v11.1.0","tags":["JavaScript","browser","testing","library","ReleaseNote"],"content":"Cypress v11.1.0リリース。\nNext.js v13のサポート、Vue2の`mount()`で`extensions.directives`をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing 3.0 • Nuxt","url":"https://nuxt.com/v3","tags":["Vue","library","ReleaseNote"],"content":"Nuxt 3リリース。\nVue 3、TypeScript、Viteのサポート、webpack 5のサポート、サーバーエンジンのNitroとポータブルな出力の対応など。\nまたIEのサポートを終了、Node.js 12のサポートを終了など","relatedLinks":[{"title":"Upgrade Guide • Nuxt","url":"https://nuxt.com/docs/getting-started/upgrade"}]},{"category":"Headline","title":"Announcing TypeScript 4.9 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-4-9/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 4.9リリース。\n型キャストはせずに型の一致をチェックできる`satisfies`演算子の追加、`in`演算子での型の絞り込みの改善、`accessor`キーワードのサポート、`== NaN`をコンパイルエラーに変更など。\n`--watch`でのファイル監視のデフォルトを`useFsEvents`に変更、値と型を同じ`exports`フィールドの`typeVersions`の優先度を修正など","relatedLinks":[]},{"category":"Headline","title":"Angular v15 is now available!. Over the past year we removed Angular’s… | by Minko Gechev | Nov, 2022 | Angular Blog","url":"https://blog.angular.io/angular-v15-is-now-available-df7be7f2f4c8","tags":["Angular","ReleaseNote"],"content":"Angular 15リリース。\nStandalone APIをStable化、Node.js 12のサポート終了など","relatedLinks":[{"title":"Release v15.0.0 · angular/angular","url":"https://github.com/angular/angular/releases/tag/15.0.0"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 158 | WebKit","url":"https://webkit.org/blog/13584/release-notes-for-safari-technology-preview-158/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 158リリース。\nCSSの`font-size-adjust`プロパティの実装、フラグ付きで`contain-intrinsic-size`プロパティの実装、WebCodecsをデフォルトで有効化など","relatedLinks":[]},{"category":"Article","title":"The evolution of scalable CSS","url":"https://frontendmastery.com/posts/the-evolution-of-scalable-css/","tags":["CSS","article"],"content":"大規模プロジェクトでもスケールするCSSのプラクティスの変遷についての記事。\n大規模のCSSの管理が難しい問題として名前空間が、名前をつけるのが難しい、リファクタリングやデバッグが難しい問題について。\nこれに対するアーキテクチャとしてOOCS、SMACSS、BEM、CSS-in-JS、Atomic CSS、Tailwindなどが解決している問題について。","relatedLinks":[]},{"category":"Article","title":"LernaとGithub Actionsでmonorepoライブラリのリリースを楽にする - Link and Motivation Developers&#039; Blog","url":"https://link-and-motivation.hatenablog.com/entry/2022/11/16/190305","tags":["JavaScript","Github","Actions","library","article"],"content":"lernaを使ってmonorepoでライブラリをpublishする方法について","relatedLinks":[]},{"category":"SlideVideo","title":"Client-side prototype pollution | Web Security Academy","url":"https://portswigger.net/web-security/prototype-pollution","tags":["browser","security","tutorial"],"content":"Prototype PollutionというJavaScriptにおける脆弱性について。\nPrototype Pollutionの見つけ方、Prototype Pollutionを使った攻撃や対策について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Node.js Security Best Practices | Node.js","url":"https://nodejs.org/en/docs/guides/security/","tags":["node.js","security","document"],"content":"Node.jsのセキュリティベストプラクティス。\nDoS攻撃対策、`--inspect`を本番で利用しない、パッケージの公開、タイミング攻撃、サードパーティモジュールとpolicy-integrity、npm経由のサプライチェーン攻撃についてなど","relatedLinks":[]}]},{"meta":{"title":"2022-11-22のJS:  State of JavaScript 2022のアンケートを実施中、RegExp `v` flag","author":"azu","layout":"post","date":"2022-11-22T00:42:43.228Z","category":"JSer","tags":["React","tutorial","CSS","TypeScript","browser"],"url":"https://jser.info/2022/11/22/state-of-javascript-2022-regexp-v-flag/"},"items":[{"category":"Headline","title":"AWS AppSync GraphQL APIs Supports JavaScript Resolvers | AWS News Blog","url":"https://aws.amazon.com/jp/blogs/aws/aws-appsync-graphql-apis-supports-javascript-resolvers/","tags":["aws","GraphQL","JavaScript","news"],"content":"AWS AppSync GraphQL APIsのResolverとしてVTLに加えてJavaScriptが利用できるようになる。","relatedLinks":[]},{"category":"Headline","title":"Release v1.28 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.28.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.28.0リリース。\nVSCodeからテストコードの生成を補助するPlaywright Toolsの追加、`test.describe.configure` APIの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v7.17.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v7.17.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v7.17.0リリース。\n`pnpm licenses list`コマンドの追加など","relatedLinks":[]},{"category":"Headline","title":"State of JavaScript 2022","url":"https://survey.devographics.com/survey/state-of-js/2022","tags":["JavaScript","Survey","news"],"content":"2022年12月15日まで、JavaScript開発者向けのアンケートであるState Of JSが実施中。","relatedLinks":[]},{"category":"Article","title":"The magical world of Particles with React Three Fiber and Shaders - Maxime Heckel&#039;s Blog","url":"https://blog.maximeheckel.com/posts/the-magical-world-of-particles-with-react-three-fiber-and-shaders/","tags":["React","WebGL","article","tutorial"],"content":"React Three Fiberを使ったパーティクルのレンダリングについてのチュートリアル","relatedLinks":[{"title":"The Study of Shaders with React Three Fiber - Maxime Heckel","url":"https://blog.maximeheckel.com/posts/the-study-of-shaders-with-react-three-fiber/"}]},{"category":"Article","title":"ECMAScript proposal: RegExp flag \\`/v\\` makes character classes and character class escapes more powerful","url":"https://2ality.com/2022/11/regexp-v-flag.html","tags":["ECMAScript","proposal","article"],"content":"ECMAScript Proposal Stage 3のRegExpの`v`フラグについての解説。\n文字クラスとUnicode Property Escape、文字クラスの集合操作、case-insensitiveマッチの改善について","relatedLinks":[]},{"category":"Article","title":"コードジャンプ可能な CSS Modules を実現する happy-css-modules の紹介 - mizdra&#039;s blog","url":"https://www.mizdra.net/entry/2022/11/14/102506","tags":["CSS","TypeScript","article"],"content":"Typed CSS Modulesとコードジャンプの問題について。\nTypeScriptのDeclaration Mapを使い、型定義ファイルではなくソースコードであるCSSそのものへジャンプする実装について","relatedLinks":[]},{"category":"Article","title":"Manifest v3 signing available November 21 on Firefox Nightly | Mozilla Add-ons Community Blog","url":"https://blog.mozilla.org/addons/2022/11/17/manifest-v3-signing-available-november-21-on-firefox-nightly/","tags":["Firefox","Extension","article"],"content":"2022年11月21日からFirefoxの拡張機能ストアであるAMOに対してManifest V3の拡張をアップロードして署名できるようになる","relatedLinks":[]},{"category":"Article","title":"Automate an isolated browser instance with just a few lines of code","url":"https://blog.cloudflare.com/introducing-workers-browser-rendering-api/","tags":["cloudflare","puppeteer","article"],"content":"Cloudflare WorkersからPuppeteerが利用できるRendering APIを導入予定という話。\ngVisorで管理されたBrowser Renderingを行うサンドボックス内でレンダリングを行いその結果を取得できる","relatedLinks":[]},{"category":"Article","title":"Expiration Cap Removed From JavaScript Cookies In WebKit Browsers | Simo Ahava&#039;s blog","url":"https://www.simoahava.com/privacy/first-party-cookies-webkit-revisited/","tags":["browser","safari","privacy"],"content":"SafariのCookieの有効期限について。\nブラウザを利用した日で7日間未使用の場合の削除、ITPでのトラッキング分類された場合に24時間で削除、CNAME Cloakingでの7日間制限などについて","relatedLinks":[]},{"category":"SlideVideo","title":"メタフロントエンド開発者 プロフェッショナル認定証 | Coursera","url":"https://www.coursera.org/professional-certificates/meta-front-end-developer","tags":["HTML","CSS","JavaScript","React","tutorial","video"],"content":"Metaのフロントエンド開発者入門むけのcoursera講座。\nHTML/CSS/JavaScriptとReact、UI/UXなどについて学ぶ講座","relatedLinks":[]},{"category":"WebsiteDocument","title":"Permissions-Policy Research - Google ドキュメント","url":"https://docs.google.com/document/d/14xHANU3n43PfJR_dCpEwVCiVYv12BAfGqOICNvd79R4/edit#","tags":["browser","Chrome","spec","document"],"content":"Feature-PolicyとPermissions-Policyの対応や標準化についての調査ドキュメント。\nMDNのドキュメントのために調査されている。","relatedLinks":[{"title":"Intent to document: Permissions-Policy · Issue #22347 · mdn/content","url":"https://github.com/mdn/content/issues/22347"}]},{"category":"SoftwareLibrary","title":"hadmean/hadmean: Generate powerful, fully functional, ready-to-be-deployed admin apps in seconds with just \\`npx hadmean\\`. No Javascript, no SQL, no components, no tutorials, and finally zero maintenance. Stop building and maintaining admin apps that you can auto-generate.","url":"https://github.com/hadmean/hadmean","tags":["node.js","Tools"],"content":"データベースのデータをみる管理画面を作成するジェネレータアプリ。","relatedLinks":[]},{"category":"Book","title":"JavaScript と比較しながら学ぶ TypeScript | Techpit","url":"https://www.techpit.jp/courses/248","tags":["JavaScript","TypeScript","book"],"content":"JavaScriptに型を付けながらTypeScriptについて学ぶ書籍","relatedLinks":[{"title":"[","url":"https://zenn.dev/ababup1192/articles/6873aa4b4109f2"}]}]},{"meta":{"title":"2022-11-29のJS: ESMeta、Wasmer 3.0、tRPC v10","author":"azu","layout":"post","date":"2022-11-29T14:34:25.485Z","category":"JSer","tags":["TypeScript","Tools","node.js","WebAssembly","Rust"],"url":"https://jser.info/2022/11/29/esmeta-wasmer-3.0-trpc-v10/"},"items":[{"category":"Headline","title":"Prettier 2.8: improve --cache CLI option and TypeScript 4.9 satisfies operator! · Prettier","url":"https://prettier.io/blog/2022/11/23/2.8.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 2.8リリース。\nTypeScript 4.9 `satisfies` operatorのサポート、`--cache-location`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"es-meta/esmeta: ECMAScript Specification (ECMA-262) Metalanguage","url":"https://github.com/es-meta/esmeta","tags":["ECMAScript","JavaScript","Tools"],"content":"ECMAScript仕様書のメタ言語ツール。\nECMAScriptの言語/仕様書のパーサとインタープリタを実装したメタツール。\n仕様書のアルゴリズムをステップ実行したり、デバッガーでBreak Pointを貼ったり、仕様書における内部状態を可視化できる。","relatedLinks":[]},{"category":"Headline","title":"Announcing Wasmer 3.0","url":"https://wasmer.io/posts/announcing-wasmer-3.0","tags":["WebAssembly","ReleaseNote"],"content":"Wasmer 3.0リリース。\nWAPMパッケージを実行できる`wasmer run`コマンドの追加、`MemoryView`の追加。\nZigのクロスコンパイル機能を使ってWindow/Linux/macOSの実行ファイルを作成できるように","relatedLinks":[{"title":"wasmer/migration","url":"https://github.com/wasmerio/wasmer/blob/master/docs/migration_to_3.0.0.md"}]},{"category":"Headline","title":"Announcing tRPC v10 | tRPC","url":"https://trpc.io/blog/announcing-trpc-10","tags":["TypeScript","library","ReleaseNote"],"content":"tRPC v10リリース。\nRouterの定義方法、`inferRouterInputs`と`inferRouterOutputs`の型定義を追加、Middlewareのシグネチャの変更など","relatedLinks":[{"title":"Migrate from v9 to v10 | tRPC","url":"https://trpc.io/docs/migrate-from-v9-to-v10"}]},{"category":"Headline","title":"Node.js 18.x runtime now available in AWS Lambda | AWS Compute Blog","url":"https://aws.amazon.com/jp/blogs/compute/node-js-18-x-runtime-now-available-in-aws-lambda/","tags":["aws","Lambda","node.js","news"],"content":"AWS LambdaでNode.js 18をサポート","relatedLinks":[]},{"category":"Article","title":"Wasmはなぜセキュアなのか？","url":"https://zenn.dev/0kate/articles/83e48c177ff709","tags":["WebAssembly","article","security"],"content":"Wasmerの実装を読みながら、WebAssemblyのセキュリティ機能がどのように実現されているについて","relatedLinks":[]},{"category":"Article","title":"Prerender2 という機能について | blog.bokken.io","url":"https://blog.bokken.io/articles/2022-11-24/about-prerender2.html","tags":["Chrome","article"],"content":"Chromeで実装中のPrerender2について。\nSpeculation Rulesでプリレンダリングする対象を指定する新しい仕組みについて","relatedLinks":[]},{"category":"Article","title":"デザインシステム開発優先度の「難しさ」と「対策」｜hikaru-takase /Loglass｜note","url":"https://note.com/99997373/n/n7dcb9092a90b","tags":["Design","article","opinion"],"content":"マルチプロダクト化していく中で複数のプロダクトから参照できるデザインが必要となり、それを解決するためにデザインシステムをどのように進めていくかについて。\nデザイントークンの分離、コンポーネントの集中管理、小さく作り始めて広げていくなど","relatedLinks":[]},{"category":"Article","title":"TypeScript and native ESM on Node.js","url":"https://2ality.com/2021/06/typescript-esm-nodejs.html","tags":["node.js","TypeScript","article"],"content":"Node.jsでのESMと`exports`フィールドについての解説","relatedLinks":[]},{"category":"SlideVideo","title":"JSConf JP 2022 公開資料・Twitterリンクまとめ","url":"https://zenn.dev/yumemi_inc/articles/2022-11-27-jsconf-jp-2022","tags":["JavaScript","Conference","slide","video"],"content":"JSConf JP 2022の動画とスライドのまとめ","relatedLinks":[{"title":"JSConf JP","url":"https://jsconf.jp/2022/"}]},{"category":"SoftwareLibrary","title":"1Password/typeshare: Typeshare is the ultimate tool for synchronizing your type definitions between Rust and other languages for seamless FFI.","url":"https://github.com/1Password/typeshare","tags":["Rust","TypeScript","kotlin","swift","golang","library","Tools"],"content":"アノテーションしたRustのコードからTypeScript/Swift/Kotlinの型定義を生成できるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"hyperstackjs · Hyperstack is a modern full-stack Node.js web framework for the pragmatic programmer","url":"https://hyperstackjs.io/","tags":["node.js","JavaScript","library","server"],"content":"Node.jsのウェブアプリケーションフレームワーク","relatedLinks":[]},{"category":"Book","title":"A Skeptic’s Guide to Functional Programming with JavaScript","url":"https://jrsinclair.com/skeptics-guide","tags":["JavaScript","functional","book"],"content":"JavaScriptでの関数型プログラミングについての書籍","relatedLinks":[]}]},{"meta":{"title":"2022-12-07のJS: Electron 22.0.0、Web PerformanceとJavaScript Performance","author":"azu","layout":"post","date":"2022-12-07T05:04:16.991Z","category":"JSer","tags":["performance","Chrome","Electron","Next.js","TypeScript"],"url":"https://jser.info/2022/12/07/electron-22.0.0-web-performancejavascript-performance/"},"items":[{"category":"Headline","title":"Electron 22.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-22-0","tags":["Electron","ReleaseNote"],"content":"Electron 22.0.0リリース。\nChromium 108、Node.js 16.17.1、V8 10.8へのアップデート、`UtilityProcess`モジュールの追加、`new-window`イベントの非推奨化など。\nWindows 7/8/8.1をサポートする最後のElectronバージョンとなる。","relatedLinks":[]},{"category":"Headline","title":"Release 5.0.0 · primus/eventemitter3","url":"https://github.com/primus/eventemitter3/releases/tag/5.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"eventemitter3 5.0.0リリース。\nNode.js ESMのサポートなど","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2022-11 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2022/12/05/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2022年11月に行われたTC39 MeetingによってStatusが変化したECMAScript Proposalのまとめ。","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 108 - Chrome Developers","url":"https://developer.chrome.com/blog/new-in-chrome-108/","tags":["Chrome","ReleaseNote"],"content":"Chrome 108の変更点について。\nviewportのunitとして`dvh`/`lvh`/`svh`を追加、Variable fontsのCOLRv1をサポート。\nFileSystemSyncAccessHandleのAPIを同期メソッドに変更、Permissions PolicyのOrigin指定に`*`(wildcard)を利用できるようになるなど","relatedLinks":[]},{"category":"Article","title":"How TypeScript 4.9 \\`satisfies\\` Your Prisma Workflows","url":"https://www.prisma.io/blog/satisfies-operator-ur8ys8ccq7zb","tags":["TypeScript","article"],"content":"TypeScript 4.9の`satisfies` operatorの使い方についての記事。\nPrismaやZodと合わせた使い方について","relatedLinks":[]},{"category":"Article","title":"Sass製SVG爆速表示ライブラリのご紹介 - dwango on GitHub","url":"https://dwango.github.io/articles/2022-12_nicolive_svg/","tags":["CSS","SVG","Cargo"],"content":"CSSを使ってSVGを切り替える方法とそれを実装したライブラリについて。\nCSSの`mask-image`を使った方法と`animationstart`で切り替える方法についての比較","relatedLinks":[]},{"category":"Article","title":"Image Formats for the Web | DebugBear","url":"https://www.debugbear.com/blog/image-formats","tags":["Image","performance","article"],"content":"ウェブ向けの画像フォーマットとどれを使うべきかについて。\nGIF/PNG/JPG/WebP/AVIF/SVGそれぞれの特性と推奨事項。また、AVIFは非可逆圧縮と可逆圧縮どちらもサポートしているが、可逆圧縮の結果はあまり良くない点についてなど","relatedLinks":[]},{"category":"Article","title":"Migrating from Vue 2 to Svelte","url":"https://escape.tech/blog/from-vue2-to-svelte/","tags":["Vue","Svelte","article"],"content":"Vue 2からSvelteKitに移行したという話。","relatedLinks":[]},{"category":"Article","title":"Working with Zustand | TkDodo&#039;s blog","url":"https://tkdodo.eu/blog/working-with-zustand","tags":["JavaScript","React","article"],"content":"React向けのステート管理ライブラリであるZustandについてのTips。\nパフォーマンスに関するTips、アクションとステートの分離、アクションをsetterではなくeventとして扱う、Storeのスコープを小さく保つなど","relatedLinks":[]},{"category":"Article","title":"Prerender pages in Chrome for instant page navigations - Chrome Developers","url":"https://developer.chrome.com/en/blog/prerender-pages/","tags":["Chrome","performance","article"],"content":"Chromeの新しいprerenderについて。\nアドレスバーでURLを入力する場合も信頼度に基づいてPrerenderを投機的に行う。\nまたSpeculation Rules APIでのprerenderのルール定義、prerenderをサーバ側で無効化する方法、prerenderされたかを判定する方法についてなど","relatedLinks":[]},{"category":"Article","title":"Speeding up the JavaScript ecosystem - one library at a time","url":"https://marvinh.dev/blog/speeding-up-javascript-ecosystem/","tags":["JavaScript","performance","article"],"content":"不必要な型変換や関数内に関数を作らないことで多くのライブラリはパフォーマンスが改善するという話。\n実際のPostCSSプラグインやSVGOなどのコードを例に、どのような場所がパフォーマンスに影響していたかについて","relatedLinks":[]},{"category":"Article","title":"New npm features for secure publishing and safe consumption | The GitHub Blog","url":"https://github.blog/2022-12-06-new-npm-features-for-secure-publishing-and-safe-consumption/","tags":["npm","security","article"],"content":"npmにアクセスするスコープを設定できるfine-grained access tokenの追加、npmのウェブサイト上のCode explorerでコードを閲覧できるようになるなど","relatedLinks":[]},{"category":"SlideVideo","title":"An introduction to the LibJS JavaScript engine - Google スライド","url":"https://docs.google.com/presentation/d/1-chE3GTNFnNRwZqk4Bf3GCPV_nINfKG-NUTM4IeEnVc/edit#slide=id.p","tags":["JavaScript","slide"],"content":"SerenityOS向けにスクラッチでJavaScriptエンジンを書いたというスライド。\nECMA-262の仕様を満たすJITなしのAST/Bytecodeインタープリタをどのように実装していったかについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"shuding/nextra: Simple, powerful and flexible site generation framework with everything you love from Next.js.","url":"https://github.com/shuding/nextra","tags":["Next.js","library"],"content":"Next.jsとMDXベースの静的サイトジェネレータツール。","relatedLinks":[]}]},{"meta":{"title":"2022-12-13のJS: Bun 0.3.0、SWR 2.0、Civet(CoffeeScript of TypeScript)","author":"azu","layout":"post","date":"2022-12-12T15:08:17.430Z","category":"JSer","tags":["Tools","Bun","Chrome","React","performance"],"url":"https://jser.info/2022/12/13/bun-0.3.0-swr-2.0-civetcoffeescript-of-typescript/"},"items":[{"category":"Headline","title":"Bun v0.3.0","url":"https://bun.sh/blog/bun-v0.3.0","tags":["Bun","ReleaseNote"],"content":"Bun 0.3.0リリース。\n高負荷時メモリ消費量の改善、GCでのクラッシュを修正など安定性の向上。\nNode.js互換性として、`child_process`モジュール、`Error.captureStackTrace()` APIなどの追加。\n`console`をAsyncIterableに変更、`import`してるモジュールを自動的にnpmからインストールするように。\nNext.jsライクなルーティングをファイルシステムに対して行う`FileSystemRouter` APIの追加、`expect()`のmatchersの追加など","relatedLinks":[{"title":"Release Bun v0.3.0 · oven-sh/bun","url":"https://github.com/oven-sh/bun/releases/tag/bun-v0.3.0"}]},{"category":"Headline","title":"Ember 4.9 Released","url":"https://blog.emberjs.com/ember-4-9-released/","tags":["Ember","ReleaseNote"],"content":"Ember 4.9リリース。\nTypeScript 4.9のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing the Tauri Mobile Alpha Release | Tauri Apps","url":"https://tauri.app/blog/2022/12/09/tauri-mobile-alpha/","tags":["JavaScript","Rust","mobile","ReleaseNote"],"content":"Tauri 2.0.0 alphaリリース。\niOS/Androidのモバイルアプリでの実行をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing SWR 2.0 – SWR","url":"https://swr.vercel.app/blog/swr-v2","tags":["React","library","ReleaseNote"],"content":"SWR 2.0リリース。\n破壊的な変更として、Fetcherの引数の変更、キャッシュの内部構造の変更、ビルドターゲットをES2018に変更。\n`useSWRMutation`の追加、Optimistic UIに関するオプションを追加、SWR DevToolsに対応。\n`preload` APIの追加、状態として`isLoading`を追加、`keepPreviousData`オプションの追加、React 18の対応改善など","relatedLinks":[{"title":"SWR 2.0 の発表 – SWR","url":"https://swr.vercel.app/ja/blog/swr-v2"}]},{"category":"Headline","title":"Announcing Rome v11","url":"https://rome.tools/blog/2022/12/06/rome11/","tags":["JavaScript","Tools","ReleaseNote"],"content":"Rome v11リリース。\nTypeScript 4.9のサポート、`semicolons`オプションの追加、Lintルールの追加とLintのグループを追加など","relatedLinks":[]},{"category":"Headline","title":"Release v0.16.0 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.16.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"esbuild v0.16.0リリース。\n破壊的な変更として`esbuild-<arch>`のパッケージを`@esbuild/<arch>`へと変更、`define`パラメータのバリデーションを追加。\nSVGのようにファイルをbase64する必要がない場合はしないように変更、`</script>`を自動エスケープするように変更、`--legal-comments`のデフォルトを`none`に変更など","relatedLinks":[]},{"category":"Article","title":"Chromium Blog: Introducing passkeys in Chrome","url":"https://blog.chromium.org/2022/12/introducing-passkeys-in-chrome.html","tags":["Chrome","security","article"],"content":"Chrome 108でPasskeysが利用可能になった","relatedLinks":[]},{"category":"Article","title":"Interaction to Next Paint (INP)","url":"https://web.dev/inp/","tags":["Chrome","browser","performance","article"],"content":"Interaction to Next Paint(INP)という操作してからの応答時間を測るパフォーマンスのメトリクスについて。\nINPが200msより大きいなら改善が必要、インタラクションにはどのようなものがあるかやFirst Input Delay(FID)との違いについて。\nまた、ブラウザでの計測方法やラボデータについて","relatedLinks":[]},{"category":"Article","title":"Building data-centric apps with a reactive relational database","url":"https://riffle.systems/essays/prelude/","tags":["JavaScript","SQLite","article"],"content":"UIの状態をブラウザ上のDB(SQLite)に全て持たせることで、アプリ開発を簡素化する研究。\nSQLiteをデータベースではなく、データストアとして利用する","relatedLinks":[]},{"category":"Article","title":"Web Performance Calendar » Mobile Performance of Next.js Sites","url":"https://calendar.perfplanet.com/2022/mobile-performance-of-next-js-sites/","tags":["Next.js","performance","article"],"content":"Next.jsのショーケースに掲載されてるウェブサイトのモバイルにおけるパフォーマンスを計測した記事。","relatedLinks":[{"title":"Annie Sullivan: ","url":"https://indieweb.social/@anniesullie/109479127815952360"}]},{"category":"WebsiteDocument","title":"socketsupply/socket: Create networked, native, cross-platform software on mobile and desktop using HTML, CSS, and JavaScript.","url":"https://github.com/socketsupply/socket","tags":["HTML","CSS","JavaScript","software"],"content":"HTML、CSS、JavaScriptを使ってモバイルアプリ、デスクトップアプリを作成するツールキット。\nWebViewベースのアプリケーションを作成できるSDK","relatedLinks":[]},{"category":"WebsiteDocument","title":"zenorocha/react-email: 💌 Build and send emails using React","url":"https://github.com/zenorocha/react-email","tags":["React","mail","library"],"content":"メールコンテンツを作成するためのReactコンポーネントとレンダラー","relatedLinks":[]},{"category":"SoftwareLibrary","title":"elysiajs/elysia: Fast, and friendly Bun web framework","url":"https://github.com/elysiajs/elysia","tags":["Bun","library","JavaScript"],"content":"Bun向けのウェブフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"DanielXMoore/Civet: The CoffeeScript of TypeScript","url":"https://github.com/DanielXMoore/Civet","tags":["CoffeeScript","TypeScript","Tools","program"],"content":"CoffeeScriptからTypeScriptへコンパイルできるCoffeeScriptコンパイラ。\nCoffeeScript2と互換性のある構文とES2015以降のサポート、TypeScriptの型アノテーションのサポートを目的に作られている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rafasofizada/pechkin: Pechkin is a modern, asynchronous, flexible and configurable Node.js library for handling file uploads (i.e. multipart/form-data requests), written in TypeScript.","url":"https://github.com/rafasofizada/pechkin","tags":["node.js","library"],"content":"`multipart/form-data`などのファイルアップロードを扱うNode.jsライブラリ。","relatedLinks":[]}]},{"meta":{"title":"2022-12-20のJS: Vite 4.0、SvelteKit 1.0、Node v19.3.0(npm 9)、RUM Archive","author":"azu","layout":"post","date":"2022-12-20T02:56:00.971Z","category":"JSer","tags":["performance","Tools","CSS","node.js","browser"],"url":"https://jser.info/2022/12/20/vite-4.0-sveltekit-1.0-node-v19.3.0npm-9-rum-archive/"},"items":[{"category":"Headline","title":"jQuery 3.6.2 Released! | Official jQuery Blog","url":"https://blog.jquery.com/2022/12/13/jquery-3-6-2-released/","tags":["jQuery","ReleaseNote"],"content":"jQuery 3.6.2リリース。\nCSS Variablesのバグ修正、`<template>`に対する`.contains()`の修正。\nCSSセレクタの`:has()`の仕様の問題でjQuery 1.3以降に影響があったが、仕様とChromeが修正された。","relatedLinks":[]},{"category":"Headline","title":"Vite 4.0 is out! | Vite","url":"https://vitejs.dev/blog/announcing-vite4.html","tags":["vite","ReleaseNote"],"content":"Vite 4.0リリース。\nSWCをサポートする`@vitejs/plugin-react-swc`を追加、ES2020で出力するように変更、CSSを文字列としてインポートする方法の変更など","relatedLinks":[]},{"category":"Headline","title":"Announcing SvelteKit 1.0","url":"https://svelte.dev/blog/announcing-sveltekit-1.0","tags":["Svelte","ReleaseNote"],"content":"SvelteKit 1.0リリース。","relatedLinks":[{"title":"Migration guide · Discussion #5774 · sveltejs/kit","url":"https://github.com/sveltejs/kit/discussions/5774"}]},{"category":"Headline","title":"Storybook 7.0 beta","url":"https://storybook.js.org/blog/7-0-beta/","tags":["JavaScript","debug","Tools","ReleaseNote"],"content":"Storybook 7.0 betaリリース。\nwebpack4、IE11、Node.js 14のサポート終了、`storiesOf` APIをデフォルトで無効化など。\nCSF3のデフォルト化、Viteのサポート、Test runnerとCode Coverageのサポートなど","relatedLinks":[{"title":"Storybook 7 migration guide","url":"https://chromatic-ui.notion.site/Storybook-7-migration-guide-dbf41fa347304eb2a5e9c69b34503937"}]},{"category":"Headline","title":"Release v1.29.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.29.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.29.0リリース。\n`route.fetch()`の追加、`locator.all()`の追加、`expect().toPass`の追加。\nテスト失敗時にページ全体のスクリーンショットを撮る`fullPage`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Node v19.3.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v19.3.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v19.3.0リリース。\nNode.jsでのnpmのアップデートにおける\"Major Update\"を定義し、npm 9.2.0にアップデート。","relatedLinks":[{"title":"Integrating with node · npm/cli Wiki","url":"https://github.com/npm/cli/wiki/Integrating-with-node"}]},{"category":"Headline","title":"Release v0.16.10 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.16.10","tags":["JavaScript","Tools","ReleaseNote"],"content":"esbuild v0.16.10リリース。\n`--legal-comments`のデフォルト値を元に戻し、ライセンスとそのライセンスコメントの起源となるファイル名をコメントに含めるように変更。","relatedLinks":[]},{"category":"Article","title":"Find the most expensive CSS selectors","url":"https://devtoolstips.org/tips/en/find-expensive-selectors/","tags":["CSS","performance","article"],"content":"MSEdgeのDevToolsで、CSSセレクタの処理時間やマッチ回数を見る方法について","relatedLinks":[]},{"category":"Article","title":"Help choose the syntax for CSS Nesting | WebKit","url":"https://webkit.org/blog/13607/help-choose-from-options-for-css-nesting-syntax/","tags":["CSS","アンケート","article"],"content":"CSSのネスト構文のProposalでどの構文がわかりやすいかというアンケートが実施されている","relatedLinks":[]},{"category":"Article","title":"Web Performance Calendar » Web Performance APIs Appreciation Post","url":"https://calendar.perfplanet.com/2022/web-performance-apis-appreciation-post/","tags":["JavaScript","browser","performance","article"],"content":"新しめのウェブパフォーマンスAPIについての紹介記事。\nRender blocking status、Offscreen Canvas、OfflineAudioContext。\nAsync Image Decoding、`Image.decode()`、`loading=lazy`、`fetchpriority`、103 Early Hintsなどについて","relatedLinks":[]},{"category":"Article","title":"Prisma Client Just Became a Lot More Flexible","url":"https://www.prisma.io/blog/client-extensions-preview-8t3w27xkrxxn","tags":["TypeScript","database","library","article"],"content":"PrismaにPrisma Client extensionsという拡張の仕組みがプレビュー実装された。\n`PrismaClient`に対して、メソッドの追加、フィルター処理の追加、クエリに対する処理の追加などができる拡張の仕組み","relatedLinks":[]},{"category":"WebsiteDocument","title":"RUM Archive - Homepage","url":"https://rumarchive.com/","tags":["browser","performance","cdn","webservice"],"content":"Akamai mPulseの匿名化RUMデータセットのアーカイブを公開しているサイト。\n匿名化されたブラウザ情報やWeb Vitalsなどのウェブパフォーマンスに関するRUMデータをBigQueryに公開している。\n大規模なRUMデータセットをBigQueryで分析できる。","relatedLinks":[{"title":"Web Performance Calendar » An Introduction to the RUM Archive","url":"https://calendar.perfplanet.com/2022/an-introduction-to-the-rum-archive/"},{"title":"rum-archive/rum-archive: RUM Archive","url":"https://github.com/rum-archive/rum-archive"}]},{"category":"SoftwareLibrary","title":"bluwy/publint: Lint packaging errors","url":"https://github.com/bluwy/publint","tags":["node.js","Tools","npm"],"content":"npmパッケージのLintツール。\n`package.json`における`main`や`exports`フィールドがさまざまな環境で互換性のある書き方になっているかをチェックできるツール","relatedLinks":[]}]},{"meta":{"title":"2022-12-28のJS: Next.js 13.1、HTTP/3 Prioritizationの仕組み、Deno 1.29、Bun 0.4","author":"azu","layout":"post","date":"2022-12-28T05:31:43.481Z","category":"JSer","tags":["React","book","security","browser","cdn"],"url":"https://jser.info/2022/12/28/next.js-13.1-http3-prioritization-deno-1.29-bun-0.4/"},"items":[{"category":"Headline","title":"Deno 1.29: Custom npm registry support","url":"https://deno.com/blog/v1.29","tags":["deno","ReleaseNote"],"content":"Deno v1.29リリース。\n`NPM_CONFIG_REGISTRY`でnpmレジストリを指定できるように、`deno install`コマンドを追加、REPLでの`npm:`サポート。\n`deno check --remote`を`--all`に変更、`--inspect-wait`フラグの追加、TypeScript 4.9のサポート。\nStdに`testing/types`モジュールの追加など","relatedLinks":[]},{"category":"Headline","title":"Bun v0.4","url":"https://bun.sh/blog/bun-v0.4.0","tags":["Bun","ReleaseNote"],"content":"Bun 0.4リリース。\n`bunx`コマンドを追加、`#!/usr/bin/env node`をbunで実行する`--bun`フラグを追加、Node.jsとの互換性の向上など。","relatedLinks":[]},{"category":"Headline","title":"Release v7.20.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v7.20.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v7.20.0リリース。\n`pnpm config <get|set|delete|list>`コマンドの追加など","relatedLinks":[]},{"category":"Headline","title":"Release 3.27.0 - 2022.12.26 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.27.0","tags":["JavaScript","polyfill","library","ReleaseNote"],"content":"core-js v3.27.0リリース。\nStage 3のIterator Helpers/Set methods /Well-Formed Unicode Strings/Explicit resource managementの実装。\nStage 2のString.dedentの実装など","relatedLinks":[]},{"category":"Headline","title":"Twemojiが2023年になると表示されなくなる(かもしれない)問題に対処する","url":"https://zenn.dev/yhatt/articles/60ce0c3ca79994","tags":["cdn","news","twitter"],"content":"MaxCDNが2022年で廃止となるため、twemojiなどMaxCDNをデフォルトで利用するライブラリが動かなくなるという話","relatedLinks":[{"title":"Clarify MaxCDN URLs now that MaxCDN is retiring · Issue #556 · twitter/twemoji","url":"https://github.com/twitter/twemoji/issues/556"}]},{"category":"Headline","title":"Blog - Next.js 13.1 | Next.js","url":"https://nextjs.org/blog/next-13-1","tags":["Next.js","relre"],"content":"Next.js 13.1リリース。\n`app`ディレクトリの改善、外部ライブラリの`next-transpile-modules`を本体に統合、試験的に`modularizeImports`オプションの追加、Turbopackの改善など","relatedLinks":[{"title":"martpie/next-transpile-modules: ","url":"https://github.com/martpie/next-transpile-modules"}]},{"category":"Headline","title":"Release v100 · ije/esm.sh","url":"https://github.com/ije/esm.sh/releases/tag/v100","tags":["ECMAScript","cdn","library","ReleaseNote"],"content":"ESMとしてnpmパッケージを扱えるPackage CDNのesm.sh v100リリース。\nWebサイトのアップデート、playgroundの追加。","relatedLinks":[]},{"category":"Article","title":"TypeScript 4.9のas const satisfiesが便利。型チェックとwidening防止を同時に行う","url":"https://zenn.dev/moneyforward/articles/typescript-as-const-satisfies","tags":["TypeScript","article"],"content":"wideningを避ける`as const`と型推論の結果を保つ`satisfiers`演算子を組み合わせた、`as const satisfies`について","relatedLinks":[]},{"category":"Article","title":"Web Performance Calendar » HTTP/3 Prioritization Demystified","url":"https://calendar.perfplanet.com/2022/http-3-prioritization-demystified/","tags":["HTTP2","browser","article","performance"],"content":"各ブラウザのHTTP/3のPriorityの実装について調べた記事。\nブラウザとリソースの組み合わせでの優先度の違い、`priority`ヘッダと`PRIORITY_UPDATE`フレームの実装の違い。\n`fetchpriority`属性でブラウザ間の違いを減らせる点について","relatedLinks":[]},{"category":"Article","title":"Migrating a large, open-source React application to Next.js and Vercel – Vercel","url":"https://vercel.com/blog/migrating-a-large-open-source-react-application-to-next-js-and-vercel","tags":["React","Next.js","article"],"content":"BBCのオープンソースとして公開されているフロントエンドを例にして、ReactアプリケーションをNext.jsベースに書き換える方法についての記事","relatedLinks":[{"title":"bbc/simorgh: The BBC","url":"https://github.com/bbc/simorgh"}]},{"category":"WebsiteDocument","title":"ericclemmons/click-to-component: Option+Click React components in your browser to instantly open the source in VS Code","url":"https://github.com/ericclemmons/click-to-component","tags":["React","debug","library"],"content":"クリックしたら該当するReactコンポーネントのファイルを開くデバッグ用ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"PuruVJ/neodrag: One Draggable to rule them all 💍","url":"https://github.com/PuruVJ/neodrag","tags":["JavaScript","Svelte","React","Vue","library"],"content":"Svelte向けのD&Dライブラリ。\nReact/Vue/Solid/Vanilla向けのBindingも用意されている","relatedLinks":[]},{"category":"Book","title":"JavaScript for hackers by Gareth Heyes \\[Leanpub PDF/iPad/Kindle\\]","url":"https://leanpub.com/javascriptforhackers/","tags":["JavaScript","security","book"],"content":"ブラウザやJavaScriptの欠陥を見つけるハッカー向けのJavaScript本","relatedLinks":[]},{"category":"Book","title":"フロントエンド開発のためのセキュリティ入門 知らなかったでは済まされない脆弱性対策の必須知識（平野 昌士 はせがわ ようすけ 後藤 つぐみ）｜翔泳社の本","url":"https://www.shoeisha.co.jp/book/detail/9784798169477","tags":["security","browser","JavaScript","book"],"content":"2023年02月13日 発売予定\nフロントエンドエンジニア向けのウェブセキュリティについての書籍","relatedLinks":[]},{"category":"Book","title":"1冊ですべて身につくJavaScript入門講座 (１冊ですべて身につく) | Mana |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4815615756/","tags":["JavaScript","animation","book"],"content":"2023年3月1日 発売。\nウェブデザイナー向けのJavaScriptについての書籍","relatedLinks":[]}]},{"meta":{"title":"2023-01-06のJS:  Vue 2のEOLは2023年末、NextAuthはAuth.jsに、React NativeのFirst-class Support for TypeScript","author":"azu","layout":"post","date":"2023-01-06T03:37:03.041Z","category":"JSer","tags":["node.js","React","Tools","browser","book"],"url":"https://jser.info/2023/01/06/vue-2eol2023-nextauthauth.js-react-nativefirst-class-support-for-typescript/"},"items":[{"category":"Headline","title":"Prototype Pollution in JSON5 via Parse Method · CVE-2022-46175 · GitHub Advisory Database","url":"https://github.com/advisories/GHSA-9c47-m6qq-7p4h","tags":["JSON","JavaScript","library","security","ReleaseNote"],"content":"JSON5にprototype pollutionの脆弱性があり、2.2.2と1.0.2で修正された。","relatedLinks":[{"title":"Release v2.2.2 · json5/json5","url":"https://github.com/json5/json5/releases/tag/v2.2.2"},{"title":"Release v1.0.2 · json5/json5","url":"https://github.com/json5/json5/releases/tag/v1.0.2"}]},{"category":"Headline","title":"Tamagui 1.0 🎉 — Tamagui","url":"https://tamagui.dev/blog/version-one","tags":["React","library","ReleaseNote"],"content":"React向けのUIフレームワークであるTamagui 1.0リリース。\nReact NativeとWebどちらも対応し、スタイリングライブラリも含む。1.0ではNativeとWebの互換性の向上やバンドルサイズの改善などが行われている。","relatedLinks":[]},{"category":"Headline","title":"Vue.js","url":"https://v2.vuejs.org/lts/","tags":["Vue","document"],"content":"Vue 2のサポート終了は2023年12月31日。\nサポート終了後はセキュリティ修正を提供しない、拡張LTSはAngularJSと同じく外部企業に依頼する形となる予定","relatedLinks":[{"title":"2022 Year In Review | The Vue Point","url":"https://blog.vuejs.org/posts/2022-year-in-review.html"}]},{"category":"Headline","title":"Release v0.16.13 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.16.13","tags":["JavaScript","Tools","ReleaseNote"],"content":"esbuild v0.16.13リリース。\n`--metafile`でbundle時のメタデータを出力し、メタデータを可視化できるビューアサイトの実装など","relatedLinks":[]},{"category":"Headline","title":"First-class Support for TypeScript · React Native","url":"https://reactnative.dev/blog/2023/01/03/typescript-first","tags":["React","Native","ReleaseNote"],"content":"React Native 0.71でTypeScriptの型定義が同梱され、新しいテンプレートもデフォルトでTypeScriptを利用するようになった","relatedLinks":[]},{"category":"Headline","title":"Node v18.13.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v18.13.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v18.13.0リリース。\n`File` APIの実装、`node:test`モジュールに`mock` APIの追加、v8 snapshot compressionを無効化して起動速度の向上など","relatedLinks":[]},{"category":"Headline","title":"Release v6.4.0 · lerna/lerna","url":"https://github.com/lerna/lerna/releases/tag/v6.4.0","tags":["JavaScript","monorepo","ReleaseNote"],"content":"lerna v6.4.0リリース。\n`lerna watch`コマンドの追加など","relatedLinks":[]},{"category":"Headline","title":"Auth.js","url":"https://authjs.dev/","tags":["JavaScript","WebAuthentication","OAuth","library"],"content":"NextAuthはAuth.jsとなり、Next.js以外にもSvelteKitやSolidStartなどをサポートするようになった。","relatedLinks":[]},{"category":"Headline","title":"Gluon","url":"https://gluonjs.org/","tags":["browser","node.js","deno","Tools","library"],"content":"ChromeとFirefoxをWebViewの代わりにデスクトップアプリを作るフレームワーク。\nデスクトップブラウザの起動オプションで単独のアプリらしく起動させる。\nバックエンドにはNode.jsとDenoが利用でき、アプリと連携できるAPIが用意されている。","relatedLinks":[]},{"category":"Article","title":"そろそろカスケードレイヤー(@layer)と向き合う","url":"https://zenn.dev/yend724/articles/20221227-fcz1jh70bhnqof2v","tags":["CSS","article"],"content":"CSSの@layerについての解説記事","relatedLinks":[]},{"category":"Article","title":"Interop 2022: end of year update","url":"https://web.dev/interop-2022-wrapup/","tags":["browser","article"],"content":"ウェブブラウザの相互運用性の取り組みであるInterop 2022の結果のまとめ","relatedLinks":[]},{"category":"Article","title":"Miško HeveryのQwik記事シリーズ | POSTD","url":"https://postd.cc/series-qwik/","tags":["JavaScript","article"],"content":"Qwikシリーズの翻訳記事","relatedLinks":[]},{"category":"Book","title":"実践Node.js入門 | 伊藤 康太 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4297129566/","tags":["node.js","book"],"content":"2023年1月26日 発売。\nNode.jsでのCLIやアプリケーション開発についての書籍","relatedLinks":[]}]},{"meta":{"title":"2023-01-13のJS: Remix 1.10.0、React Native 0.71、State of JS 2022","author":"azu","layout":"post","date":"2023-01-13T02:36:21.010Z","category":"JSer","tags":["node.js","accessibility","webkit","issue","CSS"],"url":"https://jser.info/2023/01/13/remix-1.10.0-react-native-0.71-state-of-js-2022/"},"items":[{"category":"Headline","title":"Node v19.4.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v19.4.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v19.4.0リリース。\n`buffer.isUtf8`の追加、どれぐらいの並列数を扱えるかを返す`os.availableParallelism`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v1.10.0 · remix-run/remix","url":"https://github.com/remix-run/remix/releases/tag/remix%401.10.0","tags":["Remix","ReleaseNote"],"content":"Remix 1.10.0リリース。\n`@remix-run/router`というReact Routerとの共通基盤となるパッケージを使い再構築されている。\n`shouldRevalidate`関数のサポート、`useNavigation`/`useRevalidator`/`useRouteLoaderData` Hook APIの追加など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 161 | WebKit","url":"https://webkit.org/blog/13686/release-notes-for-safari-technology-preview-161/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 161リリース。\n実験的にAudioSession Web API、WebCodecs AV1 のサポート。\nFullscreen APIに`-webkit-` prefixがつかなくなるように変更など","relatedLinks":[]},{"category":"Headline","title":"Release v3.10.0 · rollup/rollup","url":"https://github.com/rollup/rollup/releases/tag/v3.10.0","tags":["rollup","ReleaseNote","library"],"content":"Rollup v3.10.0リリース。\noptional chainingに対するTree Shakingのサポートなど","relatedLinks":[]},{"category":"Headline","title":"React Native 0.71: TypeScript by Default, Flexbox Gap, and more... · React Native","url":"https://reactnative.dev/blog/2023/01/12/version-071","tags":["React","Native","TypeScript","ReleaseNote"],"content":"React Native 0.71リリース。\nTypeScriptがデフォルトでサポートされ、`@types/react-native`は不要となった。\nFlexboxの`gap`プロパティのサポート、`aria-*` propsのサポート、PointerEventsをopt-inでサポートなど。\n`propTypes`のサポートを一時的に復活、Hermesの改善など","relatedLinks":[{"title":"Road to 0.71.0 · Discussion #41 · reactwg/react-native-releases","url":"https://github.com/reactwg/react-native-releases/discussions/41#discussioncomment-4089256"}]},{"category":"Article","title":"The Safari bug that never was","url":"https://obyford.com/posts/the-safari-bug-that-never-was/","tags":["webkit","issue","article"],"content":"Safari Technology Previewで発見したバグをWebKitに報告し修正されるまでの話","relatedLinks":[]},{"category":"Article","title":"次世代 CSS 仕様が与えるコンポーネント時代の Web への影響 | blog.jxck.io","url":"https://blog.jxck.io/entries/2023-01-07/new-css-capabilities-for-component.html","tags":["CSS","article"],"content":"最近実装されているCSSの新しい仕様について。\n`@scope`, `@layer`, Nesting, `:is()`, `:where()`, `:has()`, `@container`などについて","relatedLinks":[]},{"category":"Article","title":"The State of JS 2022","url":"https://2022.stateofjs.com/en-US/","tags":["JavaScript","Survey"],"content":"JavaScript開発者アンケートのThe State of JS 2022の結果が公開された。\n回答者の属性ごとに、言語機能、ライブラリ、ツール、JSとTSの利用率、リソース、学習方法などについての解答結果が見られる。","relatedLinks":[]},{"category":"Article","title":"NPM Kiosk - A new way to sell NPM packages","url":"https://npm-kiosk.remotion.dev/","tags":["npm","article"],"content":"npmパッケージを販売するために、パッケージをインストールできるアクセストークン付きのパッケージを作成する方法について","relatedLinks":[]},{"category":"Article","title":"All of Learn Accessibility! is available","url":"https://web.dev/learn-accessibility-available/","tags":["accessibility","article"],"content":"アクセシビリティについて学べるLearn Accessibilityのコースが完成した","relatedLinks":[{"title":"Learn Accessibility","url":"https://web.dev/learn/accessibility/"}]},{"category":"Article","title":"A new accessibility strategy for the GOV.UK Design System - Accessibility in government","url":"https://accessibility.blog.gov.uk/2023/01/06/a-new-accessibility-strategy-for-the-gov-uk-design-system/","tags":["accessibility","article"],"content":"WCAG 2.2を満たすためのアクセシビティ改善とアクセシビリティの原則について。\nウェブアクセシビリティの4つの原則、ユニバーサルデザインの7つの原則、progressive enhancementについて","relatedLinks":[{"title":"Introduction to Understanding WCAG | WAI | W3C","url":"https://www.w3.org/WAI/WCAG21/Understanding/intro#understanding-the-four-principles-of-accessibility"},{"title":"The 7 Principles | Centre for Excellence in Universal Design","url":"https://universaldesign.ie/What-is-Universal-Design/The-7-Principles/"},{"title":"Building a resilient frontend using progressive enhancement - Service Manual - GOV.UK","url":"https://www.gov.uk/service-manual/technology/using-progressive-enhancement"}]},{"category":"Article","title":"Node.js にプロセスレベルの Permission が入りそうな話 - from scratch","url":"https://yosuke-furukawa.hatenablog.com/entry/2023/01/12/160406","tags":["node.js","security","article"],"content":"Node.jsで実装が進められているPermission Modelの実装について","relatedLinks":[{"title":"src,process: initial permission model implementation by RafaelGSS · Pull Request #44004 · nodejs/node","url":"https://github.com/nodejs/node/pull/44004"},{"title":"Permission Model · Issue #791 · nodejs/security-wg","url":"https://github.com/nodejs/security-wg/issues/791"}]},{"category":"WebsiteDocument","title":"2022 JavaScript Rising Stars","url":"https://risingstars.js.org/2022/en","tags":["JavaScript","library"],"content":"JavaScript Rising Starsの2022年の結果が公開された。\nフロントエンドフレームワーク、React、Vue、バックエンド、ビルドツール、モバイル、CSS、テスト、デスクトップ、静的サイトジェネレータのStar数をもとにしたランキング。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Dunks1980/bay.js: An easy to use, lightweight library for web-components.","url":"https://github.com/Dunks1980/bay.js","tags":["JavaScript","template","WebComponents","library"],"content":"`<template>`からWebComponentを作成して扱えるライブラリ","relatedLinks":[]},{"category":"Book","title":"実践Node.js入門 ―基礎・開発・運用：書籍案内｜技術評論社","url":"https://gihyo.jp/book/2023/978-4-297-12956-9","tags":["node.js","book","JavaScript"],"content":"2023年1月17日発売。\nNode.jsの入門書","relatedLinks":[]}]},{"meta":{"title":"JSer.info 12周年です","author":"azu","layout":"post","date":"2023-01-16T08:21:00.000Z","category":"Article","tags":["JSer"],"url":"https://jser.info/2023/01/16/jser-12th/"},"items":[]},{"meta":{"title":"2023-01-18のJS: Flow v0.197.0(Local Type Inference)、Fetch APIのエラーハンドリング","author":"azu","layout":"post","date":"2023-01-18T04:18:30.991Z","category":"JSer","tags":["TypeScript","Tools","node.js","ECMAScript","book"],"url":"https://jser.info/2023/01/18/flow-v0.197.0local-type-inference-fetch-api/"},"items":[{"category":"Headline","title":"rimraf/CHANGELOG.md at main · isaacs/rimraf","url":"https://github.com/isaacs/rimraf/blob/main/CHANGELOG.md#v40","tags":["node.js","library","ReleaseNote"],"content":"rimraf 4.0リリース。\nglobサポートを削除、Promiseを返すように変更、Node 14未満のサポート終了、TypeScriptでの書き直し。\nまたCJSとESMの両方に対応し、Windowsでのパフォーマンスの改善など","relatedLinks":[]},{"category":"Headline","title":"Release v0.17.0 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.17.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"esbuild v0.17.0リリース。\nincremental buildに関する処理を`context` APIに移動。\n`watch`と`serve`を同時に利用できるように、またServer Send Eventを使ったLive Reloadに対応、開発サーバがHTTPSに対応など","relatedLinks":[]},{"category":"Headline","title":"Release v0.197.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.197.0","tags":["flowtype","ReleaseNote"],"content":"Flow v0.197.0リリース。\nLocal Type Inferenceをopt-inで利用できるように。","relatedLinks":[{"title":"Introducing: Local Type Inference for Flow | by Michael Matson Vitousek | Flow | Medium","url":"https://medium.com/flow-type/introducing-local-type-inference-for-flow-6af65b7830aa"}]},{"category":"Headline","title":"moon v0.22 - New pipeline, hashing, and caching, with Turborepo migration | moon","url":"https://moonrepo.dev/blog/v0.22","tags":["monorepo","Tools","ReleaseNote"],"content":"monorepo管理ツールのmoon 0.22リリース。\nパイプラインの並列性を制御できるように、プロジェクトグラフのキャッシュと依存のインストールミスが減るように。\nTurborepoからのマイグレーションコマンドを追加、Bunのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Firefox 109.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/109.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 109リリース。\n拡張機能がManifest V3に対応、`scrolled`イベントのサポートなど","relatedLinks":[{"title":"Firefox 109 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/109"}]},{"category":"Article","title":"Safe Data Fetching in Modern JavaScript","url":"https://www.builder.io/blog/safe-data-fetching","tags":["JavaScript","Fetch","article"],"content":"Fetch APIについての記事。\nFetch APIのエラーハンドリング、Axiosライクなエラーハンドリング、JSONをPOSTするときのハマりどころ、Fetchのラッパーについて","relatedLinks":[]},{"category":"Article","title":"\\`\\*.d.ts\\` ファイルをコミットする前に知ってほしい4つのこと","url":"https://zenn.dev/qnighy/articles/9a6a0041f2a1aa","tags":["TypeScript","article"],"content":"TypeScriptの`.d.ts`をソースコードとして含める必要がないケースについて。\nまた、含める場合にtsconfigの`typeRoot`や`types`は使わずに、コードからimportする方法や`includes`を使う方法について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"giusepperaso/structura.js: A very fast and lightweight Typescript library to create immutable states with a mutable syntax","url":"https://github.com/GiuseppeRaso/structura.js","tags":["JavaScript","library"],"content":"ImmerライクなImmutable処理のAPIを提供するライブラリ。\nFreezeをTypeScriptの型で表現することによって、オーバヘッドを減らしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"LyraSearch/lyra: 🌌 Fast, in-memory, typo-tolerant, full-text search engine written in TypeScript.","url":"https://github.com/LyraSearch/lyra","tags":["TypeScript","search ","library"],"content":"TypeScriptで書かれた全文検索エンジン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"azu/eslint-cjs-to-esm: ESLint wrapper for migration from CJS to ESM.","url":"https://github.com/azu/eslint-cjs-to-esm","tags":["node.js","JavaScript","ECMAScript","CommonJS","Tools","ESLint"],"content":"CommonJSからESMへのマイグレーションを補助するツール。\nESLintをラップしていて、CJS to ESMを扱うルールをビルトインしている。\nimportしてるパスへの`.js`の追加や`require`/`exports`などのCJSでしか使えない機能の禁止など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tsmodule/tsmodule: TypeScript to ES Module loader and compiler.","url":"https://github.com/tsmodule/tsmodule","tags":["TypeScript","ECMAScript","Tools"],"content":"TypeScriptでESMなパッケージを開発するツールキット","relatedLinks":[]},{"category":"SoftwareLibrary","title":"shuding/react-wrap-balancer: Simple React Component That Makes Titles More Readable","url":"https://github.com/shuding/react-wrap-balancer","tags":["JavaScript","React","CSS","library","english"],"content":"タイトル文字列の折り返しを読みやすくするためのReactコンポーネント","relatedLinks":[{"title":"Improving readability with React Wrap Balancer – Vercel","url":"https://vercel.com/blog/react-wrap-balancer#innovation-in-text-wrapping"}]},{"category":"SoftwareLibrary","title":"azu/tsconfig-to-dual-package: Node.js dual package tool that add package.json to tsconfig&#039;s \\`outDir\\`","url":"https://github.com/azu/tsconfig-to-dual-package","tags":["TypeScript","library","node.js"],"content":"TypeScriptでCJSとESMのDual packageを作成するためのツール。\n`tsc`のビルド結果があるディレクトリに対して、CJSとESMに対応した`package.json`を追加することでDual packageを作成する","relatedLinks":[]},{"category":"Book","title":"改訂3版JavaScript本格入門　～モダンスタイルによる基礎から現場での応用まで：書籍案内｜技術評論社","url":"https://gihyo.jp/book/2023/978-4-297-13288-0","tags":["JavaScript","book"],"content":"2023年2月13日発売\nJavaScriptの入門書","relatedLinks":[]}]},{"meta":{"title":"2023-01-24のJS: Bun v0.5、Remix v1.11.0、メモリリークの調査","author":"azu","layout":"post","date":"2023-01-24T13:23:07.417Z","category":"JSer","tags":["performance","node.js","Bun","rlee","Next.js"],"url":"https://jser.info/2023/01/24/bun-v0.5-remix-v1.11.0-/"},"items":[{"category":"Headline","title":"Bun v0.5 | Bun Blog","url":"https://bun.sh/blog/bun-v0.5.0","tags":["Bun","rlee"],"content":"Bun 0.5.0リリース。\n`workspaces`のインストールをサポート。\nNode.jsとの互換性として`node:dns`、`node:tls`、`node:net`、`node:readline`のサポート。\nモジュール解決時の識別子の優先度を変更など","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0-alpha.1 · reduxjs/redux-toolkit","url":"https://github.com/reduxjs/redux-toolkit/releases/tag/v2.0.0-alpha.1","tags":["library","redux","ReleaseNote"],"content":"Redux Toolkit v2.0.0-alpha.1リリース。\nESM形式とCJS形式のDual Packageへの変更、`thunk`関数を`redux-thunk`パッケージへ移動。\nv2正式版にはImmer 10を含める予定など","relatedLinks":[{"title":"Immer 10 proposals: Drop promises, default export, array.length patches, ES5 mode, and make getter / setter support opt-in · Issue #1015 · immerjs/immer","url":"https://github.com/immerjs/immer/issues/1015"}]},{"category":"Headline","title":"Q1 Roadmap · Issue #17475 · denoland/deno","url":"https://github.com/denoland/deno/issues/17475","tags":["deno","issue","proposal"],"content":"Denoの2023 Q1のロードマップ。\n`deno.json`に直接import mapを埋め込めるように、`type=module`の`package.json`をサポート、`node:` prefixのサポート。\ndeno.land/x での semver指定のサポート、`deno bundle`をDeprecateにし、`deno pack`の追加など","relatedLinks":[]},{"category":"Headline","title":"Safari 16.3 Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safari-release-notes/safari-16_3-release-notes","tags":["safari","ReleaseNote"],"content":"Safari 16.3リリース。\n`fetch()`で`Content-Encoding: gzip`のコンテンツをダウンロードしたとき問題を修正、`Cross-Origin-Embedder-Policy`のバグを修正。\nCSPに`prefetch-src`ディレクティブの追加など","relatedLinks":[{"title":"WebKit Features in Safari 16.3 | WebKit","url":"https://webkit.org/blog/13691/webkit-features-in-safari-16-3/"}]},{"category":"Headline","title":"Release v29.4.0 · facebook/jest","url":"https://github.com/facebook/jest/releases/tag/v29.4.0","tags":["JavaScript","jest","ReleaseNote"],"content":"Jest v29.4.0リリース。\n`equal`のアルゴリズムをカスタマイズできる`expect.addEqualityTesters()`の追加、オブジェクトのプロパティをモックする`jest.replaceProperty()`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v1.11.0 · remix-run/remix","url":"https://github.com/remix-run/remix/releases/tag/remix%401.11.0","tags":["Remix","ReleaseNote"],"content":"Remix 1.11.0リリース。\n`defer`を使ってレスポンス待ちを減らせるように、`@remix-run/css-bundle`でのCSSファイルのロード、CSS Modules、Vanilla Extractのサポート。\nFlat Routesをopt-inで利用できるように","relatedLinks":[{"title":"Flat Routes · Discussion #4482 · remix-run/remix","url":"https://github.com/remix-run/remix/discussions/4482"}]},{"category":"Article","title":"Next.js製アプリケーションのコンパイルを約100倍高速化した話","url":"https://zenn.dev/mkt/articles/543669021d9a1e","tags":["Next.js","article","performance"],"content":"Next.jsのビルド速度の問題を`.next/trace`のトレースデータを見て分析する方法について","relatedLinks":[{"title":"NextJs compiling extremely slow · Issue #29559 · vercel/next.js","url":"https://github.com/vercel/next.js/issues/29559#issuecomment-938431883"}]},{"category":"Article","title":"Why Not document.write()? – CSS Wizardry – Web Performance Optimisation","url":"https://csswizardry.com/2023/01/why-not-document-write/","tags":["JavaScript","article","performance"],"content":"`document.write()`がなぜ遅いかについて。","relatedLinks":[]},{"category":"Article","title":"Why Is My Jest Test Suite So Slow? | by Steven Lemon | Jan, 2023 | Bits and Pieces","url":"https://blog.bitsrc.io/why-is-my-jest-suite-so-slow-2a4859bb9ac0","tags":["JavaScript","testing","article","performance"],"content":"Jestのテストのパフォーマンスのボトルネックの調べ方について。\n起動時間、`jsdom`のロード、キャッシュ、テストファイルのロード、実際のテストの実行時間について。\nNode.jsのプロファイラーを使ってどこに問題があるかを調べる方法について","relatedLinks":[]},{"category":"Article","title":"Fixing a Memory Leak in a Production Node.js App","url":"https://kentcdodds.com/blog/fixing-a-memory-leak-in-a-production-node-js-app","tags":["node.js","JavaScript","debug","article","video"],"content":"Node.jsのアプリケーションでメモリリークが発生し、実際にどのようにデバッグして問題を見つけていったかという記事。\n動画では`shiki`が使う`vscode-oniguruma`のメモリ解放処理を呼んでいないことが原因だと判断し、Workerで処理するように変更した。\nしかし、実際には`express-http-proxy`がリクエストURLを保持していて、Image CDNのURLが長いためメモリを圧迫していた。","relatedLinks":[]},{"category":"Article","title":"SSSVG: An Interactive SVG Reference | fffuel","url":"https://fffuel.co/sssvg/","tags":["SVG","tutorial"],"content":"実際に触りながらSVGのタグを見れるリファレンスサイト","relatedLinks":[]},{"category":"Article","title":"Optimize Time to First Byte","url":"https://web.dev/optimize-ttfb/","tags":["performance","browser","article"],"content":"Time to First Byte (TTFB)の改善について。\n`Serving-Timing`ヘッダを使い詳細化、CDNの利用、ページのリダイレクトを避ける、SSR時にStreaming Server Renderingを行う。\nService Workerを使ったキャッシュ戦略、103 Early Hintsについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"amandaghassaei/gpu-io: A GPU-accelerated computing library for physics simulations and other mathematical calculations","url":"https://github.com/amandaghassaei/gpu-io","tags":["WebGL","JavaScript","library"],"content":"WebGLを使ったGPU処理を扱うライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Brooooooklyn/canvas: High performance skia binding to Node.js. Zero system dependencies and pure npm packages without any postinstall scripts nor node-gyp.","url":"https://github.com/Brooooooklyn/canvas","tags":["node.js","canvas","library"],"content":"native addonsを使ったskia backendのCanvas APIの実装ライブラリ。\nアーキテクチャに合わせたoptionalDependenciesでprebuildのSkiaを含めたバイナリがダウンロードされるため、システムに対して事前に依存をインストールを追加する必要がない","relatedLinks":[]}]},{"meta":{"title":"2023-01-31のJS: Astro 2.0、Deno 1.30、TypeScript 5.0 Beta","author":"azu","layout":"post","date":"2023-01-31T04:47:09.661Z","category":"JSer","tags":["React","TypeScript","deno","template","aws"],"url":"https://jser.info/2023/01/31/astro-2.0-deno-1.30-typescript-5.0-beta/"},"items":[{"category":"Headline","title":"Astro 2.0 | Astro","url":"https://astro.build/blog/astro-2/","tags":["JavaScript","library","ReleaseNote"],"content":"Astro 2.0リリース。\nContent Collections APIの追加、SSGとSSRを組み合わせられるように、エラー表示の改善、HMRの改善、Vite 4.0へのアップデートなど","relatedLinks":[]},{"category":"Headline","title":"Deno 1.30: Built-in Node modules","url":"https://deno.com/blog/v1.30","tags":["deno","ReleaseNote"],"content":"Deno v1.30リリース。\n`node:` prefixのサポート、`deno.json`にImport Mapsを定義できるように、`Deno.env.has(name)`の追加。\n`deno fmt`にセミコロンの設定を追加など","relatedLinks":[]},{"category":"Headline","title":"The very first beta release of Eleventy v2.0 — Eleventy","url":"https://www.11ty.dev/blog/eleventy-v2-beta/","tags":["JavaScript","template","ReleaseNote"],"content":"Eleventy 2.0 Betaリリース。\n破壊的な変更として、Node.js 14未満のサポート終了、MarkdownでIndent Code Blockをデフォルトで無効化、非推奨のオプションを削除など。\nパッケージサイズの削減、ビルド時間の改善、`--incremental`の追加。\nまた`.webc`のWebComponentをサポートするプラグインの追加など。","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0 · mswjs/msw","url":"https://github.com/mswjs/msw/releases/tag/v1.0.0","tags":["ServiceWorker","library","ReleaseNote"],"content":"MSW 1.0リリース","relatedLinks":[]},{"category":"Headline","title":"Release v0.17.5 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.17.5","tags":["JavaScript","bundler","ReleaseNote"],"content":"esbuild v0.17.5リリース。\nTypeScript 5.0 betaの`const`parameterとenumのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.0 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-0-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.0 Betaリリース。\nECMAScript Stage 3のDecoratorを実装、`const` type perameterの追加、`tsconfig.json`で複数の`extends`に対応、enumとunion型の改善。\n`--moduleResolution bundler`の追加と関連するオプションの追加、`exports`フィールのConditionを指定できる`--customConditions`の追加。\n`import`時に`type`修飾子を削除しそれ以外を残す`--verbatimModuleSyntax`オプションの追加、JSDocで`@satisfies`をサポートなど。\nまた、TypeScriptのコードベースをnamespaceからmoudleに移行し、パフォーマンス/メモリ/パッケージサイズの改善。\n`--target ES3`や`--out`などのオプションを非推奨に変更し、`--forceConsistentCasingInFileNames`をデフォルトでtrueに変更するといった変更も含まれている","relatedLinks":[]},{"category":"Article","title":"A Cure for React useState Hell?","url":"https://www.builder.io/blog/use-reducer","tags":["React","article"],"content":"useStateの代わりにuseReducerを使いStateの処理をまとめるという話","relatedLinks":[]},{"category":"Article","title":"Performance of WebAssembly runtimes in 2023 | Frank DENIS random thoughts.","url":"https://00f.net/2023/01/04/webassembly-benchmark-2023/","tags":["WebAssembly","article","benchmark","performance"],"content":"WebAssembly runtimeのベンチマークの比較記事","relatedLinks":[]},{"category":"Article","title":"Scrollend, a new JavaScript event - Chrome Developers","url":"https://developer.chrome.com/blog/scrollend-a-new-javascript-event/","tags":["JavaScript","browser","article"],"content":"スクロールが完了したことを通知する`scrollend`イベントについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Replace Create React App recommendation with Vite by t3dotgg · Pull Request #5487 · reactjs/reactjs.org","url":"https://github.com/reactjs/reactjs.org/pull/5487#issuecomment-1409720741","tags":["React","proposal","issue"],"content":"Create React App(CRA)がメンテナンスされていないが、今後どうするかというIssue。\nCRAの存在理由、CRAのコマンドを維持して内部的に他のフレームワークのランチャーとして機能させるProposal。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"deca-org/deca-ui: DecaUI is production-ready themeable component library built with StitchesJS.","url":"https://github.com/deca-org/deca-ui","tags":["React","library"],"content":"ReactのUIコンポーネントフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cyclic-software/s3fs: Drop in replacement for the Node.js fs library backed by AWS S3","url":"https://github.com/cyclic-software/s3fs","tags":["aws","node.js","library"],"content":"AWS S3をバックエンドにした`fs`互換のAPIを持ったライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jakebailey/hereby: A simple Node.js task runner","url":"https://github.com/jakebailey/hereby","tags":["TypeScript","Tools"],"content":"TypeScriptのリポジトリで利用しているタスクランナー。\nESMで書いたタスクの定義ファイルを元にタスクを実行できる。gulpの代わりに利用されている。","relatedLinks":[]},{"category":"Book","title":"逆引き 型ファースト Zod","url":"https://zenn.dev/terrierscript/books/2023-01-typed-zod","tags":["TypeScript","book"],"content":"Zodの逆引きリファレンス","relatedLinks":[]}]},{"meta":{"title":"2023-02-08のJS: Node.js v18.14.0(npm 9.xへアップデート)、Interop 2023、 Learn Images","author":"azu","layout":"post","date":"2023-02-07T15:06:11.157Z","category":"JSer","tags":["node.js","testing","npm","tutorial","Image"],"url":"https://jser.info/2023/02/08/node.js-v18.14.0npm-9.x-interop-2023-learn-images/"},"items":[{"category":"Headline","title":"Release v2.0.0 · pmndrs/jotai","url":"https://github.com/pmndrs/jotai/releases/tag/v2.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"Jotai 2.0.0リリース。\n`createStore` APIをexpose。\n破壊的な変更として、`get()`が自動でPromiseをresolveしないように、`initialValues`を`store`で渡すように変更など","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2023-01 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2023/02/03/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2023年1月のTC39ミーティングでのProposalのステータス変更のまとめ。\nArrayにImmutableメソッドを追加するProposalがStage 4となりES2023に含まれる。\nNode.jsのAsyncStorage APIとよく似ているAsync Contextが提案された。","relatedLinks":[]},{"category":"Headline","title":"Node v18.14.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v18.14.0/","tags":["node.js","npm","ReleaseNote"],"content":"Node.js v18.14.0リリース。\nnpm 9.3.1を同梱するように変更。\nnpm 8から9は破壊的な変更を含むが、アップデートによるパッケージのテストに失敗がないこと、ロックファイルが自動で変更されないことなどを条件にNode.jsのminor updateで取り込まれる。","relatedLinks":[{"title":"Integrating with node · npm/cli Wiki","url":"https://github.com/npm/cli/wiki/Integrating-with-node"}]},{"category":"Headline","title":"Node v19.6.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v19.6.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v19.6.0リリース。\n`--experimental-loader`で読み込んだLoaderが、後ろで読み込むLoaderに対して適用されるように。\nnpm 9.4.0へアップデートし`--install-strategy=linked`をサポート","relatedLinks":[]},{"category":"Headline","title":"Release v9.4.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v9.4.0","tags":["npm","ReleaseNote"],"content":"npm v9.4.0リリース。\npnpmライクなインストール戦略である`--install-strategy=linked`をサポート。\nIsolated modeと言われていたRFCの実装。","relatedLinks":[{"title":"rfcs/0042-isolated-mode.md at main · npm/rfcs · GitHub","url":"https://github.com/npm/rfcs/blob/main/accepted/0042-isolated-mode.md"}]},{"category":"Article","title":"Learn Images","url":"https://web.dev/learn/images/","tags":["tutorial","Image","article"],"content":"`<img>`タグなどの画像についてのチュートリアル。\nレスポンシブ画像、画像とCLSなどのパフォーマンスメトリクス、画像フォーマットごとの特徴、画像と配信について","relatedLinks":[]},{"category":"Article","title":"What&#039;s New In DevTools (Chrome 110) - Chrome Developers","url":"https://developer.chrome.com/en/blog/new-in-devtools-110/","tags":["Chrome","debug","Tools"],"content":"Chrome 110の変更点について。\nロード時にPerformanceタブをクリアするように、User Flowの改善、Source表示をデフォルトで整形するように、VueやTSXなどのシンタックスハイライトに対応。\nAuto Completeの改善など","relatedLinks":[]},{"category":"Article","title":"ElementInternals and Form-Associated Custom Elements | WebKit","url":"https://www.webkit.org/blog/13711/elementinternals-and-form-associated-custom-elements/","tags":["WebComponents","article"],"content":"Custom Elementの`ElementInternals`について。\nCustom Elementで`aria-*`属性を固定してしまう問題を`#internals.aria*`での回避、Form Validationを扱える`#internals.setFormValue`など。","relatedLinks":[]},{"category":"Article","title":"On building the enterprise-grade Node.js applications | Code Flashbacks","url":"https://www.codeflashbacks.com/announcing-the-enterprise-node-js-service-template/","tags":["node.js","article"],"content":"Node.jsでのエンタープライズアプリケーションを作る際のテンプレートプロジェクトについて。\nFastify、DDD、E2Eテスト、グローバルのエラー処理、分散トレース向けの`x-request-id`の設定、テスト、Type Safeな設定管理、Prismaを使ったDB管理などを含む","relatedLinks":[{"title":"lokalise/node-service-template: Batteries-included starter template for Node.js backend services","url":"https://github.com/lokalise/node-service-template"}]},{"category":"WebsiteDocument","title":"web-platform-tests dashboard","url":"https://wpt.fyi/interop-2023","tags":["browser","testing","web "],"content":"ブラウザ互換性に関して重点的に取り組む分野を決めたInterop 2023が開始された。\nCSSではContainer Queries、CSS Grid、`:has()`など。\nJSでは、Module、Offscreen Canvas、Pointer Eventsなど。\nそのほかにはURLやWebCodecsなどが重点分野として選ばれている。","relatedLinks":[{"title":"Interop 2023: continuing to improve the web for developers","url":"https://web.dev/interop-2023/"},{"title":"Announcing Interop 2023 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2023/02/announcing-interop-2023/"},{"title":"Pushing Interop Forward in 2023 | WebKit","url":"https://webkit.org/blog/13706/interop-2023/"},{"title":"Microsoft Edge and Interop 2023 - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2023/02/01/microsoft-edge-and-interop-2023/"},{"title":"Igalia and Interop 2023 | Igalia","url":"https://www.igalia.com/news/2023/interop2023.html"},{"title":"Interop 2023 - Bocoup","url":"https://bocoup.com/blog/interop-2023"}]},{"category":"WebsiteDocument","title":"deps: replace url parser with Ada by anonrig · Pull Request #46410 · nodejs/node","url":"https://github.com/nodejs/node/pull/46410","tags":["node.js","URL","issue","performance"],"content":"Node.jsの`URL`をada-urlというC++で実装したものに切り替える。\n現在のURLの実装と比較してパフォーマンスが改善されている。","relatedLinks":[{"title":"deps: replace url parser with Ada by anonrig · Pull Request #46410 · nodejs/node","url":"https://github.com/nodejs/node/pull/46410"}]},{"category":"SoftwareLibrary","title":"CodeIntelligenceTesting/jazzer.js: Coverage-guided, in-process fuzzing for the Node.js","url":"https://github.com/CodeIntelligenceTesting/jazzer.js","tags":["JavaScript","testing","library"],"content":"libFuzzerベースのFuzzingライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tanekloc/tmsg: Type-safe i18n library for TypeScript apps. Based on and largely compatible with MessageFormat.","url":"https://github.com/tanekloc/tmsg","tags":["JavaScript","TypeScript","library","i18n"],"content":"messageformatの機能をサポートしたi18nライブラリ。\n型でテンプレートをパースすることで、テンプレートにない値を渡すとコンパイルエラーにできる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"shadcn/ui - Beautifully designed components built with Radix UI and Tailwind CSS.","url":"https://ui.shadcn.com/","tags":["React","UI","library"],"content":"Radix UIとTailwind CSSを使ったReact UIフレームワーク","relatedLinks":[]}]},{"meta":{"title":"2023-02-15のJS: Lighthouse 10、core-jsとオープンソースの財政的な支援、WebContainers","author":"azu","layout":"post","date":"2023-02-15T04:33:33.465Z","category":"JSer","tags":["performance","TypeScript","browser","Tools","node.js"],"url":"https://jser.info/2023/02/15/lighthouse-10-core-js-webcontainers/"},"items":[{"category":"Headline","title":"Release Notes for Safari Technology Preview 163 | WebKit","url":"https://webkit.org/blog/13839/release-notes-for-safari-technology-preview-163/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 163リリース。\nCSS GridのMasonry layoutをデフォルトで有効化、`StorageManager.estimate()`のサポート、Web Crypto APIがEd25519をサポート。\n非標準な`HTMLHeadElement.profile`や`HTMLFrameElement.location`などを削除","relatedLinks":[]},{"category":"Headline","title":"Release v3.2.0 · nuxt/nuxt","url":"https://github.com/nuxt/nuxt/releases/tag/v3.2.0","tags":["Vue","ReleaseNote","library"],"content":"Nuxt.js v3.2.0リリース。\nNuxt DevToolsの追加、`useFetch`でのリクエストに自動的にCookieが付くように。\nサーバのコードからclient-only componentを取り除く`treeshakeClientOnly`がデフォルトで`true`へと変更など。","relatedLinks":[]},{"category":"Headline","title":"What&#039;s new in Lighthouse 10 - Chrome Developers","url":"https://developer.chrome.com/blog/lighthouse-10-0/","tags":["browser","performance","Tools","ReleaseNote"],"content":"Lighthouse 10リリース。\nスコアからTTIが削除され、CLSにスコアが移行する。\nAuditとしてBFCacheの検証、ペースト禁止の検証の追加。\nLighthouseの結果であるJSONの構造の変更など","relatedLinks":[{"title":"Release v10.0.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v10.0.0"}]},{"category":"Headline","title":"Electron 23.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-23-0","tags":["Electron","ReleaseNote"],"content":"Electron 23.0.0リリース。\nChromium 110、Node.js 18.12.1、V8 11.0へのアップデート。\nWindows 7/8/8.1のサポートを終了、`scroll-touch-*`イベントの削除。\n機能追加としてWebUSB APIのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v1 Because I finally got around to it · jquense/yup","url":"https://github.com/jquense/yup/releases/tag/v1.0.0","tags":["TypeScript","library","ReleaseNote"],"content":"スキーマを組み上げてバリデーションできるyup 1.0.0リリース。\n`tuple`の追加、bundleしたファイルを配布するように、`when` APIの変更、emailバリデーションをWHATWGの定義と同じものへ変更。\n`cast`に`ignore-optionality`オプションを追加、型処理のパフォーマンス改善と`Objectschema`クラスの追加など","relatedLinks":[{"title":"How do I migrate to v1 · Issue #1906 · jquense/yup","url":"https://github.com/jquense/yup/issues/1906"}]},{"category":"Headline","title":"Release DOMPurify 3.0.0 · cure53/DOMPurify","url":"https://github.com/cure53/DOMPurify/releases/tag/3.0.0","tags":["DOM","security","library","ReleaseNote"],"content":"DOMpurify 3.0.0リリース。\nIEのサポートを終了、`ALLOW_SELF_CLOSE_IN_ATTRP`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release 3.28.0 - 2023.02.14 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.28.0","tags":["JavaScript","polyfill","library","ReleaseNote"],"content":"core-js v3.28.0リリース。\nStage4となったChange Array by copy proposalをStableに移動。\nStage3の`JSON.parse` source text access、`ArrayBuffer.prototype.transfer`、Explicit Resource Managementを追加。\nStage 2のSymbol Predicatesを実装、Stage 1の`Number.range`を`Iterator.range`に変更など","relatedLinks":[]},{"category":"Headline","title":"Nextra 2 – Next.js Static Site Generator – The Guild","url":"https://the-guild.dev/blog/nextra-2","tags":["Next.js","library","ReleaseNote"],"content":"Next.jsベースの静的サイトジェネレータであるNextra 2リリース。\nMDX2のサポート、Markdownのインポート、Next 13に対応、リモートのMarkdownファイルを読み込んでレンダリングできるように、FlexSearchを使った全文検索のサポートなど","relatedLinks":[]},{"category":"Article","title":"Bringing Javascript to WebAssembly for Shopify Functions (2023)","url":"https://shopify.engineering/javascript-in-webassembly-for-shopify-functions","tags":["WebAssembly","JavaScript","article"],"content":"JavaScriptをWasmにして実行する仕組みについて。\nQuickJSを使いJavaScriptをByteCodeにした`script.wasm`を作成し、`QuickJS.wasm`と動的にリンクして大部分を共有している。\n\nShopify Functionで利用されるが、非同期処理の制限や5ms未満での実行制限がある。現在はRustで作成したWasmより3枚ていど遅いが、今後はSpiderMonkeyの利用やJITについてやっていく。","relatedLinks":[{"title":"Shopify/javy: JS to WebAssembly toolchain","url":"https://github.com/Shopify/javy"}]},{"category":"Article","title":"Speculation Rules API によるプリレンダリングのためのメトリクス設計","url":"https://nhiroki.jp/2023/02/13/metrics-for-prerendering","tags":["Chrome","performance","article"],"content":"Speculation Rules APIのPreRenderingについて。\nPrerenderした場合の`navigationStart`は事前実行のタイミングとなるため、`activationStart`というメトリクスが追加された点。\nまた、Predenderが実際に利用されているかの判定方法について","relatedLinks":[]},{"category":"Article","title":"Improved type safety in Storybook 7","url":"https://storybook.js.org/blog/improved-type-safety-in-storybook-7/","tags":["TypeScript","article"],"content":"Storybook 7でのTypeScriptの型について。\n`StoryObj`タイプや`satisfies`演算子を使ってexportするコンポーネントの定義に型を付ける話","relatedLinks":[]},{"category":"Article","title":"Understanding App Directory Architecture In Next.js — Smashing Magazine","url":"https://www.smashingmagazine.com/2023/02/understanding-app-directory-architecture-next-js/","tags":["Next.js","article"],"content":"Next.jsの`app`ディレクトリについての記事","relatedLinks":[]},{"category":"Article","title":"A Historical Reference of React Criticism—zachleat.com","url":"https://www.zachleat.com/web/react-criticism/","tags":["React","article","history"],"content":"Reactに対する批判の歴史についての記事","relatedLinks":[]},{"category":"Article","title":"core-js/2023-02-14-so-whats-next.md at master · zloirock/core-js · GitHub","url":"https://github.com/zloirock/core-js/blob/master/docs/2023-02-14-so-whats-next.md","tags":["JavaScript","polyfill","article","OpenSource","opinion"],"content":"core-jsの歴史、財政的な問題、ロードマップについて。\nまた、多くのウェブサイトが複数のバージョンの`core-js`を同じページに読み込んでいるパッケージの依存関係の問題について","relatedLinks":[]},{"category":"WebsiteDocument","title":"WebContainers - Dev environments. In your web app. | WebContainers","url":"https://webcontainers.io/","tags":["node.js","JavaScript","library","webservice"],"content":"Node.jsをWebブラウザ上で動作させて、Playgroundなどに利用できるWebContainersのAPIとパッケージが公開された","relatedLinks":[]},{"category":"WebsiteDocument","title":"Introducing historical web performance data via the CrUX History API - Chrome Developers","url":"https://developer.chrome.com/en/blog/chrome-ux-report-history-api/","tags":["Chrome","browser","performance"],"content":"CrUX History APIで1週間間隔のデータを6ヶ月間分の履歴が確認できるようになった。\nWebVitalsのデータを各ページレベルでも取得できるようになっている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"upgradejs/depngn: A CLI tool to find out if your dependencies support a given version of node.","url":"https://github.com/upgradejs/depngn","tags":["node.js","Tools"],"content":"インストールされている依存関係の`engines`フィールドを見て、指定したNode.jsバージョンが条件を満たすかを一覧できるツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"slashd-analytics/run: Run user-provided code in a Web Worker","url":"https://github.com/slashd-analytics/run","tags":["JavaScript","webworker","library"],"content":"Web Workerを一種のSandboxとして使い、任意のJSコードを実行するライブラリ","relatedLinks":[]},{"category":"Book","title":"Design Patterns in TypeScript","url":"https://refactoring.guru/design-patterns/typescript","tags":["TypeScript","document","book"],"content":"TypeScriptでのデザインパターンについてまとめたサイト","relatedLinks":[]}]},{"meta":{"title":"2023-02-20のJS: Sandpack 2.0、Safari 16.4 Beta、Reactドキュメンタリー","author":"azu","layout":"post","date":"2023-02-20T03:43:01.828Z","category":"JSer","tags":["node.js","React","video","browser","CSS"],"url":"https://jser.info/2023/02/20/sandpack-2.0-safari-16.4-beta-react/"},"items":[{"category":"Headline","title":"Firefox 110.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/110.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 110リリース。\nContainer Queriesのサポート、Errorの`stack`プロパティがシリアライズされた際に含まれるように変更。\nReadableStreamがAsync Iterableとして利用できるようになるなど","relatedLinks":[{"title":"Firefox 110 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/110"}]},{"category":"Headline","title":"Announcing Sandpack 2.0 and a Node.js runtime for any browser","url":"https://codesandbox.io/blog/announcing-sandpack-2","tags":["JavaScript","node.js","browser","ReleaseNote"],"content":"Sandpack 2.0リリース。\nブラウザ上でNode.jsのコードを実行するNodeboxの追加。\nWebContainersとの違いとして、Nodeboxはサンプルコードの実行を意図しているので、完全なNode.jsのエミュレータではない点。一方で`SharedArrayBuffer`を使わないことで色々な環境でも動作するようになっている。","relatedLinks":[]},{"category":"Headline","title":"Release v0.200.0 · facebook/flow","url":"https://github.com/facebook/flow/releases/tag/v0.200.0","tags":["flowtype","ReleaseNote"],"content":"Flow v0.200.0リリース。\ngenerics-escapeの問題の改善、型チェックの厳密化、数値と日付の比較を許可しないように変更など。\n`flow autofix`に`missing-local-annot`を追加など","relatedLinks":[]},{"category":"Headline","title":"Release v9.5.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v9.5.0","tags":["npm","ReleaseNote"],"content":"npm v9.5.0リリース。\n`npm publish --provenance`のサポート。現時点ではGitHub Actionsのみの限定的なサポートで、OIDCを使ったCIからのpublishをサポートするための仕組み。","relatedLinks":[{"title":"Automated publishing of npm packages from CI/CD · Issue #625 · npm/statusboard","url":"https://github.com/npm/statusboard/issues/625"},{"title":"RFC for linking packages to their source and build by feelepxyz · Pull Request #626 · npm/rfcs","url":"https://github.com/npm/rfcs/pull/626"}]},{"category":"Headline","title":"Thursday February 16 2023 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/february-2023-security-releases/","tags":["node.js","security","news"],"content":"Node.jsのセキュリティアップデート。\nNode.js v18.14.1 (LTS)/v19.6.1 (Current)/v16.19.1 (LTS)/v14.21.3 (LTS)がそれぞれリリースされている。","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v3.0.0","tags":["JavaScript","server","library","ReleaseNote"],"content":"Hono 3.0.0リリース。\n`req`を`Request`オブジェクトを拡張した`HonoRequest`オブジェクトに変更、StaticRouterの廃止、Validatorの変更。\nzodと組み合わせてrouterからレスポンスの型定義を作成できる`jsonT`とそれを利用するクライアントの`hono/client`の追加。\nwintercgのRuntime Keysの名前を返す`runtime()`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0-alpha.0 · chaijs/chai","url":"https://github.com/chaijs/chai/releases/tag/v5.0.0-alpha.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"chai v5.0.0-alpha.0リリース。\nPure ESMのパッケージに変更。\nNode.js 16未満のサポート終了、IEのサポート終了など","relatedLinks":[]},{"category":"Headline","title":"Safari 16.4 Beta Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safari-release-notes/safari-16_4-release-notes","tags":["safari","ReleaseNote"],"content":"Safari 16.4 Betaリリース。\n\n- CSS Typed Object Model APIのサポート、Constructable Stylesheetsのサポート\n- Declarative Shadow DOM、EmentInternals、Imperative Slot APIのサポート\n- RegExp lookbehind assertions、`import.meta.resolve`、`Atomics.waitAsync`、Import Mapsのサポート\n- iframeの`loading=lazy`、`Clear-Site-Data` HTTPヘッダーのサポート\n- AudioSession Web APIのサブセットをサポート、Web Codecs APIの一部をサポート\n- WebAssembly SIMD、OffscreenCanvas(2Dのみ)、Compression Streams APIのサポート\n- Fetch Metadata Request Headers、Scroll to Text Fragmentのサポート\n- Screen Orientation API、Screen Wake Lock API、UserActivation APIのサポート\n- ホーム画面に追加されたWebアプリ限定でプッシュ通知、Badge APIをサポート\n  - [Web Push for Web Apps on iOS and iPadOS | WebKit](https://webkit.org/blog/13878/web-push-for-web-apps-on-ios-and-ipados/ \"Web Push for Web Apps on iOS and iPadOS | WebKit\")\n- Web Inspectorの改善、WebDriverでのShadow Rootsのサポート、CookieのSameSite属性をサポート\n- Lockdownモードでキャッシュ系のAPIを無効化するなど","relatedLinks":[]},{"category":"Article","title":"State of React Native 2022","url":"https://results.stateofreactnative.com/","tags":["React","Native","Survey"],"content":"React Nativeについての開発者アンケートであるState of React Native 2022の結果が公開された。","relatedLinks":[]},{"category":"Article","title":"My talk on CSS runtime performance | Read the Tea Leaves","url":"https://nolanlawson.com/2023/01/17/my-talk-on-css-runtime-performance/","tags":["CSS","performance","article","video"],"content":"CSSのRuntime Performanceについての動画。\nCSS Selectorの動作とコスト、レイアウトのパフォーマンスとCSS Containment、デバッグ方法について","relatedLinks":[]},{"category":"Article","title":"How to Inspect Interactions in the Browser","url":"https://www.builder.io/blog/inspect-interactions-in-the-browser","tags":["Chrome","debug","article"],"content":"Chrome DevToolsのEmulate a focused pageを使ってHoverやFocus中に出る要素をInspectする方法について","relatedLinks":[]},{"category":"Article","title":"Popover API - JavaScript不要、HTMLのみでポップオーバーUI","url":"https://zenn.dev/yusukehirao/articles/popover-api-and-attributes","tags":["HTML","accessibility","article"],"content":"HTMLの`popover`属性について。","relatedLinks":[]},{"category":"Article","title":"Try out CSS Nesting today | WebKit","url":"https://webkit.org/blog/13813/try-css-nesting-today-in-safari-technology-preview/","tags":["CSS","article"],"content":"CSS NestingがSafari Technology Previewで利用できるようになったため、使い方についての紹介記事","relatedLinks":[]},{"category":"SlideVideo","title":"React.js: The Documentary - YouTube","url":"https://www.youtube.com/watch?v=8pDqJVdNa44","tags":["React","video"],"content":"Reactのドキュメンタリー。\nFacebook社内でのReactの誕生、社内でのBolt.jsとの選択、オープンソースとしての公開と最初の失敗、設計原則の周知、外部からのContributorと採用、Reactチームについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"codesandbox/nodebox-runtime: The open source version of the nodebox repository, a Node.js runtime for the browser","url":"https://github.com/codesandbox/nodebox-runtime","tags":["node.js","browser","JavaScript","library"],"content":"Node.jsのコードをブラウザ上で動かすためのNode.js互換のランタイムを実装したライブラリ。","relatedLinks":[{"title":"Announcing Sandpack 2.0 and a Node.js runtime for any browser","url":"https://codesandbox.io/blog/announcing-sandpack-2"}]}]},{"meta":{"title":"2023-02-28のJS: Next.js 13.2、Deno 1.31(`package.json`サポート)、TypeScript Runtime Validation Benchmark","author":"azu","layout":"post","date":"2023-02-27T15:44:43.018Z","category":"JSer","tags":["node.js","TypeScript","testing","pnpm","accessibility"],"url":"https://jser.info/2023/02/28/next.js-13.2-deno-1.31package.json-typescript-runtime-validation-benchmark/"},"items":[{"category":"Headline","title":"Release v8.0.0-alpha.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v8.0.0-alpha.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v8.0.0-alpha.0リリース。\npeerDependenciesを自動インストールする`auto-install-peers`を`true`へ変更、`publishConfig.linkDirectory`を`true`に変更。\n`resolution-mode`のデフォルト値を`lowest-direct`に変更、lockfileをv6に変更など","relatedLinks":[]},{"category":"Headline","title":"What’s New With Lerna 6.5?. In case you missed it, Lerna version… | by Zack DeRose | Feb, 2023 | Nx Devtools","url":"https://blog.nrwl.io/whats-new-with-lerna-6-5-4a4f69371504","tags":["JavaScript","monorepo","Tools","ReleaseNote"],"content":"Lerna 6.5リリース。\n`lerna publish from-git`が冪等性を持つように、`lerna run <command>,<command>`で複数のスクリプトを実行できるように。\n`private: true`のパッケージも公開できる`lerna publish --include-private`の追加など","relatedLinks":[]},{"category":"Headline","title":"Node v19.7.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v19.7.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v19.7.0リリース。\nnpm 9.5.0へアップデート、`util.aborted()`の追加、`--test-coverage`のサポート、Single Executableバイナリをサポートする初期実装を追加など","relatedLinks":[]},{"category":"Headline","title":"Blog - Next.js 13.2 | Next.js","url":"https://nextjs.org/blog/next-13-2","tags":["Next.js","ReleaseNote"],"content":"Next.js 13.2リリース。\nNext SEOをインスパイアしたMetadata APIをサポート、Route Handlers APIのサポート、MDXをServer Side Componentで利用できるように。\nRustで書き直されたMDXパーサを利用できるように、`<Link>`の`href`が型安全に、エラーオーバーレイの改善、Turbopackの改善。\nTurbopackが一部のwebpack loaderのサポート、Vercel Cache APIを利用したNext.js Cacheのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Bun v0.5.7 | Bun Blog","url":"https://bun.sh/blog/bun-v0.5.7","tags":["Bun","ReleaseNote"],"content":"Bun 0.5.7リリース。\n`FormData`のサポート、GitとGitHubの依存をサポート、デフォルトで`setTimeout`がNode.jsと同じTimeoutオブジェクトを返すように変更。\n`fetch` APIが`AbortSignal`をサポート、`bun wiptest`コマンドを`bun test`にリネームなど","relatedLinks":[]},{"category":"Headline","title":"Deno 1.31: package.json support","url":"https://deno.com/blog/v1.31","tags":["deno","ReleaseNote"],"content":"Deno v1.31リリース。\n`package.json`をサポートし`scripts`や`dependencies`を扱えるように、Node-APIのサポートをStableに変更。\nDenoのランタイムにNode.jsの互換レイヤーを同梱するように変更。\n`deno bundle`コマンドを非推奨化、`deno fmt`のフラグから`--options-` prefixなしのオプション名を指定できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Changelog | Cypress Documentation","url":"https://docs.cypress.io/guides/references/changelog#12.7.0","tags":["JavaScript","testing","browser","library","ReleaseNote"],"content":"Cypress 12.7.0リリース。\n`cy.setCookie`で`HostOnly`のCookieを設定できるように、Cypress Component Testingsと連携するためのAPIを公開など","relatedLinks":[{"title":"Integrating with Cypress Component Testing | Cypress Documentation","url":"https://docs.cypress.io/guides/component-testing/third-party-definitions"}]},{"category":"Headline","title":"Release v0.29.0 · vitest-dev/vitest","url":"https://github.com/vitest-dev/vitest/releases/tag/v0.29.0","tags":["vite","testing","ReleaseNote"],"content":"vitest v0.29.0リリース。\n試験的に依存関係をbundleして読み込むことでパフォーマンスを改善する`deps.experimentalOptimizer`オプションを追加。\nまた、`--no-threads`オプション使っている場合は、`--single-thread`や`deps.experimentalOptimizer`を代わりに使うことを推奨している。","relatedLinks":[]},{"category":"Article","title":"Chrome’s Headless mode gets an upgrade: introducing \\`--headless=new\\` - Chrome Developers","url":"https://developer.chrome.com/articles/new-headless/","tags":["Chrome","article","puppeteer"],"content":"Chromeの新しいHeadlessモードについて。\n`chrome --headless=new`で実行でき、Puppeteerなどからもopt-inで利用できる。\n今まではヘッドレス用の実装が分かれていたためメンテナンスの問題があったが、新しい実装ではヘッドレスありなしが統合される形となった。","relatedLinks":[]},{"category":"Article","title":"Typescript Runtime Validators and DX, a type-checking performance analysis of zod/superstruct/yup/typebox - DEV Community","url":"https://dev.to/nicklucas/typescript-runtime-validators-and-dx-a-type-checking-performance-analysis-of-zodsuperstructyuptypebox-5416","tags":["TypeScript","article","library"],"content":"TypeScriptのスキーマバリデーションライブラリであるZod/Yup/Superstruct/Typebox/Light Typeのコンパイル時間のベンチマーク比較。","relatedLinks":[]},{"category":"Article","title":"JavaScript Import maps, Part 1: Introduction | SpiderMonkey JavaScript/WebAssembly Engine","url":"https://spidermonkey.dev/blog/2023/02/23/javascript-import-maps-part-1-introduction.html","tags":["JavaScript","module","ECMAScript","article"],"content":"Import Mapsについての記事。\nECMAScriptではModule Specifierで指定した文字列をどう解決するかがランタイムに任されている点。\nNode.jsとBrowserのModules解決の違い、Import Mapsでのランタイムの違いの吸収について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Learn Privacy","url":"https://web.dev/learn/privacy/","tags":["privacy","tutorial"],"content":"ウェブサイトとPrivacyについてのチュートリアル。\n必要なデータだけを使う、サーバからのデータの削除とクライアントのデータをClear-Site-Dataでの削除、third-party scriptとcookie、Fingerprintingなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"natemoo-re/clack: Effortlessly build beautiful command-line apps","url":"https://github.com/natemoo-re/clack","tags":["node.js","JavaScript","library"],"content":"コマンドラインの対話的なプロンプトUIを作成するNode.jsライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"🪄 | ts-rest","url":"https://ts-rest.com/","tags":["TypeScript","library"],"content":"Zodを使ったスキーマ共有型のRPCフレームワーク。","relatedLinks":[]},{"category":"Book","title":"Webアプリケーションアクセシビリティ──今日から始める現場からの改善：書籍案内｜技術評論社","url":"https://gihyo.jp/book/2023/978-4-297-13366-5","tags":["accessibility","book"],"content":"2023年2月27日発売\nウェブアプリケーションに置けるアクセシビリティについての書籍","relatedLinks":[]}]},{"meta":{"title":"2023-03-08のJS: Jest 29.5.0、Chrome 111、testing-libraryへの移行","author":"azu","layout":"post","date":"2023-03-08T12:31:07.994Z","category":"JSer","tags":["node.js","testing","TypeScript","React","rails"],"url":"https://jser.info/2023/03/08/jest-29.5.0-chrome-111-testing-library/"},"items":[{"category":"Headline","title":"Release 7.2.0 · google/zx","url":"https://github.com/google/zx/releases/tag/7.2.0","tags":["JavaScript","library","ReleaseNote"],"content":"zx 7.2.0リリース。\n`retry()`と`spinner()`ヘルパーの追加など","relatedLinks":[]},{"category":"Headline","title":"Buf | Connect for Node.js is now available","url":"https://buf.build/blog/connect-node-beta","tags":["node.js","ProtocolBuffers","library","ReleaseNote"],"content":"gRPC/Protocol Buffersを扱うConnect for Node.jsがリリースされた。","relatedLinks":[]},{"category":"Headline","title":"moon v0.25 - Deno tier 2 support, CI insights, custom project languages, and more | moonrepo","url":"https://moonrepo.dev/blog/v0.25","tags":["monorepo","Tools","ReleaseNote"],"content":"moon v0.25リリース。\nDenoのサポート、オフラインモードのサポート、プロジェクトレベルでTypeScriptの設定を上書きできるように、GitHub Actionsの追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.0 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-0-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.0 RCリリース。\nECMAScript Stage 3のDecoratorを実装、`const` type perameterの追加、`tsconfig.json`で複数の`extends`に対応、enumとunion型の改善。\n`--moduleResolution bundler`の追加と関連するオプションの追加、`exports`フィールのConditionを指定できる`--customConditions`の追加。\n`import`時に`type`修飾子を削除しそれ以外を残す`--verbatimModuleSyntax`オプションの追加、JSDocで`@satisfies`をサポートなど。\nまた、TypeScriptのコードベースをnamespaceからmoudleに移行し、パフォーマンス/メモリ/パッケージサイズの改善。\n`--target ES3`や`--out`などのオプションを非推奨に変更し、`--forceConsistentCasingInFileNames`をデフォルトでtrueに変更するといった変更も含まれている","relatedLinks":[]},{"category":"Headline","title":"Release v111 · ije/esm.sh","url":"https://github.com/ije/esm.sh/releases/tag/v111","tags":["JavaScript","cdn","module"],"content":"esm.sh v111リリース。\n`deprecated`メッセージに対応、バージョン指定せずにリクエストした場合のTTLを10分に変更など","relatedLinks":[]},{"category":"Headline","title":"Release v29.5.0 · facebook/jest","url":"https://github.com/facebook/jest/releases/tag/v29.5.0","tags":["JavaScript","testing","ReleaseNote"],"content":"Jest v29.5.0リリース。\n`randomize`オプションでテストをランダムな順番で実行できるように、`workerThreads`オプションの追加、エラー出力のフォーマッターがError Causeのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v2.1.0 · vercel/swr","url":"https://github.com/vercel/swr/releases/tag/v2.1.0","tags":["JavaScript","React","library","ReleaseNote"],"content":"SWR v2.1.0リリース。\nリアルタイムデータソースをSubscribeできる`useSWRSubscription`の追加、`useSWRInfinite`に`parallel`オプションを追加など","relatedLinks":[]},{"category":"Headline","title":"Node v18.15.0 (LTS) | Node.js","url":"https://nodejs.org/ja/blog/release/v18.15.0/","tags":["node.js","ReleaseNote"],"content":"Node.js v18.15.0リリース。\n`--test-coverge`の追加、`fs.statfs`の追加、プロセスで使用可能なメモリの量を取得する`process.constrainedMemory()`の追加、`buffer.isAscii`の追加","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 111 - Chrome Developers","url":"https://developer.chrome.com/blog/new-in-chrome-111/","tags":["Chrome","ReleaseNote"],"content":"Chrome 111リリース。\n\nCSS Color Level 4のサポート、`:nth-child()`と`:nth-last-child()`の擬似クラスセレクターのサポート、Style Container Queriesのサポート。\nStreaming declarative shadow DOM、View Transitions APIのサポート。\nOrigin TrialとしてDocument Picture-in-Pictureのサポート。\nWeb Payment APIに関する非推奨なAPIの削除など","relatedLinks":[{"title":"What","url":"https://developer.chrome.com/blog/new-in-devtools-111/"}]},{"category":"Article","title":"You Don&#039;t Need Rails to Start Using Hotwire","url":"https://www.akshaykhot.com/using-hotwire-without-rails/","tags":["JavaScript","rails","library","article"],"content":"Railsを使わなくてもHotwireは使えるという話。\nHotwireの基本的な使い方について。","relatedLinks":[]},{"category":"Article","title":"Sentry’s Frontend Tests: Migrating from Enzyme to React Testing Library | Product Blog • Sentry","url":"https://blog.sentry.io/2023/02/23/sentrys-frontend-tests-migrating-from-enzyme-to-react-testing-library/","tags":["React","JavaScript","testing","article"],"content":"ReactのテストライブラリであるEnzymeはReact 18をサポートする予定がないため、React Testing Libraryへの移行をした記事。\nReact Testing Libraryへの移行時に見つけた問題やどのようにマイグレーションしていったかについて","relatedLinks":[]},{"category":"Article","title":"クライアントの Cookie などのデータを削除する Clear Site Data という仕様について | blog.bokken.io","url":"https://blog.bokken.io/articles/2023-02-28/about-clear-site-data.html","tags":["browser","article"],"content":"`Clear-Site-Data` HTTPレスポンスヘッダについて","relatedLinks":[]},{"category":"Article","title":"Experiments with the JavaScript Garbage Collector - DEV Community","url":"https://dev.to/codux/experiments-with-the-javascript-garbage-collector-2ae3","tags":["JavaScript","article"],"content":"WeakRefsの一部である`FinalizationRegistry`で登録したオブジェクトはいつGCによって回収されるのかについて。","relatedLinks":[]},{"category":"Article","title":"testing-library でユーザの気持ちになって書くフロントエンドのテスト","url":"https://zenn.dev/tnyo43/articles/39e4caa321d0aa","tags":["JavaScript","testing","DOM","accessibility","article"],"content":"testing-libraryを使ってテストコードとユーザーの操作を合わせる形で要素を選択して実装する方法について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Sandworm: Keep Your JavaScript Code Secure and Compliant","url":"https://sandworm.dev/","tags":["npm","webservice"],"content":"npmパッケージのAudit、ライセンス情報、依存関係ツリーの表示などを行うサービス","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Node.js Toolbox","url":"https://nodejstoolbox.com/","tags":["node.js","library","search"],"content":"Node.jsライブラリをカテゴリ別にして比較表示できるサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kaleidawave/ezno: A JavaScript compiler and TypeScript checker written in Rust with a focus on static analysis and runtime performance","url":"https://github.com/kaleidawave/ezno","tags":["TypeScript","Rust"],"content":"Rustで書かれたTypeScriptコンパイラ、型チェッカー。","relatedLinks":[]}]},{"meta":{"title":"2023-03-14のJS: Storybook 7.0.0 RC、Rspack(webpack interoperability)、Pino Logging Guide","author":"azu","layout":"post","date":"2023-03-14T00:27:23.585Z","category":"JSer","tags":["webpack","node.js","Tools","TypeScript","CSS"],"url":"https://jser.info/2023/03/14/storybook-7.0.0-rc-rspackwebpack-interoperability-pino-logging-guide/"},"items":[{"category":"Headline","title":"Release v5.76.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.76.0","tags":["webpack","ReleaseNote"],"content":"webpack v5.76.0リリース。\nパフォーマンスの改善など。","relatedLinks":[]},{"category":"Headline","title":"jQuery 3.6.4 Released: Selector Forgiveness | Official jQuery Blog","url":"https://blog.jquery.com/2023/03/08/jquery-3-6-4-released-selector-forgiveness/","tags":["jQuery","ReleaseNote"],"content":"jQuery 3.6.4リリース。\njQuery 3.6.3で入れた`CSS.supports`を使ってSelectorがネイティブなものかを判定する処理を元に戻している。\n`CSS.supports`と`querySelector`はセレクタの扱いに関して異なる部分があるため、元のtry-catchを使う実装に戻した。","relatedLinks":[{"title":"[","url":"https://github.com/w3c/csswg-drafts/issues/8378"}]},{"category":"Headline","title":"Announcing Rspack - Rspack","url":"https://www.rspack.dev/blog/announcement.html","tags":["webpack","bundler","ReleaseNote"],"content":"Rustで書かれたwebpack互換のbundler。\nwebpackを使うプロジェクトとの互換性や移行性を考慮していて、オプションやloaderも互換性ある形で実装している。\n出力するランタイムコードもwebpackの出力との互換性を考慮していて、プラグインもJSで書けるようになっている。\nまた、webpackチームとも連携していて、webpackとの統合も計画している。","relatedLinks":[{"title":"Migration from webpack - Rspack","url":"https://www.rspack.dev/guide/migrate-from-webpack.html"},{"title":"Loader compat - Rspack","url":"https://www.rspack.dev/guide/loader-compat.html"},{"title":"Plugin compat - Rspack","url":"https://www.rspack.dev/guide/plugin-compat.html"}]},{"category":"Headline","title":"Release v6.9.0 · remix-run/react-router","url":"https://github.com/remix-run/react-router/releases/tag/react-router%406.9.0","tags":["React","library","ReleaseNote"],"content":"React Router 6.9.0リリース。\n`lazy` propsをサポートし、コンポーネントを遅延ロードできるように","relatedLinks":[]},{"category":"Headline","title":"Release v7.0.0-rc.0 · storybookjs/storybook","url":"https://github.com/storybookjs/storybook/releases/tag/v7.0.0-rc.0","tags":["JavaScript","UI","Tools","ReleaseNote"],"content":"Storybook v7.0.0-rc.0リリース。","relatedLinks":[]},{"category":"Article","title":"Everything You Need to Know About the Gap After the List Marker | CSS-Tricks - CSS-Tricks","url":"https://css-tricks.com/everything-you-need-to-know-about-the-gap-after-the-list-marker/","tags":["CSS","article"],"content":"CSSの`::marker`擬似要素について","relatedLinks":[]},{"category":"Article","title":"A Complete Guide to Pino Logging in Node.js | Better Stack Community","url":"https://betterstack.com/community/guides/logging/how-to-install-setup-and-use-pino-to-log-node-js-applications/","tags":["node.js","article"],"content":"pinoを使ったロギングについての解説記事","relatedLinks":[]},{"category":"Article","title":"TypeScript&#039;s Migration to Modules - TypeScript","url":"https://devblogs.microsoft.com/typescript/typescripts-migration-to-modules/","tags":["TypeScript","article"],"content":"TypeScriptのコードベースをnamespaceからModuleに変更した話。\n変更によるパフォーマンスの改善、namespaceが使われていた歴史的経緯、マイグレーション方法、互換性についてなど","relatedLinks":[]},{"category":"Article","title":"Node.js Security Progress Report –  Permission Model Merged - OpenJS Foundation","url":"https://openjsf.org/blog/2023/03/13/node-js-security-progress-report-permission-model-merged/?hss_channel=tw-14538601","tags":["node.js","security","article"],"content":"Node.js Security Working Groupの2月の変更点。\nPermission Model、Node.js データベースの自動更新、メジャーリリース前のコントリビューションの扱いを明確化など","relatedLinks":[]},{"category":"WebsiteDocument","title":"Rspack","url":"https://www.rspack.dev/","tags":["webpack","Rust","Tools"],"content":"Rustで書かれたwebpack互換のbundler。\nwebpackを使うプロジェクトとの互換性や移行性を考慮していて、オプションやloaderも互換性ある形で実装している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"open-draft/event-contract: Type-safe, implementation-agnostic event contract framework.","url":"https://github.com/open-draft/event-contract","tags":["TypeScript","library"],"content":"Type-Safeでイベントを実装するフレームワーク。\n`EventTarget`を使った`transport`が用意されていて、任意の仕組みでイベントを実装できる。\n`schema`によってzodを使ったRuntimeのType Checkもできるようになっている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"proto - A multi-language toolchain manager | moonrepo","url":"https://moonrepo.dev/proto","tags":["node.js","deno","Bun","golang","console","Tools"],"content":"Node.js,Deno,Bun,Go言語などに対応したバージョン管理ツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"antonmedv/finder: CSS Selector Generator 🗺","url":"https://github.com/antonmedv/finder","tags":["JavaScript","CSS","library"],"content":"DOM要素からuniqueなCSSセレクターを作成するライブラリ","relatedLinks":[]}]},{"meta":{"title":"2023-03-22のJS: Firefox 111、react.dev、TypeScript 5","author":"azu","layout":"post","date":"2023-03-22T03:54:32.412Z","category":"JSer","tags":["TypeScript","node.js","React","npm","Firefox"],"url":"https://jser.info/2023/03/22/firefox-111-react.dev-typescript-5/"},"items":[{"category":"Headline","title":"Firefox 111.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/111.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 111リリース。\nHTMLの`translate`属性をサポート、CSS color functionsをフラグ付きでサポート。\nFile System Access APIのOrigin private file system (OPFS)をサポートなど","relatedLinks":[{"title":"Firefox 111 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/111"}]},{"category":"Headline","title":"Node v19.8.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v19.8.0","tags":["node.js","ReleaseNote"],"content":"Node.js v19.8.0リリース。\n`Buffer.copyBytesFrom()`の追加、`AsyncLocalStorage.bind()`と`AsyncLocalStorage.snapshot()`の追加。\n`fs.openAsBlob()`の追加、`URLSearchParams`に`size` getterの追加、WASIに`version`を追加など","relatedLinks":[]},{"category":"Headline","title":"vite/CHANGELOG.md at main · vitejs/vite","url":"https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md#420-2023-03-16","tags":["vite","ReleaseNote"],"content":"Vite 4.2.0リリース。\nHTMLファイル内で`%ENV_NAME%`での環境変数の置換に対応、Source Mapsの改善、`exports`フィールドのSubpath importsに対応。\nTypeScript 5のサポートとesbuild 0.17へのアップデートなど","relatedLinks":[]},{"category":"Headline","title":"Introducing react.dev – React","url":"https://react.dev/blog/2023/03/16/introducing-react-dev","tags":["React","document","news"],"content":"Reactの新しいドキュメントサイトである react.dev が公開された。\nドメインが react.dev となり、React Hooksがデフォルトとなり、チュートリアルやAPIガイドも書き直されている。","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.0 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-0/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.0リリース。\nECMAScript Stage 3のDecoratorを実装、`const` type perameterの追加、`tsconfig.json`で複数の`extends`に対応、enumとunion型の改善。\n`--moduleResolution bundler`の追加と関連するオプションの追加、`exports`フィールのConditionを指定できる`--customConditions`の追加。\n`import`時に`type`修飾子を削除しそれ以外を残す`--verbatimModuleSyntax`オプションの追加、JSDocで`@satisfies`をサポートなど。\nまた、TypeScriptのコードベースをnamespaceからmoudleに移行し、パフォーマンス/メモリ/パッケージサイズの改善。\n`--target ES3`や`--out`などのオプションを非推奨に変更し、`--forceConsistentCasingInFileNames`をデフォルトでtrueに変更するといった変更も含まれている","relatedLinks":[]},{"category":"Headline","title":"styled-components/xstyled: A utility-first CSS-in-JS framework built for React. 💅👩‍🎤⚡️","url":"https://github.com/styled-components/xstyled","tags":["JavaScript","CSS","news"],"content":"xstyledがstyled-componentsのorganizationに移管された","relatedLinks":[{"title":"Evan Jacobs on Twitter: ","url":"https://twitter.com/probablyup/status/1632385154814558210"}]},{"category":"Article","title":"Introducing &quot;safe npm&quot;, a Socket npm Wrapper - Socket","url":"https://socket.dev/blog/introducing-safe-npm","tags":["npm","article","security"],"content":"`npm`と`npx`にaliasして利用できるコマンド。\nインストール時にパッケージがマルウェアかインストール時にスクリプト実行するかなどをチェックしてからインストールできる","relatedLinks":[{"title":"socket npm ","url":"https://docs.socket.dev/docs/socket-npm-socket-npx"}]},{"category":"Article","title":"npm installとnpm ciの動作確認を簡単にやっておいた - Mitsuyuki.Shiiba","url":"https://bufferings.hatenablog.com/entry/2023/03/21/145023","tags":["npm","article","CI"],"content":"npm installとnpm ciとキャッシュについて。\n`npm install`は`node_modules/`を再利用できるが、安全ではないケースもある。\n`npm ci`は`node_modules/`を削除するため`~/.npm`をキャッシュとして使う必要があることについて。","relatedLinks":[{"title":"npm install と npm ci って結局どう使うの？2023年版 - Mitsuyuki.Shiiba","url":"https://bufferings.hatenablog.com/entry/2023/03/15/215044"}]},{"category":"WebsiteDocument","title":"lagonapp/lagon: Deploy Serverless Functions at the Edge. Current status: Dev","url":"https://github.com/lagonapp/lagon","tags":["V8","Rust","JavaScript","OpenSource"],"content":"V8とRustで書かれているJavaScriptランタイム。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"total-typescript/ts-reset: A &#039;CSS reset&#039; for TypeScript, improving types for common JavaScript API&#039;s","url":"https://github.com/total-typescript/ts-reset","tags":["TypeScript","library"],"content":"TypeScriptのlibsの型定義を上書きする型定義ライブラリ。\n`JSON.parse`が`any`ではなく`unknown`を返すように変更したり、`.includes()`や`.has()`の型を厳密にするなどしている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"anymaniax/orval: orval is able to generate client with appropriate type-signatures (TypeScript) from any valid OpenAPI v3 or Swagger v2 specification, either in yaml or json formats. 🍺","url":"https://github.com/anymaniax/orval","tags":["OpenAPI","TypeScript","React","Tools","library"],"content":"OpenAPI SpecからAPIクライアントやモックサーバなどのコードを生成するツール。","relatedLinks":[{"title":"OpenAPIからコードを自動生成！『Orval』のメリットと選定理由","url":"https://zenn.dev/hrbrain/articles/3ca5d37dd0b80e"}]},{"category":"SoftwareLibrary","title":"gajus/turbowatch: Extremely fast file change detector and task orchestrator for Node.js.","url":"https://github.com/gajus/turbowatch","tags":["node.js","library"],"content":"ファイルの変更を監視して、プロセスを再起動するライブラリ、ツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Transformers.js","url":"https://xenova.github.io/transformers.js/","tags":["browser","JavaScript","library","MachineLearning"],"content":"ブラウザ上で動くTransformersライブラリ。\nHuggingFace Hubからのモデルのダウンロードに対応していて、BERTなどさまざまモデルでタスクを実行できる","relatedLinks":[]},{"category":"Book","title":"Practical WebAssembly \\[Book\\]","url":"https://www.oreilly.com/library/view/practical-webassembly/9781098142513/","tags":["WebAssembly","book"],"content":"2024年5月発売\nWebAssemblyについての書籍。\nRustとAssemblyScriptでWasmを作成して利用する方法について","relatedLinks":[]}]},{"meta":{"title":"2023-03-29のJS: Safari 16.4、DenoとCloudflare WorkersのNode.js互換性、pnpm 8.0.0","author":"azu","layout":"post","date":"2023-03-29T01:53:53.679Z","category":"JSer","tags":["Tools","safari","pnpm","cloudflare","node.js"],"url":"https://jser.info/2023/03/29/safari-16.4-denocloudflare-workersnode.js-pnpm-8.0.0/"},"items":[{"category":"Headline","title":"Release Notes for Safari Technology Preview 166 | WebKit","url":"https://webkit.org/blog/13964/release-notes-for-safari-technology-preview-166/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 166リリース。\nCSSの`@counter-style`のサポート、JSの正規表現の`v`フラグの実装、HTMLの`popover`属性のサポート。\nHTTP 103のEarly Hintsに対応など","relatedLinks":[]},{"category":"Headline","title":"Release v8.0.0-rc.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v8.0.0-rc.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v8.0.0-rc.0リリース。\nNode.js 14のサポート終了、デフォルト設定の変更、ロックファイルの形式の変更など","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2023-03 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2023/03/26/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2023年3月のTC39ミーティングでのECMAScript Proposalのステータス変更のまとめ。","relatedLinks":[]},{"category":"Headline","title":"Deno 1.32: Enhanced Node.js Compatibility","url":"https://deno.com/blog/v1.32","tags":["deno","ReleaseNote"],"content":"Deno v1.32リリース。\nTypeScript 5.0、V8 11.2へのアップデート。\nNode.jsとの互換性の改善、`deno compile`がWeb WorkerとDynamic Importをサポート、unstableなWebGPUのサポートを削除など。\nstd/encodingのcsv/yaml/toml/json/jsonc/front_matterをstd/のトップレベルに移動など。","relatedLinks":[]},{"category":"Headline","title":"Release v0.17.14 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.17.14","tags":["JavaScript","Tools","ReleaseNote"],"content":"esbuild v0.17.14リリース。\nTypeScript 5の`const` parameterをサポート、CSS nestingのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v8.0.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v8.0.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v8.0.0リリース。\nNode.js 14のサポート終了、デフォルト設定の変更、`peerDependencies`をデフォルトでインストールするように。\nLockfileの形式とバージョンをアップデートなど","relatedLinks":[]},{"category":"Headline","title":"WebKit Features in Safari 16.4 | WebKit","url":"https://webkit.org/blog/13966/webkit-features-in-safari-16-4/","tags":["safari","ReleaseNote"],"content":"Safari 16.4リリース。\n\n- `margin-trim`プロパティ、`lh` unit、CSS Typed Object Model APIのサポート、Constructable Stylesheetsのサポート\n- Declarative Shadow DOM、EmentInternals、Imperative Slot APIのサポート\n- RegExp lookbehind assertions、`import.meta.resolve`、`Atomics.waitAsync`、Import Mapsのサポート\n- iframeの`loading=lazy`、`Clear-Site-Data` HTTPヘッダーのサポート\n- AudioSession Web APIのサブセットをサポート、Web Codecs APIの一部をサポート\n- WebAssembly SIMD、OffscreenCanvas(2Dのみ)、Compression Streams APIのサポート\n- Fetch Metadata Request Headers、Scroll to Text Fragmentのサポート\n- Screen Orientation API、Screen Wake Lock API、UserActivation APIのサポート\n- ホーム画面に追加されたWebアプリ限定でプッシュ通知、Badge APIをサポート\n- Web Inspectorの改善、WebDriverでのShadow Rootsのサポート、CookieのSameSite属性をサポート\n- Lockdownモードでキャッシュ系のAPIを無効化するなど\n\n関連:","relatedLinks":[{"title":"Safari 16.4 Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safari-release-notes/safari-16_4-release-notes"},{"title":"2023-02-20のJS: Sandpack 2.0、Safari 16.4 Beta、Reactドキュメンタリー - JSer.info","url":"https://jser.info/2023/02/20/sandpack-2.0-safari-16.4-beta-react/"}]},{"category":"Headline","title":"moon v1.0 - Official release! Project constraints, tagging, and more! | moonrepo","url":"https://moonrepo.dev/blog/moon-v1.0","tags":["monorepo","Rust","JavaScript","Tools","ReleaseNote"],"content":"monorepo管理ツールのmoon v1.0リリース。\nプロジェクトのタグ付けのサポート、タグを使ったプロジェクト間の制約をサポート、環境変数の置換のサポートなど","relatedLinks":[]},{"category":"Article","title":"Node.js compatibility for Cloudflare Workers – starting with Async Context Tracking, EventEmitter, Buffer, assert, and util","url":"https://blog.cloudflare.com/workers-node-js-asynclocalstorage/","tags":["cloudflare","node.js","article"],"content":"Cloudflare WorkersにNode.jsのCore Modulesの一部が実装されたという話。\n`nodejs_compat`というフラグが有効な場合に、AsyncLocalStorage/EventEmitter/Buffer/Assertなどが利用できる","relatedLinks":[]},{"category":"Article","title":"The origin private file system - Chrome Developers","url":"https://developer.chrome.com/articles/origin-private-file-system/","tags":["browser","JavaScript","article"],"content":"Origin private file systemについて。\nメインスレッド、Web Workerでの利用、基本的なAPIとユースケースについて。","relatedLinks":[]},{"category":"Article","title":"Introducing Nuxt DevTools · Nuxt","url":"https://nuxt.com/blog/introducing-nuxt-devtools","tags":["Vue","article"],"content":"Nuxt DevToolsの紹介。\nNuxtのページ、コンポーネント、自動インポート、Modules、Assets、Plugins、Hooks、設定、ステートなどのデバッグができるツール","relatedLinks":[]},{"category":"WebsiteDocument","title":"Hello, Superflare","url":"https://superflare.dev/","tags":["cloudflare","node.js","JavaScript","library"],"content":"Cloudflare Workers/Pagesに特化したアプリケーションツールキット。\nD1 Database、R2 Storage、Cloudflare Queues、セッション管理、Durable Objectsを使ったBroadcastingをサポートしている。\nまたDBのマイグレーションの管理、Remixなどのフレームワークとの連携も行っている","relatedLinks":[]},{"category":"WebsiteDocument","title":"mamiksik/parrot-intellij: AI Commit Messages Autocomplete for InteliJ","url":"https://github.com/mamiksik/parrot-intellij","tags":["JetBrains","plugin","LanguageModel"],"content":"コミットメッセージを自動生成するJetBrains/VSCode拡張。\nコミットメッセージを学習したモデルを利用する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"gvergnaud/hotscript: A library of composable functions for the type-level! Transform your TypeScript types in any way you want using functions you already know.","url":"https://github.com/gvergnaud/hotscript","tags":["TypeScript","library"],"content":"TypeScriptの型レベル高階関数のライブラリ。\n型でパターンマッチを書くの利用できるような型関数を提供しているライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sinclairnick/brail: 💌 Transactional email that feels different","url":"https://github.com/sinclairnick/brail","tags":["React","mail","library","Tools"],"content":"Reactでメールのコンテンツを書けるメールツールキット。\nメール向けのUIコンポーネント、Linter、コンポーネントからHTMLメールを作成するジェネレータ、tRPCを使ったAPI、DevToolsなどが含まれる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mayank99/ecsstatic: the predefinite CSS-in-JS library for vite","url":"https://github.com/mayank99/ecsstatic","tags":["CSS","vite"],"content":"CSS-in-JSライブラリ。\n`css`タグ関数を使ってCSSを書き、Viteを使ってコンパイルするようになっている。\nSassにも対応してる","relatedLinks":[]},{"category":"Book","title":"PEAKS（ピークス）｜Jestではじめるテスト入門","url":"https://peaks.cc/books/testing_with_jest","tags":["JavaScript","testing","book"],"content":"Jestを使ったテストの入門書","relatedLinks":[]}]},{"meta":{"title":"2023-04-07のJS: Rome v12、ES2023 RC、TypeScript 5で追加されたオプション","author":"azu","layout":"post","date":"2023-04-06T15:01:39.093Z","category":"JSer","tags":["React","Tools","TypeScript","node.js","Next.js"],"url":"https://jser.info/2023/04/07/rome-v12-es2023-rc-typescript-5/"},"items":[{"category":"Headline","title":"Node v16.20.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v16.20.0","tags":["node.js","ReleaseNote"],"content":"Node.js v16.20.0リリース。\nundici、npm、corepackのアップデート","relatedLinks":[]},{"category":"Headline","title":"Announcing Rome v12","url":"https://rome.tools/blog/2023/03/28/rome12/","tags":["JavaScript","Tools"],"content":"Rome v12リリース。\nJSONのサポート、TypeScript 5.0のサポート、フラグ付きでImportのソートに対応。\nエラー表示の改善や`--config-path`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v1.7.0 - U Can&#039;t Type This · solidjs/solid","url":"https://github.com/solidjs/solid/releases/tag/v1.7.0","tags":["JavaScript","React","ReleaseNote"],"content":"Solid v1.7.0リリース。\nTypeScriptのより厳密な型で書けるように改善、`onError`を置き換える`catchError`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release ES2023 Candidate April 2023 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2023-candidate-2023-04","tags":["ECMAScript","ReleaseNote","spec"],"content":"ECMAScript 2023 Candidateリリース。\n6月のEcma GAで承認されたら正式にリリースされる。","relatedLinks":[]},{"category":"Headline","title":"Bun v0.5.9 | Bun Blog","url":"https://bun.sh/blog/bun-v0.5.9","tags":["Bun","ReleaseNote"],"content":"Bun 0.5.9リリース。\nファイル変更を監視してプロセスを再起動する`bun --watch`のサポート、tarballの依存をサポート、バグ修正など。\n0.6.0ではReact Server Componentsをサポートする予定。","relatedLinks":[]},{"category":"Headline","title":"Electron 24.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-24-0","tags":["Electron","ReleaseNote"],"content":"Electron 24.0.0リリース。\nChromium 112.0.5615.49、Node.js 18.12.1、V8 11.0へのアップデート。\n`nativeImage.createThumbnailFromPath(path, size)`の`maxSize`オプションを`size`オプションへ変更など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 167 | WebKit","url":"https://webkit.org/blog/14100/release-notes-for-safari-technology-preview-167/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 167リリース。\nCSS NestingでのTop Level `&`をサポート、Priority Hintsのサポートなど","relatedLinks":[]},{"category":"Article","title":"React Labs: What We&#039;ve Been Working On – March 2023 – React","url":"https://react.dev/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023","tags":["React","article"],"content":"React Labsで進めているプロジェクトについて。\nReact Server Componentsで\"use client\"ディレクティブを使うようになり、サーバコンポーネントではasync/awaitを利用できるようになる予定。\nSuspenseでのCSSやFontのロード、`<meta>`などのビルドインサポート、Reactの最適化コンパイラの開発状況などについて","relatedLinks":[]},{"category":"Article","title":"RailsアプリのフロントエンドをじわじわとNext.jsにリプレースした話と、その振り返り - High Link テックブログ","url":"https://tech.high-link.co.jp/entry/Rails-application-replace-Next.js","tags":["Next.js","rails","article","JavaScript"],"content":"NginxでパスごとにRailsからNext.jsへリクエストを切り替えながら、移行していったという話。\n認証の問題、`<Link>`によるフロントエンドのルーティングとの齟齬の問題など移行時の対応について","relatedLinks":[]},{"category":"Article","title":"CSS text-wrap: balance - Chrome Developers","url":"https://developer.chrome.com/en/blog/css-text-wrap-balance/","tags":["CSS","article"],"content":"Chromeにフラグ付きで実装されているCSS `text-wrap: balance`について。\nテキストブロックの改行位置を調整するタイポグラフィ用のプロパティ","relatedLinks":[]},{"category":"Article","title":"What are source maps?","url":"https://web.dev/source-maps/","tags":["sourcemap","article","debug"],"content":"Source Mapsとは何かについて。\nSource Mapsのフォーマット、読み方、ツールでのサポート、`x_google_ignoreList`の独自拡張などについて","relatedLinks":[{"title":"The ","url":"https://developer.chrome.com/en/articles/x-google-ignore-list/"}]},{"category":"Article","title":"TypeScript 5.0 で追加された verbatimModuleSyntax とは何か？","url":"https://zenn.dev/teppeis/articles/2023-04-typescript-5_0-verbatim-module-syntax","tags":["TypeScript","article"],"content":"TypeScript 5.0で追加された`verbatimModuleSyntax`について。\n`import type`をそのまま削除し、`import`は残すというシンプルな動作について","relatedLinks":[]},{"category":"Article","title":"TypeScript で&quot;moduleResolution&quot;: &quot;Node&quot;は使わないほうがいい","url":"https://blog.s2n.tech/articles/dont-use-moduleresolution-node","tags":["TypeScript","article"],"content":"TypeScriptの`moduleResolution`オプションに指定できる`Node`/`NodeNext`/`Bundler`の挙動の違いについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"lxsmnsyc/seroval: Stringify JS values","url":"https://github.com/lxsmnsyc/seroval","tags":["JavaScript","library"],"content":"JavaScriptのオブジェクトをJavaScriptのコードやJSONのシリアライズ/デシリアライズするライブラリ。\nシリアライズするかを機能ごとの無効化するオプションを持っている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"wantedly/react-declassify: say goodbye to class components","url":"https://github.com/wantedly/react-declassify","tags":["React","JavaScript","Tools"],"content":"ReactのクラスコンポーネントをHooksを使うように変換するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"unjs/magicast: 🧀 Programmatically modify JavaScript and TypeScript source codes with a simplified, elegant and familiar syntax powered by recast and babel.","url":"https://github.com/unjs/magicast","tags":["JavaScript","AST","library"],"content":"JavaScriptのAST操作を簡単に行うためのライブラリ。","relatedLinks":[]}]},{"meta":{"title":"2023-04-13のJS: Storybook 7.0、JSPM CLI、Next.js 13.3","author":"azu","layout":"post","date":"2023-04-13T01:48:33.699Z","category":"JSer","tags":["Tools","debug","node.js","Chrome","TypeScript"],"url":"https://jser.info/2023/04/13/storybook-7.0-jspm-cli-next.js-13.3/"},"items":[{"category":"Headline","title":"Release @sveltejs/kit@1.15.2 · sveltejs/kit","url":"https://github.com/sveltejs/kit/releases/tag/%40sveltejs%2Fkit%401.15.2","tags":["Svelte","ReleaseNote"],"content":"Svelte Kit 1.15.2リリース。\nCSRFに関する脆弱性が修正されているセキュリティリリース","relatedLinks":[{"title":"Release @sveltejs/kit@1.15.1 · sveltejs/kit","url":"https://github.com/sveltejs/kit/releases/tag/%40sveltejs%2Fkit%401.15.1"}]},{"category":"Headline","title":"JSPM - JSPM CLI Relaunch - Import Map Package Management","url":"https://jspm.org/jspm-cli","tags":["JavaScript","module","Tools","ReleaseNote"],"content":"JSPM 3.0リリース。\n全てのブラウザがImport Mapsをサポートしたので、JSPMのCLIをImport Mapsの管理に利用できるように大きく変更している","relatedLinks":[]},{"category":"Headline","title":"Blog - Next.js 13.3 | Next.js","url":"https://nextjs.org/blog/next-13-3","tags":["Next.js","ReleaseNote"],"content":"Next.js 13.3リリース。\nファイル名ベースのMetadata APIのサポート、Satoriを使った`ImageResponse`のサポート、App Routerでstatic exportのサポート。\n`@folder`の命名規則を使ったParallel RoutesとIntercepting Routeのサポートなど","relatedLinks":[{"title":"Metadata | Next.js","url":"https://beta.nextjs.org/docs/api-reference/metadata#file-based-metadata"}]},{"category":"Headline","title":"Release v0.30.0 · vitest-dev/vitest","url":"https://github.com/vitest-dev/vitest/releases/tag/v0.30.0","tags":["vite","testing","library","ReleaseNote"],"content":"vitest v0.30.0リリース。\nmonorepoをサポートするworkspace機能の追加、snapshotのロジックを`@vitest/snapshot`パッケージに移動など","relatedLinks":[]},{"category":"Headline","title":"Chrome 113 beta - Chrome Developers","url":"https://developer.chrome.com/en/blog/chrome-113-beta/","tags":["Chrome","ReleaseNote"],"content":"Chrome 113 Betaリリース。\nCSS Media Queryで`overflow-inline`/`overflow-block`/`update`をサポート、`image-set()`のサポート。\n`Headers.getSetCookie`のサポート、WebGPUのサポート。\n`document.domain`への代入を代入を非推奨化など","relatedLinks":[]},{"category":"Headline","title":"Node v19.9.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v19.9.0","tags":["node.js","ReleaseNote"],"content":"Node.js v19.9.0リリース。\n`TracingChannel`の追加、`URL.canParse`の追加など","relatedLinks":[]},{"category":"Headline","title":"Storybook 7.0","url":"https://storybook.js.org/blog/storybook-7-0/","tags":["JavaScript","debug","Tools","ReleaseNote"],"content":"Storybook 7.0リリース。\nUIデザインの刷新、Vite/Next.js/SvelteKit が設定なしで利用できるように、Framework APIの追加、Story Format v3など","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · liriliri/eruda","url":"https://github.com/liriliri/eruda/releases/tag/v3.0.0","tags":["browser","debug","library","ReleaseNote"],"content":"モバイルブラウザでも利用できる開発者ツールライブラリであるeruda 3.0リリース","relatedLinks":[]},{"category":"Article","title":"What&#039;s New in DevTools (Chrome 113) - Chrome Developers","url":"https://developer.chrome.com/en/blog/new-in-devtools-113/","tags":["Chrome","debug","article"],"content":"Chrome 113のDevToolsの変更点について。\nレスポンスのヘッダを書き換え可能に、`x_google_ignoreList`のオプションに対応。\nRecordパネルでassertionを追加できるように、JavaScript Profilerパネルを廃止など","relatedLinks":[]},{"category":"Article","title":"Announcing WCGI: WebAssembly + CGI","url":"https://wasmer.io/posts/announcing-wcgi","tags":["WebAssembly","article"],"content":"WasmerがCGIサーバのWasmファイルの実行をする`wcgi`のサポートを追加した","relatedLinks":[]},{"category":"Article","title":"Popularity of top frameworks on Netlify: Next.js, Gatsby, create-react-app","url":"https://www.netlify.com/blog/framework-popularity-on-netlify/","tags":["article","JavaScript"],"content":"Netlifyにデプロイされているアプリケーションが利用しているフレームワークの調査記事。\nReactベースのcreate-react-app/Next.js/Gatsbyが多く、続いてNuxtやVueとなっている。\nエンタープライズアカウントでの傾向の違いなどについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"divriots/jampack: Optimizes static websites for best user experience and best Core Web Vitals scores.","url":"https://github.com/divriots/jampack","tags":["JavaScript","performance","Tools","HTML"],"content":"静的サイトジェネレータなどによって出力されたHTML/CSS/JSや画像などを最適化するツール。\n画像の最適化、Above the foldの最適化、アセットの圧縮、`<img>`タグの属性の修正などを行う","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Hexagon/croner: Trigger functions or evaluate cron expressions in JavaScript or TypeScript. No dependencies. Most features. Node. Deno. Bun. Browser.","url":"https://github.com/hexagon/croner","tags":["JavaScript","library"],"content":"cron構文で関数を実行できるジョブライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nitrogql/mod.rs at master · uhyo/nitrogql · GitHub","url":"https://github.com/uhyo/nitrogql","tags":["TypeScript","GraphQL","library"],"content":"GraphQLをTypeScriptで利用するためのツールキット。\nGraphQLの構文チェック、GraphQLファイルからTypeScriptの型定義の生成、GraphQLファイルをロードするloaderを提供する","relatedLinks":[]},{"category":"SoftwareLibrary","title":"open-draft/logger: Environment-agnostic, ESM-friendly logger for simple needs.","url":"https://github.com/open-draft/logger","tags":["JavaScript","TypeScript","library"],"content":"ESM-friendlyな`debug`モジュール的なロガーライブラリ。\n`DEBUG`環境変数に対応している","relatedLinks":[]},{"category":"Book","title":"Node.js Secure Coding: Defending Against Command Injection Vulnerabilities","url":"https://www.nodejs-security.com/","tags":["node.js","book","security"],"content":"Node.jsのセキュリティについての書籍","relatedLinks":[]}]},{"meta":{"title":"2023-04-19のJS: vueuse 10.0.0、Immer 10.0.0、Node.js 20.0.0","author":"azu","layout":"post","date":"2023-04-19T04:47:07.134Z","category":"JSer","tags":["node.js","TypeScript","Vue","monorepo","Tools"],"url":"https://jser.info/2023/04/19/vueuse-10.0.0-immer-10.0.0-node.js-20.0.0/"},"items":[{"category":"Headline","title":"Node v18.16.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v18.16.0","tags":["node.js","ReleaseNote"],"content":"Node.js v18.16.0リリース。\nSingle execute applicationの初期実装を追加、URLパーサをAdaに変更しパフォーマンスの改善。","relatedLinks":[]},{"category":"Headline","title":"Release v10.0.0 · vueuse/vueuse","url":"https://github.com/vueuse/vueuse/releases/tag/v10.0.0","tags":["Vue","library","ReleaseNote"],"content":"vueuse v10.0.0リリース。\n破壊的な変更として`isFunction`と`isString`を削除、`computedAsync`のデフォルト挙動をshallowに変更、`resolveRef`を`toRef`にリネーム、非推奨なAPIの削除など。\n機能追加として、`createReusableTemplate`/`createTemplatePromise`/`useAnimate`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · lerna-lite/lerna-lite","url":"https://github.com/lerna-lite/lerna-lite/releases/tag/v2.0.0","tags":["JavaScript","monorepo","Tools","ReleaseNote"],"content":"lerna-lite 2.0.0リリース。\n`--use-nx`を削除、`lerna version`と`lerna publish`をオプショナルなコマンドに変更など","relatedLinks":[]},{"category":"Headline","title":"&lt;/&gt; htmx ~ htmx 1.9.0 has been released!","url":"https://htmx.org/posts/2023-04-11-htmx-1-9-0-is-released/","tags":["HTML","JavaScript","library","ReleaseNote"],"content":"htmx 1.9.0リリース。\nView Transitions APIのサポート","relatedLinks":[]},{"category":"Headline","title":"Release v10.0.0 · immerjs/immer","url":"https://github.com/immerjs/immer/releases/tag/v10.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"Immer v10.0.0リリース。\nES5環境をサポート外にしたことでIEのサポート終了、プレーンなオブジェクトにおけるgetterとsetterをデフォルトでは無視することでパフォーマンスの改善。\nPromiseベースのReducerのサポート終了、`enableAllPlugins`を削除など","relatedLinks":[]},{"category":"Headline","title":"Firefox 112.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/112.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 112リリース。\nHTMLの`inert`属性のサポート、CSSのExponential functionsをサポートなど","relatedLinks":[{"title":"Firefox 112 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/112"}]},{"category":"Headline","title":"Release v116 · esm-dev/esm.sh","url":"https://github.com/esm-dev/esm.sh/releases/tag/v116","tags":["cdn","JavaScript","ReleaseNote"],"content":"esm.sh 116リリース。\n`esm.sh/gh/OWNER/REPO/PATH`でGitHubのリポジトリからファイルをロードできるように","relatedLinks":[]},{"category":"Headline","title":"Node v20.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v20.0.0","tags":["node.js","ReleaseNote"],"content":"Node.js v20.0.0リリース。\n実験的にPermission Modelを追加、ESM Loader Hooksを別スレッドで実行するように、`import.meta.resolve()`を同期処理に変更。\nV8 11.3にアップデート、Test RunnnerをStableに変更、Single executable appsの改善、Web Crypto APIの互換性改善など","relatedLinks":[{"title":"Node.js 20 Now Available - OpenJS Foundation","url":"https://openjsf.org/blog/2023/04/18/node-js-20-now-available/"}]},{"category":"Headline","title":"Announcing TypeScript 5.1 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-1-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.1 Betaリリース。\n`undefined`を`return`する関数の型の扱いを改善、getterとsetter間でそれぞれ異なる型を指定できるように、JSXの改善。\nNode.js 14.17未満のサポート終了、`typeRoots`の上向きのパッケージ解決を無効化など","relatedLinks":[]},{"category":"Article","title":"The Performance Golden Rule Revisited - Web Performance Consulting | TimKadlec.com","url":"https://timkadlec.com/remembers/2023-04-10-the-golden-rule-revisited/","tags":["article","performance"],"content":"> エンドユーザーの応答時間の80～90％はフロントエンドに費やされる\n\nというウェブサイトのパフォーマンスにおけるGolden Ruleを現在のウェブサイトで再調査した記事","relatedLinks":[]},{"category":"Article","title":"Trying Node.js Test Runner | Better world by better software","url":"https://glebbahmutov.com/blog/trying-node-test-runner/","tags":["node.js","article","testing"],"content":"Node.jsの`node:test`モジュールを使ったテストと`node --test`での実行について","relatedLinks":[]},{"category":"Article","title":"新しいNext.jsの入門 ─ App DirectoryによるWeb開発をハンズオンで理解しよう - エンジニアHub｜Webエンジニアのキャリアを考える！","url":"https://eh-career.com/engineerhub/entry/2023/04/18/093000","tags":["Next.js","tutorial","article"],"content":"Next.jsのapp directoryを使ったアプリケーション開発のチュートリアル","relatedLinks":[]},{"category":"SoftwareLibrary","title":"yoavbls/pretty-ts-errors: 🔵 Make TypeScript errors prettier and human-readable in VSCode 🎀","url":"https://github.com/yoavbls/pretty-ts-errors","tags":["TypeScript","VSCode","Extension"],"content":"TypeScriptの型エラーをわかりやすく表示するVSCode拡張","relatedLinks":[]},{"category":"SoftwareLibrary","title":"HeyPuter/kv.js: Advanced in-memory caching module for JavaScript. For when you need caching but running Redis or Memcached would be an overkill.","url":"https://github.com/HeyPuter/kv.js","tags":["JavaScript","library"],"content":"RedisやMemcachedとよく似たコマンド(関数)をもつIn-MemoryなKVSライブラリ","relatedLinks":[]}]},{"meta":{"title":"2023-04-30のJS: Vite 4.3、Deno 1.33、Node.js 14から18へのアップデート","author":"azu","layout":"post","date":"2023-04-30T04:13:45.146Z","category":"JSer","tags":["node.js","slide","npm","CSS","JSON"],"url":"https://jser.info/2023/04/30/vite-4.3-deno-1.33-node.js-1418/"},"items":[{"category":"Headline","title":"Vite 4.3 is out! | Vite","url":"https://vitejs.dev/blog/announcing-vite4-3.html","tags":["vite","ReleaseNote"],"content":"Vite 4.3リリース。\n起動速度を40%から80%程度改善、HMRの処理時間を20%から40%程度改善など","relatedLinks":[{"title":"How we made Vite 4.3 faaaaster 🚀 | sun0day","url":"https://sun0day.github.io/blog/vite/why-vite4_3-is-faster.html"}]},{"category":"Headline","title":"Release v5.80.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.80.0","tags":["webpack","ReleaseNote"],"content":"webpack v5.80.0リリース。\n`import.meta`に対するdestructuringのサポート、`await`に対するdestructuringでのTree Shakingをサポート。\nESMで書かれたローダーをサポート、`exports`フィールドのwild cardパターンをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.33.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.33.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.33.0リリース。\n`locator.or()`の追加、`locator.filter`に`hasNot`と`hasNotText`オプションを追加、`toBeAttached` Assertioを追加など","relatedLinks":[]},{"category":"Headline","title":"Deno 1.33: Deno 2 is coming","url":"https://deno.com/blog/v1.33","tags":["deno","ReleaseNote"],"content":"Deno v1.33リリース。\nunstable APIとしてDeno KVを追加、`deno.json`の形式変更、Dynamic Importと権限チェックの変更。\nNode.jsの互換性として`crypto`や`vm`の対応改善、npm pacakgeのキャッシュの改善など。\n`Deno.run`の非推奨化、`Deno.serve`のAPIの変更、`fs.exists`が非推奨ではなくなるなど","relatedLinks":[{"title":"Deno KV 正式発表！cloudflare KVとcloudflare D1のいいとこ取り？ - Qiita","url":"https://qiita.com/access3151fq/items/ee1cf3e5fc35150dd910"}]},{"category":"Article","title":"Badging for Home Screen Web Apps | WebKit","url":"https://webkit.org/blog/14112/badging-for-home-screen-web-apps/","tags":["JavaScript","article"],"content":"`navigator.setAppBadge` APIでのバッジの追加について","relatedLinks":[]},{"category":"Article","title":"alxolr | How to process a CSV file five times faster in NodeJs with Rust and Napi rs","url":"https://www.alxolr.com/articles/how-to-process-a-csv-file-five-times-faster-in-node-js-with-rust-and-napi-rs","tags":["csv","node.js","Rust","article"],"content":"CSVをパースする処理をRustで書いて、Napi rsでNode.jsから利用する話","relatedLinks":[]},{"category":"Article","title":"Introducing npm package provenance | The GitHub Blog","url":"https://github.blog/2023-04-19-introducing-npm-package-provenance/","tags":["npm","security","article"],"content":"npmパッケージが、どのソースコードのコミット、ビルドの設定なのかのprovenanceを紐づけられる`--provenance`フラグをサポート。\n現在はGitHub Actionsからのpublishにおける紐付けをサポートしてる。\nサプライチェーンの問題が起きた時に、パッケージに含まれるprovenanceをチェックすることで、整合性がチェックできる","relatedLinks":[{"title":"Introducing npm package SLSA provenance support | Open Source Insights","url":"https://blog.deps.dev/npm-provenance/"}]},{"category":"Article","title":"CSS update Media Query - Chrome Developers","url":"https://developer.chrome.com/en/blog/css-update-media-query/","tags":["CSS","article"],"content":"`update` Media Queryについて。\nデバイスのリフレッシュレートが`fast`/`slow`/`none`かを判定したスタイルを書ける。","relatedLinks":[]},{"category":"Article","title":"What&#039;s new in ECMAScript 2023 | pawelgrzybek.com","url":"https://pawelgrzybek.com/whats-new-in-ecmascript-2023/","tags":["ECMAScript","JavaScript","article"],"content":"ES2023で追加される機能について。\n`Array.prototpype.findLast`、Hashbangのサポート、WeakMapのキーとしてSymbolが利用できるように。\n配列に対してimmutableな操作である`toReversed`/`toSorted`/`toSpliced`/`with`の追加など","relatedLinks":[]},{"category":"Article","title":"CSS Custom Properties Beyond the :root · Matthias Ott – User Experience Designer","url":"https://matthiasott.com/notes/custom-properties-beyond-the-root","tags":["CSS","article"],"content":"なぜ`:root`でCSS Custom Propertyを定義するのかについて","relatedLinks":[]},{"category":"Article","title":"WebContainers now run on Safari, iOS, and iPadOS","url":"https://blog.stackblitz.com/posts/webcontainers-are-now-supported-on-safari/","tags":["JavaScript","webservice","article"],"content":"WebContainersがSafariをサポート","relatedLinks":[]},{"category":"Article","title":"Node.js v20 の主な変更点 - 別にしんどくないブログ","url":"https://shisama.hatenablog.com/entry/2023/04/24/083000","tags":["node.js","article"],"content":"Node.js 20の変更点について","relatedLinks":[]},{"category":"Article","title":"A Gentle Introduction to Islands","url":"https://deno.com/blog/intro-to-islands","tags":["JavaScript","deno","article"],"content":"Islands ArchitectureとDenoのFreshにおける実装について","relatedLinks":[]},{"category":"SlideVideo","title":"これから先も戦えるサードパーティスクリプト - Speaker Deck","url":"https://speakerdeck.com/nichimu/korekaraxian-mozhan-erusadopateisukuriputo","tags":["JavaScript","slide"],"content":"サードパーティスクリプトのファイルサイズを小さく保つために、機能をプラグインとしてプロジェクトごとに取捨選択してビルドできるようにしているという話。\nまた、プラグイン間のデータのやり取りにはPub/Subを利用している点についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"現実世界におけるスキーマ設計の妥協 - Speaker Deck","url":"https://speakerdeck.com/sadnessojisan/xian-shi-shi-jie-niokerusukimashe-ji-notuo-xie","tags":["JSON","JavaScript","slide"],"content":"JSON Schema/Swagger/zod/GraphQL/gRPCなどのスキーマとバリデーションについてのスライド。\n広く使われているJSON Schemaをベースにしたバリデーションを既存のアプリケーションに導入する話","relatedLinks":[]},{"category":"SlideVideo","title":"Corepackを使ってNode.jsをアップデートする ⬆️⬆️","url":"https://azu.github.io/slide/2023/nodejs-corepack/corepack.html","tags":["node.js","npm","slide"],"content":"Node.js 14から18へのアップデート時に、npmも多く変わってしまっているので、Node.jsのアップデートとnpmのアップデートをCorepackを使って別々に行う方法についてのスライド。\nまた、Node.jsアップデート時に起きる問題をOS、native addon、peerDependencies、Node.jsそのものに分けて紹介している。","relatedLinks":[{"title":"Node.js 14から18へアップデートする方法について | Web Scratch","url":"https://efcl.info/2023/04/29/node.js-14-to-18/"}]},{"category":"SoftwareLibrary","title":"Playground - React JSON Form","url":"https://bhch.github.io/react-json-form/playground/","tags":["JavaScript","JSON","React","library"],"content":"django-jsonform/JSON SchemaからFormを生成するReact Component","relatedLinks":[]},{"category":"Book","title":"フロントエンド開発のためのテスト入門 今からでも知っておきたい自動テスト戦略の必須知識 電子書籍｜翔泳社の本","url":"https://www.shoeisha.co.jp/book/detail/9784798178639","tags":["JavaScript","debug","testing","book"],"content":"フロントエンドのテストについての書籍。\nJest／Testing Library／Storybook／reg-suit／Playwrightなどについて","relatedLinks":[]}]},{"meta":{"title":"2023-05-04のJS: Qwik 1.0.0、Angular 16、Karmaが非推奨へ","author":"azu","layout":"post","date":"2023-05-04T04:13:33.809Z","category":"JSer","tags":["node.js","Chrome","testing","Remix","Ember"],"url":"https://jser.info/2023/05/04/qwik-1.0.0-angular-16-karma/"},"items":[{"category":"Headline","title":"Release v1.16.0 · remix-run/remix","url":"https://github.com/remix-run/remix/releases/tag/remix@1.16.0","tags":["Remix","ReleaseNote"],"content":"Remix 1.16.0リリース。\nCSS Modules/Vanilla Extract/PostCSSのサポートをStable化。tailwindのサポートをStable化。\nOpt-inで新しい`remix dev`を利用できるようになるなど。","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · redwoodjs/redwood","url":"https://github.com/redwoodjs/redwood/releases/tag/v5.0.0","tags":["JavaScript","node.js","library","ReleaseNote"],"content":"Redwood v5.0.0リリース。\nReact 18、Chakra UI v2にアップグレード、Serverless-AWS deployのサポートを終了。\nデフォルトのターゲットをNode.js 18に変更など","relatedLinks":[]},{"category":"Headline","title":"Introducing storage on Vercel – Vercel","url":"https://vercel.com/blog/vercel-storage","tags":["webservice","news"],"content":"VercelがUpstashベースのKV Storage、NeonベースのPostgres、Cloudflare R2ベースのBlobストレージのサポート","relatedLinks":[]},{"category":"Headline","title":"docs: Add deprecation notice to Karma README · karma-runner/karma@450fdfd","url":"https://github.com/karma-runner/karma/commit/450fdfdac5b999967daec1020f1ac69cf9b854ab","tags":["news","JavaScript","testing","library"],"content":"KarmaがDeprecatedとなり、今後は機能追加やバグ修正を受け付けないようになる。\n移行パスとしてJest、Web Test Runner、jasmine-browser-runner、Vitestなどを推奨している。","relatedLinks":[{"title":"Moving Angular CLI to Jest and Web Test Runner | by Doug Parker | Apr, 2023 | Angular Blog","url":"https://blog.angular.io/moving-angular-cli-to-jest-and-web-test-runner-ef85ef69ceca"}]},{"category":"Headline","title":"Qwik Reaches v1.0","url":"https://www.builder.io/blog/qwik-v1","tags":["JavaScript","library","ReleaseNote"],"content":"Qwik 1.0リリース。","relatedLinks":[{"title":"Release v1.0.0 · BuilderIO/qwik","url":"https://github.com/BuilderIO/qwik/releases/tag/v1.0.0"}]},{"category":"Headline","title":"Node v20.1.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v20.1.0","tags":["node.js","ReleaseNote"],"content":"Node.js v20.1.0リリース。\n`CallTrakcer`をDeperecatedに変更、`readdir`/`opendir`メソッドに`recursive`オプションを追加、`cp`メソッドに`mode`フラグを追加。\n`http.createServer`メソッドに`highWaterMark`オプションを追加など","relatedLinks":[]},{"category":"Headline","title":"Angular v16 is here!. Six months ago, we reached a… | by Minko Gechev | May, 2023 | Angular Blog","url":"https://blog.angular.io/angular-v16-is-here-4d7a28ec680d","tags":["Angular","ReleaseNote"],"content":"Angular 16リリース。\n新しいReactiveの仕組みとしてAngular Signals利用できるように。\nSSRとHydrationのパフォーマンス改善、standalone APIへの移行ツールの追加、esbuildベースのビルドを利用できるように。\nKarmaをDeprecatedとし、JestとWeb Test Runnerのサポートを追加など","relatedLinks":[]},{"category":"Headline","title":"Chrome 114 beta - Chrome Developers","url":"https://developer.chrome.com/en/blog/chrome-114-beta/","tags":["Chrome","ReleaseNote"],"content":"Chrome 114 Betaリリース。\nCSSの`text-wrap: balance`の追加、`overflow: overlay`の追加。\nBFCacheが効かない理由をPerformanceNavigationTiming APIで取得できるように、Cookieの`Partitioned`属性に対応。\n`scrollend`イベント、Popover APIのサポートなど。\nOrigin TrialとしてBackground Blur APIを追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing Tauri 1.3.0 | Tauri Apps","url":"https://tauri.app/blog/2023/05/03/tauri-1-3/","tags":["Rust","JavaScript","ReleaseNote"],"content":"Tauri 1.3.0リリース。\nセキュリティの改善が主となるリリース。\nリモートIPCの対象を設定できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v0.31.0 · vitest-dev/vitest","url":"https://github.com/vitest-dev/vitest/releases/tag/v0.31.0","tags":["vite","testing","ReleaseNote"],"content":"vitest v0.31.0リリース。\n`vi.hoisted`の追加、`test`に`repeats`オプションを追加など","relatedLinks":[]},{"category":"Headline","title":"Say Allo&#039; to the new Inquirer (release of the rewrite) · SBoudrias/Inquirer.js · Discussion #1214","url":"https://github.com/SBoudrias/Inquirer.js/discussions/1214","tags":["node.js","library","ReleaseNote"],"content":"Node.jsのターミナルプロンプトライブラリであるinquirerが`@inquirer/prompts`として新しく公開された。\n全ての機能を含む`@inquirer/prompts`と個別の機能ごとのパッケージをそれぞれ公開されている。","relatedLinks":[]},{"category":"Headline","title":"jsdom/Changelog.md at e5b8e8afdebee816862584cb7d45bdc6f86d54af · jsdom/jsdom","url":"https://github.com/jsdom/jsdom/blob/HEAD/Changelog.md#%E2%80%8B2200","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"jsdom 22.0.0リリース。\nNode.js 14のサポート終了、`browserified`フィールドを使ったbrowser向けのbundleのサポートを終了など","relatedLinks":[]},{"category":"Headline","title":"Announcing Babylon.js 6.0. Our mission is to build one of the most… | by Babylon.js | Apr, 2023 | Medium","url":"https://babylonjs.medium.com/announcing-babylon-js-6-0-dcb5f1662e3a","tags":["JavaScript","3D","library","ReleaseNote","WebGL"],"content":"Babylon.js 6.0リリース。\nHavokの物理エンジンの追加、パフォーマンス優先モードの追加、流体レンダリングのサポートなど。\nGUIエディタをStableへと変更。スクリーンリーダのサポート、ドキュメントの刷新など","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · markedjs/marked","url":"https://github.com/markedjs/marked/releases/tag/v5.0.0","tags":["Markdown","JavaScript","library"],"content":"marked v5.0.0リリース。\nいくつかのオプションをdeprecateにし、代わりにパッケージ化。\nNode.js 14と16のサポートを終了。","relatedLinks":[]},{"category":"Article","title":"EmberData 5.X Update","url":"https://blog.emberjs.com/ember-data-5-x-update-2023-04-15/","tags":["Ember","article"],"content":"EmberData 5.xでは大きなパラダイムチェンジを入れる予定であるため、EmberData 4.12のLTSは6.xがリリースされるまで延長される予定。","relatedLinks":[]},{"category":"Article","title":"【Chrome DevTools】Performance Insightsでフロントエンドパフォーマンス改善","url":"https://zenn.dev/chot/articles/ce7296779048a2","tags":["Chrome","performance","article"],"content":"Chrome DevToolsのPerformance Insightsの使い方について。\nパフォーマンスタイムライン、メトリクスの読み方、何かブロックになっているかを見る方法について","relatedLinks":[]},{"category":"Article","title":"React Canaries: Enabling Incremental Feature Rollout Outside Meta – React","url":"https://react.dev/blog/2023/05/03/react-canaries","tags":["React","article"],"content":"ReactにCanaryリリースが追加された。\n`npm install react@canary`で実験的な機能を含めたものをインストールできるようになる。","relatedLinks":[]},{"category":"Article","title":"Exploring The Potential Of Web Workers For Multithreading On The Web — Smashing Magazine","url":"https://www.smashingmagazine.com/2023/04/potential-web-workers-multithreading-web/","tags":["webworker","article"],"content":"WebWorkerのユースケースについて","relatedLinks":[]}]},{"meta":{"title":"2023-05-10のJS: Next.js 13.4(App RouterがStable化)、Firefox 113","author":"azu","layout":"post","date":"2023-05-10T00:40:58.143Z","category":"JSer","tags":["React","Next.js","Firefox","astro","browser"],"url":"https://jser.info/2023/05/10/next.js-13.4app-routerstable-firefox-113/"},"items":[{"category":"Headline","title":"Blog - Next.js 13.4 | Next.js","url":"https://nextjs.org/blog/next-13-4","tags":["Next.js","ReleaseNote"],"content":"Next.js 13.4リリース。\nApp RouterをStableに変更、TurbopackをBetaに変更。\n実験的な機能としてServer Actionsを追加など","relatedLinks":[]},{"category":"Headline","title":"Astro 2.4 | Astro","url":"https://astro.build/blog/astro-240/","tags":["astro","ReleaseNote"],"content":"Astro 2.4リリース。\n`scopedStyleStrategy`オプションの追加、`<Code />`コンポーネントの改善、SSR時にもサイトマップをサポート。\nフラグ付きでmiddlewareのサポート、CSSのインライン化のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v0.1.10 · web-infra-dev/rspack","url":"https://github.com/web-infra-dev/rspack/releases/tag/v0.1.10","tags":["webpack","rspack","ReleaseNote"],"content":"rspack 0.1.10リリース。\n`compilation.modules`のサポート、`splitChunks`オプションの互換性の改善、Angularの初期サポートの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v8.4.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v8.4.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v8.4.0リリース。\n`pnpm publish --provenance`をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Firefox 113.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/113.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 113リリース。\nCSSの`color()`/`lab()`/`lch()`などのサポート、`of <selector>`構文をサポート。\nCompression Streams APIのサポート、AV1 video codecをサポート。\nアクセシビリティエンジンを刷新し、スクリーンリーダなどを使った際のパフォーマンスを改善など。","relatedLinks":[{"title":"Firefox 113 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/113"},{"title":"Firefox 113 Significantly Boosts Accessibility Performance - Mozilla Accessibility","url":"https://blog.mozilla.org/accessibility/firefox-113-accessibility-performance/"},{"title":"Cache the World: Turbo Charging Firefox Accessibility Performance and Maintainability | Jantrid","url":"https://www.jantrid.net/2022/12/22/Cache-the-World/"}]},{"category":"Article","title":"Origin Private File Systemを使ってブラウザ上でファイルを高速に操作しよう","url":"https://zenn.dev/cybozu_frontend/articles/origin-private-file-system","tags":["JavaScript","article"],"content":"Origin Private File Systemの基本的な使い方について","relatedLinks":[]},{"category":"Article","title":"5 Lessons Learned From Taking Next.js App Router to Production - Inngest Blog","url":"https://www.inngest.com/blog/5-lessons-learned-from-taking-next-js-app-router-to-production","tags":["React","Next.js","article"],"content":"Next.jsのApp Routerについて。\nクライアントサイドのキャッシュとサーバサイドのキャッシュ、Search Parameterの扱い、ディレクトリ構造、学習リソースについて。","relatedLinks":[]},{"category":"Article","title":"Chromium Blog: An Update on the Lock Icon","url":"https://blog.chromium.org/2023/05/an-update-on-lock-icon.html","tags":["Chrome","security","article"],"content":"Chrome 117でメニューの鍵アイコンをやめて、調整アイコンに変更するという話","relatedLinks":[]},{"category":"Article","title":"Cache the World: Turbo Charging Firefox Accessibility Performance and Maintainability | Jantrid","url":"https://www.jantrid.net/2022/12/22/Cache-the-World/","tags":["Firefox","accessibility","article"],"content":"Firefox 113で入ったアクセシビリティエンジンの刷新の詳細。\nQuantumでパフォーマンスが低下したのを、キャッシュによって改善する取り組み。\nアクセシビリティツリーのキャッシュをするが、そのキャッシュを同期する仕組みについて","relatedLinks":[{"title":"Firefox 113 Significantly Boosts Accessibility Performance - Mozilla Accessibility","url":"https://blog.mozilla.org/accessibility/firefox-113-accessibility-performance/"}]},{"category":"WebsiteDocument","title":"Unlighthouse - Site-wide Google Lighthouse · Unlighthouse","url":"https://unlighthouse.dev/","tags":["browser","JavaScript","Tools","performance","CI"],"content":"サイトをクロールしてLighthouseによるスキャンをまとめてやってくれるツール。\nクロール対象をルーティングから定義もでき、結果をまとめたレポートを生成してくれる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"natemoo-re/ultramatter: &lt;1kB frontmatter parser that supports a reasonable subset of YAML","url":"https://github.com/natemoo-re/ultramatter","tags":["JavaScript","library"],"content":"frontmatterをパースする小さなライブラリ。\nYAMLのサブセットのみを扱うことで、ファイルサイズを小さくしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vadimdemedes/ink-ui: 💄 Ink-redible command-line interfaces made easy","url":"https://github.com/vadimdemedes/ink-ui","tags":["JavaScript","React","console","library"],"content":"Inkを使ったターミナル向けのUIコンポーネント。\n対話的な入力フォーム、選択肢、ローディング、\nアラート、リスト表示などのコンポーネント","relatedLinks":[]},{"category":"Book","title":"React Application Architecture for Production | Packt","url":"https://www.packtpub.com/product/react-application-architecture-for-production/9781801070539","tags":["React","book"],"content":"Reactでのアプリケーション開発についての書籍。\n著者はbulletproof-reactの人","relatedLinks":[{"title":"PacktPublishing/React-Application-Architecture-for-Production: React Application Architecture for Production, published by Packt","url":"https://github.com/PacktPublishing/React-Application-Architecture-for-Production/tree/main"},{"title":"alan2207/bulletproof-react: 🛡️ ⚛️ A simple, scalable, and powerful architecture for building production ready React applications.","url":"https://github.com/alan2207/bulletproof-react"}]}]},{"meta":{"title":"2023-05-19のJS: jQuery 3.7.0、Vue 3.3、Bun 0.6.0(`bun build`)","author":"azu","layout":"post","date":"2023-05-19T06:39:39.589Z","category":"JSer","tags":["node.js","Vue","TypeScript","Tools","V8"],"url":"https://jser.info/2023/05/19/jquery-3.7.0-vue-3.3-bun-0.6.0bun-build/"},"items":[{"category":"Headline","title":"Release v120 · esm-dev/esm.sh","url":"https://github.com/esm-dev/esm.sh/releases/tag/v120","tags":["JavaScript","cdn","library","ReleaseNote"],"content":"esm.sh v120リリース。\nesm.shの処理をCloudflare Worker上でしている`esm-worker`パッケージを公開。\nbuild APIが`types`オプションをサポート。","relatedLinks":[]},{"category":"Headline","title":"Announcing Dart 3. 100% sound null safety. Records… | by Michael Thomsen | Dart | May, 2023 | Medium","url":"https://medium.com/dartlang/announcing-dart-3-53f065a10635","tags":["dart","ReleaseNote"],"content":"Dart 3リリース。\nnull safe、Record、パターンマッチ、クラスの改善。\nWebAssemblyへのコンパイルに対応など","relatedLinks":[]},{"category":"Headline","title":"jQuery 3.7.0 Released: Staying in Order | Official jQuery Blog","url":"https://blog.jquery.com/2023/05/11/jquery-3-7-0-released-staying-in-order/","tags":["jquery","ReleaseNote"],"content":"jQuery 3.7.0リリース。\n`uniqueSort`メソッドの追加、単位なしのCSSプロパティのサポート、パフォーマンスの改善。\n\nIEでは`focus`/`blur`が非同期で実行されるが、他のブラウザでは同期的に実行されるため、挙動の違いが発生していた。\nIEでも同期的に実行される`focusin`/`focusout`を使いシミュレートすることで修正された。","relatedLinks":[]},{"category":"Headline","title":"Announcing Vue 3.3 | The Vue Point","url":"https://blog.vuejs.org/posts/vue-3-3","tags":["Vue","TypeScript","rlee"],"content":"Vue 3.3リリース。\n`<script setup lang=\"ts\">`でのTypeScriptの型定義の改善、双方向バインディングを扱う`defineModel()`の追加など","relatedLinks":[]},{"category":"Headline","title":"jasmine/5.0.0.md at main · jasmine/jasmine · GitHub","url":"https://github.com/jasmine/jasmine/blob/main/release_notes/5.0.0.md","tags":["JavaScript","testing","library","ReleaseNote"],"content":"Jasmine 5.0.0リリース。\nNode.js 12/14/16のサポート終了、テストの並列実行をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Rome v12.1.0","url":"https://rome.tools/blog/2023/05/10/rome12_1/","tags":["JavaScript","Tools","ReleaseNote"],"content":"Rome 12.1.0リリース。\nStage 3のDecoratorsのサポート、GitなどのVCSをサポートし`.gitignore`の設定などを利用できるように、ルールの追加や修正。\nstdinに対する`rome check`の対応、`rome migrate`コマンドの追加、ヘルプの改善など","relatedLinks":[]},{"category":"Headline","title":"Release 7.0.0-alpha.0 · lerna/lerna","url":"https://github.com/lerna/lerna/releases/tag/7.0.0-alpha.0","tags":["JavaScript","monorepo","ReleaseNote"],"content":"lerna 7.0.0-alpha.0リリース。\n`lerna bootstrap`/`add`/`link`コマンドを別のパッケージに分離し、本体には含めないように変更","relatedLinks":[]},{"category":"Headline","title":"Nuxt 3.5 · Nuxt","url":"https://nuxt.com/blog/v3-5","tags":["Vue","library","ReleaseNote"],"content":"Nuxt 3.5リリース。\nVue 3.3へアップデート、Nitropack 2.4にアップデート、JSONペイロードのシリアライズの改善。\n`nuxt.config`ファイルで環境ごとの設定を書けるように、実験的にルーティングから型定義を生成する仕組みを追加など","relatedLinks":[]},{"category":"Headline","title":"Release v13.0.0 · sverweij/dependency-cruiser","url":"https://github.com/sverweij/dependency-cruiser/releases/tag/v13.0.0","tags":["node.js","library","Tools","ReleaseNote"],"content":"モジュールの依存関係を分析するツールであるdependency-cruiser 13.0.0リリース。\nNode.js 14のサポート終了、yarn 1のPnPのサポート終了、Pure ESMのパッケージに変更。\n設定ファイルをESMで書けるように、`--config`で設定ファイルの渡さなくても自動で設定ファイルを探索するように変更、パフォーマンスの改善。","relatedLinks":[]},{"category":"Headline","title":"Bun v0.6.0 | Bun Blog","url":"https://bun.sh/blog/bun-v0.6.0","tags":["Bun","bundler","ReleaseNote"],"content":"Bun 0.6.0リリース。\n`bun build`を追加しファイルをbundleとminifyできるbundler機能を追加、`bun build --compile`で単一実行可能ファイルを生成できるように。\n`import.meta.main`のサポート、`bun test`の改善、TypeScript 5.0のサポート、Import Attributesのサポート、Node.jsの互換性改善など","relatedLinks":[{"title":"The Bun Bundler | Bun Blog","url":"https://bun.sh/blog/bun-bundler"}]},{"category":"Headline","title":"Astro 2.5 | Astro","url":"https://astro.build/blog/astro-250/","tags":["astro","ReleaseNote"],"content":"Astro 2.5リリース。\nData collectionsとしてJSONやYAMLを扱える仕組みの追加、`compressHTML`でHTMLを圧縮できるように、コンポーネントを並列レンダリングできるように。\n実験的な仕組みとして`hybridOutput`オプションを追加、Custom client directivesの追加など","relatedLinks":[]},{"category":"Headline","title":"Node v20.2.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v20.2.0","tags":["node.js","ReleaseNote"],"content":"Node.js v20.2.0リリース。\n`http.createServer`に`rejectNonStandardBodyWrites`オプションを追加し、HEADリクエストにbodyがある場合にエラーとするように。\n`URL`クラスの`has`と`delete`に`value`引数を追加など","relatedLinks":[{"title":"Add value argument to URLSearchParams","url":"https://github.com/whatwg/url/pull/735"}]},{"category":"Article","title":"Introducing Deopt Explorer - TypeScript","url":"https://devblogs.microsoft.com/typescript/introducing-deopt-explorer/","tags":["TypeScript","V8","performance","article"],"content":"TypeScriptのパフォーマンスを改善するためにインラインキャッシュをちゃんと使えるようにコードをリファクタリングしたという話。\nインラインキャッシュとMonomorphic/Polymorphic/Megamorphic、Deopt Explorerを使った最適化されていない箇所の分析と修正について","relatedLinks":[]},{"category":"Article","title":"Baseline","url":"https://web.dev/baseline/","tags":["browser","article"],"content":"ブラウザによって広くサポートされている機能セットという定義を提供するBaselineについて。\nある機能セットが多くのブラウザでサポートされていてそれが使える状態になっているという状態への名前がなかったため、Baselineという名前で定義をしていく取り組み。\n年に1回 Baseline を更新する予定で、サイトやライブラリがBaselineの機能を持ったブラウザをサポートするといったユースケースを想定している。","relatedLinks":[{"title":"Introducing Baseline","url":"https://web.dev/introducing-baseline/"},{"title":"Introducing Baseline: a unified view of stable web features | MDN Blog","url":"https://developer.mozilla.org/en-US/blog/baseline-unified-view-stable-web-features/"},{"title":"web-platform-dx/feature-set: Exploring how to present Web platform features adoptability","url":"https://github.com/web-platform-dx/feature-set"}]},{"category":"Article","title":"JS private class fields considered harmful – Lea Verou","url":"https://lea.verou.me/2023/04/private-fields-considered-harmful/","tags":["JavaScript","article"],"content":"ES2022で追加されたclassのprivate fieldsは、VueのようにProxyでReactiveな仕組みを実装するものと相性が悪いという話。","relatedLinks":[]},{"category":"WebsiteDocument","title":"microsoft/deoptexplorer-vscode: A VS Code extension to visualize deoptimizations in your JavaScript and TypeScript code running in V8 (i.e., NodeJS, Edge, Chrome, etc.).","url":"https://github.com/microsoft/deoptexplorer-vscode","tags":["VSCode","node.js","V8"],"content":"V8 のトレースログをVSCode上で可視化して最適化ができていない箇所を見つける拡張。\nCPUプロファイルの可視化、インラインキャッシュの状態、Deoptimizations、関数の状態などを可視化できる","relatedLinks":[]}]},{"meta":{"title":"2023-05-26のJS: wrangler v3.0.0、playwright v1.34.0、TypeScript 5.2の予定(変換プラグイン)","author":"azu","layout":"post","date":"2023-05-26T03:10:15.925Z","category":"JSer","tags":["TypeScript","Tools","browser","Chrome","book"],"url":"https://jser.info/2023/05/26/wrangler-v3.0.0-playwright-v1.34.0-typescript-5.2/"},"items":[{"category":"Headline","title":"ESLint v8.41.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2023/05/eslint-v8.41.0-released/","tags":["ESLint","ReleaseNote"],"content":"ESLint v8.41.0リリース。\n`shouldUseFlatConfig()`を追加、`indent`ルールのパフォーマンス改善など","relatedLinks":[]},{"category":"Headline","title":"WebKit Features in Safari 16.5 | WebKit","url":"https://webkit.org/blog/14154/webkit-features-in-safari-16-5/","tags":["safari","ReleaseNote"],"content":"Safari 16.5リリース。\nCSS Nestingのサポート、`:user-valid`と`:user-invalid`の擬似クラスをサポート。\nLockdownモードでWebCodecs APIを無効化など","relatedLinks":[{"title":"Safari 16.5 Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safari-release-notes/safari-16_5-release-notes"}]},{"category":"Headline","title":"TypeScript 5.2 Iteration Plan · Issue #54298 · microsoft/TypeScript","url":"https://github.com/microsoft/TypeScript/issues/54298","tags":["TypeScript","issue"],"content":"TypeScript 5.2で取り組む予定のIssue。\nECMAScript ProposalのDecorator Metadata、`using`の対応。\n明示的に型を定義せずに推論させるpartial type argument inferenceを扱う`_`の追加、`tsc`コマンドで変換プラグインを扱う仕組みの追加。\n並列解析でのパフォーマンス改善などに取り組む予定となっている","relatedLinks":[]},{"category":"Headline","title":"Improved local development with wrangler and workerd","url":"https://blog.cloudflare.com/wrangler3/","tags":["cloudflare","console","Tools","ReleaseNote"],"content":"wrangler 3.0.0リリース。\n`wrangler publish`を`wrangler deploy`にリネーム、`wrangler dev`でMiniflareと`worked` runtimeを使ったローカル環境での開発をデフォルトに変更","relatedLinks":[{"title":"Release wrangler@3.0.0 · cloudflare/workers-sdk","url":"https://github.com/cloudflare/workers-sdk/releases/tag/wrangler%403.0.0"}]},{"category":"Headline","title":"Announcing TypeScript 5.1 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-1-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.1 RCリリース。\n`undefined`を`return`する関数の型の扱いを改善、getterとsetter間でそれぞれ異なる型を指定できるように、JSXの改善。\nNode.js 14.17未満のサポート終了、`typeRoots`の上向きのパッケージ解決を無効化など","relatedLinks":[]},{"category":"Headline","title":"Release v1.34.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.34.0","tags":["browser","JavaScript","testing","ReleaseNote"],"content":"playwright v1.34.0リリース。\nNode.js 14のサポート終了、`playwright`と`@playwright/test`を両方インストールしてる場合に`npx playwright test`が動かなくなるように変更。\nUIモードでテストのステップを表示できるように、`testProject.teardown`プロパティのサポート、`locator.and()`の追加など。","relatedLinks":[]},{"category":"Headline","title":"Release v0.1.12 · web-infra-dev/rspack","url":"https://github.com/web-infra-dev/rspack/releases/tag/v0.1.12","tags":["webpack","bundler","ReleaseNote","JavaScript"],"content":"rspack v0.1.12リリース。\n`resolve.exportsFields`をサポート、Data URIのimportをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v3.2.0 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v3.2.0","tags":["JavaScript","server","library","ReleaseNote"],"content":"Hono 3.2.0リリース\n`LinearRouter`と`PatternRouter`の追加。実行環境に合わせたプリセットの追加、` app.mount()` APIの追加、cookie middlewareの追加など","relatedLinks":[{"title":"Honoのv3.2が出ました","url":"https://zenn.dev/yusukebe/articles/ee57dc12f34724"}]},{"category":"Article","title":"Introducing the popover API - Chrome Developers","url":"https://developer.chrome.com/en/blog/introducing-popover-api/","tags":["browser","HTML","article"],"content":"`popover`属性について","relatedLinks":[]},{"category":"Article","title":"Regular expressions in JavaScript - Honeybadger Developer Blog","url":"https://www.honeybadger.io/blog/javascript-regular-expressions/","tags":["JavaScript","RegExp","article"],"content":"JavaScriptにおける正規表現の解説とユースケースについて","relatedLinks":[]},{"category":"Article","title":"Chrome113でHTTPヘッダを上書きしていろんな状態をお試しできる - hogashi.\\*","url":"https://blog.hog.as/entry/2023/05/11/181952","tags":["Chrome","article","debug"],"content":"Chrome DevToolsでHTTPヘッダを書き換えられるようになった話","relatedLinks":[]},{"category":"Article","title":"Using the Web Vitals extension to debug Core Web Vitals issues","url":"https://web.dev/debug-cwvs-with-web-vitals-extension/","tags":["performance","browser","Chrome","Extension","article"],"content":"Web Vitals extensionを使いWeb Vitalsに関する問題をデバッグする方法について","relatedLinks":[{"title":"GoogleChrome/web-vitals-extension: A Chrome extension to measure essential metrics for a healthy site","url":"https://github.com/GoogleChrome/web-vitals-extension"}]},{"category":"SlideVideo","title":"OpenJS Collab Summit 2023 - YouTube","url":"https://www.youtube.com/playlist?list=PLyspMSh4XhLO15jJD9Sj069fN18j12AbQ","tags":["JavaScript","Conference","video"],"content":"OpenJS Collab Summit 2023 の動画一覧","relatedLinks":[]},{"category":"SoftwareLibrary","title":"microsoft/devicescript: TypeScript for Tiny IoT Devices","url":"https://github.com/microsoft/devicescript","tags":["TypeScript","Tools"],"content":"Raspberry Pi PicoなどのIoTデバイス向けの処理をTypeScriptで書けるツールキット","relatedLinks":[]},{"category":"SoftwareLibrary","title":"webpro/knip: ✂️ Find unused files, dependencies and exports in your JavaScript and TypeScript projects. Knip it before you ship it!","url":"https://github.com/webpro/knip","tags":["JavaScript","TypeScript","Tools"],"content":"未使用のファイル、未使用の依存関係、未使用のエクスポートなどを検出や削除できるツール。\nさまざまなツールのプラグインとして対応している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vanjs-org/van: 🍦VanJS (Vanilla JavaScript): World&#039;s smallest reactive UI framework","url":"https://github.com/vanjs-org/van","tags":["JavaScript","library","GUI"],"content":"ファイルサイズが小さなReactive UIフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mizchi/lizod","url":"https://github.com/mizchi/lizod","tags":["TypeScript","library"],"content":"zodライクなTypeScriptの型として利用できるバリデーションライブラリ。\nzodからメソッドチェーンや複雑なバリデーションを取り除いたAPIを作ることで、ファイルサイズが小さくなることを目的にしている","relatedLinks":[{"title":"lizod: 1kb 未満の zod の精神的後継","url":"https://zenn.dev/mizchi/articles/lizod-is-lightweight-zod"}]},{"category":"Book","title":"JavaScript Primer 改訂2版 迷わないための入門書 | azu, Suguru Inatomi |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4048931105/","tags":["JavaScript","book"],"content":"2023年6月9日発売\nJavaScriptの入門書","relatedLinks":[{"title":"JavaScript Primer 改訂2版の予約が開始されました | Web Scratch","url":"https://efcl.info/2023/05/18/jsprimer-v2-yoyaku/"}]}]},{"meta":{"title":"2023-06-01のJS: Parcel v2.9.0、Deno 1.34、State of Node.js Performance 2023","author":"azu","layout":"post","date":"2023-06-01T04:48:59.339Z","category":"JSer","tags":["Bun","TypeScript","performance","bundler","deno"],"url":"https://jser.info/2023/06/01/parcel-v2.9.0-deno-1.34-state-of-node.js-performance-2023/"},"items":[{"category":"Headline","title":"Parcel v2.9.0","url":"https://parceljs.org/blog/v2-9-0/","tags":["bundler","JavaScript","ReleaseNote"],"content":"Parcel 2.9.0リリース。\n`exports`フィールドをopt-inでサポート、ESMで書かれた設定ファイルをサポート、ローカルのプラグインをサポート。\nデフォルトのminifyをSWCへ切り替え、`--trace`フラグで詳細なトレースデータを取得できるようになるなど","relatedLinks":[{"title":"Release v2.9.0 · parcel-bundler/parcel","url":"https://github.com/parcel-bundler/parcel/releases/tag/v2.9.0"}]},{"category":"Headline","title":"Bun v0.6.4 | Bun Blog","url":"https://bun.sh/blog/bun-v0.6.4","tags":["Bun","ReleaseNote"],"content":"Bun 0.6.4リリース。\n`bun test`のパフォーマンス改善、`.env.test`や`.env.test.local`をロードできるように、`process.env.TZ`でタイムゾーンの変更に対応。\n`require.cache`でimport cacheを削除できるようになるなど、ログの改善など","relatedLinks":[]},{"category":"Headline","title":"Deno 1.34: deno compile supports npm packages","url":"https://deno.com/blog/v1.34","tags":["deno","ReleaseNote"],"content":"Deno v1.34リリース。\n`deno compile`が`npm:`に対応、`deno.json`でglobを指定できるように、IPアドレスに対するTLS証明書をサポート。\nunstable APIとして `Deno.createHttpClient()`を追加など","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2023-05 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2023/05/27/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2023-05のTC39 MeetingでのECMAScript Proposalの変更点まとめ。\n`Atomics.waitAsync`、Well-Formed Unicode Strings 、RegExp `v` flag がStage 4となりES2024に入る。","relatedLinks":[]},{"category":"Headline","title":"Bun v0.6.5 | Bun Blog","url":"https://bun.sh/blog/bun-v0.6.5","tags":["Bun","ReleaseNote"],"content":"Bun 0.6.5リリース。\n以前はCommonJSをESMに変換して実行していたが、ネイティブにCommonJSをサポート。\n`npm_lifecycle_event`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0-beta.0 · reduxjs/redux","url":"https://github.com/reduxjs/redux/releases/tag/v5.0.0-beta.0","tags":["redux","ReleaseNote"],"content":"Redux v5.0.0-beta.0リリース。\n`UnknownAction` typeの追加、ソースコードをTypeScriptにマイグレーション。\n`createStore`を非推奨に、dual packageの対応、IEのサポート終了など","relatedLinks":[]},{"category":"Headline","title":"Electron 25.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-25-0","tags":["Electron","ReleaseNote"],"content":"Electron 25.0.0リリース。\nChromium 114、Node.js 18.15.0、V8 11.4へアップデート。\nChromiumのネットワークスタックを使った`net.fetch` APIの追加、`protocol.handle` APIの追加。\n`protocol.{register,intercept}{Buffer,String,Stream,File,Http}Protocol` APIの非推奨化など","relatedLinks":[]},{"category":"Headline","title":"Release sveltejs@4.0.0-next.0 · sveltejs/svelte","url":"https://github.com/sveltejs/svelte/releases/tag/svelte%404.0.0-next.0","tags":["Svelte","ReleaseNote"],"content":"Svelte 4.0.0-next.0リリース。\nNode.js 14のサポート終了、webpack 4のサポート終了、パッケージサイズの改善など","relatedLinks":[]},{"category":"Article","title":"300ms Faster: Reducing Wikipedia&#039;s Total Blocking Time","url":"https://www.nray.dev/blog/300ms-faster-reducing-wikipedias-total-blocking-time/","tags":["performance","article"],"content":"WikipediaのTBTのパフォーマンス改善について。\n不要なJavaScriptの削除、event delegationを使った処理の最適化について","relatedLinks":[]},{"category":"Article","title":"AbortSignal.any(), AbortSignal.timeout(), そして addEvnetListener() の Signal | blog.jxck.io","url":"https://blog.jxck.io/entries/2023-06-01/abort-signal-any.html","tags":["Fetch","article","JavaScript"],"content":"AbortSignalを使ったリソース解放のパターンと`AbortSignal.any()`/`AbortSignal.timeout()`について","relatedLinks":[]},{"category":"Article","title":"State of Node.js Performance 2023","url":"https://blog.rafaelgss.dev/state-of-nodejs-performance-2023","tags":["node.js","performance","article"],"content":"Node.js 16, 18, 20でのベンチマーク比較。\nfsやeventsなどの内部ベンチマーク、HTTPサーバのベンチマーク比較など","relatedLinks":[]},{"category":"WebsiteDocument","title":"React Handbook","url":"https://reacthandbook.dev/","tags":["React","document"],"content":"Reactハンドブック。\nReactでのアプリケーション開発についてのガイド","relatedLinks":[]},{"category":"SoftwareLibrary","title":"stepci/garph: Fullstack GraphQL Framework for TypeScript","url":"https://github.com/stepci/garph","tags":["TypeScript","GraphQL","library"],"content":"GraphQL APIスキーマをビルダー関数で組み立てて、フロントとサーバで共有できるtRPCライクなGraphQLライブラリ。","relatedLinks":[]},{"category":"Book","title":"O&#039;Reilly Japan - 初めてのTypeScript","url":"https://www.oreilly.co.jp/books/9784814400362/?utm_mediun=referral","tags":["TypeScript","book"],"content":"2023年06月16日 発売。\nLearning TypeScriptの翻訳本","relatedLinks":[]}]},{"meta":{"title":"2023-06-11のJS: Rspack 0.2、Modern CSS、polywasm","author":"azu","layout":"post","date":"2023-06-11T00:54:28.409Z","category":"JSer","tags":["Bun","TypeScript","CSS","Chrome","astro"],"url":"https://jser.info/2023/06/11/rspack-0.2-modern-css-polywasm/"},"items":[{"category":"Headline","title":"Announcing TypeScript 5.1 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-1/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.1リリース。\n`undefined`を`return`する関数の型の扱いを改善、getterとsetter間でそれぞれ異なる型を指定できるように、JSXの改善。\nNode.js 14.17未満のサポート終了、`typeRoots`の上向きのパッケージ解決を無効化など","relatedLinks":[]},{"category":"Headline","title":"Bun v0.6.6 | Bun Blog","url":"https://bun.sh/blog/bun-v0.6.6","tags":["Bun","ReleaseNote"],"content":"Bun 0.6.6リリース。\n`bun test`がGitHub Actions向けの出力をサポート、`bun test --only`/`bun test --todo`/`test.if()`/`describe.if()`の追加。\n`test()`が`timeout`オプションをサポート、`expect()`にmatcherを追加。\nFetch Upload Streamingのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Chrome 115 beta - Chrome Developers","url":"https://developer.chrome.com/en/blog/chrome-115-beta/","tags":["Chrome","ReleaseNote"],"content":"Chrome 115 Betaリリース。\nスクロールベースのアニメーションである`ScrollTimeline`と`ViewTimeline`の追加、`WebAssembly.Module()`のメインスレッドでのモジュールサイズの制限を8MBに緩和。\nメインフレームのナビゲーションで自動的にHTTPSにアップデートし、HTTPへのフォールバックを行うように、Storage Partitioningをデフォルトで有効化など。\nOrigin TrialとしてCompute Pressure API、マジックコメントでのcompile hintsの追加、Storage Buckets APIの追加など。\n`document.domain`への代入を非推奨化、Mutation Eventsを非推奨化など","relatedLinks":[]},{"category":"Headline","title":"Astro 2.6: Middleware | Astro","url":"https://astro.build/blog/astro-260/","tags":["astro","ReleaseNote"],"content":"Astro 2.6リリース。\nMiddlewares/`output: \"hybrid\"`/Custom client directivesのStable化。\nCSSをインライン化する`inlineStylesheets: \"auto\"`オプションの追加、実験的にリダイレクト機能の追加など","relatedLinks":[]},{"category":"Headline","title":"Open sourcing Ezno&#039;s checker and trying out / previewing the JavaScript type checker today · kaleidawave/ezno · Discussion #21","url":"https://github.com/kaleidawave/ezno/discussions/21","tags":["TypeScript","Rust","ReleaseNote"],"content":"Rustで書かれたTypeScriptの型チェッカーであるEnzoがリリースされた。\nまだサポートされていない構文なども多いがOxc CLIを通して利用できるようになった","relatedLinks":[{"title":"Release CLI v0.1.0 Ezno Type Checker · Boshen/oxc","url":"https://github.com/Boshen/oxc/releases/tag/v0.1.0"}]},{"category":"Headline","title":"Release 7.0.0 · lerna/lerna","url":"https://github.com/lerna/lerna/releases/tag/7.0.0","tags":["JavaScript","monorepo","ReleaseNote"],"content":"lerna 7.0.0リリース。\n`lerna bootstrap`/`add`/`link`は削除された。デフォルトでworkspacesを使うようになり、`useWorkspaces`オプションの削除。\n非推奨となっていたオプションの削除など","relatedLinks":[{"title":"Legacy Package Management | Lerna","url":"https://lerna.js.org/docs/legacy-package-management"}]},{"category":"Headline","title":"Node v20.3.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v20.3.0","tags":["node.js","ReleaseNote"],"content":"Node.js v20.3.0リリース。\nlibuv 1.45.0にアップデート、`AbortSignal.any()`の実装など","relatedLinks":[]},{"category":"Headline","title":"Announcing Rspack 0.2 - Rspack","url":"https://www.rspack.dev/blog/announcing-0.2.html","tags":["webpack","rspack","ReleaseNote"],"content":"Rspack 0.2リリース。\nPlugin Hooksの追加、ESM形式のoutputに対応、`SplitChunksPlugin`の実装、Data URIのサポート、Vue/Svelte/NestJSの対応など","relatedLinks":[]},{"category":"Headline","title":"Bun v0.6.8 | Bun Blog","url":"https://bun.sh/blog/bun-v0.6.8","tags":["Bun","ReleaseNote"],"content":"Bun v0.6.8リリース。\n`Bun.password`の追加、`bun:test`モジュールに`mock`/`spyOn`関数を追加。\n`Bun.serve`にブラウザからWebSocketsを使ったデバッガーに接続できる`inspector`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v1.35.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.35.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.35.0リリース。\nUI modeでRoute APIが処理したリクエストを表示するように、スクリーンショットに`maskColor`オプションを追加、`uninstall`サブコマンドを追加。\nバイナリを`playwright`から`playwright-core`へリネームなど","relatedLinks":[]},{"category":"Headline","title":"evanw/polywasm","url":"https://github.com/evanw/polywasm","tags":["WebAssembly","JavaScript","library","polyfill"],"content":"`globalThis.WebAssembly`のpolyfill実装。\nApple/SafariのLockdown Modeのように`WebAssembly` APIが利用できない環境でも、`.wasm`を実行するためのpolyfill。","relatedLinks":[]},{"category":"Article","title":"JavaScript Macros in Bun | Bun Blog","url":"https://bun.sh/blog/bun-macros","tags":["Bun","article"],"content":"Bun 0.6.0で実装されたbundlerを使ったbundle時のマクロ展開について。\n`import ... with { type: 'macro' }`でマクロとして読み込み、bundle時にそのモジュールの評価結果を埋め込む機能。","relatedLinks":[]},{"category":"Article","title":"The origin private file system","url":"https://web.dev/origin-private-file-system/","tags":["JavaScript","article"],"content":"Origin private file systemについて。\nOriginごとのルートディレクトリがあり、メインスレッドまたはWeb Workerから利用できる。\nWeb Workerからは同期APIも利用できる。","relatedLinks":[]},{"category":"Article","title":"HTML 全体の CSS を取得して Shadow DOM に適用する | marmooo&#039;s blog","url":"https://marmooo.blogspot.com/2023/06/html-css-shadow-dom.html","tags":["CSS","WebComponents","article"],"content":"`document.styleShets`からスタイルを集めて`replaceSync`でスタイルシートを作り、`shadowRoot.adoptedStyleSheets`でスタイルシートを当てる方法について。","relatedLinks":[]},{"category":"Article","title":"Modern CSS in Real Life - Chris Coyier","url":"https://chriscoyier.net/2023/06/06/modern-css-in-real-life/","tags":["CSS","article","slide"],"content":"モダンなCSSの機能についてのスライドと解説。\nLogical Properties、Container Queries、Cascade Layers、CSS Colorsと`oklch()`、View Transitions APIについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"RSC From Scratch. Part 1: Server Components · reactwg/server-components · Discussion #5","url":"https://github.com/reactwg/server-components/discussions/5","tags":["React","tutorial"],"content":"React Server Components (RSC)を一から実装してみるチュートリアル。\nSSRとRSCの違い。\nJSXのHTMLへの変換しHTMLを返しレンダリング、入力状態を維持したままナビゲーションをするためにJSXをオブジェクトとして返しクライアントでレンダリング。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Tresjs/tres: Declarative ThreeJS using Vue Components","url":"https://github.com/tresjs/tres","tags":["Vue","WebGL","library"],"content":"ThreeJSとVueを使った宣言的に3DのViewを作成できるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"NakedJSX - Use JSX without React","url":"https://nakedjsx.org/","tags":["jsx","JavaScript","library"],"content":"JSXから静的なHTMLと小さなランタイムを生成するツールキット。\nScoped CSSを扱う機能、開発用サーバ、画像/CSS/HTML/JSの最適化して出力をする機能を持っている。","relatedLinks":[]}]},{"meta":{"title":"2023-06-21のJS: React-Redux v8.1.0、Fresh 1.2、Modern CSS","author":"azu","layout":"post","date":"2023-06-20T22:57:46.724Z","category":"JSer","tags":["React","node.js","WebAssembly","webservice","TypeScript"],"url":"https://jser.info/2023/06/21/react-redux-v8.1.0-fresh-1.2-modern-css/"},"items":[{"category":"Headline","title":"Release 3.31.0 - 2023.06.12 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.31.0","tags":["JavaScript","library","polyfill","ReleaseNote"],"content":"core-js v3.31.0リリース。\nProposal Stageの変更への対応。\nArray GroupingはStage 2へ降格し、静的メソッドである`Object.groupBy`を追加。\n`Promise.withResolvers`の追加など","relatedLinks":[]},{"category":"Headline","title":"Turborepo 1.10 – Turbo","url":"https://turbo.build/blog/turbo-1-10-0","tags":["JavaScript","Tools","ReleaseNote"],"content":"Turborepo 1.10リリース。\nPlopを使った`turbo gen`の追加、`.env`のサポート、`--env-mode`がStableに変更など","relatedLinks":[{"title":"Consistency Made Simple : PLOP","url":"https://plopjs.com/"}]},{"category":"Headline","title":"Release v8.1.0 · reduxjs/react-redux","url":"https://github.com/reduxjs/react-redux/releases/tag/v8.1.0","tags":["React","redux","ReleaseNote"],"content":"React-Redux v8.1.0リリース。\n開発モードでは`useSelector`が同じ入力に対して同じ結果を返すかをチェックする仕組みが追加された。\nselectorを同じ入力で2回呼び出し、異なる参照の場合は警告を出す仕組み","relatedLinks":[]},{"category":"Headline","title":"Fresh 1.2 – welcoming a full-time maintainer, sharing state between islands, limited npm support, and more","url":"https://deno.com/blog/fresh-1.2","tags":["deno","library","ReleaseNote","React"],"content":"Deno向けのWeb FrameworkであるFresh 1.2リリース。\nメインメンテナーをPreactのMarvin Hagemeisterに交代。\nSigalsをhydrateできるように、`npm:`識別子の対応、HEADハンドラーの追加。\n`islands/`のサブディレクトリのサポート、プラグインが非同期処理に対応など","relatedLinks":[]},{"category":"Headline","title":"Release v10.0.0 · nestjs/nest","url":"https://github.com/nestjs/nest/releases/tag/v10.0.0","tags":["node.js","library","ReleaseNote"],"content":"NestJS v10.0.0リリース。\nNode.js 12, 14のサポート終了、`@nestjs/common`から`CacheModule`を削除など","relatedLinks":[{"title":"Migration guide - FAQ | NestJS - A progressive Node.js framework","url":"https://docs.nestjs.com/migration-guide"}]},{"category":"Headline","title":"Release v5.0.0 ❤️ · gvergnaud/ts-pattern","url":"https://github.com/gvergnaud/ts-pattern/releases/tag/v5.0.0","tags":["TypeScript","ReleaseNote","library"],"content":"TypeScript向けのパターンマッチングライブラリであるts-pattern 5.0.0リリース。\n`.with`の動作変更、method chainのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Tuesday June 20 2023 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/june-2023-security-releases","tags":["node.js","ReleaseNote","security"],"content":"Node.jsのセキュリティアップデートとして、16.x/18.x/20.xがそれぞれ公開された。\n\n- Node.js v16.20.1 (LTS)\n- Node.js v18.16.1 (LTS)\n- Node.js v20.3.1 (Current)","relatedLinks":[]},{"category":"Article","title":"The Cloud is dead, long live the Cloud! Announcing Wasmer Edge","url":"https://wasmer.io/posts/announcing-wasmer-edge","tags":["WebAssembly","webservice","article"],"content":"Wasmer Edgeのリリース。\nWebAssemblyのアプリケーションをWasmtimeで動かすプラットフォーム。\nShared nothingのアーキテクチャを採用した分散モノリスのアプローチ。","relatedLinks":[]},{"category":"Article","title":"Modern CSS For Dynamic Component-Based Architecture | Modern CSS Solutions","url":"https://moderncss.dev/modern-css-for-dynamic-component-based-architecture/","tags":["CSS","article"],"content":"モダンなCSSを使ったコンポーネントベースのアーキテクチャについて。\n`@layer`を使ったLayout、`:has()`やCustom Propertiesを使ったVariants。\n`@container style()`を使ったスタイルの条件分岐、Container QueryとMedia Queryによるブレークポイントでのデバイスサイズ出し分けの違いについてなど","relatedLinks":[]},{"category":"Article","title":"TypeScript 5.2&#039;s New Keyword: &#039;using&#039; | Total TypeScript","url":"https://www.totaltypescript.com/typescript-5-2-new-keyword-using","tags":["TypeScript","JavaScript","ECMAScript","proposal","article"],"content":"TypeScript 5.2で実装予定のECMAScript Proposal Stage 3の`using`について。\nリソース解放のパターンを`using`構文としてサポートする","relatedLinks":[{"title":"tc39/proposal-explicit-resource-management: ECMAScript Explicit Resource Management","url":"https://github.com/tc39/proposal-explicit-resource-management"},{"title":"ECMAScript Explicit Resource Management ","url":"https://github.com/microsoft/TypeScript/issues/52955"}]},{"category":"Article","title":"Introducing HTTP/3 Prioritization","url":"https://blog.cloudflare.com/better-http-3-prioritization-for-a-faster-web/","tags":["HTTP3","performance","article","cloudflare"],"content":"HTTP/3 Extensible Prioritiesをサポートすることで、Webページの読み込みがどれぐらい改善されるかについて","relatedLinks":[]},{"category":"Article","title":"Web Apps on macOS Sonoma 14 Beta","url":"https://blog.tomayac.com/2023/06/07/web-apps-on-macos-sonoma-14-beta/","tags":["macOS","safari","article"],"content":"macOS Sonomaのインストール可能なウェブアプリの動作について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Fermyon • Experience the next wave of cloud computing. | Fermyon • Experience the next wave of cloud computing.","url":"https://www.fermyon.com/","tags":["WebAssembly","webservice"],"content":"Spinというツールキットで作成したWebAssemblyアプリケーションをデプロイ、実行できるサーバレスプラットフォーム","relatedLinks":[{"title":"The Next Generation of Serverless is Happening | Fermyon • Experience the next wave of cloud computing.","url":"https://www.fermyon.com/blog/next-generation-of-serverless-is-happening"}]}]},{"meta":{"title":"2023-06-29のJS: Svelte 4、Ember 5.0、The Cost Of JavaScript in 2023","author":"azu","layout":"post","date":"2023-06-29T00:45:08.079Z","category":"JSer","tags":["CSS","Tools","React","TypeScript","editor"],"url":"https://jser.info/2023/06/29/svelte-4-ember-5.0-the-cost-of-javascript-in-2023/"},"items":[{"category":"Headline","title":"Announcing Svelte 4","url":"https://svelte.dev/blog/svelte-4","tags":["Svelte","ReleaseNote"],"content":"Svelte 4リリース。\nNode.js 14のサポート終了、CJSの出力は廃止しESMのみをサポートするように、Custom Elementsの対応を`tag`オプションから`customElement`オプションに変更。\n生成するファイルサイズの削減、ウェブサイトのドキュメントを刷新など","relatedLinks":[{"title":"Svelte 4 migration guide • Docs • Svelte","url":"https://svelte.dev/docs/v4-migration-guide"},{"title":"Release svelte@4.0.0 · sveltejs/svelte","url":"https://github.com/sveltejs/svelte/releases/tag/svelte%404.0.0"}]},{"category":"Headline","title":"Ember 5.0 Released","url":"https://blog.emberjs.com/ember-5-0-released/","tags":["Ember","ReleaseNote"],"content":"Ember 5.0リリース。\nEmberではメジャーアップデートで機能追加をせず、破壊的変更のみを行う。\n`AutoLocation`の削除、`@ember/error`パッケージの削除、`Ember.String`の削除など","relatedLinks":[]},{"category":"Headline","title":"Release v6.14.0 · remix-run/react-router","url":"https://github.com/remix-run/react-router/releases/tag/react-router%406.14.0","tags":["React","library","ReleaseNote"],"content":"React Router 6.14.0リリース。\n`useSubmit`がJSONとTextをサポート。","relatedLinks":[]},{"category":"Headline","title":"Release v0.18.9 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.18.9","tags":["JavaScript","CSS","Tools","ReleaseNote"],"content":"esbuild v0.18.9リリース。\n`await using`の対応漏れの修正、autoprefixer的のようにCSSのprefixを自動で追加できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Bun v0.6.10 | Bun Blog","url":"https://bun.sh/blog/bun-v0.6.10","tags":["Bun","ReleaseNote"],"content":"Bun v0.6.10リリース。\nCommonJSの互換性を改善しwebpack動作するように、`require.main`のサポート、`__esModule`フラグを解釈するように。\n`fs.watch`の実装、V8の`Error.captureStackTrace`の実装。\n`bun install`時にライフサイクルスクリプトの実行を許可するパッケージを定義する`trustedDependencies`フィールドのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 173 | WebKit","url":"https://webkit.org/blog/14378/release-notes-for-safari-technology-preview-173/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 173リリース。\nSafari 17で導入予定の機能が利用できるTechnology Preview。\nWeb Inspectorの再設計、ウェブアプリをDockに追加、JPEG XLのサポート、HEICのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · cloudflare/miniflare","url":"https://github.com/cloudflare/miniflare/releases/tag/v3.0.0","tags":["cloudflare","ReleaseNote","JavaScript"],"content":"miniflare v3.0.0リリース。\nworkerdを利用するのようになった。\nCLIが同梱されなくなり`wrangler`を経由してCLIとして利用できる。\nまたいくつかのAPIが削除や変更されている。","relatedLinks":[{"title":"⬆️ Migrating from Version 2 · Miniflare","url":"https://miniflare.dev/get-started/migrating"}]},{"category":"Article","title":"Cyclic Dependency Space Toggles","url":"https://kizu.dev/cyclic-toggles/","tags":["CSS","article"],"content":"CSS Variablesを使ってロジックゲートを実装する方法について。\n循環参照するVariablesは無効となる仕様を利用し、Variablesにif文的な切り替えを実装する方法について。\nまた、なぜこのような仕様と実装になったのかについて","relatedLinks":[]},{"category":"Article","title":"Next.js App Router Update | Next.js","url":"https://nextjs.org/blog/june-2023-update","tags":["Next.js","article"],"content":"Next.jsの最近の取り組みについて。\nApp RouterのStable化、巨大なアプリケーションでのパフォーマンスの改善、ドキュメントの改善。\nReactのServer Side Componentへの対応やServer Actionsについてなど","relatedLinks":[]},{"category":"SlideVideo","title":"2023-06-24 DOMのテストがどんどん書きたくなるTesting Libraryの世界への招待 (#phpconfuk) - Google スライド","url":"https://docs.google.com/presentation/d/1j6sEAs0LF5jPXs_mHxvPreqK-lxEL3OxvQAFyXmxbZc/view#slide=id.g24bcedd6665_0_0","tags":["JavaScript","testing","slide"],"content":"DOMのテストライブラリであるTesting Libraryの考え方について。\nDOMを生成し、テスト対象をクエリで検索し、アサーションでテストする。\nクエリにはWAI-ARIA Roleやラベル、Test Idなどを指定するメソッドがあるがその優先度について。","relatedLinks":[{"title":"About Queries | Testing Library","url":"https://testing-library.com/docs/queries/about/"}]},{"category":"SlideVideo","title":"The Cost Of JavaScript - 2023 - YouTube","url":"https://www.youtube.com/watch?v=ZKH3DLT4BKw","tags":["JavaScript","video","performance"],"content":"JavaScriptのコストについての動画とスライド。\nJavaScriptのダウンロード、実行のコスト。\nCode SplittingやDynamic Importなどの最適化。\nIslands ArchitectureのPartial Hydration、QwikのResumalable Hydration、ReactのSelective Hydationについて。","relatedLinks":[{"title":"The Cost Of JavaScript in 2023 - Speaker Deck","url":"https://speakerdeck.com/addyosmani/the-cost-of-javascript-in-2023"}]},{"category":"WebsiteDocument","title":"Module Federation: streamline your microfrontends","url":"https://module-federation.io/","tags":["JavaScript","MicroFrontend","document"],"content":"Microfrontendsの開発を補助するModule Federationについてのウェブサイトが公開された。\nドキュメントやユースケース、使い方やサンプルプロジェクトなどが公開されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Panda CSS - Build modern websites using build time and type-safe CSS-in-JS","url":"https://panda-css.com/","tags":["CSS","TypeScript","Tools"],"content":"CSS in JSフレームワーク。\nTypeScriptでType Safeにスタイルを書くことができ、ツールを通してCSSファイルとして出力することで、実行時にはJSが不要になっている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Codux | Visual IDE for React","url":"https://www.codux.com/","tags":["React","editor","Tools"],"content":"Reactのビジュアルエディタ。\nGUIでコンポーネントを編集でき、コードも並べて編集できるエディタ。","relatedLinks":[{"title":"Meet Codux: The React Visual Editor That Improves Developer Experience — Smashing Magazine","url":"https://www.smashingmagazine.com/2023/06/codux-react-visual-editor-improves-developer-experience/"}]}]},{"meta":{"title":"2023-07-05のJS: TypeScript 5.2 Beta、ECMAScript 2023、Firefox 115","author":"azu","layout":"post","date":"2023-07-05T06:01:57.428Z","category":"JSer","tags":["TypeScript","ECMAScript","browser","node.js","game"],"url":"https://jser.info/2023/07/05/typescript-5.2-beta-ecmascript-2023-firefox-115/"},"items":[{"category":"Headline","title":"Release v8.0.0-alpha.0 · pixijs/pixijs","url":"https://github.com/pixijs/pixijs/releases/tag/v8.0.0-alpha.0","tags":["JavaScript","game","library","ReleaseNote"],"content":"PixiJS v8.0.0-alpha.0リリース。\nWebGPUレンダラーとWebGLレンダラーの書き直し、変更されたものだけ更新するリアクティブレンダラー、高度なBlendモードをの追加など。\n初期化方法を非同期に変更、Graphics APIの刷新など","relatedLinks":[]},{"category":"Headline","title":"ESLint v8.44.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2023/06/eslint-v8.44.0-released/","tags":["ESLint","ReleaseNote"],"content":"ESLint v8.44.0リリース。\n`eslint.config.js`でPromiseを受け入れることで設定ファイル(CJS)からESMをロードできるように、espreeがRegExpの`v`フラグをサポート。\n`context.parserServices`プロパティを非推奨化など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.2 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-2-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.2 Betaリリース。\nStage 3 ProposalのExplicit Resource Management(`using`宣言)のサポート、Decorator Metadataのサポート。\nTupleにおけるラベルありなしの組み合わせの制限を削除、配列のUnion型の扱いの改善など","relatedLinks":[]},{"category":"Headline","title":"Ecma International approves new standards - Ecma International","url":"https://www.ecma-international.org/news/ecma-international-approves-new-standards-at-the-125th-general-assembly-27-june-2023/","tags":["ECMAScript","ReleaseNote"],"content":"ECMAScript 2023がecma GAで承認されたため、正式にリリース。","relatedLinks":[{"title":"Release ES2023 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2023"}]},{"category":"Headline","title":"Release v4.0.0 · lquixada/cross-fetch","url":"https://github.com/lquixada/cross-fetch/releases/tag/v4.0.0","tags":["JavaScript","browser","node.js","library","ReleaseNote"],"content":"cross-fetch 4.0.0リリース。\nNode.js 10と12のサポート終了、Node.js 18と20のサポート、Service WorkerとCloudflare Workersのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v8.6.6 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v8.6.6","tags":["pnpm","performance","ReleaseNote"],"content":"pnpm v8.6.6リリース。\nパフォーマンスの改善など","relatedLinks":[]},{"category":"Headline","title":"Release v29.6.0 · jestjs/jest","url":"https://github.com/jestjs/jest/releases/tag/v29.6.0","tags":["jest","JavaScript","testing","library"],"content":"Jest 29.6.0リリース。\nCurrent Testでのsnapshotテストのサポート、非同期でエラーがthrowされた場合の問題を`rejectionHandled`イベントを使うことで修正など","relatedLinks":[]},{"category":"Headline","title":"Release 0.2.5 · web-infra-dev/rspack","url":"https://github.com/web-infra-dev/rspack/releases/tag/0.2.5","tags":["webpack","ReleaseNote","JavaScript","bundler"],"content":"rspack 0.2.5リリース。\nWeb Workerのサポート、entryの`filename`オプションのサポート、HMRでCJSとESMが混在している場合にwarningを出すようになるなど","relatedLinks":[]},{"category":"Headline","title":"Firefox 115.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/115.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 115リリース。\nmacOS 10.12/10.13/10.14、Windows7/8/8.1がサポートされる最後のバージョンとなる。\n`contenteditable`におけるノード分割と結合の挙動を他のブラウザと揃えるように変更。\n` Array.fromAsync()`のサポート、ES2023の`Array.toReversed()`/`.toSorted()`/`.toSpliced()`/`.with()`のサポート。\n`Response.json()`、`URL.canParse()`のサポートなど。","relatedLinks":[{"title":"Firefox users on macOS 10.12, 10.13 and 10.14 moving to Extended Support Release | Firefox ヘルプ","url":"https://support.mozilla.org/ja/kb/firefox-users-macos-1012-1013-1014-moving-to-extended-support"},{"title":"Firefox users on Windows 7, 8 and 8.1 moving to Extended Support Release | Firefox ヘルプ","url":"https://support.mozilla.org/ja/kb/firefox-users-windows-7-8-and-81-moving-extended-support"},{"title":"Firefox 115 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/115"},{"title":"Intent to Ship: Compatible join and split node direction in HTML editor","url":"https://groups.google.com/a/mozilla.org/g/dev-platform/c/Ob-T1HSe-4I?pli=1"}]},{"category":"Article","title":"CommonJS is not going away | Bun Blog","url":"https://bun.sh/blog/commonjs-is-not-going-away","tags":["Bun","CommonJS","article","ECMAScript","module"],"content":"BunがCommonJSをサポートするのはなぜかについて。\nCommonJSとECMAScript Moduleを比べると同期と非同期の違いがあるため起動時のロード時間が異なることや、すでに多くのCommonJSモジュールがあるため","relatedLinks":[{"title":"CommonJS is hurting JavaScript","url":"https://deno.com/blog/commonjs-is-hurting-javascript"}]},{"category":"Article","title":"Useful DevTools Tips and Tricks — Smashing Magazine","url":"https://www.smashingmagazine.com/2023/06/popular-devtools-tips/","tags":["debug","browser","article"],"content":"ブラウザの開発者ツールのTipsをまとめた記事","relatedLinks":[]},{"category":"Article","title":"Architecture of an early stage SAAS | Feelback Blog","url":"https://www.feelback.dev/blog/feelback-saas-launch-architecture/","tags":["webservice","article","node.js"],"content":"fly.io と Node.jsを使ったSaaSのアーキテクチャ解説。\nfly.ioを使った低コストなインフラの構成。\nクライアントとサーバどちらもNode.jsで、型付きRPCとしてhttpcを利用。\n管理画面はCloudflare Pagesにありhttpcを使って通信、ホームページやドキュメントにはAstroを利用している。\nまた、利用している外部サービスやmonorepoの構造についてなど","relatedLinks":[{"title":"httpc: function-based API made easy","url":"https://httpc.dev/"}]},{"category":"SoftwareLibrary","title":"giuseppelt/httpc: Build function-based API with minimal code and end-to-end type safety","url":"https://github.com/giuseppelt/httpc","tags":["TypeScript","JavaScript","library","server"],"content":"TypeScriptで書いたサーバの関数をクライアントから同じように呼び出せるRPCツールキット。\nサーバで関数をexportしたコードからクライアントコードを生成する仕組みによって、サーバの関数と同じ関数と引数でAPIコールができる。","relatedLinks":[]}]},{"meta":{"title":"2023-07-13のJS: Prisma 5.0.0、Prettier 3.0、Convert to ESM","author":"azu","layout":"post","date":"2023-07-12T21:35:17.212Z","category":"JSer","tags":["node.js","CSS","Tools","TypeScript","animation"],"url":"https://jser.info/2023/07/13/prisma-5.0.0-prettier-3.0-convert-to-esm/"},"items":[{"category":"Headline","title":"Node v20.4.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v20.4.0","tags":["node.js","ReleaseNote"],"content":"Node.js v20.4.0リリース。\n`node:test`がTimerのMockをサポート、ECMAScript Stage 3のExplicit Resource Management(`using`)のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Bun v0.6.13 | Bun Blog","url":"https://bun.sh/blog/bun-v0.6.13","tags":["Bun","ReleaseNote"],"content":"Bun v0.6.13リリース。\n`bun:test`がDateのmockに対応、`Buffer.toString(\"base64\")`のパフォーマンス改善、`node:tls`と`node:net`の互換性の改善。\n`Buffer.isUtf8()`と`isAcii()`の実装、`WebSocket`クライアントのバグ修正など","relatedLinks":[]},{"category":"Headline","title":"Prettier 3.0: Hello, ECMAScript Modules! · Prettier","url":"https://prettier.io/blog/2023/07/05/3.0.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 3.0リリース。\nMarkdownで日本語/中国語と英語の間にスペースを入れないように変更、CJKの禁則処理に対応。\nプラグインで非同期パーサをサポート、設定ファイルでESMをサポート、`trailingComma`のデフォルト値を`all`に変更など","relatedLinks":[]},{"category":"Headline","title":"Announcing typescript-eslint v6 | typescript-eslint","url":"https://typescript-eslint.io/blog/announcing-typescript-eslint-v6/","tags":["TypeScript","ESLint","ReleaseNote"],"content":"typescript-eslint 6.0.0リリース。\nプリセットルールをグループに分けて、`strict-type-checked`/`stylistic`/`stylistic-type-checked`を追加、プリセットを組み合わせて設定するように変更。\n非推奨となったルールの削除、Node.js 14のサポート終了、ルールの設定変更など。\n開発者向けのAPIやASTの変更も含まれる。","relatedLinks":[]},{"category":"Headline","title":"Boa release v0.17 - Boa","url":"https://boajs.dev/posts/2023-07-08-boa-release-17/","tags":["JavaScript","Rust","ReleaseNote"],"content":"Rustで書かれたJavaScriptパーサ/コンパイラーのBoa 0.17リリース。\nECMAScript Modulesに対応、test262のダッシュボードを追加。\n定数畳み込み、Hidden Classの最適化に対応。\n`--debug-object`フラグの追加、組み込みオブジェクトラッパーの追加、Intlのサポートなど","relatedLinks":[{"title":"Boa EcmaScript conformance","url":"https://boajs.dev/boa/test262/"}]},{"category":"Headline","title":"Release 5.0.0 · prisma/prisma","url":"https://github.com/prisma/prisma/releases/tag/5.0.0","tags":["JavaScript","node.js","database","library","ReleaseNote"],"content":"Prisma 5.0.0リリース。\n実験的な機能だった`jsonProtocol`/`fieldReference`/`extendedWhereUnique`をStableに変更。\nNode.js 14のサポート終了、暗黙的に配列とみなす\"array shortcuts\"のサポートを削除、非推奨のオプションの削除など","relatedLinks":[{"title":"Upgrade to Prisma 5","url":"https://www.prisma.io/docs/guides/upgrade-guides/upgrading-versions/upgrading-to-prisma-5"}]},{"category":"Headline","title":"Release v6.0.0 · styled-components/styled-components","url":"https://github.com/styled-components/styled-components/releases/tag/v6.0.0","tags":["CSS","JavaScript","alib","ReleaseNote"],"content":"styled-components v6.0.0リリース。\nNode.js 14のサポート終了、TypeScriptでの書き直し、ベンダープレフィックスをデフォルトでは省略するように変更、stylis v4へアップデートなど","relatedLinks":[{"title":"styled-components: FAQs","url":"https://styled-components.com/docs/faqs#what-do-i-need-to-do-to-migrate-to-v6"}]},{"category":"Headline","title":"Deno 1.35: A fast and convenient way to build web servers","url":"https://deno.com/blog/v1.35","tags":["deno","ReleaseNote"],"content":"Deno v1.35リリース。\n`Deno.serve()`をStableに変更、Noe.jsとの互換性改善。\n標準モジュールの`semver`の書き直し、`html`モジュールの追加、`http/user_agent`の追加など","relatedLinks":[]},{"category":"Headline","title":"Bytecode Alliance — Welcoming Javy: A new hosted project","url":"https://bytecodealliance.org/articles/javy-hosted-project","tags":["JavaScript","WebAssembly","news"],"content":"Shopifyによって作成されたJavaScriptを WebAssembly(JS + QuickJS)にコンパイルするJavyがBytecode Allianceのホストプロジェクトとなった。","relatedLinks":[]},{"category":"Article","title":"Breaking Up with SVG-in-JS in 2023 | Jacob Groß | kurtextrem.de","url":"https://kurtextrem.de/posts/svg-in-js","tags":["JavaScript","SVG","article","performance"],"content":"SVGをJSのbundleに含める問題とパフォーマンスについて","relatedLinks":[]},{"category":"Article","title":"アニメーションの実装が劇的に簡単になるFLIPテクニック","url":"https://katashin.info/posts/flip-animation/","tags":["JavaScript","CSS","animation","article"],"content":"FLIP(First, Last, Invert, Play)というアニメーションのテクニックについて。\n複雑な座標計算をせずにアニメーションを実装する方法。","relatedLinks":[]},{"category":"Article","title":"DevTools Tips: Record and replay user flows with the Recorder - Chrome Developers","url":"https://developer.chrome.com/en/blog/devtools-tips-4/","tags":["Chrome","debug","testing","Tools","article"],"content":"Chrome DevToolsのRecord and Replay機能について。\n操作を記録して再生できる。再生に対してブレークポイントを設定したり、内容を編集、拡張機能を使ってCypressなどのテストフレームワーク向けに出力したりできる。","relatedLinks":[]},{"category":"Article","title":"CommonJSからES Modulesへの移行する方法。トップダウンかボトムアップか | Web Scratch","url":"https://efcl.info/2023/07/05/convert-to-esm/","tags":["JavaScript","node.js","ECMAScript","CommonJS","article"],"content":"Node.jsにおけるESMへの移行は、依存関係の読み込み側に影響を与えるため、ボトムアップではなくトップダウンで段階的な移行ができるという話。\n依存ツリーの作成や段階的な移行をするための境界線の見つけ方、CJSからESMをインポートする回避策などについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Scroll-driven Animations","url":"https://scroll-driven-animations.style/","tags":["JavaScript","CSS","animation","document"],"content":"Scroll-driven animationsのデモやユースケースについてまとめたサイト","relatedLinks":[{"title":"A case study on scroll-driven animations performance - Chrome Developers","url":"https://developer.chrome.com/en/blog/scroll-animation-performance-case-study/"}]},{"category":"SoftwareLibrary","title":"mdx-editor/editor: An open source rich text React component for markdown editing","url":"https://github.com/mdx-editor/editor","tags":["Markdown","JavaScript","library"],"content":"MarkdownリッチエディタのReactコンポーネント。","relatedLinks":[]},{"category":"Book","title":"gibbok/typescript-book: The Concise TypeScript Book: A Concise Guide to Effective Development in TypeScript. Free and Open Source.","url":"https://github.com/gibbok/typescript-book","tags":["TypeScript","book","OpenSource"],"content":"TypeScriptの入門書","relatedLinks":[]}]},{"meta":{"title":"2023-07-20のJS: vm2の開発終了、Storybook 7.1、Fresh 1.3","author":"azu","layout":"post","date":"2023-07-20T12:49:40.487Z","category":"JSer","tags":["node.js","security","Tools","ECMAScript","proposal"],"url":"https://jser.info/2023/07/20/vm2-storybook-7.1-fresh-1.3/"},"items":[{"category":"Headline","title":"ECMAScript proposal updates @ 2023-07 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2023/07/14/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2023年7月のTC39 MeetingでのECMAScript Proposalのステータス変更のまとめ","relatedLinks":[]},{"category":"Headline","title":"Discontinued · Issue #533 · patriksimek/vm2","url":"https://github.com/patriksimek/vm2/issues/533","tags":["node.js","security","library","issue","news"],"content":"Node.jsの`vm`モジュールを使ったSandboxを実現する目的の`vm2`に構造的なSandbox Escapeの脆弱性があるため、メンテナンスを終了するというアナウンス。\n脆弱性のPoCは2023年8月ごろに公開されるため、isolated-vmのようなモジュールへ移行を推奨している。","relatedLinks":[{"title":"vm2 Sandbox Escape vulnerability · CVE-2023-37466 · GitHub Advisory Database","url":"https://github.com/advisories/GHSA-cchq-frgv-rjh5"},{"title":"laverdet/isolated-vm: Secure ","url":"https://github.com/laverdet/isolated-vm"}]},{"category":"Headline","title":"Release v0.18.13 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.18.13","tags":["JavaScript","bundler","ReleaseNote"],"content":"esbuild v0.18.13リリース。\n`DEV: doAnExpensiveCheck()`のようなラベル指定した処理を、`--drop-label`で削除できるように。","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 174 | WebKit","url":"https://webkit.org/blog/14390/release-notes-for-safari-technology-preview-174/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 174リリース。\nCanvas自体に設定された合計メモリ使用量の制限を削除など","relatedLinks":[{"title":"Total Canvas Memory Use Exceeds The Maximum Limit - PQINA","url":"https://pqina.nl/blog/total-canvas-memory-use-exceeds-the-maximum-limit/"}]},{"category":"Headline","title":"Node v18.17.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v18.17.0","tags":["node.js","ReleaseNote"],"content":"Node.js v18.17.0リリース。\nURLパーサのAda 2.0にアップデート、`URL.canParse`のサポート、Web Crypto APIの仕様との互換性の向上など","relatedLinks":[]},{"category":"Headline","title":"Release 1.0.3 · kamranahmedse/driver.js","url":"https://github.com/kamranahmedse/driver.js/releases/tag/1.0.3","tags":["JavaScript","ReleaseNote","library"],"content":"サイトツアー表示をするDriver.js 1.0リリース。\nTypeScriptで書き直し、SVGをページ上に載せてハイライト表示をするように実装を変更、ドキュメントを刷新など","relatedLinks":[]},{"category":"Headline","title":"Storybook 7.1","url":"https://storybook.js.org/blog/storybook-7-1/","tags":["JavaScript","CSS","debug","Tools","ReleaseNote"],"content":"Storybook 7.1リリース。\nオンボーディングの追加、Emotionなどのスタイリングライブラリのセットアップを自動化、Vueのサポートの改善。\nFigma design addonをコアに取り込むなど","relatedLinks":[]},{"category":"Headline","title":"Chrome 116 beta - Chrome Developers","url":"https://developer.chrome.com/en/blog/chrome-116-beta/","tags":["Chrome","ReleaseNote"],"content":"Chrome 116 betaリリース。\nCSS Motion Path、`display`と`content-visibility`に対してキーフレームアニメーションをサポート。\n`AbortSignal.any()`のサポート、Fetch APIの`getReader({mode: 'byob'})`をサポート、Document Picture-in-Pictureのサポート。\nPermissions Policy Originsに`*` wildcardの指定をサポート。\nOrigin TrialとしてCOOPの`restrict-properties`をサポート、EditContext APIのサポートなど","relatedLinks":[{"title":"Use a ReadableStream with byte source (formerly called ReadableByteStream) for .body · Issue #267 · whatwg/fetch","url":"https://github.com/whatwg/fetch/issues/267"},{"title":"ReadableStream.getReader() - Web API | MDN","url":"https://developer.mozilla.org/ja/docs/Web/API/ReadableStream/getReader"},{"title":"Wildcards in Permissions Policy Origins by arichiv · Pull Request #516 · w3c/webappsec-permissions-policy","url":"https://github.com/w3c/webappsec-permissions-policy/pull/516"},{"title":"w3c/edit-context: EditContext API","url":"https://github.com/w3c/edit-context"}]},{"category":"Headline","title":"Fresh 1.3 – Simplified Route Components and More","url":"https://deno.com/blog/fresh-1.3","tags":["deno","library","ReleaseNote"],"content":"Fresh 1.3リリース。\n非同期のルートコンポーネントをサポート、プラグインがルーティングやミドルウェアを定義できるように、`_500.tsx`でのエラーページのサポート、ErrorBoundaryのサポート。\n1ファイルから複数のislandsをexportできるように、`Deno.serve`のサポートなど","relatedLinks":[{"title":"feat: support async route components by marvinhagemeister · Pull Request #1388 · denoland/fresh","url":"https://github.com/denoland/fresh/pull/1388"},{"title":"feat(server): plugins can add middlewares and routes by deer · Pull Request #1455 · denoland/fresh","url":"https://github.com/denoland/fresh/pull/1455"}]},{"category":"Headline","title":"Release v0.18.14 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.18.14","tags":["esbuild","ReleaseNote"],"content":"esbuild v0.18.14リリース。\nCSS Modulesサポートの一貫として、`global-css` loaderと`local-css` loaderを追加し、CSSで`:local()`と`:global()`をサポートなど。","relatedLinks":[]},{"category":"Article","title":"URL.canParse","url":"https://davidwalsh.name/url-canparse","tags":["JavaScript","URL","article"],"content":"URLがパースできるかを判定する`URL.canParse`メソッドについて","relatedLinks":[{"title":"URL: canParse() static method - Web APIs | MDN","url":"https://developer.mozilla.org/en-US/docs/Web/API/URL/canParse_static"}]},{"category":"Article","title":"How React 18 Improves Application Performance – Vercel","url":"https://vercel.com/blog/how-react-18-improves-application-performance","tags":["React","article"],"content":"React 18のTransitions、Suspense、Server Componentsについて","relatedLinks":[]},{"category":"Article","title":"Security alert: social engineering campaign targets technology industry employees - The GitHub Blog","url":"https://github.blog/2023-07-18-security-alert-social-engineering-campaign-targets-technology-industry-employees/","tags":["Github","security","npm","article"],"content":"採用担当者や開発者になりすまし、プライベートリポジトリに招待、そのリポジトリをcloneしてインストールすると感染するマルウェアが仕込まれているという攻撃が増えている話。\nマルウェアはnpm install時に、ダウンロードして実行される仕組みになっているという話","relatedLinks":[{"title":"Phylum Discovers Sophisticated Ongoing Attack on NPM","url":"https://blog.phylum.io/sophisticated-ongoing-attack-discovered-on-npm/"}]},{"category":"SoftwareLibrary","title":"coderaiser/putout: 🐊 Pluggable and configurable JavaScript Linter and code transformer with built-in ESLint and Babel support for js, jsx typescript, flow, markdown, yaml and json. Write declarative codemods in a simplest possible way 😏","url":"https://github.com/coderaiser/putout","tags":["JavaScript","AST","Tools"],"content":"BabelとESLintをベースにしたcodemodのツールキット。\nビルトインルールとしてCommonJS to ESMなど多数の変換ルールを持っているが、それらを管理するツールとプラグインの仕組みを提供する。","relatedLinks":[]}]},{"meta":{"title":"2023-07-28のJS: Node.js v20.5.0、Bun v0.7.0、Redwood v6.0.0","author":"azu","layout":"post","date":"2023-07-28T05:25:26.952Z","category":"JSer","tags":["nodejs","TypeScript","esbuild","npm","webservice"],"url":"https://jser.info/2023/07/28/node.js-v20.5.0-bun-v0.7.0-redwood-v6.0.0/"},"items":[{"category":"Headline","title":"Node v20.5.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v20.5.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v20.5.0リリース。\n`node:events`に`addAbortListener`を追加、`fs.readFileSync`でUTF-8のファイルを読み込むときのパフォーマンスを改善など","relatedLinks":[]},{"category":"Headline","title":"Bun v0.7.0 | Bun Blog","url":"https://bun.sh/blog/bun-v0.7.0","tags":["Bun","ReleaseNote"],"content":"Bun v0.7.0リリース。\nViteのサポート、`Worker` APIのサポート、`structuredClone()`のサポート、`AsyncLocalStorage`のサポート。\n実行時のパフォーマンスを犠牲にメモリ消費量を抑える`bun --smol`フラグのサポート、`bun test --bail=<number>`のサポート、Node.jsとの互換性改善など","relatedLinks":[]},{"category":"Headline","title":"Astro 2.9: View Transitions (experimental) | Astro","url":"https://astro.build/blog/astro-290/","tags":["astro","ReleaseNote"],"content":"Astro 2.9リリース。\n試験的にView Transitionsのサポート、Redirectsオプションのサポート。\n再エクスポートをしてるライブラリのbundleを最適化など","relatedLinks":[]},{"category":"Headline","title":"Release 3.32.0 - 2023.07.28 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.32.0","tags":["JavaScript","polyfill","ReleaseNote"],"content":"core-js v3.32.0リリース。\nArray grouping, `Promise.withResolvers`, Set methods, Iterator HelpersのStage変更に対応。\nStage 3の`Float16Array`, Stage 1の`Uint8Clamped`をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 175 | WebKit","url":"https://www.webkit.org/blog/14398/release-notes-for-safari-technology-preview-175/","tags":["ReleaseNote","safari"],"content":"Safari Technology Preview 175リリース。\nService Workerでrequestをリダイレクトした時にHashフラグメントがなくなる問題を修正。\n`.nodeValue`と`.textContent`に`null`代入時の動作を他のブラウザと合わせて、`null`を空文字として扱うように変更など","relatedLinks":[{"title":"249323 – Make Attr.value/nodeValue/textContent not nullable","url":"https://bugs.webkit.org/show_bug.cgi?id=249323"},{"title":"Why can","url":"https://github.com/whatwg/dom/issues/259"}]},{"category":"Headline","title":"Release v1.19.0 · remix-run/remix","url":"https://github.com/remix-run/remix/releases/tag/remix%401.19.0","tags":["Remix","ReleaseNote"],"content":"Remix 1.19.0リリース。\nesbuildの`metafile.*`をビルドディレクトリに含めるように、`serverNodeBuiltinsPolyfill`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0 · redwoodjs/redwood","url":"https://github.com/redwoodjs/redwood/releases/tag/v6.0.0","tags":["nodejs","esbuild","ReleaseNote"],"content":"Redwood v6.0.0リリース。\nViteをデフォルトのBundlerとして利用するように変更、Prisma 5へのアップデート、Storybook 7へのアップデート、firebaseのアップデートなど","relatedLinks":[{"title":"Redwood v6.0.0 Upgrade Guide - Announcements / Releases and Upgrade Guides - RedwoodJS Community","url":"https://community.redwoodjs.com/t/redwood-v6-0-0-upgrade-guide/5044"}]},{"category":"Article","title":"typescript-eslint v6 アップデートガイド","url":"https://zenn.dev/cybozu_frontend/articles/ts-eslint-v6-guide","tags":["TypeScript","esbuild","article"],"content":"typescript-eslit v6 のプリセットの変更について","relatedLinks":[]},{"category":"Article","title":"ESLintを使って JSDoc / TSDoc の記述を必須化する","url":"https://zenn.dev/wakamsha/articles/setup-eslint-plugin-jsdoc","tags":["ESLint","article"],"content":"ESLintのルールでJSDocの記述をチェックする設定について","relatedLinks":[]},{"category":"Article","title":"ServiceWorkerの落とし穴8選 - Repro Tech Blog","url":"https://tech.repro.io/entry/2023/07/27/105218","tags":["ServiceWorker","article","JavaScript"],"content":"Service Workerのライフサイクル、Cache-Controlヘッダでのキャッシュの動作、デバッグ、バグがあった時に停止方法などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"pkg-size | Find the true size of a npm package","url":"https://pkg-size.dev/","tags":["npm","webservice","performance"],"content":"WebContainersを使ってパッケージをインストールし、パッケージのインストール速度やインストールサイズをチェックできるサービス","relatedLinks":[]},{"category":"WebsiteDocument","title":"httptoolkit/brotli-wasm: A reliable compressor and decompressor for Brotli, supporting node &amp; browsers via wasm","url":"https://github.com/httptoolkit/brotli-wasm","tags":["WebAssembly","JavaScript","library"],"content":"BrotliのCompress/Decompressを扱うライブラリ。\nRustのBrotli CrateをWebAssemblyにコンパイルして利用する。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"fabian-hiller/valibot: The modular and type safe schema library for validating structural data 🤖","url":"https://github.com/fabian-hiller/valibot","tags":["TypeScript","library"],"content":"zodライクなスキーマをビルダー関数で組み立てバリデーションとTypeScriptの型として利用できるライブラリ。\n利用しているビルダー関数のみを含むBundleを作れるように、メソッドチェーンではなく関数を組み合わせてスキーマを定義するようになっている","relatedLinks":[{"title":"Introducing Valibot, a ","url":"https://www.builder.io/blog/introducing-valibot"}]}]},{"meta":{"title":"2023-08-03のJS: Riot.js v9.0.0、Firefox 116、React Server Componentsへの移行","author":"azu","layout":"post","date":"2023-08-03T04:00:38.849Z","category":"JSer","tags":["performance","React","cdn","ESLint","browser"],"url":"https://jser.info/2023/08/03/riot.js-v9.0.0-firefox-116-react-server-components/"},"items":[{"category":"Headline","title":"Release v130 · esm-dev/esm.sh","url":"https://github.com/esm-dev/esm.sh/releases/tag/v130","tags":["JavaScript","cdn","library","ReleaseNote"],"content":"esm.sh v130リリース。\nminifyされたUMDをexportするCommonJSパッケージをサポート","relatedLinks":[]},{"category":"Headline","title":"ESLint v8.46.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2023/07/eslint-v8.46.0-released/","tags":["ESLint","ReleaseNote"],"content":"ESLint v8.46.0リリース。\nES2024の正規表現の`v`フラグをサポート、 flat configのエラーメッセージの改善など","relatedLinks":[]},{"category":"Headline","title":"Release Evergreen · riot/riot","url":"https://github.com/riot/riot/releases/tag/v9.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"Riot.js v9.0.0リリース。\nバージョン番号を統一するため、バージョンをスキップしてv9へ。\nNode.js 14/16のサポート終了、BabelでのTranspileをしないように変更、boolean属性の挙動変更など","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0 · markedjs/marked","url":"https://github.com/markedjs/marked/releases/tag/v6.0.0","tags":["Markdown","JavaScript","library","ReleaseNote"],"content":"marked v6.0.0リリース。\nコードベースをTypeScriptへの移行。\nこれに伴い@types/markedは非推奨となった。","relatedLinks":[]},{"category":"Headline","title":"Firefox 116.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/116.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 116リリース。\nHTTP/2のアップロードパフォーマンスの改善、CSP3 external hashesをサポート。\nFetchの`getReader({mode: 'byob'})`をサポートなど","relatedLinks":[{"title":"Firefox 116 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/116"}]},{"category":"Headline","title":"Release v0.34.0 · vitest-dev/vitest","url":"https://github.com/vitest-dev/vitest/releases/tag/v0.34.0","tags":["vite","testing","ReleaseNote"],"content":"vitest v0.34.0リリース。\n`@vitest/coverage-c8`を`@vitest/coverage-v8`に変更、`server`オプションの追加に伴いオプションの移動、`deps.optimizer`をデフォルトで有効化など。\n`describe.sequential` APIの追加など","relatedLinks":[]},{"category":"Headline","title":"Bootstrap 5.3.1 | Bootstrap Blog","url":"https://blog.getbootstrap.com/2023/07/26/bootstrap-5-3-1/","tags":["CSP","library","ReleaseNote"],"content":"Bootstrap 5.3.1リリース。\nダークモードのカラーコントラストの改善、`.disabled`などで無効時のスタイルを追加など","relatedLinks":[]},{"category":"Headline","title":"Bun v0.7.1 | Bun Blog","url":"https://bun.sh/blog/bun-v0.7.1","tags":["Bun","ReleaseNote"],"content":"Bun v0.7.1リリース。\nESMのロードパフォーマンスの改善、`bun:sqlite`のSELECTの改善、workspaceでバージョン指定をサポート。\nnpmプライベートレジストリのサポート改善、Node.jsとの互換性改善、`MessagePort`と`MessageChannel`のサポート、Fetch APIが`file:`をサポートなど","relatedLinks":[]},{"category":"Article","title":"ブラウザの戻る/進むを高速に！ヤフーにおけるBFCache有効化に向けた取り組み - Yahoo! JAPAN Tech Blog","url":"https://techblog.yahoo.co.jp/entry/2023072430429932/","tags":["browser","performance"],"content":"ChromeでのBFcache有効化の条件、デバッグ方法、BFCache有効時のパフォーマンスについて","relatedLinks":[{"title":"How Back/forward Cache Helped Yahoo! JAPAN News Increase Revenue by 9% on Mobile","url":"https://web.dev/yahoo-japan-news-bfcache/"}]},{"category":"Article","title":"Remote Synthesis | Is Jamstack Officially Finished?","url":"https://remotesynthesis.com/blog/goodbye-jamstack/","tags":["community","JavaScript","article"],"content":"Netlifyが運営していたJamstack Community Discordが廃止されたことについて。","relatedLinks":[]},{"category":"Article","title":"Speeding up the dbt™ docs by 20x with React Server Components | Dagster Blog","url":"https://dagster.io/blog/dbt-docs-on-react","tags":["React","performance","article"],"content":"古いAngularJSと巨大なJSONで動いていた`dbt docs`で生成されるサイトを、Next.jsとReact Server Componentsで置き換える話。\nどのように移植したのか、パフォーマンスがどのように改善されたのかについて","relatedLinks":[]},{"category":"Article","title":"We migrated 50,000 lines of code to React Server Components | Mux","url":"https://www.mux.com/blog/what-are-react-server-components","tags":["React","article"],"content":"React Server Componentsについて。\nCSRとSSRとServer Componentについて。\nコンポーネントのツリーをServer Componentへ徐々に移行していく方法について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"KittyGiraudel/a11y-dialog: A very lightweight and flexible accessible modal dialog script.","url":"https://github.com/KittyGiraudel/a11y-dialog","tags":["UI","accessibility","library"],"content":"WAI-ARIAのダイアログパターンを実装したダイアログUIライブラリ","relatedLinks":[]}]},{"meta":{"title":"2023-08-10のJS: Lighthouse v11.0.0、Astro 2.10(View Transitions)、SharpのWebAssemblyビルド","author":"azu","layout":"post","date":"2023-08-10T13:11:24.885Z","category":"JSer","tags":["Bun","Tools","Chrome","performance","deno"],"url":"https://jser.info/2023/08/10/lighthouse-v11.0.0-astro-2.10view-transitions-sharpwebassembly/"},"items":[{"category":"Headline","title":"Bun v0.7.2 | Bun Blog","url":"https://bun.sh/blog/bun-v0.7.2","tags":["Bun","ReleaseNote"],"content":"Bun v0.7.2リリース。\n`node:worker_threads`、`node:diagnostics_channel`のサポート。\n`BroadcastChannel` APIのサポート、`Error`オブジェクトを`structuredClone`でcloneできるように修正。\nメモリリークの修正など","relatedLinks":[]},{"category":"Headline","title":"Release v11.0.0 · GoogleChrome/lighthouse","url":"https://github.com/GoogleChrome/lighthouse/releases/tag/v11.0.0","tags":["Chrome","performance","Tools","ReleaseNote"],"content":"Lighthouse v11.0.0リリース。\nNode.js 16のサポート終了、`resource-summary`/`service-worker`/`first-contentful-paint-3g`のAuditを削除。\nINPのAuditをStableへと移行など","relatedLinks":[]},{"category":"Headline","title":"Deno 1.36: More flexible security and expanded testing APIs","url":"https://deno.com/blog/v1.36","tags":["deno","ReleaseNote"],"content":"Deno v1.36リリース。\n`--deny-*`の拒否フラグをサポート、`deno test`がJUnitレポーターをサポート、`node:test`のサポート。\nNode.jsとの互換性改善、モジュールのダウンロードにリトライを追加など","relatedLinks":[]},{"category":"Headline","title":"Astro 2.10: Persistent State in View Transitions | Astro","url":"https://astro.build/blog/astro-2100/","tags":["astro","ReleaseNote"],"content":"Astro 2.10リリース。\nView Transition APIを使って指定した要素を永続的にする`transition:persist`ディレクティブの追加。\nまた合わせてAstro 3.0がベータリリースされている。","relatedLinks":[]},{"category":"Headline","title":"Bun v0.7.3 | Bun Blog","url":"https://bun.sh/blog/bun-v0.7.3","tags":["Bun","ReleaseNote"],"content":"Bun v0.7.3リリース。\n`bun test --coverage`のサポート、`bun test -t /pattern/`のサポート。\n`bun:sqlite`、`fs`のクラッシュの修正など","relatedLinks":[]},{"category":"Headline","title":"1.0.0: Milestone for API stability · vanjs-org/van · Discussion #72","url":"https://github.com/vanjs-org/van/discussions/72","tags":["JavaScript","library","ReleaseNote"],"content":"Reactive UIフレームワークのVanJS 1.0リリース。","relatedLinks":[{"title":"Release 1.0.0: Milestone for API stability · vanjs-org/van","url":"https://github.com/vanjs-org/van/releases/tag/1.0.0"}]},{"category":"Headline","title":"Release v0.19.0 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.19.0","tags":["esbuild","ReleaseNote"],"content":"esbuild v0.19.0リリース。\nエントリーポイントにワイルドカードを指定できるように、Dynamic Importで変数を含めたパスをbundleできるように。\n`--packages=external`と`tsconfig.json`の`paths`の問題の修正、`.module.css`のデフォルトローダを`local-css`へ変更","relatedLinks":[]},{"category":"Headline","title":"Wednesday August 9th 2023 Security Releases | Node.js","url":"https://nodejs.org/en/blog/vulnerability/august-2023-security-releases","tags":["nodejs","ReleaseNote","security"],"content":"Node.jsのセキュリティリリースとして次のバージョンが公開されている。\n\n- Node v20.5.1 (Current)\n- Node v18.17.1 (LTS)\n- Node v16.20.2 (LTS)\n\n実験的な機能であるPermissions policiesの修正とOpenSSLのアップデートが主な修正","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.2 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-2-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.2 RCリリース。\nStage 3 ProposalのExplicit Resource Management(`using`宣言)のサポート、Decorator Metadataのサポート。\nTupleにおけるラベルありなしの組み合わせの制限を削除、配列のUnion型の扱いの改善。\n`import type`では`.ts`ファイルをimportできるように修正、`module`オプションと`moduleResolution`オプションの間違った組み合わせのチェックを追加など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 176 | WebKit","url":"https://webkit.org/blog/14401/release-notes-for-safari-technology-preview-176/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 176リリース。\nCSSの`contain-intrinsic-size: inherit`のサポート、`liner(...)` timing functionのサポートなど","relatedLinks":[]},{"category":"Article","title":"Bringing Sharp to WebAssembly and WebContainers","url":"https://blog.stackblitz.com/posts/bringing-sharp-to-wasm-and-webcontainers/","tags":["WebAssembly","Image","article"],"content":"C++で書かれたNative Addonの画像処理ライブラリであるsharpをWebContainersで利用できるようにWebAssemblyへコンパイルする話。\nemnapiを使ったNode APIの移植、libvipsをWasmへコンパイル、起動時の処理を同期的にするためにEmscriptenをどのように修正したかについて。","relatedLinks":[]},{"category":"Article","title":"A compilation of outstanding testing articles (with JavaScript) | Practica.js","url":"https://practica.dev/blog/a-compilation-of-outstanding-testing-articles-with-javaScript/","tags":["JavaScript","program","testing","article"],"content":"テストに関する優れた記事/動画の概要を紹介している記事。","relatedLinks":[]},{"category":"Article","title":"Puppeteer in Node.js: Common Mistakes to Avoid | AppSignal Blog","url":"https://blog.appsignal.com/2023/02/08/puppeteer-in-nodejs-common-mistakes-to-avoid.html","tags":["puppeteer","article"],"content":"Puppeteerでのよくある間違いについての連載記事","relatedLinks":[]},{"category":"SlideVideo","title":"Vue.jsエコシステム動向2023 - Speaker Deck","url":"https://speakerdeck.com/kazupon/vue-dot-jsekosisutemudong-xiang-2023","tags":["Vue","slide"],"content":"Vue周りのエコシステムについてのスライド。\nVue 3.3の改善内容やReactivity Transformが非推奨となった理由について。\nVueのLSP、Nuxt 3とNitroについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"npmgraph -","url":"https://npmgraph.js.org/","tags":["npm","webservice","Tools"],"content":"npmパッケージの依存関係を可視化できるWebサービス。\n指定したパッケージまたは`package.json`から解析できる","relatedLinks":[]},{"category":"Book","title":"実践 Svelte入門：書籍案内｜技術評論社","url":"https://gihyo.jp/book/2023/978-4-297-13495-2","tags":["Svelte","book"],"content":"Svelteの入門書","relatedLinks":[]}]},{"meta":{"title":"2023-08-16のJS: Next.js v13.4.16(test mode)、SafariのStorage Policy、ESMへの移行(Redux)","author":"azu","layout":"post","date":"2023-08-16T13:35:20.092Z","category":"JSer","tags":["Chrome","TypeScript","React","safari","npm"],"url":"https://jser.info/2023/08/16/next.js-v13.4.16test-mode-safaristorage-policy-esmredux/"},"items":[{"category":"Headline","title":"Google Online Security Blog: An update on Chrome Security updates – shipping security fixes to you faster","url":"https://security.googleblog.com/2023/08/an-update-on-chrome-security-updates.html","tags":["Chrome","security","news"],"content":"Chrome 116から、2週間ごとのセキュリティリリースが1週間ごとのリリースへと短縮される。","relatedLinks":[]},{"category":"Headline","title":"Release v1.37.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.37.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.37.0リリース。\n`--shard`フラグで分割実行した結果のレポートを結合できる`merge-reports`コマンドの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v1.3.0 · vega/ts-json-schema-generator","url":"https://github.com/vega/ts-json-schema-generator/releases/tag/v1.3.0","tags":["TypeScript","library","ReleaseNote"],"content":"ts-json-schema-generator v1.3.0リリース。\n`satisfies`演算子のサポート、TypeScript 5へのアップデート、Bunのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Electron 26.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-26-0","tags":["Electron","ReleaseNote"],"content":"Electron 26リリース。\nChromium 116, V8 11.2, Node.js 18.16.1へのアップデート。","relatedLinks":[]},{"category":"Headline","title":"Release v13.4.16 · vercel/next.js","url":"https://github.com/vercel/next.js/releases/tag/v13.4.16","tags":["Next.js","ReleaseNote"],"content":"Next.js v13.4.16リリース。\n実験的にplaywrightとmswを使ったtest modeを追加など","relatedLinks":[{"title":"Next.jsにnext/testmodeという概念が出現しMSW x Playwrightのテストがやりやすくなりそう","url":"https://zenn.dev/uyas/articles/bc58a4bed15ed4"}]},{"category":"Article","title":"Updates to Storage Policy | WebKit","url":"https://webkit.org/blog/14403/updates-to-storage-policy/","tags":["safari","JavaScript","article"],"content":"SafariのWeb StorageのPolicyについて。\nOriginごと/全体でのQuotaがあり、Quotaを超えると`QuotaExceededError`が発生する。\n利用されていないウェブサイトのデータはオリジンごとに削除される。また、ストレージの永続性を保証するためのStorage APIの使い方について","relatedLinks":[]},{"category":"Article","title":"Blogged Answers: My Experience Modernizing Packages to ESM · Mark&#039;s Dev Blog","url":"https://blog.isquaredsoftware.com/2023/08/esm-modernization-lessons/","tags":["JavaScript","npm","redux","article","opinion"],"content":"あらゆる環境で動くJavaScriptのパッケージ公開の難しさについての記事。\nCJSとESMのdual package、TypeScriptの`moduleResolution`との互換性、UMD、webpack 4との互換性。\nNext.jsとReact Server Componentの問題についてなど。","relatedLinks":[]},{"category":"Article","title":"Module documentation (in progress)","url":"https://gist.github.com/andrewbranch/79f872a8b9f0507c9c5f2641cfb3efa6","tags":["TypeScript","article"],"content":"TypeScriptがモジュールに対してどのようなアプローチで扱っているについてのガイド。\n`moduleResolution`オプション、TypeScriptのモジュール解決の仕組み、ESMとCJSの相互運用性などについて","relatedLinks":[]},{"category":"Article","title":"Creating a recorder with Document Picture-in-Picture API | Contrast","url":"https://www.getcontrast.io/learn/using-document-picture-in-picture-and-insertable-streams-apis-to-record-your-screen-and-camera","tags":["JavaScript","Chrome","article"],"content":"Document Picture-in-Picture APIを使って、カメラ表示と画面を合成して録画する方法について","relatedLinks":[]},{"category":"Article","title":"A Blog Post With Every HTML Element","url":"https://www.patrickweaver.net/blog/a-blog-post-with-every-html-element/","tags":["HTML","article"],"content":"全てのHTML要素を含むブログ記事。\nそれぞれのタグについての説明が含まれている","relatedLinks":[]},{"category":"Article","title":"Deprecating the unload event - Chrome Developers","url":"https://developer.chrome.com/en/blog/deprecating-unload/","tags":["Chrome","JavaScript","article"],"content":"Chrome 117から`unload`イベントがDeprecatedとなる。\n`unload`イベントはうまく動かないことが多くBFCacheを無効にする。\n代用として`visibilitychange`/`pagehide`イベントを推奨している。`unload`イベントを利用しているかを調べる方法についてなど","relatedLinks":[]},{"category":"Article","title":"What&#039;s New in DevTools (Chrome 117) - Chrome Developers","url":"https://developer.chrome.com/en/blog/new-in-devtools-117/","tags":["Chrome","debug","article"],"content":"Chrome 117の開発者ツールの変更点について。\nNetworkでのコンテンツオーバーライドの改善、拡張機能のURLをフィルターする機能を追加、Fetchにおける実際のPriorityを確認できるように。\nサードパーティクッキーに関する警告や問題の説明を追加、prerenderのデバッグ機能を追加など","relatedLinks":[]},{"category":"SlideVideo","title":"React - Speaker Deck","url":"https://speakerdeck.com/recruitengineers/react","tags":["React","slide"],"content":"Reactの考え方についてのスライド。\nMPA/SPAの違いや課題、宣言的UIとしてのReact、コンポーネント、状態管理、レンダリング、副作用について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Using TypeScript – React","url":"https://react.dev/learn/typescript","tags":["React","TypeScript","document"],"content":"TypeScriptについてのReactの公式ドキュメント","relatedLinks":[]}]},{"meta":{"title":"2023-08-24のJS: Fresh 1.4、Chrome 117 Beta、Bun 0.8.0","author":"azu","layout":"post","date":"2023-08-24T13:53:47.943Z","category":"JSer","tags":["Chrome","React","debug","deno","Extension"],"url":"https://jser.info/2023/08/24/fresh-1.4-chrome-117-beta-bun-0.8.0/"},"items":[{"category":"Headline","title":"Fresh 1.4 – Faster Page Loads, Layouts and More","url":"https://deno.com/blog/fresh-1.4","tags":["deno","library","ReleaseNote"],"content":"Fresh 1.4リリース。\n事前コンパイルによるページ読み込みの改善、`<head>`/`<head>`/`<body>`タグを定義できるように、`_layout`ファイルのサポート。\n`defineRoute`/`defineLayout`/`defineApp`関数の追加、ルートグループの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v29.6.3 · jestjs/jest","url":"https://github.com/jestjs/jest/releases/tag/v29.6.3","tags":["jest","ReleaseNote"],"content":"Jest v29.6.3リリース。\n`@types/node`への依存を削除、watch modeでは常にworkerを使うように変更、minorバージョンで入ったmockに関する破壊的変更をrevertなど","relatedLinks":[]},{"category":"Headline","title":"Release v3.5.0 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v3.5.0","tags":["JavaScript","server","library"],"content":"Hono v3.5.0リリース。\nSecurity Headersミドルウェアの追加、Cookieヘルパーの追加、Zod OpenAPIミドルウェアの追加。\n`queries`、`c.runtime()`、`app.handleEvent()` を非推奨化など","relatedLinks":[]},{"category":"Headline","title":"Chrome 117 beta - Chrome Developers","url":"https://developer.chrome.com/en/blog/chrome-117-beta/","tags":["Chrome","ReleaseNote"],"content":"Chrome 117 betaリリース。\nCSSの`@starting-style`ルール、`overlay`プロパティ、`transition-behavior`プロパティのサポート。\nCSS Gridに`subgrid`の実装、`text-wrap: pretty`のサポートなど。\nECMAScript Stage 3の`Object.groupBy`/`Map.groupBy`の実装、Iterator Helpersの実装。\n\n`Clear-Site-Data`ヘッダの値として`\"clientHints\"`と`\"*\"`を実装。\nURLパースをWHATWG URL標準に合わせるように修正。\nOrigin TrialsとしてShared Brotli、WebSQLのdeprecation trial。\nまた`unload`イベントを非推奨へと変更など","relatedLinks":[]},{"category":"Headline","title":"Release v9.0.0-alpha.0 · reduxjs/react-redux","url":"https://github.com/reduxjs/react-redux/releases/tag/v9.0.0-alpha.0","tags":["React","redux","library","ReleaseNote"],"content":"React-Redux v9.0.0-alpha.0リリース。\nReact 18、Redux 5が必須へと変更。\nCJS/ESMのdual packageに対応、UMDビルドの削除、Server Componentとの互換性の改善など","relatedLinks":[]},{"category":"Headline","title":"Bun v0.8.0 | Bun Blog","url":"https://bun.sh/blog/bun-v0.8.0","tags":["Bun","ReleaseNote"],"content":"Bun v0.8.0リリース。\n`--inspect`でのDebuggerサポート、`bun update`での依存関係のアップデートのサポート、SvelteKit/Nuxtのサポート。\nFetch APIのresponse body streamingのサポート、`File` constructorのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Rspack 0.3 Release Announcement - Rspack","url":"https://www.rspack.dev/blog/announcing-0.3.html","tags":["rspack","webpack","ReleaseNote"],"content":"Rspack 0.3リリース。\nCSSの挙動をwebpackと合わせるオプションとして`experiments.css = true`を追加、post-css関係のloaderの変更など。\nWeb Workerのサポート、`builtin:swc-loader`のサポート、`RSPACK_PROFILE=ALL`でのプロファイルを取れるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v2.3.0 · parcel-bundler/watcher","url":"https://github.com/parcel-bundler/watcher/releases/tag/v2.3.0","tags":["nodejs","C++","library","ReleaseNote"],"content":"@parcel/watcher 2.3.0リリース。\nFreeBSDのサポート、Wasmバックエンドである`@parcel/watcher-wasm`パッケージの追加など","relatedLinks":[]},{"category":"Article","title":"Debugging speculation rules - Chrome Developers","url":"https://developer.chrome.com/en/blog/debugging-speculation-rules/","tags":["Chrome","debug","article"],"content":"Chromeの開発者ツールを使った`speculationrules`などの投機的なprefetchのデバッグ方法について","relatedLinks":[]},{"category":"Article","title":"Long Animation Frames API - Chrome Developers","url":"https://developer.chrome.com/en/articles/long-animation-frames/","tags":["Chrome","performance","article"],"content":"Long Task APIでは50ms以上占有するタスクがあることしか分からないため不完全な情報だった。\nLong Animation Frames APIはこの欠点を改善し、INPの改善に役立つ情報を提供する目的で追加された点について。\nLong Animation Frames API に含まれる情報(Attributes)やこれを利用したデバッグ方法について。","relatedLinks":[]},{"category":"Article","title":"Patterns for Reactivity with Modern Vanilla JavaScript | Frontend Masters","url":"https://frontendmasters.com/blog/vanilla-javascript-reactivity/","tags":["JavaScript","article"],"content":"JavaScriptでReactiveな処理をどう実装するかについて。\nEventTargetとCustomEventを使ったPubSub/Observerパターン、Proxyを使ったリフアクティブなオブジェクト、Signal。\nまたDOMの`MutationObserver`や`IntersectionObserver`などAPIについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"alvarlagerlof/rsc-parser: A parser for the React Server components when sent over the network","url":"https://github.com/alvarlagerlof/rsc-parser","tags":["Chrome","Extension","React","debug"],"content":"React Server Component(RSC)のデバッグをするブラウザ拡張。\nRSCのネットワークリクエストをパースし、ペイロードを可視化できる","relatedLinks":[]},{"category":"WebsiteDocument","title":"Alt Text Hall of Fame – Celebrating well-written image descriptions.","url":"https://alttexthalloffame.org/","tags":["accessibility","HTML","Image"],"content":"画像の代替テキストについてのサイト。\nなぜ必要なのかと具体的にどういうキャプションを書くのかの具体的な例などを紹介している","relatedLinks":[]}]},{"meta":{"title":"2023-09-01のJS: Nuxt 3.7、Rome → Biome、Astro 3.0","author":"azu","layout":"post","date":"2023-09-01T03:13:00.504Z","category":"JSer","tags":["nodejs","TypeScript","testing","Tools","book"],"url":"https://jser.info/2023/09/01/nuxt-3.7-rome-biome-astro-3.0/"},"items":[{"category":"Headline","title":"Announcing TypeScript 5.2 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-2/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.2リリース。\nStage 3 ProposalのExplicit Resource Management(`using`宣言)のサポート、Decorator Metadataのサポート。\nTupleにおけるラベルありなしの組み合わせの制限を削除、配列のUnion型の扱いの改善。\n`import type`では`.ts`ファイルをimportできるように修正、`module`オプションと`moduleResolution`オプションの間違った組み合わせのチェックを追加など","relatedLinks":[]},{"category":"Headline","title":"Nuxt 3.7 · Nuxt","url":"https://nuxt.com/blog/v3-7","tags":["Vue","library","ReleaseNote"],"content":"Nuxt v3.7リリース。\nWeb Streamと`Response`のサポート、capo.jsを使った`<head>`内の要素の最適化をサポート、Vite 4.4へのアップデート、Nitro 2.6へのアップデート。\n`tsconfig.json`の`baseUrl`ではなく相対パスを使うように変更、AsyncLocalStorageを使った非同期コンテキストのサポートなど","relatedLinks":[{"title":"Announcing Nitro 2.6 · UnJS","url":"https://unjs.io/blog/2023-08-25-nitro-2.6"}]},{"category":"Headline","title":"Release v8.7.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v8.7.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v8.7.0リリース。\n`worker_threads`を使ったパッケージの解凍処理でパフォーマンスの改善。\nv8.0.0では依存する最小バージョンをインストールする`resolution-mode: lowest`がデフォルトだったが、v8.7.0で`resolution-mode: highest`に変更。\n`pnpm import`がnpmのlockfileVersion 3をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing Biome","url":"https://biomejs.dev/blog/annoucing-biome","tags":["JavaScript","Tools","news"],"content":"RomeはBiomeという名前でプロジェクトをforkすることになった。\n会社としてのRome Tools Inc.は解散し連絡も取れないため、RomeのコアチームがBiomeというプロジェクトで新しくやり直すことになった。\nこれに伴い`rome`パッケージなども`@biome/*`へと変更される。","relatedLinks":[]},{"category":"Headline","title":"Release v0.20.0 · nodejs/corepack","url":"https://github.com/nodejs/corepack/releases/tag/v0.20.0","tags":["nodejs","Tools","ReleaseNote"],"content":"corepack 0.20.0リリース。\nCLIのコマンドのほとんどが変更された。古いコマンドも互換性のために維持されている。","relatedLinks":[]},{"category":"Headline","title":"Changelog | Cypress Documentation","url":"https://docs.cypress.io/guides/references/changelog#13-0-0","tags":["E2E","testing","library","ReleaseNote"],"content":"Cypress 13.0.0リリース。\nNode.js 14のサポート終了、`video`オプションがデフォルトで`false`へと変更など","relatedLinks":[]},{"category":"Headline","title":"Release astro@3.0.0 · withastro/astro","url":"https://github.com/withastro/astro/releases/tag/astro%403.0.0","tags":["astro","JavaScript","library","ReleaseNote"],"content":"Astro 3.0.0リリース。\nNode.js 16のサポート終了、`~/assets`のimport aliasがデフォルトでは含まれないように変更、`class:list`の挙動を変更、画像の最適化にSharpを使うように変更。\nScoped Styleに`:where`ではなくdata属性を使うように変更、ExperimentalだったView TransitionとImageオプションを削除しデフォルトで有効化。\nReact Fast Refreshが動作するようになるなど","relatedLinks":[{"title":"Astro 3.0 | Astro","url":"https://astro.build/blog/astro-3/"},{"title":"View Transitions 🚀 Astro Documentation","url":"https://docs.astro.build/en/guides/view-transitions/#upgrade-to-v30-from-v2x"},{"title":"Upgrade to Astro v3 🚀 Astro Documentation","url":"https://docs.astro.build/en/guides/upgrade-to/v3/"}]},{"category":"Headline","title":"Release v10.0.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v10.0.0","tags":["npm","ReleaseNote"],"content":"npm v10.0.0リリース。\nNode.js 14と16のサポートの終了、libnpmpublishが409エラーの場合に再施行しないように変更など","relatedLinks":[]},{"category":"Headline","title":"JavaScript Primer v5.0.0: ES2023の対応/CC BYライセンスに変更/Open Collectiveで支援できるようになりました | Web Scratch","url":"https://efcl.info/2023/08/31/jsprimer-v5/","tags":["JavaScript","ReleaseNote","book"],"content":"JavaScript入門書のjsprimer v5.0.0リリース。\nES2023のChange Array by copyの対応、`Array.prototype.{findLast, findLastIndex}`の対応。\nライセンスをCC BY-NCからCC BYへ変更など","relatedLinks":[]},{"category":"Article","title":"Protractor Deprecation Update August 2023 | by Mark Thompson (@marktechson) | Aug, 2023 | Angular Blog","url":"https://blog.angular.io/protractor-deprecation-update-august-2023-2beac7402ce0","tags":["JavaScript","browser","testing","article"],"content":"Protractorは2023年8月末でEOLとなるためサポートが終了する。\n終了に伴うよくある質問や他のテストツールへの移行方法について","relatedLinks":[]},{"category":"Article","title":"Introducing the scheduler.yield origin trial - Chrome Developers","url":"https://developer.chrome.com/en/blog/introducing-scheduler-yield-origin-trial/","tags":["Chrome","JavaScript","article"],"content":"Chrome 115で実験的に実装されている`scheduler.yield`について。\n`setTimeout(..., 0)`はタスクキューの最後に追加するが、`scheduler.yield`はタスクキューの先頭に追加するという違いがあることについて","relatedLinks":[]},{"category":"Article","title":"The complexity of writing an efficient NodeJS Docker image - Specfy","url":"https://www.specfy.io/blog/1-efficient-dockerfile-nodejs-in-7-steps","tags":["Docker","article","nodejs"],"content":"Node.jsのDocker Imageのビルドサイズの最適化について","relatedLinks":[]},{"category":"Article","title":"14 Linting Rules To Help You Write Asynchronous Code in JavaScript - Maxim Orlov","url":"https://maximorlov.com/linting-rules-for-asynchronous-code-in-javascript/","tags":["JavaScript","ESLint","article"],"content":"非同期(PromiseやAsync Function)に関するESLintルールの紹介記事。\nよくある非同期処理の間違いや問題を検知するESLintルールのまとめ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"aerotoad/neboa: Type-safe NoSQL with Node &amp; SQLite. 🌫️💽","url":"https://github.com/aerotoad/neboa","tags":["nodejs","SQLite","library","TypeScript"],"content":"Node.js向けのSQLiteバックエンドのORMライブラリ。","relatedLinks":[]},{"category":"Book","title":"JavaScript Primer v5.0.0: ES2023の対応/CC BYライセンスに変更/Open Collectiveで支援できるようになりました | Web Scratch","url":"https://efcl.info/2023/08/31/jsprimer-v5/","tags":["JavaScript","book","ReleaseNote"],"content":"JavaScript入門書のjsprimer v5.0.0リリース。\nES2023のChange Array by copyの対応、`Array.prototype.{findLast, findLastIndex}`の対応。\nライセンスをCC BY-NCからCC BYへ変更など","relatedLinks":[]}]},{"meta":{"title":"2023-09-07のJS: Node.js v20.6.0(.env)、Rspackのアーキテクチャデザイン","author":"azu","layout":"post","date":"2023-09-07T06:06:26.726Z","category":"JSer","tags":["nodejs","bundler","MicroFrontend","architecture","GraphQL"],"url":"https://jser.info/2023/09/07/node.js-v20.6.0.env-rspack/"},"items":[{"category":"Headline","title":"nitrogql 1.0 release | nitrogql blog","url":"https://nitrogql.vercel.app/blog/release-1.0","tags":["GraphQL","Tools","Rust","nodejs","TypeScript","ReleaseNote"],"content":"GraphQLからクライアントコードの生成とGraphQLのクエリの型チェック行うnitrogql 1.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Node v20.6.0 (Current) | Node.js","url":"https://nodejs.org/ja/blog/release/v20.6.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v20.6.0リリース。\n`.env`をビルトインサポート、`import.meta.resolve`をフラグなしで利用できるように、`module.register()` APIの追加。\nLoaderの`load` hookがCommonJSをサポートし、非推奨の`require.extensions`を使わなくてもCommonJSを扱うcustom loaderを書けるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · actions/checkout","url":"https://github.com/actions/checkout/releases/tag/v4.0.0","tags":["Github","Actions","nodejs","ReleaseNote"],"content":"actions/checkout v4.0.0リリース。\nNode.js 20を利用するように、`show-progress`オプションを追加など","relatedLinks":[]},{"category":"Article","title":"Design Trade-offs in Bundler: The Rationale Behind Creating Rspack · web-infra-dev/wg · Discussion #1","url":"https://github.com/web-infra-dev/wg/discussions/1","tags":["JavaScript","bundler","article","architecture"],"content":"Rspackの開発の目的やwebpack/parcel/esbuild/rollupなどのbundlerのアーキテクチャについて。\nwebpackにはデバッグやパフォーマンスの問題があり、Vite/Rollupも大規模プロジェクトではパフォーマンスにビルド環境の差異の問題があり、esbuildはプラグインの柔軟性に問題がある。\nRollupはESMのみが第一級市民であり、RspackはwebpackとParcelと同じく言語に依存しないことを目的にしている。\nそれぞれのbundlerのプラグインAPIの設計と複雑性、ASTの再利用とパフォーマンスの問題、Tree ShakingをASTベースで行った場合の課題について。\nまた、今後のRspackが目指す方向して簡単に使えるようにすること、デバッグをしやすくすること、最適化をwebpackと同等以上にすること、リモートキャッシュなどについて触れている。","relatedLinks":[]},{"category":"Article","title":"Mofi - Snappy UIs With WebAssembly and Web Workers","url":"https://mofi.loud.red/blog/wasm-and-workers","tags":["WebAssembly","webworker","article","JavaScript"],"content":"WebAssemblyでの処理をWebWorkerの中で動かし、メインスレッドをブロックせずに処理を行うという話。\nCPUのコア数を超えてWorkerを増やすと問題があるため、ワーカープールを作成しWorker数を制御している。またWorkerから進捗状況をメッセージングする方法についてなど","relatedLinks":[]},{"category":"Article","title":"Faster Vue.js Execution in Firefox - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2023/09/faster-vue-js-execution-in-firefox/","tags":["Firefox","JavaScript","performance","article"],"content":"Vueなどが使うProxyの最適化を行うことで、TodoMVC-Vuewのパフォーマンスが40%改善される。\nFirefox 118のリリースにこの変更が含まれる予定。","relatedLinks":[]},{"category":"Article","title":"How we reduced the size of our JavaScript bundles by 33% - Dropbox","url":"https://dropbox.tech/frontend/how-we-reduced-the-size-of-our-javascript-bundles-by-33-percent","tags":["JavaScript","bundler","article"],"content":"Rollupを使ってCode Splitting/Tree Shakingを行うことでbundleサイズを小さくしたという話。\n一方でRollupはメモリ上に全てのコードを持つためCIのビルドが不安定になった点、細かいchunkだと圧縮効率があまりよくなかった点についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"Modern.js","url":"https://modernjs.dev/en","tags":["JavaScript","library","MicroFrontend"],"content":"ByteDanceのJavaScript向けのウェブアプリケーションフレームワーク。\nReactをベースにしたクライアントサイド向けのモデルやルーティング、Rspack/ESLint/Jestなどの統合、BFFのサポート、MicroFrontendのサポートなどをしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"measuredco/puck: The self-hosted drag and drop editor for React.","url":"https://github.com/measuredco/puck","tags":["React","editor ","library"],"content":"D&Dで編集できるビジュアルエディタのReactコンポーネントライブラリ","relatedLinks":[]},{"category":"Book","title":"Nuxt 3　フロントエンド開発の教科書：書籍案内｜技術評論社","url":"https://gihyo.jp/book/2023/978-4-297-13685-7","tags":["Vue","library","book"],"content":"2023年9月22日発売\nNuxtについての書籍","relatedLinks":[]}]},{"meta":{"title":"2023-09-15のJS: Bun v1.0、Node.js 16はEOL、State of CSS 2023","author":"azu","layout":"post","date":"2023-09-15T00:57:05.650Z","category":"JSer","tags":["React","Bun","CSS","nodejs","Chrome"],"url":"https://jser.info/2023/09/15/bun-v1.0-node.js-16eol-state-of-css-2023/"},"items":[{"category":"Headline","title":"Bun 1.0 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0","tags":["Bun","ReleaseNote"],"content":"Bun v1.0リリース。\nNode.js互換のruntimeとコアパッケージの実装、TypeScriptのTranspiler、Bundler、npmのパッケージマネージャー、`bun test`でのテストツールを持つ。","relatedLinks":[{"title":"Bun 1.0 is here - YouTube","url":"https://www.youtube.com/watch?v=BsnCpESUEqM"}]},{"category":"Headline","title":"Release v29.7.0 · jestjs/jest","url":"https://github.com/jestjs/jest/releases/tag/v29.7.0","tags":["jest","JavaScript","testing","ReleaseNote"],"content":"Jest v29.7.0リリース。\n`jest --init`に変わってセットアップができる`create-jest`パッケージの追加など","relatedLinks":[]},{"category":"Headline","title":"doc: mark v16.x as End-of-Life by targos · Pull Request #908 · nodejs/Release","url":"https://github.com/nodejs/Release/pull/908","tags":["nodejs","news"],"content":"Node.js 16がEOLとなった","relatedLinks":[{"title":"Bringing forward the End-of-Life Date for Node.js 16 | Node.js","url":"https://nodejs.org/en/blog/announcements/nodejs16-eol"}]},{"category":"Headline","title":"New in Chrome 117 - Chrome Developers","url":"https://developer.chrome.com/en/blog/new-in-chrome-117/","tags":["Chrome","ReleaseNote"],"content":"Chrome 117リリース。\nCSSのアニメーションに関する機能の追加、\nCSS subgridの実装。\nECMAScript Stage 3の`Object.groupBy`/`Map.groupBy`の実装、Iterator Helpersの実装など","relatedLinks":[{"title":"Chrome 117 beta - Chrome Developers","url":"https://developer.chrome.com/en/blog/chrome-117-beta/"}]},{"category":"Headline","title":"Release v3.6.0 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v3.6.0","tags":["JavaScript","library","server","ReleaseNote"],"content":"Hono v3.6.0リリース。\n`c.render()`と`c.setRenderer()`の追加、`c.var`の追加。\nHMRに対応するViteプラグインとして`@hono/vite-dev-server`を公開など","relatedLinks":[]},{"category":"Headline","title":"Chrome 118 beta - Chrome Developers","url":"https://developer.chrome.com/en/blog/chrome-118-beta/","tags":["Chrome","ReleaseNote"],"content":"Chrome 118 betaリリース。\n`@scope`でのScoped Styles、Media QueryでJavaScriptが有効かを判定する`scripting`の追加。\n`tabIndex`が`0`以上のscoll containerにフォーカスできるように、`beforeunload`で`event.returnValue`が空文字の場合はダイアログを表示しないように変更。","relatedLinks":[]},{"category":"Headline","title":"Bootstrap 5.3.2 | Bootstrap Blog","url":"https://blog.getbootstrap.com/2023/09/14/bootstrap-5-3-2/","tags":["CSS","library","ReleaseNote"],"content":"Bootstrap 5.3.2リリース。","relatedLinks":[]},{"category":"Article","title":"Making Sense of React Server Components","url":"https://www.joshwcomeau.com/react/server-components/","tags":["React","article"],"content":"React Server Componentsがどのように動くか、ClientとServerの境界線、利点についてなど","relatedLinks":[]},{"category":"Article","title":"How to Pass a Component as a Prop in React | Total TypeScript","url":"https://www.totaltypescript.com/pass-component-as-prop-react","tags":["React","article"],"content":"ComponentをPropsとして渡す3つの方法について。\nJSXを渡す方法、Componentを渡す方法、`as`を使う方法について","relatedLinks":[]},{"category":"SlideVideo","title":"State of CSS 2023","url":"https://2023.stateofcss.com/","tags":["CSS","Survey"],"content":"State of CSS 2023の結果が公開された。\nCSSの言語機能、フレームワーク、CSS in JS、ツールなどについてのアンケート結果が公開されている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Next.Nav","url":"https://www.next-nav.com/","tags":["Next.js","VSCode","Extension"],"content":"Next.jsのルーティング情報からアプリケーションがどのような構造になっているかを表示、ルーティングの編集ができるVSCode拡張","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nebrelbug/npm-to-yarn: Convert npm CLI commands to yarn, and vice versa","url":"https://github.com/nebrelbug/npm-to-yarn","tags":["npm","yarn","pnpm","Bun","library"],"content":"npmのコマンドをyarn/pnpm/bunのコマンドに変換するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"isaacs/tshy","url":"https://github.com/isaacs/tshy","tags":["TypeScript","Tools"],"content":"TypeScriptのソースコードからESMとCJSのdual packageを作成するツール","relatedLinks":[]},{"category":"Book","title":"Efficient Node.js","url":"https://learning.oreilly.com/library/view/efficient-node-js/9781098145187/","tags":["nodejs","book"],"content":"2024年8月発売\nNode.jsでのアプリケーション開発についての書籍","relatedLinks":[]}]},{"meta":{"title":"2023-09-22のJS: Remix v2、Safari 17、TypeScriptドキュメンタリー","author":"azu","layout":"post","date":"2023-09-22T11:20:43.678Z","category":"JSer","tags":["Tools","nodejs","UI","Chrome","debug"],"url":"https://jser.info/2023/09/22/remix-v2-safari-17-typescript/"},"items":[{"category":"Headline","title":"Bun v1.0.2 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.2","tags":["Bun","ReleaseNote"],"content":"Bun v1.0.2リリース。\n`bunx <pkg>@latest`で最新のパッケージが取得できないバグを修正、`bun --watch`のパフォーマンス改善。\nDateのパースにV8の実装を使ように、`URL.canParse`/`URLSearchParams.prototype.size`の実装など。","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · remix-run/remix","url":"https://github.com/remix-run/remix/releases/tag/remix%402.0.0","tags":["Remix","ReleaseNote"],"content":"Remix 2.0.0リリース。\nReact 17のサポート終了、Node.js 14/16のサポート終了。\nV1からの移行は`v2_*`フラグを使うことで機能を一つずつ有効化して移行できる。\n2.0.0では`v2_*`フラグの削除、`remix.config.js`の設定やコマンドの変更などが含まれる。","relatedLinks":[{"title":"Remix v2 | Remix","url":"https://remix.run/blog/remix-v2"},{"title":"Upgrading to v2 | Remix","url":"https://remix.run/docs/en/main/start/v2"}]},{"category":"Headline","title":"Node v18.18.0 (LTS) | Node.js","url":"https://nodejs.org/ja/blog/release/v18.18.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v18.18.0リリース。\n`node --import`フラグの追加、`node:fs`と`node:stream`でExplicit Resource Managementのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node v20.7.0 (Current) | Node.js","url":"https://nodejs.org/ja/blog/release/v20.7.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v20.7.0リリース。\n複数の`--env-file`指定をサポート、npm 10.xへのアップデート、`process.sourceMapsEnabled` APIの追加など","relatedLinks":[]},{"category":"Headline","title":"Next.js 13.5 | Next.js","url":"https://nextjs.org/blog/next-13-5","tags":["Next.js","ReleaseNote"],"content":"Next.js 13.5リリース。\nパフォーマンスの改善、re-exportsするパッケージを最適化する`optimizePackageImports`オプションの追加。\n実験的な機能として、`next/image`に`unstable_getImgProps`を追加、`next dev --experimental-https`の追加。\nまた、`create-next-app`がBunをサポートなど","relatedLinks":[]},{"category":"Headline","title":"eslint-stylistic/eslint-stylistic: Monorepo for ESLint Stylistic plugins and configs","url":"https://github.com/eslint-stylistic/eslint-stylistic","tags":["ESLint","plugin"],"content":"ESLintのスタイル関連のルールを管理するプロジェクト","relatedLinks":[]},{"category":"Headline","title":"Ladle v3 | Ladle","url":"https://ladle.dev/blog/ladle-v3","tags":["JavaScript","testing","Tools","ReleaseNote"],"content":"Storybookの代替ツールであるLadle v3リリース。\nSWCをデフォルトのTranspilerに変更、Node.js 16のサポート終了、CSS in JSライブラリを追加の設定なしで動作するように","relatedLinks":[]},{"category":"Headline","title":"WebKit Features in Safari 17.0 | WebKit","url":"https://webkit.org/blog/14445/webkit-features-in-safari-17-0/","tags":["safari","ReleaseNote"],"content":"Safari 17リリース。\nHTMLでは、`<search>`要素の対応、`popover`属性の対応。\nCSSでは、`font-size-adjust`、`text-transform`、`@counter-style`、`image-set()`の対応。\nJavaScriptでは、Storage API、正規表現の`v`フラグ(ES2024)、Stage 3のSet Operationsの対応。\n画像では、JPEG XL/HEIC/AV1コーデックのサポート。\n実験的なフラグの管理方法や開発者ツールの変更なども含まれる","relatedLinks":[{"title":"Safari 17 Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safari-release-notes/safari-17-release-notes"}]},{"category":"Headline","title":"Deno 1.37: Modern JavaScript in Jupyter Notebooks","url":"https://deno.com/blog/v1.37","tags":["denoe","ReleaseNote"],"content":"Deno v1.37リリース。\n`deno jupyter --unstable`の追加、`deno test`に`--reporter=tap`レポーターを追加、Node.jsとの互換性改善。\nロックファイルの形式をversion 3にアップデート、`std/url`の追加、`std/ulid`の追加など","relatedLinks":[]},{"category":"Article","title":"How to Find the Exact Line of an Infinite Loop Bug in the code | by Abdu Tawfik | Medium","url":"https://abduvik.medium.com/how-to-find-infinite-loops-in-javascript-using-devtools-ea5fc84aec73","tags":["Chrome","debug","article"],"content":"Chromeで無限ループが起きてる時にパフォーマンスのプロファイルを取る方法について。\n無限ループが起きるとProfile自体も完了しないため、記録を開始してタブのプロセスを強制的に停止すると取得できるという方法について。\nまた同期的な無限ループと非同期的な無限ループについて","relatedLinks":[]},{"category":"Article","title":"From WebGL to WebGPU - Chrome for Developers","url":"https://developer.chrome.com/en/blog/from-webgl-to-webgpu/","tags":["WebGL","WebGPU","article"],"content":"WebGLとWebGPUの違いについて","relatedLinks":[]},{"category":"Article","title":"Introducing runes","url":"https://svelte.dev/blog/runes","tags":["Svelte","article"],"content":"Svelte 5はrunesという`$state`/`$derived`/`$effect`といったマクロを使いreactiveなステート管理を実現するという話。\n`$:`のラベルでのReactiveではアプリケーションが複雑になるとどれがReactiveなのかがわからなくなる問題があったため。","relatedLinks":[]},{"category":"SlideVideo","title":"TypeScript Origins: The Documentary - YouTube","url":"https://www.youtube.com/watch?v=U6s2pdxebSo","tags":["TypeScript","video"],"content":"TypeScriptのドキュメンタリー動画","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nuejs/nuejs: Build user interfaces with 10x less code. Alternative to React, Vue, and Svelte","url":"https://github.com/nuejs/nuejs/tree/master","tags":["JavaScript","UI","Tools","library"],"content":"少ないコード量で書けることが目的のVue/Riot的なUIフレームワーク。","relatedLinks":[]}]},{"meta":{"title":"2023-09-29のJS: Babel v7.23.0、Vike、State of HTML 2023受付開始","author":"azu","layout":"post","date":"2023-09-29T03:42:25.875Z","category":"JSer","tags":["CSS","HTML","React","ECMAScript","Bun"],"url":"https://jser.info/2023/09/29/babel-v7.23.0-vike-state-of-html-2023/"},"items":[{"category":"Headline","title":"Bun v1.0.3 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.3","tags":["Bun","ReleaseNote"],"content":"Bun v1.0.3リリース。\nTypeScriptの`emitDecoratorMetadata`をサポート、`module.parent`をサポート、`bun install`でのprivate registryのサポート。\n`console.Console`のサポート、`bunx`のバグ修正など","relatedLinks":[]},{"category":"Headline","title":"Release v3.7.0 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v3.7.0","tags":["JavaScript","server","library","ReleaseNote"],"content":"Hono v3.7.0リリース。\n`c.stream()`と`c.streamText()`を追加、`hono/testing`を追加、`hono/jwt`が`verify`/`descode`/`sign`関数をexportするように変更など","relatedLinks":[]},{"category":"Headline","title":"7.23.0 Released: Decorator Metadata and many new \\`import\\` features! · Babel","url":"https://babeljs.io/blog/2023/09/25/7.23.0","tags":["babel","ReleaseNote"],"content":"Babel v7.23.0リリース。\nStage 3のDecorator Metadataのサポート、Stage 3の`import source`のサポート。\nStage 2の`import defer`のサポート、Stage 1のOptional Chaining Assignmentのサポート、TypeScript 5.2のサポートなど。\nまたBabel 8がαリリースされている。","relatedLinks":[]},{"category":"Headline","title":"Firefox 118.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/118.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 118リリース。\n`<search>`要素のサポート、CSSの数学関数(round、mod、rem、pow、sqrt、hypot、log、exp、abs、sign)をサポート。\nまた、Opaque Response Blockingが実装されている。","relatedLinks":[{"title":"Firefox 118 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/118"}]},{"category":"Headline","title":"Vike","url":"https://vike.dev/","tags":["vite","plugin","library"],"content":"ReactやVueなどに対応したNext.jsやNuxtのようなフレームワーク機能を提供するViteプラグイン。\nルーティングやサーバサイドレンダリングなどを機能を提供しつつ、React/Vue/Svelte/SolidなどUIライブラリに対応しているのが特徴。","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2023-09 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2023/09/29/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2023-09のTC39 MeetingでのECMAScript Proposalのステータス変更のまとめ。\nResizable and growable ArrayBuffersがStage 4となりES2024に入ることが決まった。","relatedLinks":[]},{"category":"Headline","title":"Astro 3.2: View Transitions improvements | Astro","url":"https://astro.build/blog/astro-320/","tags":["astro","ReleaseNote"],"content":"Astro 3.2リリース。\n`data-astro-history=\"replace\"`の追加、`navigate` APIの追加、`<ViewTransitions />`のアクセシビリティ対応など","relatedLinks":[]},{"category":"Article","title":"State of HTML 2023 now open! • Lea Verou","url":"https://lea.verou.me/blog/2023/state-of-html-2023/","tags":["HTML","Survey","article"],"content":"HTMLについての開発者アンケートであるState of HTMLの回答の募集が始まった","relatedLinks":[{"title":"State of HTML 2023","url":"https://survey.devographics.com/en-US/survey/state-of-html/2023"}]},{"category":"Article","title":"Announcing Deno Queues","url":"https://deno.com/blog/queues","tags":["deno","article"],"content":"Deno KVを使ったキューであるDeno Queuesについて","relatedLinks":[]},{"category":"Article","title":"【2023年】SWR &amp; TanStack Query比較","url":"https://zenn.dev/taisei_13046/articles/288e4470cfc45e","tags":["React","article","library"],"content":"SWRとTanStack Queryの比較記事。\nそれぞれのライブラリの特徴、APIインターフェース、機能的な違い、キャッシュの考え方の違いについてなど","relatedLinks":[]},{"category":"Article","title":"CSS Subgrid","url":"https://web.dev/css-subgrid/","tags":["CSS","article"],"content":"CSS subgridについて","relatedLinks":[]},{"category":"Article","title":"CSS Nesting and the Cascade | WebKit","url":"https://webkit.org/blog/14571/css-nesting-and-the-cascade/","tags":["CSS","article"],"content":"Safari Technology Preview 179でCSS Nestingが記号から始まらないといけないという制約を外すrelaxed parsing behaviorが実装された","relatedLinks":[]},{"category":"Article","title":"Temporal API is Awesome · Taro","url":"https://taro.codes/posts/2023-08-23-temporal-api/","tags":["JavaScript","ECMAScript","article"],"content":"ECMAScript Proposal Stage 3のTemporal APIについて。\n基本的な使い方やブラウザの実装状況についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"kurtextrem/awesome-performance-patches: 🚀⚡ Awesome lists about performance related patches/PRs.","url":"https://github.com/kurtextrem/awesome-performance-patches","tags":["JavaScript","HTML","CSS","performance","links"],"content":"JavaScript/CSS/HTMLのパフォーマンス改善に関するPull Requestや記事などをまとめたリポジトリ","relatedLinks":[]},{"category":"Book","title":"これからはじめるReact実践入門 | SBクリエイティブ","url":"https://www.sbcr.jp/product/4815619480/","tags":["React","Next.js","book"],"content":"2023年9月28日発売\nReact、Next.jsについての書籍","relatedLinks":[]}]},{"meta":{"title":"2023-10-03のJS: Node v20.8.0、Vitest v1.0.0-beta.0、instant.dev(Rails-inspired ORM/Migrations)","author":"azu","layout":"post","date":"2023-10-03T13:10:21.794Z","category":"JSer","tags":["nodejs","UI","npm","cloudflare","API"],"url":"https://jser.info/2023/10/03/node-v20.8.0-vitest-v1.0.0-beta.0-instant.devrails-inspired-ormmigrations/"},"items":[{"category":"Headline","title":"Node v20.8.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v20.8.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v20.8.0リリース。\nStreamのパフォーマンス改善、`vm`に`importModuleDynamically`オプションを追加、主にJestなどで起きていた`vm`のメモリリークの問題を修正など","relatedLinks":[]},{"category":"Headline","title":"Lit 3.0 Prerelease 2 and more! – Lit","url":"https://lit.dev/blog/2023-09-27-lit-3.0-prerelease-2/","tags":["JavaScript","UI","library","ReleaseNote"],"content":"Lit 3.0.0-pre.1リリース。\nLit 3.0では、IE11のサポート終了、ECMAScript Proposal Stage 3のDecoratorの対応などが含まれる。","relatedLinks":[{"title":"Release lit@3.0.0-pre.1 · lit/lit","url":"https://github.com/lit/lit/releases/tag/lit%403.0.0-pre.1"}]},{"category":"Headline","title":"npm provenance general availability - The GitHub Blog","url":"https://github.blog/changelog/2023-09-26-npm-provenance-general-availability/","tags":["npm","news"],"content":"npm provenanceを使ってパッケージを公開できるようになった。\nCI/CDからパッケージを公開する際に、コミットとパッケージを紐づけて公開できるようになる。","relatedLinks":[]},{"category":"Headline","title":"Release 3.33.0 - 2023.10.02 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.33.0","tags":["JavaScript","polyfill","ReleaseNote"],"content":"core-js v3.33.0リリース。\n`RegExp.escape`の追加、compat dataのアップデートなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0-beta.0 · vitest-dev/vitest","url":"https://github.com/vitest-dev/vitest/releases/tag/v1.0.0-beta.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"vitest v1.0.0-beta.0リリース。\n`node:child_process`を使った並列実行をサポート、`pool`と`poolOptions`をサポートし関連する古いフラグを削除など","relatedLinks":[{"title":"Feature: Support ","url":"https://github.com/tinylibs/tinypool/issues/64"}]},{"category":"Headline","title":"Bun v1.0.4 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.4","tags":["Bun","ReleaseNote"],"content":"Bun v1.0.4リリース。\n`Bun.serve()`のメモリ消費量の削減、`server.requestIP()`の追加、`Bun.plugin`でのvirtual modulesのサポート。\nFetchのtimeoutのデフォルト値を30秒から5分へ変更、DNS解決のバグを修正など","relatedLinks":[]},{"category":"Article","title":"A Socket API that works across JavaScript runtimes — announcing a WinterCG spec and Node.js implementation of connect()","url":"https://blog.cloudflare.com/socket-api-works-javascript-runtimes-wintercg-polyfill-connect/","tags":["nodejs","cloudflare","API","article"],"content":"WinterCGで策定しているSocket APIについて","relatedLinks":[{"title":"Sockets API","url":"https://sockets-api.proposal.wintercg.org/"}]},{"category":"SoftwareLibrary","title":"runk/node-chardet: Character encoding detection tool for NodeJS","url":"https://github.com/runk/node-chardet","tags":["JavaScript","library"],"content":"文字コード判定ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"instant-dev/instant: Build APIs with a Rails-inspired JavaScript ORM and Migrations for Postgres","url":"https://github.com/instant-dev/instant","tags":["JavaScript","library","database"],"content":"Rails/ActiveRecordをインスパイアしたORMマッパー、マイグレーション管理ツール。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"aidenybai/pattycake: Zero-runtime pattern matching","url":"https://github.com/aidenybai/pattycake","tags":["TypeScript","Tools","performance"],"content":"ts-patternのパターンマッチをインライン化して、Runtimeライブラリの依存をなくすツール。","relatedLinks":[{"title":"gvergnaud/ts-pattern: 🎨 The exhaustive Pattern Matching library for TypeScript, with smart type inference.","url":"https://github.com/gvergnaud/ts-pattern"}]},{"category":"SoftwareLibrary","title":"tldraw/tldraw: a very good whiteboard","url":"https://github.com/tldraw/tldraw","tags":["JavaScript","library","illust","diagram","communication"],"content":"共同編集できるホワイトボードライブラリ。","relatedLinks":[]},{"category":"Book","title":"Learning Vue","url":"https://learning.oreilly.com/library/view/learning-vue/9781492098812/","tags":["Vue","JavaScript","book"],"content":"2023年12月発売\nVueについての書籍","relatedLinks":[]}]},{"meta":{"title":"2023-10-10のJS: Rollup 4.0.0、Viteの今後(Rustify Vite)、pnpm v8.9.0","author":"azu","layout":"post","date":"2023-10-10T13:00:51.013Z","category":"JSer","tags":["vite","TypeScript","rollup","nodejs","Chrome"],"url":"https://jser.info/2023/10/10/rollup-4.0.0-viterustify-vite-pnpm-v8.9.0/"},"items":[{"category":"Headline","title":"Announcing TypeScript 5.3 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-3-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.3 betaリリース。\nStage 3のImport Attributesをサポート、`resolution-mode`を`///`コメントで指定できるように。\n`switch(true)`でのNarrowingをサポート、`[Symbol.hasInstance]`と`insteanceof`を使ったNarrowingをサポート。\nパッケージ内のbundleファイルの重複を避けることで、パッケージサイズの改善など。","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · rollup/rollup","url":"https://github.com/rollup/rollup/releases/tag/v4.0.0","tags":["rollup","ReleaseNote"],"content":"Rollup v4.0.0リリース。\nNode.js 14/16のサポート終了、パーサにAcornの代わりにSWCを使うように変更。\n非推奨なオプションの削除など","relatedLinks":[]},{"category":"Headline","title":"Chrome 119 beta - Chrome for Developers","url":"https://developer.chrome.com/en/blog/chrome-119-beta/","tags":["Chrome","ReleaseNote"],"content":"Chroem 119 betaリリース。\nWebSQLの削除、`SVGUseElement`でのData URLのサポート削除、非標準な`shadowroot`属性の削除。\nCSSでは、`:user-valid`/`:user-invalid`の擬似クラスをサポート。\nCookieのExpiresの最大値を400日にする変更を過去分に対しても反映。\nOrigin Trialとして`window.open()`に`fullscreen`パラメータを追加など","relatedLinks":[]},{"category":"Headline","title":"Release v8.9.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v8.9.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v8.9.0リリース。\nJSONでinstallation scriptsを許可するパッケージを指定できる`pnpm.onlyBuiltDependenciesFile`オプションの追加。\nキャッシュからコピー時にreflinksを使うことでインストール速度の改善など。","relatedLinks":[{"title":"perf: use rclonefile to fix cloning on macOS by zkochan · Pull Request #7031 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/pull/7031"}]},{"category":"Headline","title":"Release v1.8.0 - Bifröst · solidjs/solid","url":"https://github.com/solidjs/solid/releases/tag/v1.8.0","tags":["Solid","JavaScript","library","ReleaseNote"],"content":"Solid v1.8.0リリース。\nStreaming Serialization/Hydrationの改善。\n`<!--#-->`というコメントは、NginxなどのServer Side Includesで使われている構文で衝突していたため、`<!--$-->`に変更された。","relatedLinks":[{"title":"Incompatibility between Solid","url":"https://github.com/ryansolid/dom-expressions/issues/262"}]},{"category":"Headline","title":"Japa","url":"https://japa.dev/docs/introduction","tags":["JavaScript","nodejs","testing","library","Tools"],"content":"Node.js向けのテストフレームワーク。\nUnit Testの機能に加え、プラグインとしてAPIのモック機能、Playwrightを使ったブラウザテスト、TypeScriptの型定義のテスト、Snapshot Testingなどの機能を持つ","relatedLinks":[]},{"category":"Article","title":"Next.js 13 vs Remix: An In-depth case study","url":"https://prateeksurana.me/blog/nextjs-13-vs-remix-an-in-depth-case-study/","tags":["React","Remix","Next.js","article"],"content":"Remix v2とNext.jsで同じアプリケーションを作りながら違いについて見ていく記事。\nルーティングとファイル構造、データの取得、ストリーミング、データの更新、エラー処理、キャッシュなどについて","relatedLinks":[]},{"category":"Article","title":"A comprehensive guide to the dangers of Regular Expressions in JavaScript | Sonar","url":"https://www.sonarsource.com/blog/vulnerable-regular-expressions-javascript/","tags":["JavaScript","RegExp","article"],"content":"正規表現のバックトラッキングの問題について","relatedLinks":[]},{"category":"Article","title":"The Hidden Performance Cost of NodeJS and GraphQL","url":"https://www.softwareatscale.dev/p/the-hidden-performance-cost-of-nodejs","tags":["nodejs","Promises","performance","article"],"content":"GraphQLでresolverの処理が増えるほどパフォーマンスが悪くなった原因を調査した記事。\nresolver内でPromiseの多用と`async_hooks`の利用がオーバーヘッドと関連しているという話。","relatedLinks":[]},{"category":"SlideVideo","title":"ViteConf","url":"https://viteconf.org/23/replay/welcome","tags":["vite","Conference","video"],"content":"ViteConfの動画一覧","relatedLinks":[]},{"category":"SlideVideo","title":"State of Vite (ViteConf 2023) - Google スライド","url":"https://docs.google.com/presentation/d/1oZnjsPBnb3OB2HxU88vYkZLa54GV-xNKrF8XkOIqLAU/mobilepresent#slide=id.p","tags":["vite","slide","Rust","rollup","bundler"],"content":"Viteの現在と今後について。\nViteはDevビルドにesbuild、ProdビルドにRollupを使うためビルド結果に差異が出やすいなどの問題がある。\nそのため、Rollup互換を意識したRolldownというBundlerをRustで開発するという話。\nRspackチームと協力して進める予定で、\nRspackはwebpack互換であり、RolldownはRollup互換を目的にしている。","relatedLinks":[{"title":"Design Trade-offs in Bundler: The Rationale Behind Creating Rspack · web-infra-dev/wg · Discussion #1","url":"https://github.com/web-infra-dev/wg/discussions/1"},{"title":"rolldown-rs","url":"https://github.com/rolldown-rs/"},{"title":"Why Vite | Vite","url":"https://vitejs.dev/guide/why.html"}]},{"category":"SoftwareLibrary","title":"nksaraf/vinxi: The JavaScript Server SDK","url":"https://github.com/nksaraf/vinxi","tags":["vite","server","library"],"content":"`Bun.App`をインスパイアしたサーバメタフレームワーク。\nルーターを定義しパスごとにstatic/build/nodeなどのモードとハンドラーを定義し、定義に従ってビルドやサーバをビルドする。\nBundlerにVite、サーバにNitroを使い、特定のUIフレームワークに依存しない仕組みを作ること目的にしている。","relatedLinks":[{"title":"The Bun Bundler | Bun Blog","url":"https://bun.sh/blog/bun-bundler#sneak-peek-bun-app"}]},{"category":"SoftwareLibrary","title":"arktypeio/arktype: TypeScript&#039;s 1:1 validator, optimized from editor to runtime","url":"https://github.com/arktypeio/arktype","tags":["TypeScript","library"],"content":"TypeScriptの型定義の構文をスキーマのDSLとして利用するバリデーションライブラリ。\nスキーマの型として文字列を渡し、文字列の中にあるキーワードや演算子をパースして、型として解釈してくれる。","relatedLinks":[]}]},{"meta":{"title":"2023-10-16のJS: Lit 3、Chrome 118、Zodの作り方","author":"azu","layout":"post","date":"2023-10-16T12:44:04.356Z","category":"JSer","tags":["Bun","npm","Chrome","UI","parcel"],"url":"https://jser.info/2023/10/16/lit-3-chrome-118-zod/"},"items":[{"category":"Headline","title":"Lit Launch Day: Lit 3.0, Labs graduations, a compiler and more! – Lit","url":"https://lit.dev/blog/2023-10-10-lit-3.0/","tags":["JavaScript","UI","library","ReleaseNote"],"content":"Lit 3.0リリース。\nIE11のサポート終了、最小の実行環境をES2021をサポートしてるブラウザへ変更。\nLit 2.0で非推奨となったAPIの削除、Stage 3のDecoratorの対応など。\nまた、新しいLitテンプレートコンパイラーの公開、Preact Signalsを統合するパッケージも公開されている。","relatedLinks":[{"title":"Lit 3 upgrade guide – Lit","url":"https://lit.dev/docs/v3/releases/upgrade/"}]},{"category":"Headline","title":"Bun v1.0.5 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.5","tags":["Bun","ReleaseNote"],"content":"Bun v1.0.5リリース。\nFetchのメモリリークを修正、`bun run --if-present`をサポート、`package-lock.json`を`bun.lockb`へ変換できる`bun pm migrate`コマンドを追加。\n`peerDependencies`を自動でインストールするように変更など","relatedLinks":[]},{"category":"Headline","title":"Release v2.10.0 · parcel-bundler/parcel","url":"https://github.com/parcel-bundler/parcel/releases/tag/v2.10.0","tags":["parcel","ReleaseNote"],"content":"Parcel v2.10.0リリース。\n遅延コンパイルする対象を指定できる`--lazy [glob]`と`--lazy-excludes`を追加。\nRustモジュールを一つのパッケージにマージすることで重複Cratesを削除してサイズの削減、また並列処理の効率化によるパフォーマンス改善など。","relatedLinks":[]},{"category":"Headline","title":"Fresh 1.5: Partials, client side navigation and more","url":"https://deno.com/blog/fresh-1.5","tags":["deno","ReleaseNote","library"],"content":"Fresh 1.5リリース。\nページ遷移に該当領域のフラグメントだけを取得更新できる`<Partial>`の追加。\n現在のパスと一致する`<a>`要素に`data-current`を追加、カスタムビルドターゲットを指定できる`build.target`オプションを追加。\nesbuildを使ったbundleファイルの分析をするメタファイルの生成をサポート、エラーオーバーレイのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Bun v1.0.6 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.6","tags":["Bun","yarn","npm","ReleaseNote"],"content":"Bun v1.0.6リリース。\nnpmの`overrides`フィールド、yarnの`resolutions`フィールドをサポート。","relatedLinks":[]},{"category":"Headline","title":"Electron 27.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-27-0","tags":["Electron","ReleaseNote"],"content":"Electron 27.0.0リリース。\nmacOS 10.13/10.14のサポート終了、`ipcRenderer.sendTo()` APIを非推奨化など","relatedLinks":[]},{"category":"Headline","title":"Astro 3.3: Picture component | Astro","url":"https://astro.build/blog/astro-330/","tags":["astro","ReleaseNote"],"content":"Astro 3.3リリース。\n`<picture />`コンポーネントの追加、シンタックスハイライトに使うライブラリを`shiki`から`shikiji`に変更など","relatedLinks":[]},{"category":"Headline","title":"Vite (Unstable) (dev branch) | Remix","url":"https://remix.run/docs/en/dev/future/vite","tags":["Remix","vite","document"],"content":"RemixのViteサポート。\nViteのプラグインとしてRemixが動作するようになる。","relatedLinks":[{"title":"Just use vite! · remix-run/remix · Discussion #7632","url":"https://github.com/remix-run/remix/discussions/7632"}]},{"category":"Headline","title":"Release v4.1.0 · rollup/rollup","url":"https://github.com/rollup/rollup/releases/tag/v4.1.0","tags":["rollup","ReleaseNote"],"content":"Rollup v4.1.0リリース。\nオブジェクトが持つオプションをビットフラグで管理しメモリ消費量を削減する改善が含まれる。","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 118 - Chrome for Developers","url":"https://developer.chrome.com/en/blog/new-in-chrome-118/","tags":["Chrome","ReleaseNote"],"content":"Chrome 118の変更点について。\nCSSの`@scope`ルールのサポート、Media QueryでJavaScriptが有効かを判定する`scripting`の追加。\nDevToolsの\"Sources\"パネルの改善、`zstd`のContent-Encodingをサポートなど。","relatedLinks":[]},{"category":"Article","title":"Limit the reach of your selectors with the CSS \\`@scope\\` at-rule - Chrome for Developers","url":"https://developer.chrome.com/articles/at-scope/","tags":["CSS","article"],"content":"CSS `@scope`についての記事。\n`@scope`によってセレクタの範囲を制限できるようになり、スコープは特異性には影響を与えない。\nまた、`@scope { }`とルートを指定せずに指定することscoped styleを扱うprelude-less `@scope`についてなど","relatedLinks":[]},{"category":"Article","title":"What&#039;s New in DevTools (Chrome 118) - Chrome for Developers","url":"https://developer.chrome.com/blog/new-in-devtools-118/","tags":["Chrome","debug","article"],"content":"Chrome 118の開発者ツールの変更点について。\nlocal overridesの改善、コード検索の改善、Sourcesパネルの改善、Lighthouse 11へのアップデートなど","relatedLinks":[]},{"category":"Article","title":"Write your own Zod","url":"https://zackoverflow.dev/writing/write-your-own-zod","tags":["TypeScript","article"],"content":"Zodのようなスキーマバリデーターを作る方法について。\nZodのようなスキーマオブジェクトから型をInferする方法、バリデーションの実装などについて。","relatedLinks":[]},{"category":"Article","title":"Flat config rollout plans - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2023/10/flat-config-rollout-plans/","tags":["ESLint","article"],"content":"ESLintのConfigファイルの今後について。\nESLintでは、ESLint 9で`eslint.config.js`のFlat Configがデフォルトとなり、`.eslintrc.*`の形式は非推奨となる。\n`.eslinrc.*`のサポートはESLint 10で削除される予定となっている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"react-hookz/web: React hooks done right, for browser and SSR.","url":"https://github.com/react-hookz/web","tags":["React","library"],"content":"サーバサイドレンダリング時も動作するReact Hooksのコレクションライブラリ。\n`react-use`の後継的なライブラリとなることを意識して作られている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"elbywan/zap: Another \\[insert blazing fast synonyms\\] JavaScript package manager","url":"https://github.com/elbywan/zap","tags":["npm","package","console","Tools"],"content":"Crystal言語で書かれたnpmパッケージマネージャー。","relatedLinks":[]}]},{"meta":{"title":"Deep Dive: Node.jsのESMデフォルト化への道","author":"azu","layout":"post","date":"2023-10-18T01:51:00.000Z","category":"Article","tags":["Node.js","ESM"],"url":"https://jser.info/2023/10/18/node.js-roadmap-esm-by-default/"},"items":[]},{"meta":{"title":"2023-10-25のJS: Node.js 21(Current)とNode.js 20.9.0(LTS)、Yarn 4、tsc --isolatedDeclarations","author":"azu","layout":"post","date":"2023-10-25T13:46:33.689Z","category":"JSer","tags":["Tools","nodejs","rspack","Vue","React"],"url":"https://jser.info/2023/10/25/node.js-21currentnode.js-20.9.0lts-yarn-4-tsc-isolateddeclarations/"},"items":[{"category":"Headline","title":"Release v0.3.7 · web-infra-dev/rspack","url":"https://github.com/web-infra-dev/rspack/releases/tag/v0.3.7","tags":["rspack","ReleaseNote"],"content":"rspack v0.3.7リリース。\n`experiments.rspackFuture.newResolver`で新しいResolverをOpt-inできるように。\nstyled-componentsのサポート、Vue 2でのCSSの抽出をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Rspress, the Rspack-based static site generator · web-infra-dev · Discussion #5","url":"https://github.com/orgs/web-infra-dev/discussions/5","tags":["Rust","document","Tools","ReleaseNote"],"content":"RspackベースのDocusarusu/VitePressライクな静的サイトジェネレータであるRspress 1.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release v3.8.0 · nuxt/nuxt","url":"https://github.com/nuxt/nuxt/releases/tag/v3.8.0","tags":["Vue","library","ReleaseNote"],"content":"Nuxt.js v3.8.0リリース。\nNuxt DevTools 1.0、`@nuxt/image`の自動インストール、アプリの構成を定義したメタファイルの出力に対応、NuxtLinkのデフォルトの挙動を設定できるように。\n`useAsyncData`と`useFetch`に`deep`オプションの追加、`getCachedData`でカスタムキャッシュをサポートなど","relatedLinks":[{"title":"Release v1.0.0 · nuxt/devtools","url":"https://github.com/nuxt/devtools/releases/tag/v1.0.0"}]},{"category":"Headline","title":"Storybook 7.5","url":"https://storybook.js.org/blog/storybook-7-5/","tags":["Design","Development","Tools","ReleaseNote"],"content":"Storybook 7.5リリース。\nVite 5のサポート、`storiesOf`を非推奨化。\nNext.jsとAngularのサポート改善、Lit 3.0のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TanStack Query v5 | TanStack Blog","url":"https://tanstack.com/blog/announcing-tanstack-query-v5","tags":["React","Vue","Solid","Svelte","HTTP","library","ReleaseNote"],"content":"TanStack Query v5リリース。\nAPIの引数の形式を変更、Suspenseのサポート、開発者ツールの刷新など。","relatedLinks":[{"title":"Announcing TanStack Query v5 | TanStack Blog","url":"https://tanstack.com/blog/announcing-tanstack-query-v5"},{"title":"Migrating to TanStack Query v5 | TanStack Query Docs","url":"https://tanstack.com/query/v5/docs/react/guides/migrating-to-v5"}]},{"category":"Headline","title":"Release: Yarn 4.0 🪄⚗️ | Yarn","url":"https://yarnpkg.com/blog/release/4.0","tags":["yarn","ReleaseNote"],"content":"Yarn 4.0リリース。\nNode.js 12/14/16のサポート終了、`yarn set version`は`packageManager`フィールドを更新するように。\nロックファイルとレジストリのメタデータが一致しているかを検証するHardened Modeの追加、制約エンジンをJSベースに置き換え。\n`yarn upgrade-interactive`と`yarn stage`をコアに取り込み、パフォーマンスの改善など","relatedLinks":[]},{"category":"Headline","title":"Release v0.3.8 · web-infra-dev/rspack","url":"https://github.com/web-infra-dev/rspack/releases/tag/v0.3.8","tags":["rspack","ReleaseNote"],"content":"rspack v0.3.8リリース。\nTop-Level `await`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node v20.9.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v20.9.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v20.9.0リリース。\nNode.js 20.x系のLTSとなるバージョン。\n2026年4月までメンテナンスされる予定。","relatedLinks":[]},{"category":"Headline","title":"Node.js 21 is now available! | Node.js","url":"https://nodejs.org/en/blog/announcements/v21-release-announce","tags":["nodejs","ReleaseNote"],"content":"Node.js v21リリース。\ncurrent(開発版)となるメジャーバージョン。\nFetch/WebStreams APIのStable化、V8 11.8へのアップデート、`node --test`でのglobのサポート。\nモジュールのデフォルトをESMにできる`--experimental-default-type`、Magic BytesでWasmを判定する`--experimental-wasm-modules`の追加。\n`fs.writeFile`に`flush`オプションの追加、StreamsとHTTPのパフォーマンス改善、`navigator`のグローバルオブジェクトをサポートなど","relatedLinks":[{"title":"Node v21.0.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v21.0.0"}]},{"category":"Article","title":"The State of WebAssembly 2023","url":"https://blog.scottlogic.com/2023/10/18/the-state-of-webassembly-2023.html","tags":["WebAssembly","Survey"],"content":"WebAssemblyについて開発者アンケートの結果","relatedLinks":[]},{"category":"Article","title":"Goodbye, Node.js Buffer — Sindre Sorhus","url":"https://sindresorhus.com/blog/goodbye-nodejs-buffer","tags":["nodejs","opinion","article"],"content":"Node.jsの`Buffer`はブラウザとの互換性がないため、`Uint8Array`を代わりに使おうという話。\n現在の`Buffer`は`Uint8Array`のサブクラスとして実装されているが、`slice()`の動作の違いや移植性が悪いというなどの問題がある。\n`Uint8Array`を直接扱う方法やマイグレーションなどについて","relatedLinks":[{"title":"Start moving to Uint8Array in new APIs? · Issue #41588 · nodejs/node","url":"https://github.com/nodejs/node/issues/41588"}]},{"category":"Article","title":"JS Decorators Explained: 10 Years Journey to the Real Implementation | Binary Studio","url":"https://binary-studio.com/blog/ecmascript-decorators/","tags":["JavaScript","ECMAScript","article","history"],"content":"現在Stage 3のDecoratorが、どのように今の形になったかについて","relatedLinks":[]},{"category":"SlideVideo","title":"Faster TypeScript builds with --isolatedDeclarations by Titian-Cornel Cernicova-Dragomir - GitNation","url":"https://portal.gitnation.org/contents/faster-typescript-builds-with-isolateddeclarations","tags":["TypeScript","video","performance"],"content":"TypeScriptの型定義ファイルの出力をファイルごとに行える`--isolatedDeclarations`オプションを実装しているという話。\n現在のTypeScriptの型定義の生成は依存グラフや推論された型に依存している。\nいくつかの制限があるがファイルごとに独立して型定義を生成できるようにすることで、他のツールも型定義の生成が可能になり、またファイルごとに並列で処理できるためパフォーマンスが向上するという話。","relatedLinks":[{"title":"Isolated declarations by dragomirtitian · Pull Request #53463 · microsoft/TypeScript","url":"https://github.com/microsoft/TypeScript/pull/53463"},{"title":"`","url":"https://github.com/microsoft/TypeScript/issues/47947"}]},{"category":"SlideVideo","title":"BlinkOn 18 - Sunnyvale + Virtual - YouTube","url":"https://www.youtube.com/playlist?list=PL9ioqAuyl6UKYm7EYVa7FcKCR2kDCudII","tags":["blink","Chrome","video","Conference"],"content":"BlinkOn 18の動画まとめ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"AlexSergey/rockpack: Rockpack is a simple solution for creating React Application with Server Side Rendering, bundling, linting, testing within 5 minutes","url":"https://github.com/AlexSergey/rockpack","tags":["React","Tools","library","TypeScript"],"content":"Create React App的なReactでのアプリケーション開発をするツールキット","relatedLinks":[]}]},{"meta":{"title":"2023-10-31のJS: Next.js 14、MSW 2、Node.js 21.1.0","author":"azu","layout":"post","date":"2023-10-31T13:19:42.271Z","category":"JSer","tags":["Next.js","nodejs","vite","parcel","webpack"],"url":"https://jser.info/2023/10/31/next.js-14-msw-2-node.js-21.1.0/"},"items":[{"category":"Headline","title":"Next.js 14 | Next.js","url":"https://nextjs.org/blog/next-14","tags":["Next.js","ReleaseNote"],"content":"Next.js 14リリース。\nNode.js 16のサポート終了、`next export`コマンドを非推奨化、`next/image`の`domains`オプションを非推奨化。\nServer ActionのStable化、Metadata APIの改善。\n実験的な機能として`<Suspense>`を使ったPartial Prerenderingのサポートなど","relatedLinks":[{"title":"Release v14.0.0 · vercel/next.js","url":"https://github.com/vercel/next.js/releases/tag/v14.0.0"}]},{"category":"Headline","title":"Astro 3.4: Page Partials | Astro","url":"https://astro.build/blog/astro-340/","tags":["astro","ReleaseNote"],"content":"Astro 3.4リリース。\npage componentをpartial pageとして利用できる`partial`オプションをサポート、画像最適化のパフォーマンス改善。\n実験的な機能としてDev Overlayを追加など","relatedLinks":[{"title":"Release astro@3.4.0 · withastro/astro","url":"https://github.com/withastro/astro/releases/tag/astro%403.4.0"}]},{"category":"Headline","title":"Release Release v1.6.0 · axios/axios","url":"https://github.com/axios/axios/releases/tag/v1.6.0","tags":["HTTP","library","ReleaseNote","security"],"content":"axios v1.6.0リリース。\n`X-XSRF-TOKEN`というCookieが設定されている時に、`withCredentials`オプションが有効だと、別オリジンに対するリクエストにも`X-XSRF-TOKEN`の値が送信される脆弱性の修正","relatedLinks":[]},{"category":"Headline","title":"Release v8.10.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v8.10.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v8.10.0リリース。\n`supportedArchitectures`で複数のアーキテクチャを指定できるように。\nホスト環境とDocker環境に両方のアーキテクチャのバイナリをインストール際などに利用できる。","relatedLinks":[]},{"category":"Headline","title":"Introducing MSW 2.0 - Mock Service Worker","url":"https://mswjs.io/blog/introducing-msw-2.0","tags":["JavaScript","testing","library","ReleaseNote"],"content":"MSW 2.0リリース。\nNode.js 16のサポート終了、APIのシグネチャーの変更、ブラウザ向けのAPIを`msw/browser`へ移動。\n`ReadableStream`/`FormData`のモックをサポートなど","relatedLinks":[{"title":"Release v2.0.0 · mswjs/msw","url":"https://github.com/mswjs/msw/releases/tag/v2.0.0"},{"title":"1.x → 2.x - Mock Service Worker","url":"https://mswjs.io/docs/migrations/1.x-to-2.x"}]},{"category":"Headline","title":"Node v21.1.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v21.1.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v21.1.0リリース。\nAmbiguous fileがESMかを判定する`--experimental-detect-module`フラグの追加、Jestでのメモリリークの原因となっていた`vm.Script`のバグの修正など","relatedLinks":[{"title":"Deep Dive: Node.jsのESMデフォルト化への道 - JSer.info","url":"https://jser.info/2023/10/18/node.js-roadmap-esm-by-default/"},{"title":"[","url":"https://github.com/jestjs/jest/issues/11956"}]},{"category":"Headline","title":"Release v30.0.0-alpha.1 · jestjs/jest","url":"https://github.com/jestjs/jest/releases/tag/v30.0.0-alpha.1","tags":["jest","ReleaseNote"],"content":"Jest v30.0.0-alpha.1リリース。\n`mts`/`cts`をデフォルトでサポート、fake timerの改善、SnapshotでError Causeをサポート、Prettier 3のサポートなど","relatedLinks":[]},{"category":"Article","title":"JavaScriptビルドツールの整理 各ツールの機能と依存関係","url":"https://zenn.dev/nakaakist/articles/86457bf2908379","tags":["vite","parcel","webpack","rspack","Next.js","bundler","article"],"content":"Vite/Parcel/webpack/Rspack/Turbopack/Next.js/Rollup/esbuild/SWC/Bun/Babel/Terser の特徴と依存関係について。","relatedLinks":[]},{"category":"Article","title":"Deprecation of formatting rules - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2023/10/deprecating-formatting-rules/","tags":["ESLint","article"],"content":"ESLint v8.53.0でスタイル系のルール(スペースやセミコロンなどを扱うルール)は、非推奨となる。\nマイグレーション先としてスタイル系のルールをメンテナンスするESLint StylisticやPrettierなどのツールの利用を推奨している。","relatedLinks":[{"title":"ESLint Stylistic | ESLint Stylistic","url":"https://eslint.style/"}]},{"category":"Article","title":"Announcing WinterJS","url":"https://wasmer.io/posts/announcing-winterjs-service-workers","tags":["JavaScript","WebAssembly","ServiceWorker","article"],"content":"WinterCG仕様に準拠したJavaScript Runtime。\nSpiderMonkeyをRuntimeとして使い、Service Workers APIを実装している。\nWasmerのWASIX準拠にしている。","relatedLinks":[{"title":"wasmerio/winterjs: Winter is coming... ❄️","url":"https://github.com/wasmerio/winterjs"}]},{"category":"Article","title":"サードパーティ Cookie の廃止に向けた準備 - Chrome for Developers","url":"https://developer.chrome.com/ja/blog/cookie-countdown-2023oct/","tags":["Chrome","article"],"content":"Chromeの3rd party Cookieの廃止と代替Proposalについて","relatedLinks":[]},{"category":"SlideVideo","title":"JavaScript JIT compiler - YouTube","url":"https://www.youtube.com/playlist?list=PLMOpZvQB55bcTsXzRcBjHJJb52OGWwNjr","tags":["JavaScript","C++","video"],"content":"LadybirdのJavaScriptエンジンであるLibJSにJITを実装していく動画シリーズ。","relatedLinks":[{"title":"serenity/Userland/Libraries/LibJS at master · SerenityOS/serenity","url":"https://github.com/SerenityOS/serenity/tree/master/Userland/Libraries/LibJS"}]},{"category":"SlideVideo","title":"Vue Fes Japan 2023 資料 X ポストまとめ","url":"https://zenn.dev/punkshiraishi/scraps/bf3829dc79466b","tags":["Vue","Conference","slide"],"content":"Vue Fes Japan 2023のスライドまとめ","relatedLinks":[{"title":"Vue Fes Japan 2023","url":"https://vuefes.jp/2023/"}]},{"category":"SoftwareLibrary","title":"joshmarinacci/node-pureimage: Pure JS implementation of the HTML Canvas 2D drawing API","url":"https://github.com/joshmarinacci/node-pureimage","tags":["nodejs","JavaScript","library"],"content":"Pure JavaScriptなNode.js向けCanvas APIの実装ライブラリ。","relatedLinks":[]}]},{"meta":{"title":"2023-11-08のJS: Remix 2.2.0(Vite)、Deno 1.38、Angular.dev","author":"azu","layout":"post","date":"2023-11-08T08:46:29.613Z","category":"JSer","tags":["React","Chrome","Remix","vite","document"],"url":"https://jser.info/2023/11/08/remix-2.2.0vite-deno-1.38-angular.dev/"},"items":[{"category":"Headline","title":"Release v2.2.0 · remix-run/remix","url":"https://github.com/remix-run/remix/releases/tag/remix%402.2.0","tags":["Remix","React","JavaScript","library","ReleaseNote"],"content":"Remix 2.2.0リリース。\nViteのサポート、Fetcherにkeyを指定できるように。\n`future.v3_fetcherPersist`フラグで、Fetcherのクリーンアップの新しい挙動をopt-inできるようになるなど","relatedLinks":[{"title":"Remix ❤️ Vite | Remix","url":"https://remix.run/blog/remix-heart-vite"}]},{"category":"Headline","title":"Release 3.0.0 · facebook/docusaurus","url":"https://github.com/facebook/docusaurus/releases/tag/v3.0.0","tags":["React","document","Tools","ReleaseNote"],"content":"docusauru 3.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 119 - Chrome for Developers","url":"https://developer.chrome.com/en/blog/new-in-chrome-119/","tags":["Chrome","ReleaseNote"],"content":"Chrome 119リリース。\nCookieのExpiresの最大値を400日にする変更を過去分に対して適応、WebSQLの削除。\nCSSの`:user-valid`/`:user-invalid`の擬似クラスのサポート、relative color構文のサポート、clip-pathプロパティの改善など","relatedLinks":[]},{"category":"Headline","title":"Deno 1.38: HTML doc generator and HMR","url":"https://deno.com/blog/v1.38","tags":["deno","ReleaseNote"],"content":"Deno v1.38リリース。\n`deno doc --html`で静的なHTMLなドキュメントを生成をサポート。\n`--unstable-hmr`でHMRをサポート、`--unstable-byonm`でnpmなどでインストールした`node_modules`のnpmパッケージを利用できるように、`node:*`をサポート。\n`deno run --env`で`.env`のロードをサポート、`std/http`で`EventSource` APIのサポートなど。\nその他には、`http/server`の非推奨化、`std/io`の非推奨化、`std/wasi`の非推奨化などが含まれている。","relatedLinks":[]},{"category":"Headline","title":"Bun v1.0.8 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.8","tags":["Bun","ReleaseNote"],"content":"Bun v1.0.8リリース。\n`require()`のメモリリークを修正、`bun test`でモジュールのモックをサポート、`bun install`のバグ修正、`setTimeout(fn, 0)`のバグ修正など","relatedLinks":[]},{"category":"Headline","title":"Chrome 120 beta - Chrome for Developers","url":"https://developer.chrome.com/en/blog/chrome-120-beta/","tags":["Chrome","ReleaseNote"],"content":"Chrome 120 betaリリース。\nCSSの`@property`で`syntax:<image>`をサポート、maskingを`-webkit` prefixなしでサポート、nestingのrelaxed parsing behaviorに対応。\n`<details name>`のサポート、`FontFaceSet.check()`のサポート、Intersection Observerの`scrollMargin`オプションをサポート。\nFenced Framesの機能更新、`Permissions-Policy-Report-Only`ヘッダの対応。\n\nOrigin Trialとして、`priority`リクエストヘッダの対応、`Performance.measureUserAgentSpecificMemory()`などが含まれている。","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.3 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-3-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.3 RCリリース。\nStage 3のImport Attributesをサポート、`resolution-mode`を`///`コメントで指定できるように。\n`switch(true)`でのNarrowingをサポート、`[Symbol.hasInstance]`と`insteanceof`を使ったNarrowingをサポート。\nパッケージ内のbundleファイルの重複を避けることで、パッケージサイズの改善など。","relatedLinks":[]},{"category":"Headline","title":"N|Solid Runtime: NodeSource&#039;s Open Source Release for Node.js","url":"https://nodesource.com/blog/nsolid-oss-release","tags":["nodejs","OpenSource","ReleaseNote"],"content":"Node.jsに詳細なメトリクスや細かい動作の制御などを組み込んだRuntimeであるN|SolidのコードがMITライセンスで公開された。","relatedLinks":[{"title":"nodesource/nsolid: N|Solid Runtime","url":"https://github.com/nodesource/nsolid"}]},{"category":"Article","title":"Remix ❤️ Vite | Remix","url":"https://remix.run/blog/remix-heart-vite","tags":["React","Remix","vite","article"],"content":"RemixのViteサポートについて。\nRemixがViteのプラグインとして導入できるようになり、Viteの開発サーバやビルド、プラグインの仕組みを使って開発できるようになる。\nまだCloudflareはサポートしていないが、今後サポート予定","relatedLinks":[]},{"category":"Article","title":"WebAssembly Garbage Collection (WasmGC) now enabled by default in Chrome - Chrome for Developers","url":"https://developer.chrome.com/en/blog/wasmgc/","tags":["Chrome","WebAssembly","article"],"content":"Chrome 119でサポートされたWasmGCについて。\nWasm上に独自のGCを実装せずに、既存のGCを再利用できるようにするHeap管理の仕組みについて","relatedLinks":[]},{"category":"Article","title":"Announcing Angular.dev. Today, we are excited to launch… | by Emma Twersky | Nov, 2023 | Angular Blog","url":"https://blog.angular.io/announcing-angular-dev-1e1205fa3039","tags":["Angular","document","article"],"content":"Angularの新しい学習サイトが公開された。\nWebContainersを使いブラウザ情報で直接編集できるチュートリアルやドキュメントなどが用意されている","relatedLinks":[{"title":"Angular","url":"https://angular.dev/"}]},{"category":"SoftwareLibrary","title":"farm-fe/farm: Extremely fast Vite-compatible web build tool written in Rust","url":"https://github.com/farm-fe/farm","tags":["vite","rollup","bundler","Rust","Tools","JavaScript"],"content":"Vite/Rollupプラグイン互換の仕組みを持ったRust製のBundlerツール。\nビルドパフォーマンス、devとproductionビルドでの一貫性、dev環境でbundleしないことでのリクエスト数の問題を解決する目的。\nモジュールをグループという単位でbundleして、リクエスト数を削減とキャッシュヒット率の向上を目的にしたPartial Bundlingという仕組みを持つ。","relatedLinks":[{"title":"rfcs/rfcs/003-partial-bundling/rfc.md at main · farm-fe/rfcs","url":"https://github.com/farm-fe/rfcs/blob/main/rfcs/003-partial-bundling/rfc.md"}]},{"category":"SoftwareLibrary","title":"oxc-project/javascript-parser-in-rust: Tutorial on writing a JavaScript Parser in Rust","url":"https://github.com/oxc-project/javascript-parser-in-rust","tags":["JavaScript","AST","Rust","tutorial"],"content":"JavaScriptのパーサをRustで書くためのガイドやチュートリアル","relatedLinks":[]},{"category":"Book","title":"フロントエンドの知識地図—— 一冊でHTML/CSS/JavaScriptの開発技術が学べる本：書籍案内｜技術評論社","url":"https://gihyo.jp/book/2023/978-4-297-13871-4","tags":["HTML","CSS","JavaScript","book"],"content":"2023年11月24日発売。\nフロントエンドの入門書","relatedLinks":[]}]},{"meta":{"title":"2023-11-16のJS: Angular v17、Prettier 3.1、Node.js v21.2.0","author":"azu","layout":"post","date":"2023-11-16T12:22:34.462Z","category":"JSer","tags":["Tools","performance","browser","Angular","astro"],"url":"https://jser.info/2023/11/16/angular-v17-prettier-3.1-node.js-v21.2.0/"},"items":[{"category":"Headline","title":"Introducing Angular v17. Last month marked the 13th anniversary… | by Minko Gechev | Nov, 2023 | Angular Blog","url":"https://blog.angular.io/introducing-angular-v17-4d7033312e4b","tags":["Angular","ReleaseNote"],"content":"Angular v17リリース。\nNode.js 16のサポート終了、ドキュメントサイトの刷新、`@if`や`@for`などのbuilt-in control flowのサポート。\n新しいプロジェクトでのSSRにおけるhydrationがデフォルトで有効に、`ng serve`と`ng build`にViteとesbuildを利用するようになるなど","relatedLinks":[{"title":"Release v17.0.0 · angular/angular","url":"https://github.com/angular/angular/releases/tag/17.0.0"}]},{"category":"Headline","title":"Astro 3.5: i18n Routing | Astro","url":"https://astro.build/blog/astro-350/","tags":["astro","ReleaseNote"],"content":"Astro 3.5リリース。\nprefetchの機能をコアに統合、`<ViewTransitions handleForms />`を追加、`addMiddleware`を追加、Qwikのサポート。\n実験的な機能としてi18n Routing APIを追加、`contentCollectionCache`オプションを追加など","relatedLinks":[{"title":"Release astro@3.5.0 · withastro/astro","url":"https://github.com/withastro/astro/releases/tag/astro%403.5.0"}]},{"category":"Headline","title":"Prettier 3.1: New experimental ternaries formatting and Angular control flow syntax! · Prettier","url":"https://prettier.io/blog/2023/11/13/3.1.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 3.1リリース。\n`--experimental-ternaries`で三項演算子の新しい整形ルールを試せるように。\nBabel 7.23.0でサポートされた構文をサポート、Angular 17で追加されたcontrol flow構文のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node v21.2.0 (Current) | Node.js","url":"https://nodejs.org/blog/release/v21.2.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v21.2.0リリース。\n`import.meta.dirname`と`import.meta.filename`を追加、`fs/promises`にスタックトレースを追加。\n`navigator.language`/`navigator.platform`を追加、`--no-experimental-global-navigator`フラグを追加など。","relatedLinks":[]},{"category":"Headline","title":"Project Status: Maintenance Reboot · Issue #5027 · mochajs/mocha","url":"https://github.com/mochajs/mocha/issues/5027","tags":["mocha","news","issue"],"content":"Mochaのプロジェクトをリブートしメンテナンスを再開するというアナウンス。","relatedLinks":[]},{"category":"Headline","title":"Bun v1.0.12 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.12","tags":["Bun","ReleaseNote"],"content":"Bun v1.0.12リリース。\n`bun -e \"<code>\"`のサポート、`bun --env-file <path>`のサポート、`import.meta.env`のサポート。\n`expect.unreachable()`の追加、`mock.module(...)`の改善など","relatedLinks":[]},{"category":"Article","title":"HTML DOM — Phuoc Nguyen","url":"https://phuoc.ng/collection/html-dom/","tags":["JavaScript","DOM","WebPlatformAPI","tutorial"],"content":"DOM APIを使った逆引きリファレンス的なサイト","relatedLinks":[]},{"category":"Article","title":"仕様と実装から読み解くHTMLのloading属性 - dwango on GitHub","url":"https://dwango.github.io/articles/html-loading-attribute/","tags":["HTML","browser","article"],"content":"ブラウザごとの`img`/`iframe`の`loading=lazy`の挙動の違いについて","relatedLinks":[]},{"category":"Article","title":"The end of third-party cookies and its impact on Miro apps and integrations | by Darren | Miro Engineering | Nov, 2023 | Medium","url":"https://medium.com/miro-engineering/the-end-of-third-party-cookies-and-its-impact-on-miro-apps-and-integrations-ee73358cda1e","tags":["browser","security","article"],"content":"サードパーティCookieの廃止が埋め込みサイトに与える影響と対応策について。","relatedLinks":[]},{"category":"Article","title":"A faster web in 2024 - rviscomi.dev","url":"https://rviscomi.dev/2023/11/a-faster-web-in-2024/","tags":["Chrome","performance","article"],"content":"GoogleのWeb Vitalsの指標としてFID(First Input Delay)の代わりにINP(Interaction to Next Paint)を利用するようになる変更について。\nINPを改善する方法としてのタスク分割、LCPとlazy loadingの問題、fetchpriotyやSpeculation Rules APIなどについて。","relatedLinks":[]},{"category":"Article","title":"Moving back to React","url":"https://daily.dev/blog/moving-back-to-react","tags":["React","article","refactoring"],"content":"Next.jsとの互換性のためPreactからReactへ移行した話。\nPreactとReactの互換性の問題や実際に遭遇した問題についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"JetBrains JavaScript Day 2023 - YouTube","url":"https://www.youtube.com/playlist?list=PLQ176FUIyIUZmRHOyz_n9iy2qfHo4_GRT","tags":["JavaScript","Conference","video"],"content":"JetBrains JavaScript Day 2023の動画まとめ","relatedLinks":[]},{"category":"WebsiteDocument","title":"SpeedVitals - Website Speed Test &amp; Monitoring","url":"https://speedvitals.com/","tags":["webservice","performance","Tools"],"content":"WebPageTestのように場所とデバイスを指定してパフォーマンステストができるサービス。\nURLを指定してLighthouseを使った計測データを閲覧できる","relatedLinks":[]}]},{"meta":{"title":"2023-11-26のJS: Vite 5、Node.js 20.10.0(ESMのデフォルト化フラグ)、State of JS 受付中","author":"azu","layout":"post","date":"2023-11-26T06:42:21.444Z","category":"JSer","tags":["CSS","HTML","slide","Tools","vite"],"url":"https://jser.info/2023/11/26/vite-5-node.js-20.10.0esm-state-of-js/"},"items":[{"category":"Headline","title":"Vite 5.0 is out! | Vite","url":"https://vitejs.dev/blog/announcing-vite5","tags":["vite","ReleaseNote"],"content":"Vite 5.0リリース。\nNode.js 14/16のサポート終了、Rollup 4へアップデート、CJS Node APIを非推奨化。\n`define`の置換方法をdevとproduction buildで同じ方法を使うように変更、devとpreviewでURL末尾のスラッシュの扱いが異なる問題を修正、非推奨なAPIの削除など","relatedLinks":[{"title":"Migration from v4 | Vite","url":"https://vitejs.dev/guide/migration#deprecate-cjs-node-api"}]},{"category":"Headline","title":"Bun v1.0.13 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.13","tags":["Bun","ReleaseNote"],"content":"Bun v1.0.13リリース。\n`node:http2`のサポートを改善し`@grpc/grpc-js`が動くように修正、`process.report.getReport()`をサポートしVite 5/Rollup 4が動くように修正。\n`with`ステートメントを含むファイルの変換をサポート、`Bun.spawn`のエラーを改善など","relatedLinks":[]},{"category":"Headline","title":"Release 8.0.0 · vvo/iron-session","url":"https://github.com/vvo/iron-session/releases/tag/v8.0.0","tags":["JavaScript","Next.js","library","ReleaseNote"],"content":"iron-session 8.0.0リリース。\nNext.js App Routerに対応し、APIも合わせて変更。","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.3 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-3/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.3リリース。\nStage 3のImport Attributesをサポート、`resolution-mode`を`///`コメントで指定できるように。\n`switch(true)`でのNarrowingをサポート、`[Symbol.hasInstance]`と`insteanceof`を使ったNarrowingをサポート。\nパッケージ内のbundleファイルの重複を避けることで、パッケージサイズの改善など。","relatedLinks":[]},{"category":"Headline","title":"Firefox 120.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/120.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 120リリース。\n`<source>`の`media`属性を再導入、`Date.parse()`でパースできる日付フォーマットの追加、HTTP 103 Early Hintsをサポート。\nその他には、Global Privacy Controlのサポート、CSSの`-moz-image-rect()`を削除など","relatedLinks":[{"title":"Firefox 120 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/120"}]},{"category":"Headline","title":"Node v20.10.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v20.10.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v20.10.0リリース。\nESMのデフォルト化に関する`--experimental-default-type`と`--experimental-detect-module`のフラグを追加。\n`fs.writeFile`に`flush`オプションを追加、`WebSocket`をグローバルに追加する`--experimental-websocket`フラグを追加。\nJestでメモリリークの原因となっていたVMScriptとDynamic Importに関する問題を修正など","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · lerna-lite/lerna-lite","url":"https://github.com/lerna-lite/lerna-lite/releases/tag/v3.0.0","tags":["JavaScript","monorepo","Tools","ReleaseNote"],"content":"lerna-lite v3.0.0リリース。\nNode.js 16のサポート終了、`lerna run --use-nx`の削除など","relatedLinks":[]},{"category":"Article","title":"Getting started with CSS container queries | MDN Blog","url":"https://developer.mozilla.org/en-US/blog/getting-started-with-css-container-queries/","tags":["CSS","article"],"content":"CSSのContainer queryの紹介記事。\n親要素に対して`@container`のMedia Queryで条件を指定し、子要素に対してスタイルを設定できる。\n基本的な使い方、Container units(`cq*`)、Style queryについてなど","relatedLinks":[]},{"category":"Article","title":"State of JavaScript 2023","url":"https://survey.devographics.com/en-US/survey/state-of-js/2023","tags":["JavaScript","Survey"],"content":"JavaScriptの開発者アンケートであるState of JavaScript 2023の受付が開始されている","relatedLinks":[]},{"category":"SlideVideo","title":"フロントエンドカンファレンス沖縄 2023 公開資料・Xアカウントリンクまとめ","url":"https://zenn.dev/yumemi_inc/articles/2023-11-18-frontend-conf-okinawa-2023","tags":["HTML","JavaScript","CSS","Conference","video","slide"],"content":"フロントエンドカンファレンス沖縄の動画とスライドのまとめ","relatedLinks":[{"title":"フロントエンドカンファレンス沖縄2023","url":"https://frontend-conf.okinawa.jp/"}]},{"category":"SlideVideo","title":"Intlの今までとこれから - Speaker Deck","url":"https://speakerdeck.com/sajikix/intlnojin-madetokorekara","tags":["i18n","JavaScript","ECMAScript","slide"],"content":"ECMA-402のIntlオブジェクトについてのスライド。\nIntl APIの紹介、仕様バージョンごとの追加された機能、国際化や地域化を扱うためUnicodeなどの外部仕様に依存している点、Temporalとの組み合わせなどについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Downloads by Major","url":"https://majors.nullvoxpopuli.com/","tags":["npm","webservice","Tools"],"content":"npmのパッケージのダウンロード数をメジャーバージョン単位で比較できるサービス。\nメジャーアップデートへの移行がどれぐらい進んでいるかを確認できる","relatedLinks":[]},{"category":"WebsiteDocument","title":"The Valley of Code","url":"https://thevalleyofcode.com/","tags":["JavaScript","CSS","HTTP","tutorial","HTML"],"content":"ウェブ開発に関するチュートリアルサイト。\nHTTP/HTML/CSS/JavaScriptなどのウェブ開発に関するチュートリアルやGitHub/VSCodeなどの開発に関するガイドを扱う","relatedLinks":[]}]},{"meta":{"title":"2023-12-01のJS: Node.js v18.19.0(LTS)、BiomeとPrettier、CSS Hooks","author":"azu","layout":"post","date":"2023-12-01T08:35:59.869Z","category":"JSer","tags":["nodejs","Tools","CSS","React","TypeScript"],"url":"https://jser.info/2023/12/01/node.js-v18.19.0lts-biomeprettier-css-hooks/"},"items":[{"category":"Headline","title":"Release v135 / Introducing esm.sh/run · esm-dev/esm.sh","url":"https://github.com/esm-dev/esm.sh/releases/tag/v135","tags":["JavaScript","cdn","library","ReleaseNote"],"content":"esm.sh v135リリース。\nJSXやTSのコード変換と実行できる\n`https://esm.sh/run`の追加など","relatedLinks":[]},{"category":"Headline","title":"Biome formatter wins the Prettier challenge |","url":"https://biomejs.dev/blog/biome-wins-prettier-challenge","tags":["JavaScript","Rust","Tools","ReleaseNote"],"content":"Biome v1.4.0リリース。\nJS/TS/JSXのフォーマット結果をPrettier互換となるように改善。現時点ではPrettierの結果と96%一致する。いくつかのフォーマットは意図的な差分があることについても書かれている。\nフォーマットに関するオプション追加、`--config-path`フラグの追加、Lintルールの追加など","relatedLinks":[{"title":"Release CLI v1.4.0 · biomejs/biome","url":"https://github.com/biomejs/biome/releases/tag/cli%2Fv1.4.0"}]},{"category":"Headline","title":"Release v9.0.0 · cosmiconfig/cosmiconfig","url":"https://github.com/cosmiconfig/cosmiconfig/releases/v9.0.0","tags":["nodejs","library","ReleaseNote"],"content":"設定ファイルのローダーライブラリであるcosmiconfig 9.0.0リリース。\n`searchStrategy`オプションの追加、`$import:`のサポート。\nファイルシステムの権限で読み取り失敗したときにクラッシュする問題を修正など","relatedLinks":[]},{"category":"Headline","title":"Astro 4.0 Beta Release | Astro","url":"https://astro.build/blog/astro-4-beta/","tags":["astro","ReleaseNote"],"content":"Astro 4.0 Betaリリース。\nVite 5へのアップデート、`<ViewTransitions />`に関するライフサイクルイベントを追加など","relatedLinks":[]},{"category":"Headline","title":"Node v18.19.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v18.19.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v18.19.0リリース。\nnpm 10へアップデート、`node:module`に`register` APIの追加、`import.meta.resolve`のサポート。\n`.js`のデフォルトの扱いをCJSからESMへと変更できる`--experimental-default-type`フラグのサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Node.js Downloads","url":"https://nodedownloads.nodeland.dev/","tags":["nodejs","webservice"],"content":"Node.jsのバージョンごとのダウンロード数をビジュアライズするサイト","relatedLinks":[]},{"category":"Headline","title":"Storybook 7.6","url":"https://storybook.js.org/blog/storybook-7-6/","tags":["Development","debug","Tools","ReleaseNote"],"content":"Storybook 7.6リリース。\nwebpackプロジェクトでもSWCを利用するように変更、`@storybook/test`のassertionをVitestのexpectに変更、Test modeの追加。\nreact-docgenのアップデートによる起動時間の改善、StoryshotsとVue2のサポートを非推奨化するなど","relatedLinks":[]},{"category":"Headline","title":"Node v21.3.0 (Current) | Node.js","url":"https://nodejs.org/en/blog/release/v21.3.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v21.3.0リリース。\n`--disable-warning`フラグの追加、ルート証明書をNSS 3.95に更新、UTF-8の文字列を`fs.writeFileSync`で書き込む時のパフォーマンス改善など","relatedLinks":[]},{"category":"Headline","title":"tapjs/tsimp","url":"https://github.com/tapjs/tsimp","tags":["TypeScript","nodejs","library"],"content":"ts-nodeのようにTypeScriptのコードを型チェックしながらコンパイルできるローダー。\nNode.js 20からサポートされている`Module.register()`を使って`node --import`で動作する。またデーモンとキャッシュを使うことで、不要な処理をスキップできる。","relatedLinks":[]},{"category":"Article","title":"Prettier&#039;s CLI: A Performance Deep Dive · Prettier","url":"https://prettier.io/blog/2023/11/30/cli-deep-dive","tags":["nodejs","JavaScript","performance","article"],"content":"PrettierのCLIのパフォーマンス改善について。\nglobのファイル探索の改善、INIファイルのパースの改善、キャッシュをデフォルト化、`console.log`の出力をバッファリングするように変更など","relatedLinks":[]},{"category":"Article","title":"CSS Containmentの仕組みを理解してレンダリングパフォーマンスをアップする１ 概要 | フロントエンドBlog | ミツエーリンクス","url":"https://www.mitsue.co.jp/knowledge/blog/frontend/202311/28_1448.html","tags":["CSS","article"],"content":"CSS Containmentについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"architect/aws-lite: A simple, fast, extensible AWS client","url":"https://github.com/architect/aws-lite","tags":["aws","JavaScript","library"],"content":"AWSのAPIクライアントライブラリ。\nAWS SDKのパフォーマンスやスタックトレースなどの問題に対応する目的で作成している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"css-hooks/css-hooks: Hooks bring advanced CSS features to native inline styles.","url":"https://github.com/css-hooks/css-hooks","tags":["JavaScript","CSS","React","library"],"content":"style属性でスタイリングをするCSS in JSライブラリ。React/Preact/Solidに対応している。\nCSS custom propertiesを使って、`:hover`などの擬似クラスやMedia Queryに対するスタイルをstyle属性で実現している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tapjs/tsimp","url":"https://github.com/tapjs/tsimp","tags":["TypeScript","nodejs","Tools","library"],"content":"ts-nodeのようにTypeScriptのコードを型チェックしながらコンパイルできるローダー。\nNode.js 20からサポートされている`Module.register()`を使って`node --import`で動作する。またデーモンとキャッシュを使うことで、不要な処理をスキップできる。","relatedLinks":[]},{"category":"Book","title":"Fluent React","url":"https://learning.oreilly.com/library/view/fluent-react/9781098138707/","tags":["React","book"],"content":"2024年3月発売。\nReactについての書籍","relatedLinks":[]}]},{"meta":{"title":"2023-12-08のJS: Redux 5.0.0、Vitest 1.0.0、Astro 4.0","author":"azu","layout":"post","date":"2023-12-08T13:05:55.581Z","category":"JSer","tags":["nodejs","redux","CSS","Electron","deno"],"url":"https://jser.info/2023/12/08/redux-5.0.0-vitest-1.0.0-astro-4.0/"},"items":[{"category":"Headline","title":"Fresh 1.6: Tailwind CSS plugin, simplified typings and more","url":"https://deno.com/blog/fresh-1.6","tags":["deno","library","ReleaseNote"],"content":"Fresh 1.6リリース。\nTwindからTailwind CSSへの移行、`fresh.gen.ts`の自動生成結果がコンフリクトしにくい形式へと変更、Pluginからislandsが作成できるように。\nルーティングにURLPatternではなく正規表現を使うことでパフォーマンスを改善、Contextの型定義をまとめるなどの変更が含まれる","relatedLinks":[{"title":"Release 1.6.0 · denoland/fresh","url":"https://github.com/denoland/fresh/releases/tag/1.6.0"},{"title":"Migrating to Tailwind | Fresh docs","url":"https://fresh.deno.dev/docs/examples/migrating-to-tailwind"},{"title":"Poor URLPattern performance · Issue #19861 · denoland/deno","url":"https://github.com/denoland/deno/issues/19861"}]},{"category":"Headline","title":"Release v5.0.0 · reduxjs/redux","url":"https://github.com/reduxjs/redux/releases/tag/v5.0.0","tags":["redux","JavaScript","ReleaseNote"],"content":"Redux v5.0.0リリース。\nTypeScriptへの書き換え、CJS/ESMのdual packageに変更、ES2020形式で出力するように変更。\n`createStore`を非推奨としRedux Toolkitへの移行を推奨としている。","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · reduxjs/redux-toolkit","url":"https://github.com/reduxjs/redux-toolkit/releases/tag/v2.0.0","tags":["React","redux","library","ReleaseNote"],"content":"Redux Toolkit v2.0.0リリース。\nRedux v5/Reselect 5.0へのアップデート、`createReducer`/`createSlice`の`extraReducers`におけるオブジェクト構文のサポートを削除。\n`middleware`オプションが配列ではなくコールバック関数のみを受け付けるように変更、型定義の変更など。\n`combineSlices`の追加、`createDynamicMiddleware`の追加、`autoBatchEnhancer`をデフォルトで有効化するなど","relatedLinks":[{"title":"Migrating to RTK 2.0 and Redux 5.0 | Redux","url":"https://redux.js.org/usage/migrations/migrating-rtk-2"}]},{"category":"Headline","title":"Release v6.0.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v6.0.0","tags":["nodejs","JavaScript","jailbreak","ReleaseNote"],"content":"AVA v6.0.0リリース。\nNpde.js 14/16のサポート終了、Watchモードの改善、`t.throws()`に`any`オプションを追加など","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0 · vitest-dev/vitest","url":"https://github.com/vitest-dev/vitest/releases/tag/v1.0.0","tags":["vite","testing","ReleaseNote"],"content":"vitest v1.0.0リリース。\n`node:child_process`を使った並列実行をサポート、`pool`と`poolOptions`をサポートし関連する古いフラグを削除など。\nSnapshotの形式の変更、カバレッジの改善、`--projet`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Astro 4.0 | Astro","url":"https://astro.build/blog/astro-4/","tags":["astro","ReleaseNote"],"content":"Astro 4.0リリース。\nDevToolbarの追加、i18n Routingの追加、View Transition APIのサポートを改善、Loggingの改善。\n実験的な機能としてIncremental Content Cachingを追加など","relatedLinks":[]},{"category":"Headline","title":"Electron 28.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-28-0","tags":["Electron","ReleaseNote"],"content":"Electron 28.0.0リリース。\nChromium 120.0.6099.56、Node.js 18.18.2にアップデート。\nECMAScript Moduesをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v3.11.0 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v3.11.0","tags":["JavaScript","server","library","ReleaseNote"],"content":"Hono v3.11.0リリース。\n`hono/jsx`に`ErrorBoundary`の追加、`hono/dev`にルーティングの一覧を出力する`showRoutes`を追加。\n`c.jsonT()`をDeprecatedにして、`c.json()`がRPCでも利用できるようになるなど。","relatedLinks":[{"title":"Honoのv3.10とv3.11について","url":"https://zenn.dev/yusukebe/articles/d1be7aa06999cb"}]},{"category":"Headline","title":"Release v14.0.0 · sindresorhus/got","url":"https://github.com/sindresorhus/got/releases/tag/v14.0.0","tags":["nodejs","HTTP","library","ReleaseNote"],"content":"Got v14.0.0リリース。\nNode.js 18のサポートを終了。","relatedLinks":[]},{"category":"Article","title":"Web Performance Calendar » Fastest Way of Passing State to JavaScript, Re-visited","url":"https://calendar.perfplanet.com/2023/fastest-way-passing-state-javascript-revisited/","tags":["JavaScript","performance","article"],"content":"SSRでステートを埋め込んで渡す方法のパフォーマンス比較。\nJSを出力する方法、InvalidなMime typeで埋め込む方法、JSONを埋め込む方法について","relatedLinks":[]},{"category":"Article","title":"VueFes Japan 2023イベントレポート | gihyo.jp","url":"https://gihyo.jp/article/2023/11/vuefes-japan-2023-report","tags":["Vue","article"],"content":"VueFes Japan 2023のレポート記事","relatedLinks":[{"title":"Vue ","url":"https://speakerdeck.com/kazupon/vue-and-vite-rustify"}]},{"category":"Article","title":"Ecosystem 2023 Recap | Electron","url":"https://www.electronjs.org/blog/ecosystem-2023-eoy-recap","tags":["Electron","article"],"content":"Electronのエコシステムのアップデートについての紹介記事。\nElectron Forge、Auto updatesの静的ストレージの対応、`@electron/windows-sign`について","relatedLinks":[]},{"category":"SlideVideo","title":"2020年から2023年までのCSSの変遷を振り返る - yamaScrapbox","url":"https://scrapbox.io/yamanoku/2020%E5%B9%B4%E3%81%8B%E3%82%892023%E5%B9%B4%E3%81%BE%E3%81%A7%E3%81%AECSS%E3%81%AE%E5%A4%89%E9%81%B7%E3%82%92%E6%8C%AF%E3%82%8A%E8%BF%94%E3%82%8B","tags":["CSS","slide"],"content":"2020年以降に実装されたCSSの機能紹介","relatedLinks":[]},{"category":"SoftwareLibrary","title":"unjs/unenv: 🕊️ Convert javaScript code to be runtime agnostic","url":"https://github.com/unjs/unenv/tree/main","tags":["nodejs","JavaScript","polyfill","library"],"content":"Node.js Core Modulesなどのpolyfillやモックを提供するライブラリ。\nNode.js向けのコードを他の実行環境でも動作させるためのライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"facebook/stylex: StyleX is the styling system for ambitious user interfaces.","url":"https://github.com/facebook/stylex","tags":["JavaScript","CSS","library"],"content":"FacebookのAtomic CSS in JSライブラリ。\nTypeScriptなどでType Safeにスタイルを定義、適用でき、ビルド時にCSSファイルへとコンパイルすることで実行時のコストを小さくしている。\n`stylex.create`でスタイルを定義、`stylex.props`で常に後ろが優先されるというマージルールでスタイルを適用できる。","relatedLinks":[]}]},{"meta":{"title":"2023-12-15のJS: Safari 17.2、Deno 1.39(WebGPU)、SvelteKit 2","author":"azu","layout":"post","date":"2023-12-15T04:59:54.932Z","category":"JSer","tags":["Next.js","React","debug","python","book"],"url":"https://jser.info/2023/12/15/safari-17.2-deno-1.39webgpu-sveltekit-2/"},"items":[{"category":"Headline","title":"ECMAScript proposal updates @ 2023-11 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2023/12/10/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2023-11のTC39ミーティングでのECMAScript Proposalのステータス変更のまとめ。\nArray Groupingと`Promise.withResolvers`がStage 4となりES2024に含まれる。","relatedLinks":[]},{"category":"Headline","title":"WebKit Features in Safari 17.2 | WebKit","url":"https://www.webkit.org/blog/14787/webkit-features-in-safari-17-2/","tags":["safari","ReleaseNote"],"content":"Safari 17.2リリース。\nHTMLでは、`<detail name>`のサポート、`<input autocomplete=\"one-time-code\">`のサポートなど。\nCSSでは、Nestingのルール緩和、`cap` unit、`rem()`/`mod()`/`round()`の追加、`mask-border`のサポート、Custom Highlight APIのサポートなど。\nJavaScriptでは、Import attributesのサポート。\nその他には、`<link rel=preload>`で`imagesizes`/`imagesrcset`属性でのresponsive imageをサポート。\nSVG画像を`<image crossorigin>`で読み込むときにCORSを考慮して扱えるように。\nFetch Priorityのサポート、HTML Formの`form.reportValidity()` APIをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Oxlint General Availability | The JavaScript Oxidation Compiler","url":"https://oxc-project.github.io/blog/2023-12-12-announcing-oxlint.html","tags":["ESLint","JavaScript","Rust","ReleaseNote"],"content":"Oxlintが公開された。\nESLintと同じようにJavaScriptやTypeScriptのLintをするツール。\nパフォーマンスを目的として設計されており、色々なESLintのルールをコアに取り込んでいる。","relatedLinks":[]},{"category":"Headline","title":"Deno 1.39: The Return of WebGPU","url":"https://deno.com/blog/v1.39","tags":["deno","ReleaseNote"],"content":"Deno v1.39リリース。\nWebGPU APIを再導入、`deno coverage --html`でHTMLのカバレッジレポートを表示できるように、`deno compile`の改善。\n`deno task`で`node_modules/.bin/`へのPATHを通すように。\n`Object.prototype.__proto__`を有効化する`--unstable-unsafe-proto`フラグを追加。\nJestのexpect互換の`std/expect`を追加、コマンドライン引数のパースをする`std/cli`を追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing SvelteKit 2","url":"https://svelte.dev/blog/sveltekit-2","tags":["Svelte","ReleaseNote"],"content":"SvelteKit 2リリース。\n`load`関数でのPromisesの扱いに一貫性を持たせるように、`paths.relative`をデフォルトで`true`に変更、`dangerZone.trackServerFetches`を削除など","relatedLinks":[{"title":"Migrating to SvelteKit v2 • Docs • SvelteKit","url":"https://kit.svelte.dev/docs/migrating-to-sveltekit-2"},{"title":"Release @sveltejs/kit@2.0.0 · sveltejs/kit","url":"https://github.com/sveltejs/kit/releases/tag/%40sveltejs%2Fkit%402.0.0"}]},{"category":"Article","title":"npm install --productionみたいなの色々ありすぎ問題","url":"https://zenn.dev/zawa_kyo/articles/d671e0935ae0c0","tags":["npm","article"],"content":"`npm install --omit=dev`や`--production`、`--inculde`フラグについて","relatedLinks":[]},{"category":"Article","title":"Vite は使ってないけど Jest を Vitest に移行する","url":"https://zenn.dev/sa2knight/articles/migrating_vitest_from_jest","tags":["JavaScript","testing","article"],"content":"JestからVitestへの移行方法について","relatedLinks":[]},{"category":"Article","title":"Baseline&#039;s evolution on MDN | MDN Blog","url":"https://developer.mozilla.org/en-US/blog/baseline-evolution-on-mdn/","tags":["article","browser"],"content":"主要なブラウザでサポートされてるかをわかりやすく表示するBaselineについて。\nMDNやcaniuseでのAPIのサポート状況の表示に利用されているBaselineの定義について","relatedLinks":[{"title":"Baseline 2023  |  web.dev","url":"https://web.dev/blog/baseline2023?hl=en"}]},{"category":"Article","title":"Storybook for React Server Components","url":"https://storybook.js.org/blog/storybook-react-server-components/","tags":["React","debug","article"],"content":"StorybookのReact Server Components(RSC)のサポートについて。\nRSCをクライアントサイドでレンダリングして対応予定。Storybook 8のα版で利用できるようになっている。","relatedLinks":[]},{"category":"Article","title":"【月間9000万PVのPR TIMES】プレスリリース掲載ページの Next.js 移行でやったこと | PR TIMES 開発者ブログ","url":"https://developers.prtimes.jp/2023/12/13/replace-press-release-page-with-nextjs/","tags":["Next.js","article"],"content":"Next.jsのPages Routerに移行し、キャッシュの処理はCDN(Fastly)に寄せるという話。","relatedLinks":[]},{"category":"Article","title":"1年かけてNext.jsのapp routerへ完全移行した話","url":"https://zenn.dev/urotea/articles/3fbaa77d77b788","tags":["Next.js","GraphQL","article"],"content":"Next.jsのPages RouterからApp Routerへの移行について。\n移行の手順、App Routerへの移行後のメリットやデメリットについて。\nIntercepting Routesでのダイアログ管理、layoutやエラー画面の管理、キャッシュの問題について","relatedLinks":[]},{"category":"Article","title":"一休レストランで Next.js App Router から Remix に乗り換えた話 - 一休.com Developers Blog","url":"https://user-first.ikyu.co.jp/entry/2023/12/15/093427","tags":["Next.js","Remix","article"],"content":"Next.jsのApp RouterからRemix Runに移行した話。\nNext.jsのApp RouterではCache-Controlが暗黙的で変更できない問題、RemixではResponseを自由に変更できるなどの違いについて。","relatedLinks":[]},{"category":"WebsiteDocument","title":"BuilderIO/hydration-overlay: Overlay for hydration errors with explicit diff between renders.","url":"https://github.com/BuilderIO/hydration-overlay","tags":["React","debug","library"],"content":"ReactのHydrationでのmismatchのエラーをDiff表示するライブラリ。\nSSRとCSRでのレンダリング結果にズレがある場合にHydrationエラーのデバッグに利用できる。","relatedLinks":[{"title":"Announcing React Hydration Overlay - Easily Squash Hydration Errors","url":"https://www.builder.io/blog/announcing-react-hydration-overlay"}]},{"category":"SoftwareLibrary","title":"Onyx Programming Language","url":"https://onyxlang.io/","tags":["WebAssembly","program"],"content":"WebAssemblyへとコンパイルできる言語","relatedLinks":[{"title":"Onyx, a new programming language powered by WebAssembly","url":"https://wasmer.io/posts/onyxlang-powered-by-wasmer"}]},{"category":"Book","title":"実装で学ぶフルスタックWeb開発 エンジニアの視野と知識を広げる「一気通貫」型ハンズオン | 株式会社オープントーン, 佐藤 大輔, 伊東 直喜, 上野 啓二 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4798179337/","tags":["Next.js","React","python","book"],"content":"2023年12月18日発売\nNext.jsとDjangoでのウェブ開発についての書籍。\nサンプルアプリケーションを通してウェブシステム開発を学ぶ書籍","relatedLinks":[]}]},{"meta":{"title":"2023-12-23のJS: date-fns 3.0.0、Firefox 121、React Aria Components 1.0.0、Catalyst","author":"azu","layout":"post","date":"2023-12-23T11:57:59.608Z","category":"JSer","tags":["CSS","React","TypeScript","example","Firefox"],"url":"https://jser.info/2023/12/23/date-fns-3.0.0-firefox-121-react-aria-components-1.0.0-catalyst/"},"items":[{"category":"Headline","title":"Release v3.0.0 · date-fns/date-fns","url":"https://github.com/date-fns/date-fns/releases/tag/v3.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"date-fns v3.0.0リリース。\nESMとCJSのdual pacakgeに変更、それぞれのファイルはnamed exportするように変更。TypeScriptの型を改善、引数の数のRuntime Checkを無くしてType Checkのみに変更、intervalの負数をサポート、IEのサポートを終了など","relatedLinks":[]},{"category":"Headline","title":"Firefox 121.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/121.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 121リリース。\n`<iframe loading=lazy>`のサポート、CSSの`text-wrap: balance`、`:has()`、`text-indent: each-ilne`のサポート。\nES2024の`Promise.withResolvers()`のサポート、`Date.parse()`で解釈できるフォーマットを追加。\n実験的な機能としてCustom Elementの`state`プロパティのサポート、`showPicker()`のサポートなど","relatedLinks":[{"title":"Firefox 121 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/121"}]},{"category":"Headline","title":"Tailwind CSS v3.4: Dynamic viewport units, :has() support, balanced headlines, subgrid, and more - Tailwind CSS","url":"https://tailwindcss.com/blog/tailwindcss-v3-4","tags":["CSS","library","ReleaseNote"],"content":"Tailwind CSS v3.4リリース。\nDynamic viewport unitsのサポート、`:has()`のサポート、`*` variantの追加、`size-*` utilityの追加、Sub gridのサポートなど","relatedLinks":[]},{"category":"Headline","title":"December 20, 2023 Release – React Spectrum Releases","url":"https://react-spectrum.adobe.com/releases/2023-12-20.html","tags":["React","library","ReleaseNote"],"content":"React Aria Components v1リリース。\nReact Ariaの説明をするLanding Pageの公開、Storybookやスタイルを含むStarter Kitの公開など","relatedLinks":[{"title":"React Aria","url":"https://react-spectrum.adobe.com/react-aria/index.html"},{"title":"Getting Started – React Aria","url":"https://react-spectrum.adobe.com/react-aria/getting-started.html#starter-kit"}]},{"category":"Headline","title":"Introducing Catalyst: A modern UI kit for React - Tailwind CSS","url":"https://tailwindcss.com/blog/introducing-catalyst","tags":["UI","CSS","library","ReleaseNote","React"],"content":"TailwindのUI KitであるCatalystのリリース。\nスタイル付きのコンポーネントをコピーして使う有料のReactコンポーネント集。","relatedLinks":[{"title":"Catalyst - Tailwind CSS Application UI Kit","url":"https://tailwindui.com/templates/catalyst"}]},{"category":"Headline","title":"Bun v1.0.19 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.19","tags":["Bun","ReleaseNote","TypeScript"],"content":"Bun v1.0.19リリース。\n`bun-types`には色々問題があったため`@types/bun`に変更、`setTimeout`/`setInterval`のパフォーマンスを改善など","relatedLinks":[]},{"category":"Article","title":"Node.js v21 の主な変更点 - 別にしんどくないブログ","url":"https://shisama.hatenablog.com/entry/2023/12/16/151553","tags":["nodejs","article"],"content":"Node.js v21の変更点について。\nFetchとWebStreamsのStable化、WebSocketの追加、`navigator.language`/`navigator.languages`の追加、ESMデフォルト化に関するフラグの追加。\n`import.meta.dirname`/`import.meta.filename`の追加、Test Runnerのglob指定に対応、`--disable-warning`フラグの追加など","relatedLinks":[]},{"category":"Article","title":"From CSS madness to CSS Hooks — nsaunders.dev","url":"https://nsaunders.dev/posts/css-madness-to-hooks","tags":["CSS","article"],"content":"CSS Hooksで利用されているCSS Variablesを使ったfallback trickについて。\nCSS Variablesでは`initial`が指定されている場合はfallbackが使われ、空の値の場合は空の値が使われる。\nこの特性を使うことで、CSSだけでプログラムするようにスタイルのトグルが実現できる。","relatedLinks":[{"title":"CSS Hooks","url":"https://css-hooks.com/"}]},{"category":"Article","title":"Getting started with Web Performance 🚀 - HTMHell","url":"https://www.htmhell.dev/adventcalendar/2023/14/","tags":["performance","article"],"content":"ウェブパフォーマンスの入門記事。\nなぜパフォーマンスが大事か、Core Web VitalsやLCP/INP/CLSといったメトリクスがどのような状態を計測してるのかの解説。\nパフォーマンスを計測する方法やツール、改善に対するTipsなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"TS Docs | Reference docs for npm packages","url":"https://tsdocs.dev/","tags":["TypeScript","npm","document","webservice"],"content":"npmパッケージの型情報からtypedocを表示できるサービス。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"webui-dev/webui: Use any web browser as GUI, with your preferred language in the backend and HTML5 in the frontend, all in a lightweight portable lib.","url":"https://github.com/webui-dev/webui","tags":["webview","browser","software"],"content":"ブラウザやWebViewをGUIとして使い、バックエンドを任意の言語で書けるデスクトップアプリツール。\nバックエンドからブラウザのウィンドウ操作やブラウザとのやり取りをするSDKが色々な言語向けに用意されている","relatedLinks":[]}]},{"meta":{"title":"2024-01-02のJS: Vue 3.4、Vue 2.xのEOL、quick-lint-js 3.0.0、AstroとDenoの2023年まとめ","author":"azu","layout":"post","date":"2024-01-02T01:21:04.024Z","category":"JSer","tags":["Vue","performance","CSS","book","pnpm"],"url":"https://jser.info/2024/01/02/vue-3.4-vue-2.xeol-quick-lint-js-3.0.0-astrodeno2023/"},"items":[{"category":"Headline","title":"Release v8.13.1 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v8.13.1","tags":["pnpm","ReleaseNote"],"content":"pnpm v8.13.1リリース。\n`pnpm cat-index`/`pnpm cat-file`/`pnpm find-hash`コマンドの追加など","relatedLinks":[]},{"category":"Headline","title":"moment/CHANGELOG.md at develop · moment/moment","url":"https://github.com/moment/moment/blob/develop/CHANGELOG.md#2300-full-changelog","tags":["JavaScript","library","ReleaseNote"],"content":"moment 2.30.0リリース。","relatedLinks":[{"title":"moment-2.30.0.md","url":"https://gist.github.com/ichernev/e277bcd1f0eeabb834f60a777237925a"}]},{"category":"Headline","title":"Release 3.35.0 - 2023.12.29 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.35.0","tags":["JavaScript","library","polyfill","ReleaseNote"],"content":"core-js v3.35.0リリース。\n`{ Map, Set, WeakMap, WeakSet }.{ from, of }`の`this`に関する挙動の変更など","relatedLinks":[]},{"category":"Headline","title":"Announcing Vue 3.4 | The Vue Point","url":"https://blog.vuejs.org/posts/vue-3-4","tags":["Vue","ReleaseNote"],"content":"Vue 3.4リリース。\nVueテンプレートのパーサーのパフォーマンス改善、`watchEffect`の改善、`defineModel`をStable APIに変更。\n`v-bind`が同名の場合の省略記法を追加、Hydrationのエラー表示を改善。\nglobal `JSX` namespaceの型を定義しないように変更、実験的な機能だったReactivity Transformの削除など","relatedLinks":[]},{"category":"Headline","title":"Vue.js","url":"https://v2.vuejs.org/eol/","tags":["Vue","news"],"content":"Vue 2は2023年12月31日でEnd of Life (EOL)となり、サポートが終了した。\n最終バージョンは2.7.16","relatedLinks":[]},{"category":"Headline","title":"TypeScript Clearly &amp; Quickly","url":"https://quick-lint-js.com/blog/version-3.0/","tags":["JavaScript","TypeScript","ESLint","ReleaseNote"],"content":"Quick-lint-js 3.0リリース。\nTypeScriptのLintに対応、JSXのLintの改善など","relatedLinks":[{"title":"Release 3.0.0 (2024-01-01) · quick-lint/quick-lint-js","url":"https://github.com/quick-lint/quick-lint-js/releases/tag/3.0.0"}]},{"category":"Article","title":"Next.jsを4年間使用してたどりついた、エンタープライズアプリケーションのフロントエンド開発・構築手法 | POSTD","url":"https://postd.cc/how-i-approach-and-structure-enterprise-frontend-applications-after-4-years-of-using-nextjs/","tags":["Next.js","article","translate"],"content":"Next.jsのPages Routerでのアプリケーションアーキテクチャについて。\nNext.jsのディレクトリ構造、ツール、コーディングスタイルについてなど","relatedLinks":[]},{"category":"Article","title":"Web Performance Calendar » Measuring, monitoring and optimizing TTFB with Server timing","url":"https://calendar.perfplanet.com/2023/ttfb-server-timing-measuring-monitoring-optimizing/","tags":["performance","JavaScript","article"],"content":"`Server-Timing` HTTP Response Headerについて。\n`Server-Timing`のフォーマット、Node.jsでレスポンスを組み立てる例など","relatedLinks":[]},{"category":"Article","title":"Web Performance Calendar » Digging through Chrome traces: an introduction with an example","url":"https://calendar.perfplanet.com/2023/digging-chrome-traces-introduction-example/","tags":["Chrome","performance","article"],"content":"ChromeのTraceについて。\nDevToolsは現在のタブのデータのみだが、Chrome全体のトレースを見られる`chrome://tracing`について。\nDevToolsのパフォーマンスパネルとトレースの使い分け、トレースファイルのフォーマット、トレースとChromeのコードベースの対応の調べ方について。","relatedLinks":[]},{"category":"Article","title":"SvelteKit はどのようにコンパイルしているのか？","url":"https://blog.osstech.co.jp/posts/2023/11/how-sveltekit-compiles/","tags":["Svelte","vite","article"],"content":"SvelteKitのコンパイルの仕組みであるvite-plugin-svelteとViteについて。\n`/__inspect/`でのコンパイルの確認方法、Viteについて。","relatedLinks":[]},{"category":"Article","title":"Astro ゆく年くる年","url":"https://zenn.dev/morinokami/articles/astro-2023-2024","tags":["astro","article"],"content":"Astroの2023年の主要な変更点についてのまとめ。\nContent Collections、Hybrid Rendering、Middleware、Custom Client Directives、 Page Partials、Dev Toolbar。\nまた関連プロジェクトについてなど","relatedLinks":[]},{"category":"Article","title":"2023年のDenoの変更点やできごとのまとめ","url":"https://zenn.dev/uki00a/articles/whats-new-for-deno-in-2023","tags":["deno","article"],"content":"Denoの2023年の主要な変更点について。\nNode.jsとの互換性の改善、`deno.json`のオプションの追加、Deno KV/Queues/Cronの追加、実験的なパッケージマネージャの実装、`deno jupyter`コマンドの追加など。\nまた、`deno_std`のv1リリースに向けてモジュールの削除や構造の変更などが行われていることについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"speed-highlight/core: 🌈 Light, fast, and easy to use, dependencies free javascript syntax highlighter, with automatic language detection","url":"https://github.com/speed-highlight/core","tags":["JavaScript","library"],"content":"自動で言語を判定する機能を持つシンタックハイライトライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Pagefind | Pagefind — Static low-bandwidth search at scale","url":"https://pagefind.app/","tags":["JavaScript","Rust","library","search","nodejs"],"content":"静的サイト向けの全文検索エンジンとUIライブラリ。\n検索インデックスをchunkに分けて作成し、ブラウザから取得する検索インデックスも必要な部分だけをロードすることで、大きなサイトでも転送量を小さく保つ仕組みを持つ。","relatedLinks":[]},{"category":"Book","title":"Tailwind CSS実践入門：書籍案内｜技術評論社","url":"https://gihyo.jp/book/2024/978-4-297-13943-8","tags":["CSS","book"],"content":"2024年1月26日発売\nTailwind CSSについての書籍","relatedLinks":[]}]},{"meta":{"title":"2024-01-11のJS: Biome v1.5、Node.js v20.11.0、Rspack 0.5","author":"azu","layout":"post","date":"2024-01-11T03:42:47.857Z","category":"JSer","tags":["book","Bun","DOM","Chrome","privacy"],"url":"https://jser.info/2024/01/11/biome-v1.5-node.js-v20.11.0-rspack-0.5/"},"items":[{"category":"Headline","title":"Bun v1.0.21 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.21","tags":["Bun","ReleaseNote"],"content":"Bun v1.0.21リリース。\n`console.table()`のサポート、`bun:sqlite`のエラー表示やメモリ消費量の改善。\nLinuxで`blob.arrayBuffer()`のCOWをサポートしメモリ消費を改善、`bun build --public-path=<path>`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Google shares update on next step toward phasing out third-party cookies in Chrome","url":"https://blog.google/products/chrome/privacy-sandbox-tracking-protection/","tags":["Chrome","privacy","news"],"content":"2024年1月4日からChromeの1%のユーザーを対象にサードパーティCookieを無効にするテストを開始する","relatedLinks":[{"title":"Preparing for the end of third-party cookies  |  Privacy Sandbox  |  Google for Developers","url":"https://developers.google.com/privacy-sandbox/blog/cookie-countdown-2023oct"}]},{"category":"Headline","title":"2023 JavaScript Rising Stars","url":"https://risingstars.js.org/2023/en","tags":["JavaScript","Github","news"],"content":"GitHubのスター数の比較をするJavaScript Rising Starsの2023年の結果が公開された","relatedLinks":[]},{"category":"Headline","title":"Astro 4.1 | Astro","url":"https://astro.build/blog/astro-410/","tags":["astro","ReleaseNote"],"content":"Astro 4.1リリース。\ndev toolbarにアクセシビリティのauditを追加、`client:visible`に`rootMargin`オプションを追加、CookieのEncoding/Decodingオプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v3.12.0 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v3.12.0","tags":["JavaScript","server","library","ReleaseNote"],"content":"Hono v3.12.0リリース。\nOriginヘッダをチェックする`hono/csrf`の追加、実験的なAPIとして`hono/css`でのCSS in JSを追加など","relatedLinks":[]},{"category":"Headline","title":"Release Version 23.2.0 · jsdom/jsdom","url":"https://github.com/jsdom/jsdom/releases/tag/23.2.0","tags":["JavaScript","DOM","ReleaseNote"],"content":"jsdom 23.2.0リリース。\nCSS selectorのエンジンを`nwsapi`から`dom-selector`へと変更。","relatedLinks":[{"title":"asamuzaK/domSelector: A CSS selector engine.","url":"https://github.com/asamuzaK/domSelector"},{"title":"dperini/nwsapi: Fast CSS Selectors API Engine","url":"https://github.com/dperini/nwsapi"}]},{"category":"Headline","title":"Bun v1.0.22 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.22","tags":["Bun","ReleaseNote"],"content":"Bun v1.0.22リリース。\n`PerformanceObserver`/`performance.mark`/`performance.measure` APIの実装、Fetch APIのBrotliサポート。\n`console.table`のEastAsianWidthの対応改善など","relatedLinks":[]},{"category":"Headline","title":"Biome v1.5 | Biome","url":"https://biomejs.dev/blog/biome-v1-5/","tags":["JavaScript","Tools","ReleaseNote"],"content":"Biome v1.5リリース。\nGitなどのVCSでの変更されたファイルだけを扱う`--changed`フラグの追加、`biome ci`でGitHubのProblem Matcherに合わせた出力をするように。\n`biome explain`の追加、Lintルールの追加など","relatedLinks":[{"title":"Biome の 2024年のロードマップの公開と v1.5.0 のリリース","url":"https://zenn.dev/cybozu_frontend/articles/biome-roadmap-2024"}]},{"category":"Headline","title":"Node v20.11.0 (LTS) | Node.js","url":"https://nodejs.org/en/blog/release/v20.11.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v20.11.0リリース。\n`import.meta.dirname`/`import.meta.filename`を追加、`--disable-warning`フラグを追加、Streamのパフォーマンス改善など","relatedLinks":[]},{"category":"Headline","title":"Release v13.0.0 · capricorn86/happy-dom","url":"https://github.com/capricorn86/happy-dom/releases/tag/v13.0.0","tags":["JavaScript","DOM","ReleaseNote"],"content":"Happy DOM v13.0.0リリース。\nInternalなAPIをSymbolとして使うことで直接はアクセスできないように変更、CORSのpreflightの対応改善、`window.open()`/`window.close()`の実装など","relatedLinks":[]},{"category":"Headline","title":"Rspack 0.5 Release Announcement - Rspack","url":"https://www.rspack.dev/blog/announcing-0.5.html","tags":["JavaScript","bundler","ReleaseNote"],"content":"Rspack 0.5リリース。\nModule Federationのサポート、ビルトインで定義されていたデフォルトの変換(jsやts)を削除しユーザーが定義するように変更。\n`resolve.exntesions`のデフォルト値から`.ts`や`.tsx`などを削除、Deprecatedだった`builtins.*`オプションやloaderを削除など","relatedLinks":[]},{"category":"Article","title":"More Than You Need to Know About ReactDOM.flushSync | JulesBlom.com","url":"https://julesblom.com/writing/flushsync","tags":["React","article"],"content":"Reactの`ReactDOM.flushSync`について。\nReactはデフォルトで状態の更新をまとめてレンダリングするが、`flushSync`では状態の更新をすぐにレンダリングできることについて","relatedLinks":[]},{"category":"Book","title":"【DDD入門】TypeScript × ドメイン駆動設計ハンズオン","url":"https://zenn.dev/yamachan0625/books/ddd-hands-on","tags":["DDD","TypeScript","book"],"content":"DDDのドメインモデリングや実装方法についてを見ていくチュートリアル。\nイベントストーミングでのドメインモデリング、PlantUMLを使ったモデル図の管理、TypeScriptを使った実装について紹介している","relatedLinks":[]},{"category":"Book","title":"Amazon.co.jp: フロントエンドの知識地図—— 一冊でHTML/CSS/JavaScriptの開発技術が学べる本 eBook : 池田 泰延, 西原 翼, 松本 ゆき: Kindleストア","url":"https://www.amazon.co.jp/dp/B0CMCWZRP2/","tags":["JavaScript","HTML","CSS","book"],"content":"HTML/CSS/JavaScriptなどのフロントエンドについての書籍","relatedLinks":[]},{"category":"Book","title":"The chibivue Book | The chibivue Book","url":"https://ubugeeei.github.io/chibivue/","tags":["Vue","JavaScript","book","tutorial"],"content":"Vueの仕組みを実装しながら、Virtual DOM/Reactivity System/Template Compiler/Single File Componentについて見ていくサイト。","relatedLinks":[]}]},{"meta":{"title":"JSer.info 13周年: JavaScriptの情報源を整理する","author":"azu","layout":"post","date":"2024-01-15T15:22:00.000Z","category":"雑記","tags":["JSer"],"url":"https://jser.info/2024/01/16/jser-13th/"},"items":[]},{"meta":{"title":"2024-01-21のJS: Astro 4.2、Bun 1.0.24(Bun Shell)、RemixのSPAモード","author":"azu","layout":"post","date":"2024-01-21T02:13:29.882Z","category":"JSer","tags":["Tools","nodejs","React","canvas","editor"],"url":"https://jser.info/2024/01/21/astro-4.2-bun-1.0.24bun-shell-remixspa/"},"items":[{"category":"Headline","title":"Prettier 3.2: Support JSONC and Angular’s ICU expression · Prettier","url":"https://prettier.io/blog/2024/01/12/3.2.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 3.2リリース。\n`jsonc`パーサのサポート、AngularのICU expressionのサポート。","relatedLinks":[]},{"category":"Headline","title":"iDraw.js | iDraw.js","url":"https://idraw.js.org/docs/en-US/","tags":["JavaScript","canvas","library","editor"],"content":"Canvasベースの図形の描画ライブラリとGUIエディタ。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v21.6.0 (Current)","url":"https://nodejs.org/en/blog/release/v21.6.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v21.6.0リリース。\n`net.createConnection`にconnectionに関するイベントの追加、Permission Modelに`--allow-addons`を追加など","relatedLinks":[]},{"category":"Headline","title":"Astro 4.2 | Astro","url":"https://astro.build/blog/astro-420/","tags":["astro","ReleaseNote"],"content":"Astro 4.2リリース。\n実験的なオプションとしてSpeculation Rules APIを使ったPrerenderingをサポート。`injectRoute`やファイルベースのルーティングが衝突した時の新しい優先度ルールをopt-inでサポート。\n`redirectToDefaultLocale`オプションを追加し、デフォルト言語へのリダイレクトを無効化できるように、アクセシビリティルールの追加など。","relatedLinks":[]},{"category":"Headline","title":"Bun v1.0.24 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.24","tags":["Bun","ReleaseNote"],"content":"Bun v1.0.24リリース。\n\nBun Shellというzxのようにシェルスクリプトを扱うための`$`関数の追加、`perf_hooks`の互換性改善など","relatedLinks":[]},{"category":"Article","title":"Migrating from Zod to Valibot: A Comparative Experience | Matthew Kwong","url":"https://mwskwong.com/blog/migrating-from-zod-to-valibot-a-comparative-experience","tags":["JavaScript","article"],"content":"ZodからValibotへの移行してみての比較記事","relatedLinks":[]},{"category":"Article","title":"Remix の SPA モード","url":"https://azukiazusa.dev/blog/remix-spa-mode/","tags":["Remix","article"],"content":"Remixに実験的に実装されているSPAモードについて","relatedLinks":[]},{"category":"Article","title":"React Libraries for 2024","url":"https://www.robinwieruch.de/react-libraries/","tags":["React","article","library"],"content":"Reactアプリケーション開発にカテゴリごとのライブラリやツール紹介","relatedLinks":[]},{"category":"Article","title":"Designing better target sizes","url":"https://ishadeed.com/article/target-size","tags":["CSS","Design","mobile"],"content":"ユーザーがアクションをトリガーするためにクリックやタップする領域であるターゲットサイズについての記事。\nタッチサイズ、Spacing、フィードバック。\n実際のウェブサイトの例として、階層メニューのSafe Areaの三角形をclip-pathで定義する方法、ナビゲーションのUI、プレイヤーのUI、チェックボックスのUIなどについて。","relatedLinks":[]},{"category":"Article","title":"npm in Review: A 2023 Retrospective on Growth, Security, and Quirky Facts - Socket","url":"https://socket.dev/blog/2023-npm-retrospective","tags":["npm","article"],"content":"npmレジストリ上のパッケージの分析記事。\n毎月のダウンロード数、依存関係数が多いパッケージ、ダウンロード数が多いパッケージ、2023年に初めてリリースされてダウンロードが多いパッケージ。\nそのほかには、パッケージサイズが大きいパッケージやメンテナー数が多いパッケージについてなど","relatedLinks":[]},{"category":"Article","title":"Introducing fsx: A modern filesystem API for JavaScript - Human Who Codes","url":"https://humanwhocodes.com/blog/2024/01/fsx-modern-filesystem-api-javascript/","tags":["nodejs","JavaScript","deno","article"],"content":"Node.jsやDenoのFile System APIを抽象化したライブラリ。\nファイル操作のログの取得やテスト用にメモリ上で動くAdapterの実装も含まれている。","relatedLinks":[{"title":"humanwhocodes/fsx: A modern filesystem API for JavaScript","url":"https://github.com/humanwhocodes/fsx"}]},{"category":"SlideVideo","title":"Parsing Javascript - Speaker Deck","url":"https://speakerdeck.com/brn/parsing-javascript","tags":["JavaScript","ECMAScript","slide"],"content":"JavaScript言語のパースについてスライド。\nパースの手法、JSはLL(1)の文法ではあるがBNFレベルでの厳密なパースが難しいため、手書きされることが多いことについて。\n正規表現リテラル/テンプレートリテラル/分割代入などのパースが難しい構文、PreParsingという最適化手法についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"cloudflare/next-on-pages: CLI to build and develop Next.js apps for Cloudflare Pages","url":"https://github.com/cloudflare/next-on-pages","tags":["cloudflare","Next.js"],"content":"Cloudflare PagesでNext.jsのアプリケーションを動かすツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"wevm/vocs: Minimal Documentation Framework, powered by React + Vite.","url":"https://github.com/wevm/vocs","tags":["React","vite","document","Tools"],"content":"ReactとViteを使ったドキュメントサイトフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"penrose/penrose: Create beautiful diagrams just by typing notation in plain text.","url":"https://github.com/penrose/penrose","tags":["diagram","library"],"content":"テキストで宣言的に色々なダイアグラムを描画できるライブラリ。","relatedLinks":[]}]},{"meta":{"title":"2024-01-28のJS: Firefox 122、Deno 1.40、Safari 17.4 Beta","author":"azu","layout":"post","date":"2024-01-28T06:24:28.239Z","category":"JSer","tags":["document","browser","nodejs","TypeScript","Firefox"],"url":"https://jser.info/2024/01/28/firefox-122-deno-1.40-safari-17.4-beta/"},"items":[{"category":"Headline","title":"Release v2.0.0 · volarjs/volar.js","url":"https://github.com/volarjs/volar.js/releases/tag/v2.0.0","tags":["TypeScript","library","ReleaseNote"],"content":"volar v2.0.0リリース。\nコアをTypeScriptに依存しない形へと変更、`@volar/cdn`を非推奨化など","relatedLinks":[]},{"category":"Headline","title":"Firefox 122.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/122.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 122リリース。\n`<select>`の子要素として`<hr>`を許可するように、CSSの`offset-position`と`offset-path`プロパティをデフォルトで有効化。\n`ArrayBuffer.prototype.transfer()`の実装、SVGの`<use>`にData URLを利用できないように変更。\n実験的な機能としてDeclarative shadow DOM、Popover API、Clipboard API、`Intl.Segmenter`の実装など","relatedLinks":[{"title":"Firefox 122 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/122"}]},{"category":"Headline","title":"Release v5.90.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.90.0","tags":["webpack","ReleaseNote"],"content":"webpack v5.90.0リリース。\n`node.{__filename,__dirname}`に`node-module`オプションの追加、バグ修正など","relatedLinks":[]},{"category":"Headline","title":"Deno 1.40: Temporal API","url":"https://deno.com/blog/v1.40","tags":["deno","ReleaseNote"],"content":"Deno v1.40リリース。\nTemporal APIのサポート、`import.meta.filename`/`import.meta.dirname`のサポート、`deno.json`の`imports`の指定方法を改善。\n`window`、`Deno.run()`、`Deno.serveHttp()`、`Deno.metrics()`などの古いAPIを非推奨化など","relatedLinks":[]},{"category":"Headline","title":"Safari 17.4 Beta Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safari-release-notes/safari-17_4-release-notes","tags":["safari","ReleaseNote"],"content":"Safari 17.4 Betaリリース。\nCSSでは、`@scope`のサポート、Block Containersでの`align-content`をサポート。\nHTMLでは、`<select>`の中での`<hr>`のサポート。`<input type=checkbox switch>`のサポート。\nJSでは、`Promise.withResolvers`、`ArrayBuffer.prototype.transfer`、`Object.groupBy`のサポート。\niOSでVP8/VP9/WebMをサポート、Full Screen APIをサポート。","relatedLinks":[]},{"category":"Headline","title":"Release v0.20.0 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.20.0","tags":["esbuild","ReleaseNote"],"content":"esbuild v0.20.0リリース。\nDeno 1.40に対応、`node_modules`のパッケージないから探索するファイルの拡張子の優先順位を変更など","relatedLinks":[]},{"category":"Headline","title":"QuickJS Javascript Engine","url":"https://bellard.org/quickjs/","tags":["JavaScript","ReleaseNote"],"content":"QuickJSのES2023サポート。\n\n- ES2022のTop-Level await\n- ES2023のChange Array by copy、`Array.prototype.{findLast, findLastIndex}`\n- ES2024の`Object.groupBy`、`Promise.withResolvers`","relatedLinks":[]},{"category":"Headline","title":"Announcing AdonisJS v6","url":"https://adonisjs.com/blog/adonisjs-v6-announcement","tags":["JavaScript","nodejs","ReleaseNote","server"],"content":"AdonisJS v6リリース。\nESMへの移行、Vite integrationのサポート。\nVineJSというバリデーションライブラリの作成、テストフレームワークやテンプレートエンジンなどのコアをパッケージとして切り出して利用できるようになるなど","relatedLinks":[]},{"category":"SlideVideo","title":"Next.js App Router Caching: Explained! - YouTube","url":"https://www.youtube.com/watch?v=VBlSe8tvg4U","tags":["Next.js","video","JavaScript"],"content":"Next.js App Routerでのキャッシュがどのように動くかについての動画。\nPages RouterとApp Routerのデフォルトのキャッシュの挙動の違い、`noCache()`/`cache()`でのキャッシュするかの制御、`revalidateTag()`での再検証。\n`useOptimistic()`やJavaScriptがない時の動作についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"The AHA Stack | AHA","url":"https://ahastack.dev/","tags":["JavaScript","HTML","document"],"content":"Astro x Htmx x Alpine.jsのAHA Stackについてのサイト","relatedLinks":[]},{"category":"WebsiteDocument","title":"Platform Tilt - Mozilla","url":"https://mozilla.github.io/platform-tilt/","tags":["browser","Mozilla","apple","google","Microsoft","document"],"content":"iOS/Android/Windowsなどのプラットフォーム上でのブラウザの格差に繋がる制約などについてまとめたサイト","relatedLinks":[]},{"category":"WebsiteDocument","title":"Introduction","url":"https://bentocache.dev/docs/introduction","tags":["nodejs","JavaScript","library"],"content":"AdonisJSから切り出されたキャッシュライブラリ。\nDriverでRedisなどのバックエンドプロバイダーの指定、Multi Tierによるキャッシュサイズに応じた多層化、Cache stampedeの対策などを実装している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"chrisguttandin/worker-timers: A replacement for setInterval() and setTimeout() which works in unfocused windows.","url":"https://github.com/chrisguttandin/worker-timers","tags":["browser","webworker","JavaScript","library"],"content":"ブラウザはタブがアクティブではない場合、intervalとtimeoutの最小値を強制的に変更する。\nWeb Workerではこの制限がないことを利用して、制限のない`setTimeout`と`setInterval`を提供するライブラリ","relatedLinks":[]}]},{"meta":{"title":"2024-02-05のJS: TypeScript 5.4 Beta、Learn Testing/Performance、Interop 2024","author":"azu","layout":"post","date":"2024-02-05T07:09:35.304Z","category":"JSer","tags":["browser","tutorial","WebPlatformAPI","nodejs","Tools"],"url":"https://jser.info/2024/02/05/typescript-5.4-beta-learn-testingperformance-interop-2024/"},"items":[{"category":"Headline","title":"Release v3.10.0 · nuxt/nuxt","url":"https://github.com/nuxt/nuxt/releases/tag/v3.10.0","tags":["Vue","library","ReleaseNote"],"content":"Nuxt.js v3.10.0リリース。\n実験的なオプションとして`sharedPrerenderData`を追加、`useId()`がSSR時にuniqueなIDを返すことを保証するように、アンチパターンの検出の強化など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.4 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-4-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.4 Betaリリース。\nクロージャーにおけるNarrowing結果の改善、`NoInfer` Utility Typeの追加。\nES2024の`Object.groupBy`/`Map.groupBy`をサポート、Import Attributesのサポート。\n`target: \"ES3\"`や`out`オプションなどを非推奨化など","relatedLinks":[{"title":"Feedback: 5.0 deprecations · Issue #51909 · microsoft/TypeScript","url":"https://github.com/microsoft/TypeScript/issues/51909"}]},{"category":"Headline","title":"Release v9.0.1 · typicode/husky","url":"https://github.com/typicode/husky/releases/tag/v9.0.1","tags":["GIt","JavaScript","Tools","ReleaseNote"],"content":"husky v9.0.1リリース。\n`husky init`でセットアップを簡略化、git hookの書き方を単純化など","relatedLinks":[]},{"category":"Article","title":"CodeMirror v6によるZennのMarkdownエディタの作り方","url":"https://zenn.dev/team_zenn/articles/zenn-markdown-editor-by-cm6","tags":["JavaScript","editor","article","React"],"content":"CodeMirror v6でのMarkdownエディタの実装方法について","relatedLinks":[]},{"category":"Article","title":"SameSite属性とCSRFとHSTS - Cookieの基礎知識からブラウザごとのエッジケースまでおさらいする - Flatt Security Blog","url":"https://blog.flatt.tech/entry/samesite_csrf_hsts","tags":["HTTP","browser","security","article"],"content":"Cookieの属性について。\nSecure/HttpOnly/Domain/Path/SameSite属性、`__Secure-`/`__Host-` prefix、SameSite属性の挙動やブラウザのデフォルトの動作について。","relatedLinks":[]},{"category":"Article","title":"Interop 2024がスタート | フロントエンドBlog | ミツエーリンクス","url":"https://www.mitsue.co.jp/knowledge/blog/frontend/202402/02_1152.html","tags":["browser","WebPlatformAPI","article"],"content":"ブラウザベンダーが注力して相互運用性に取り組むInterop 2024について。","relatedLinks":[]},{"category":"Article","title":"Node.jsで機能やパッケージの非推奨メッセージを通知する方法 | Web Scratch","url":"https://efcl.info/2024/02/04/emitwarning/","tags":["npm","nodejs","article"],"content":"npmやNode.jsで非推奨のメッセージを通知する方法について。\nパッケージの非推奨化、コードレベルの非推奨化、実行時の非推奨化について","relatedLinks":[]},{"category":"Article","title":"Import attributes · V8","url":"https://v8.dev/features/import-attributes","tags":["ECMAScript","article"],"content":"ECMAScript Proposal Stage 3のImport attributesについて。\n`import ... from .... assert { type } `はセマンティクス的に問題があったため、`import ... from .... with { type }`へと変更された。","relatedLinks":[]},{"category":"Article","title":"Learn Testing  |  web.dev","url":"https://web.dev/learn/testing","tags":["testing","tutorial","browser","nodejs"],"content":"自動テストについて学ぶチュートリアル。\nブラウザやNode.jsでのテスト、テストの種類、コンポーネントテスト、静的解析ツールなどについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Learn Performance  |  web.dev","url":"https://web.dev/learn/performance?hl=en","tags":["performance","tutorial","browser"],"content":"ブラウザのパフォーマンスについてのチュートリアル。\nリソースロードの最適化、JavaScriptの最適化、プリロード、Web Workerについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"Tappy - Yahoo!デベロッパーネットワーク","url":"https://tappy.yahoo.co.jp/","tags":["webservice","Tools","mobile","accessibility"],"content":"ウェブサイトのボタンなどのタップ成功率を計算して表示してくれるツール。\nタップミスが起きやすいボタンなのかの調査に利用できる。","relatedLinks":[{"title":"スマホのタップ操作の成功率を算出するモデル ～ UIデザインにおけるユーザビリティの推定 - Yahoo! JAPAN Tech Blog","url":"https://techblog.yahoo.co.jp/entry/2021120930233778/"}]},{"category":"WebsiteDocument","title":"Compression Streams are now supported on all browsers  |  Blog  |  web.dev","url":"https://web.dev/blog/compressionstreams?hl=en","tags":["JavaScript","browser","WebPlatformAPI"],"content":"gzipの圧縮/解凍するCompressionStreamが全てのブラウザで利用できるようになった。","relatedLinks":[]}]},{"meta":{"title":"2024-02-12のJS: jQuery 4.0.0、Storybook 8 Beta、Vite 5.1(Runtime API)","author":"azu","layout":"post","date":"2024-02-12T03:12:33.431Z","category":"JSer","tags":["vite","Tools","jQuery","Rust","Design"],"url":"https://jser.info/2024/02/12/jquery-4.0.0-storybook-8-beta-vite-5.1runtime-api/"},"items":[{"category":"Headline","title":"jQuery 4.0.0 BETA! | Official jQuery Blog","url":"https://blog.jquery.com/2024/02/06/jquery-4-0-0-beta/","tags":["jQuery","ReleaseNote"],"content":"jQuery 4.0.0 Betaリリース。\nIE 10以下のサポートを終了、非推奨のAPIを削除、jQuery prototypeオブジェクトからArrayメソッドを削除、focusとblurのイベント順を上書きしないように変更。\n`FormData`のサポート、自動的にJSONPへfallbackする挙動を削除、コードベースをAMDからESMへの移行、Trusted Typesのサポートなど。\nIE 11のサポートは、jQuery 5で削除される予定。","relatedLinks":[]},{"category":"Headline","title":"Announcing Rsbuild v0.4 - Rsbuild","url":"https://deploy-preview-1520--rsbuild.netlify.app/community/releases/v0-4","tags":["JavaScript","Rust","Tools","ReleaseNote"],"content":"Rsbuild v0.4リリース。\nModule Federationをファーストクラスサポート、プラグインのHookの順番を制御する`order`オプションを追加、IEの問題に関するpostcss-flexbugs-fixesを削除など","relatedLinks":[]},{"category":"Headline","title":"Storybook 8 Beta","url":"https://storybook.js.org/blog/storybook-8-beta/","tags":["JavaScript","Design","debug","Tools","ReleaseNote"],"content":"Storybook 8 Betaリリース。\nデフォルトのコンパイラをBabelからSWCに変更、モバイルUIの改善、テストパッケージを`@storybook/test`に統合、Node.js 16のサポートを終了、Yarn v1のサポートを終了など","relatedLinks":[]},{"category":"Headline","title":"Vite 5.1 is out! | Vite","url":"https://vitejs.dev/blog/announcing-vite5-1.html","tags":["vite","ReleaseNote"],"content":"Vite 5.1リリース。\n実験的なAPIとしてVite Runtime APIの追加、`.css?url`のサポート改善、循環インポートでのHMRの改善、パフォーマンスの改善など","relatedLinks":[]},{"category":"Headline","title":"CheerpJ 3.0 now generally available: Run any Java Application on Modern Browsers CheerpJ 3.0 now available: run any Java on modern browsers","url":"https://cheerpj.com/cheerpj-3-now-generally-available/","tags":["Java","JavaScript","ReleaseNote"],"content":"ブラウザ上でJavaアプリケーションを動かすCheerpJ 3.0リリース。\n今まではAOT Java Compilerだったが、3.0ではWebAssemblyベースのJVM代替実装となってる。","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v4.0.0","tags":["JavaScript","server","library","ReleaseNote"],"content":"Hono v4.0.0リリース。\nStatic Site Generation(SSG)のサポート、クライアントサイドで動く`hono/jsx/dom`の追加など。\n併せてファイルベースのルーティングなどを持つフレームワークであるhonoxを公開している。","relatedLinks":[{"title":"honojs/honox: HonoX","url":"https://github.com/honojs/honox"}]},{"category":"Article","title":"Hot Module Replacement is Easy - Bjorn Lu","url":"https://bjornlu.com/blog/hot-module-replacement-is-easy","tags":["vite","article"],"content":"ViteのHot Module Replacement(HMR)の実装について。\nHMR APIの解説、HMRのライフサイクル、HMR propagation、HMRのクライアント実装についてなど","relatedLinks":[]},{"category":"Article","title":"From many to one: Moving our JavaScript code into a monorepo | Aha! software","url":"https://www.aha.io/engineering/articles/monorepo","tags":["monorepo","JavaScript","article"],"content":"Gitの履歴を保ちながら、JavaScriptのmonorepo作る話。\nNx + pnpm、pnpm workspaces、Turborepo + pnpmの比較、Turborepoを選択した理由などについて","relatedLinks":[]},{"category":"Article","title":"Node.js Community Debate Intensifies Over Enabling Corepack by Default and Potentially Unbundling npm - Socket","url":"https://socket.dev/blog/node-community-debates-enabling-corepack-unbundling-npm","tags":["nodejs","npm","discussion","article"],"content":"Node.jsのcorepackをデフォルト有効化した場合に、`npm`をNode.jsにバンドルするかどうかの議論について。","relatedLinks":[]},{"category":"SlideVideo","title":"FOSDEM 2024 - Fast JavaScript with Data-Oriented Design","url":"https://fosdem.org/2024/schedule/event/fosdem-2024-2773-fast-javascript-with-data-oriented-design/","tags":["JavaScript","performance","video","slide"],"content":"Firefox Profilerのパフォーマンスを改善する話。\nデータを大量に扱う必要があるアプリケーションで、どんなデータが来ても高速に処理できるようするかについて。\nデータがどのようにメモリに確保されるかのメモリレイアウトを意識したデータ指向設計での改善方法について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"awslabs/llrt: LLRT (Low Latency Runtime) is an experimental, lightweight JavaScript runtime designed to address the growing demand for fast and efficient Serverless applications.","url":"https://github.com/awslabs/llrt","tags":["JavaScript","aws","library"],"content":"AWS Lambdaで利用できるQuickJSベースのJavaScript Runtime。\nサイズと起動速度を目的にしていて、Node.jsのコアモジュールを部分的に実装している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"StellateHQ/fuse: Fuse: The fastest way to build and query great APIs with TypeScript","url":"https://github.com/StellateHQ/fuse","tags":["GraphQL","TypeScript","library"],"content":"TypeScriptのコードベースでGraphQL APIの作成とクライアントを生成できるツールキット。","relatedLinks":[]}]},{"meta":{"title":"2024-02-20のJS: ES2024 RC、typescript-eslint v7、React Compiler","author":"azu","layout":"post","date":"2024-02-20T06:26:06.640Z","category":"JSer","tags":["TypeScript","ECMAScript","React","nodejs","HTTP"],"url":"https://jser.info/2024/02/20/es2024-rc-typescript-eslint-v7-react-compiler/"},"items":[{"category":"Headline","title":"Release Release v0.28.0 · axios/axios","url":"https://github.com/axios/axios/releases/tag/v0.28.0","tags":["JavaScript","HTTP","library","security","ReleaseNote"],"content":"Axios v0.28.0リリース。\nAxios v1.6.0で修正されたCSRFトークンの問題をバックポート。その他にもv1.x系での修正をバックポートしている。","relatedLinks":[]},{"category":"Headline","title":"Announcing typescript-eslint v7 | typescript-eslint","url":"https://typescript-eslint.io/blog/announcing-typescript-eslint-v7/","tags":["TypeScript","ESLint","ReleaseNote"],"content":"typescript-eslint v7リリース。\nNode.js 16のサポート終了、ESLint Flat Configをサポートする`typescript-eslint`パッケージを追加。","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2024-02 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2024/02/15/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2024年2月のTC39ミーティングでのProposalの変更まとめ。\nStage 2.7というステージが新しく追加された。\n`ArrayBuffer.prototype.transfer`はStage 4となりES2024に含まれることが決まった","relatedLinks":[]},{"category":"Headline","title":"Release ES2024 Candidate February 2024 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2024-candidate-2024-02","tags":["ECMAScript","spec","ReleaseNote"],"content":"ECMAScript 2024候補のリリース。\n`ArrayBuffer.prototype.resize`/`ArrayBuffer.prototype.transfer`、RegExpの`v`フラグの追加。\n`Promise.withResolvers`、`Object.groupBy`/`Map.groupBy`の追加。\n`Atomics.waitAsync`、`String.prototype.isWellFormed`/`String.prototype.toWellFormed`の追加など","relatedLinks":[{"title":"Editorial: Describe changes in ES2024 by bakkot · Pull Request #3282 · tc39/ecma262","url":"https://github.com/tc39/ecma262/pull/3282"}]},{"category":"Headline","title":"Bun v1.0.27 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.27","tags":["Bun","ReleaseNote"],"content":"Bun v1.0.27リリース。\n`Response`がAsync generatorとNode.jsの`Readable`をサポート、Bun Shellの改善など。\nまた、Bun Shellのエラー時のexit codeはv1.1では`1`となる変更が入る予定。","relatedLinks":[]},{"category":"Headline","title":"htmz - a low power tool for html","url":"http://leanrada.com/htmz/","tags":["HTML","JavaScript","library"],"content":"htmxのようにHTMLで宣言的にAjax的な表示を行う小さなスニペット。\n`<form action=\"/default#my-target\" target=htmz>`と指定しリクエスト結果を用意した`<iframe name=htmz>`に表示する。\niframeの描画結果を`#my-target`の要素と置換する仕組みなっている。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Wednesday February 14 2024 Security Releases","url":"https://nodejs.org/en/blog/vulnerability/february-2024-security-releases","tags":["nodejs","secu","ReleaseNote"],"content":"Node.jsのセキュリティアップデートとしてNode.js 20.x, 18.x, 21.xをそれぞれ更新。\nOpenSSLの更新、Linuxのcapabilitiesに関するバグの修正、細工したHTTPリクエストでのDoSに関する問題、パーミッションモデルの問題の修正など","relatedLinks":[]},{"category":"Headline","title":"Redwood v7.0.0 Upgrade Guide - Announcements / Releases and Upgrade Guides - RedwoodJS Community","url":"https://community.redwoodjs.com/t/redwood-v7-0-0-upgrade-guide/5713","tags":["nodejs","library","ReleaseNote"],"content":"Redwood v7リリース。\nNode.js 18のサポート終了、`prop-types`パッケージの依存を削除、dbAuthのセキュリティ改善に伴う破壊的な変更など","relatedLinks":[{"title":"Release v7.0.0 · redwoodjs/redwood","url":"https://github.com/redwoodjs/redwood/releases/tag/v7.0.0"}]},{"category":"Article","title":"React Labs: What We&#039;ve Been Working On – February 2024 – React","url":"https://react.dev/blog/2024/02/15/react-labs-what-we-have-been-working-on-february-2024","tags":["React","article"],"content":"React Compiler(aka. React Forgot)がinstagramの本番環境で利用され、今後数ヶ月以内に公開される予定。\nまた、次のメジャーバージョンであるReact 19に必要な機能が揃ったため、公開の準備を進めていくという話","relatedLinks":[]},{"category":"Article","title":"A novel technique for creating ergonomic and tree-shakable TypeScript libraries","url":"https://softwaremill.com/a-novel-technique-for-creating-ergonomic-and-tree-shakable-typescript-libraries/","tags":["JavaScript","TypeScript","article"],"content":"必要なメソッドを集める初期化とProxyオブジェクトを使うことで、zodのようにメソッドチェーンが可能でかつTree Shakingも可能なライブラリを作る方法について。\n小さなバリデーションライブラリを例に作り方や仕組みについてを解説してる。","relatedLinks":[{"title":"mieszkosabo/correttore","url":"https://github.com/mieszkosabo/correttore"}]},{"category":"SlideVideo","title":"JollyUI","url":"https://www.jollyui.dev/","tags":["React","library"],"content":"React Ariaを使ったshadcn/ui互換を目指すコンポーネント集","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Tempo • Dates by FormKit","url":"https://tempo.formkit.com/","tags":["JavaScript","ECMAScript","i18n","library"],"content":"Intlオブジェクトベースの日付操作ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"kolodny/safetest","url":"https://github.com/kolodny/safetest?tab=readme-ov-file","tags":["testing","browser","E2E","library"],"content":"Netflixで利用しているコンポーネントフレームワーク。\nPlaywright、Vitest/Jestなどのテストフレームワーク、ReactやVueなどのUIフレームワークを組み合わたテストを行う。\nアプリケーションレベルのDIコンテナやテストのセットアップをコードで柔軟にした状態でPlaywrightを使ったテストを行う。","relatedLinks":[{"title":"Introducing SafeTest: A Novel Approach to Front End Testing | by Netflix Technology Blog | Feb, 2024 | Netflix TechBlog","url":"https://netflixtechblog.com/introducing-safetest-a-novel-approach-to-front-end-testing-37f9f88c152d"}]},{"category":"SoftwareLibrary","title":"pashak09/ts-expect-error-validator: Command-line tool to validate expected TypeScript errors","url":"https://github.com/pashak09/ts-expect-error-validator","tags":["TypeScript","test","Tools"],"content":"`@ts-expect-error`には指定したエラーコードだけを無視する機能はないため、`@ts-expect-error [Code]`のコメントで指定したエラーが起きるかをチェックできるツール。","relatedLinks":[]},{"category":"Book","title":"Next.js超入門 - 秀和システム あなたの学びをサポート！","url":"https://www.shuwasystem.co.jp/book/9784798071299.html","tags":["Next.js","ebook"],"content":"Next.jsの入門書","relatedLinks":[]}]},{"meta":{"title":"2024-02-27のJS: Firefox 123、Remix 2.7.0(Remix Vite is Stable)、2023年のNode.jsまとめ","author":"azu","layout":"post","date":"2024-02-27T06:40:44.988Z","category":"JSer","tags":["nodejs","TypeScript","React","tool","Electron"],"url":"https://jser.info/2024/02/27/firefox-123-remix-2.7.0remix-vite-is-stable-2023node.js/"},"items":[{"category":"Headline","title":"Release v0.25.0 · nodejs/corepack","url":"https://github.com/nodejs/corepack/releases/tag/v0.25.0","tags":["nodejs","tool","ReleaseNote"],"content":"corepack v0.25.0リリース。\n内部的にNode.jsのBuilt-in `fetch`を使うように、`corepack cache {clean,clear}`を追加。\n`COREPACK_ENABLE_UNSAFE_CUSTOM_URLS=1`のフラグが有効な場合に、`packageManager`にカスタムURLを指定できるように。\n`COREPACK_ENABLE_DOWNLOAD_PROMPT=1`でキャッシュにないpackage managerをダウンロードする際にプロンプトを表示できるように。","relatedLinks":[]},{"category":"Headline","title":"Electron 29.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-29-0","tags":["Electron","ReleaseNote"],"content":"Electron 29.0.0リリース。\nChromium 122, Node.js 20.9.0, V8 12.2へのアップグレード。\nrenderer processから利用できる`webUtils`モジュールの追加、`ipcRenderer`そのものを`contextBridge`で公開できないように変更など","relatedLinks":[{"title":"Release electron v29.0.0 · electron/electron","url":"https://github.com/electron/electron/releases/tag/v29.0.0"}]},{"category":"Headline","title":"Firefox 123.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/123.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 123リリース。\n`<template>`要素が`shadowrootmode`属性をサポート、`Date.parse()`の互換性向上、103 Early Hintsの`rel=preload`をサポート。\n実験的な機能としてWeb Codecs APIをサポートなど","relatedLinks":[{"title":"Firefox 123 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/123"}]},{"category":"Headline","title":"Announcing TypeScript 5.4 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-4-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.4 RCリリース。\nクロージャーにおけるNarrowing結果の改善、`NoInfer` Utility Typeの追加。\nES2024の`Object.groupBy`/`Map.groupBy`をサポート、Import Attributesのサポート。\n`target: \"ES3\"`や`out`オプションなどを非推奨化されたオプションは5.5で削除される予定。","relatedLinks":[{"title":"Feedback: 5.0 deprecations · Issue #51909 · microsoft/TypeScript","url":"https://github.com/microsoft/TypeScript/issues/51909"}]},{"category":"Headline","title":"Release v1.24.0 · parcel-bundler/lightningcss","url":"https://github.com/parcel-bundler/lightningcss/releases/tag/v1.24.0","tags":["CSS","Tools","ReleaseNote"],"content":"Lightning CSS v1.24.0リリース。\n`light-dark()`のfallbackに対応、CSS system colorsをサポート、Custom Propertiesと`@keyframes`のdedupeに対応など","relatedLinks":[]},{"category":"Headline","title":"Bun v1.0.29 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.29","tags":["Bun","ReleaseNote"],"content":"Bun v1.0.29リリース。\n`string-width`互換APIを提供する`Bun.stringWidth(string)`を追加、Bun Shellで`2>&1`と`&>`をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Deno 1.41: smaller deno compile binaries","url":"https://deno.com/blog/v1.41","tags":["deno","ReleaseNote"],"content":"Deno v1.41リリース。\n`deno compile`が生成するバイナリサイズの削減、Linux ARM64のサポート、Node.js互換性の改善など","relatedLinks":[{"title":"Release v1.41.0 · denoland/deno","url":"https://github.com/denoland/deno/releases/tag/v1.41.0"}]},{"category":"Headline","title":"facebook/react-strict-dom: React Strict DOM (RSD) is a subset of React DOM, imperative DOM, and CSS that supports web and native targets","url":"https://github.com/facebook/react-strict-dom","tags":["React","DOM","iOS","Android","library"],"content":"ウェブとネイティブのサポートを目的とするReact DOMのサブセットとなる実装","relatedLinks":[]},{"category":"Headline","title":"Remix Vite is Now Stable | Remix","url":"https://remix.run/blog/remix-vite-stable","tags":["Remix","vite","ReleaseNote"],"content":"Remix 2.7.0リリース。\nSPAモードがStableに、`base`オプションのサポート、Remix ViteがCloudflare Pagesをサポート、Server Bundlesのサポート。\nクライアントコードとサーバコードを分離する仕組みとして`.server/`をサポート、`vite-env-only`でサーバのみから利用できるようにマークできるように。\nVite 5.1.0でサポートされた`.css?url`に対応、ビルド結果の出力とViteの互換性の改善など","relatedLinks":[{"title":"Remix 2.7で安定版となったCloudflare PagesのVite対応の実現方法を読み解く","url":"https://zenn.dev/chimame/articles/e5bf3a18b7d4de"}]},{"category":"Headline","title":"方能CDN - 合作伙伴","url":"https://funnull.com/Partner/","tags":["JavaScript","polyfill","news","webservice"],"content":"https://polyfill.io/ はFunnull CDN(方能CDN)を運営するFunnull(南京妙彩文化传播有限公司)に売却され、2024-02-24以降の運用はFunnullが行う。","relatedLinks":[{"title":"Jake on X: ","url":"https://twitter.com/JakeDChampion/status/1761315227008643367"},{"title":"Polyfill.ioが中国企業に売却　背景と対応策は？ - ろぼいんブログ","url":"https://roboin.io/article/2024/02/26/polyfill-io-sells-to-chinese-company-what-you-need-to-know/"}]},{"category":"Article","title":"JSDoc as an alternative TypeScript syntax","url":"https://alexharri.com/blog/jsdoc-as-an-alternative-typescript-syntax","tags":["TypeScript","article"],"content":"TypeScriptをJSDocのchekerとして利用する話。\nTypeScriptでの型定義とJSDocでの型定義の書き方を比較して紹介している。","relatedLinks":[]},{"category":"Article","title":"TanStack Router（&amp; Query）はSPA開発で求めていたものだった✨【Reactのルーティングとデータ取得】","url":"https://zenn.dev/aishift/articles/ad1744836509dd","tags":["React","JavaScript","article"],"content":"TanStack Routerの紹介記事","relatedLinks":[]},{"category":"Article","title":"Using localStorage in Modern Applications - A Comprehensive Guide | RxDB - JavaScript Database","url":"https://rxdb.info/articles/localstorage.html","tags":["JavaScript","article"],"content":"localStorage APIについて。\nlocalStorageは同期的なAPIでサイズや保存できるデータなどに制限があるが、一方で小さな値は高速に読み書きできる。\nどのような場合に利用する/しないか、IndexedDBなどとの比較","relatedLinks":[]},{"category":"Article","title":"Node.js 2023 Year in An Article","url":"https://blog.rafaelgss.dev/nodejs-2023-year-in-review","tags":["nodejs","article"],"content":"2023年のNode.jsについて。\nNode.jsのリリース、CITGMのエコシステムのテスト、Node.jsのバイナリサイズや増えた依存関係、QUIC/OpenSSL 3.0.xのコスト、パフォーマンスの改善。\nPermission Modelによる権限モデル、セキュリティリリース、`.env`やWebSocket clientなどの新しい機能について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"fabiospampinato/fast-string-width: A fast function for calculating the visual width of a string once printed to the terminal.","url":"https://github.com/fabiospampinato/fast-string-width/tree/main","tags":["JavaScript","library"],"content":"`Intl.Segmenter`を使わない`string-width`の実装ライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"unadlib/mutability: A JavaScript library for transactional mutable updates","url":"https://github.com/unadlib/mutability","tags":["JavaScript","library"],"content":"Immer的なAPIを提供するmutativeを使い、トランザクションロールバック機能を持ったオブジェクトの更新を行うライブラリ。\nオブジェクトの更新処理中に例外が発生した場合は、途中までのオブジェクトの更新は破棄できる。","relatedLinks":[{"title":"unadlib/mutative: Efficient immutable updates, 2-6x faster than naive handcrafted reducer, and more than 10x faster than Immer.","url":"https://github.com/unadlib/mutative"}]},{"category":"Book","title":"実践Next.js —— App Routerで進化するWebアプリ開発：書籍案内｜技術評論社","url":"https://gihyo.jp/book/2024/978-4-297-14061-8","tags":["Next.js","book"],"content":"2024年3月16日発売\nNext.jsについての書籍","relatedLinks":[]}]},{"meta":{"title":"2024-03-05のJS: Parcel v2.12.0、`polyfill.io`の代用、express 4.18.3","author":"azu","layout":"post","date":"2024-03-05T03:01:03.666Z","category":"JSer","tags":["Tools","webservice","nodejs","babel","bundler"],"url":"https://jser.info/2024/03/05/parcel-v2.12.0-polyfill.io-express-4.18.3/"},"items":[{"category":"Headline","title":"7.24.0 Released: Decorator updates and JSON modules imports · Babel","url":"https://babeljs.io/blog/2024/02/28/7.24.0","tags":["babel","ReleaseNote"],"content":"Babel v7.24.0リリース。\nDecoratorの新しい仕様に対応、JSON Modulesのimportに対応する`\"@babel/plugin-proposal-json-modules\"`を追加。\nHermesベースのFlowパーサを利用する`experimental_useHermesParser`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Parcel v2.12.0","url":"https://parceljs.org/blog/v2-12-0/","tags":["JavaScript","bundler","ReleaseNote"],"content":"Parcel v2.12.0リリース。\nImport Attributesを使ったmacroに対応、ブラウザ上で動作するREPLを公開、bundleにもLightning CSSを使うように変更。\nメモリ使用量を52%改善、書き込みのパフォーマンスの改善など","relatedLinks":[]},{"category":"Headline","title":"New options for Polyfill.io users - General - Fastly Community","url":"https://community.fastly.com/t/new-options-for-polyfill-io-users/2540","tags":["webservice","polyfill","news","JavaScript"],"content":"Fastlyが`polyfill.io`の代替となる`polyfill-fastly.net`と`polyfill-fastly.io`を公開した。\n`polyfill.io`はFunnull CDNに買収され運営者が変わったため代替手段として提供する目的","relatedLinks":[{"title":"FUNNULL CDN - Partners","url":"https://funnull.com/Partner/"}]},{"category":"Headline","title":"polyfill.io now available on cdnjs: reduce your supply chain risk | The Cloudflare Blog","url":"https://blog.cloudflare.com/polyfill-io-now-available-on-cdnjs-reduce-your-supply-chain-risk","tags":["cloudflare","cdn","news"],"content":"Cloudflareが polyfill.io の代替CDNをcdnjs上に公開した","relatedLinks":[{"title":"cdnjs.cloudflare.com/polyfill","url":"https://cdnjs.cloudflare.com/polyfill/"}]},{"category":"Headline","title":"Release 4.18.3 · expressjs/express","url":"https://github.com/expressjs/express/releases/tag/4.18.3","tags":["express","nodejs","ReleaseNote"],"content":"express 4.18.3リリース。\nExpressの新しいTechnical Committeeでの初めてのリリース。\nexpressの開発を再開するための話し合いをExpress Forward Initiativeで行っていて、このプロセスを進める目的のリリースとなっている。","relatedLinks":[{"title":"Release 4.18.3 by UlisesGascon · Pull Request #5505 · expressjs/express","url":"https://github.com/expressjs/express/pull/5505"},{"title":"Express Forward · Issue #160 · expressjs/discussions","url":"https://github.com/expressjs/discussions/issues/160"},{"title":"Express Forward Initiative · Issue #167 · expressjs/discussions","url":"https://github.com/expressjs/discussions/issues/167"}]},{"category":"Headline","title":"Bun v1.0.30 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.30","tags":["Bun","ReleaseNote"],"content":"Bun v1.0.30リリース。\n`exports`フィールドのパッケージ解決の条件を指定する`--conditions`フラグの追加、`expect.assertions()`/`expect.hasAssertions()`のサポートなど","relatedLinks":[{"title":"Command-line API | Node.js v21.6.2 Documentation","url":"https://nodejs.org/api/cli.html#-c-condition---conditionscondition"}]},{"category":"Headline","title":"ESLint v8.57.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2024/02/eslint-v8.57.0-released/","tags":["ESLint","reel"],"content":"ESLint v8.57.0リリース。\n`eslint.config.mjs`と`eslint.config.cjs`のサポート、`loadESLint()`という`FlatESLint`と`LegacyESLint`の相互運用性のためのAPIを追加など","relatedLinks":[]},{"category":"Article","title":"Million Lint is in public beta | Million.js","url":"https://million.dev/blog/lint","tags":["React","performance","Tools","VSCode","article"],"content":"React向けのレンダリングパフォーマンスの分析ツール。\nプロファイルを仕込みレンダリング回数や実行時間などを回収し、VSCode拡張を使いコード上に問題を表示する。\n問題の改善方法については有料のLint++というサービスを利用する","relatedLinks":[]},{"category":"Article","title":"Next.js vs. Remix - A Developer&#039;s Dilemma | Saeloun Blog","url":"https://blog.saeloun.com/2024/02/21/next.js-vs-remix/","tags":["Next.js","Remix","article"],"content":"Next.jsとRemixの比較。\nルーティング、データ取得、mutate、エラー処理、コミュニティ、学習曲線、価格などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"MDN Curriculum","url":"https://developer.mozilla.org/en-US/curriculum/","tags":["HTML","CSS","JavaScript","tutorial","accessibility"],"content":"MDNのフロントエンドカリキュラム。\nソフトスキル的なものから、HTML/CSS/JavaScriptや開発で必要な一般的な知識などのリソースをまとめたもの","relatedLinks":[]},{"category":"WebsiteDocument","title":"wxt-dev/wxt: ⚡ Next-gen Web Extension Framework","url":"https://github.com/wxt-dev/wxt?tab=readme-ov-file","tags":["browser","Extension","Tools"],"content":"Viteベースのブラウザ拡張開発フレームワーク。","relatedLinks":[]},{"category":"WebsiteDocument","title":"JSR: the JavaScript Registry","url":"https://jsr.io/","tags":["JavaScript","deno","nodejs","webservice"],"content":"TypeScriptのコードのままpushできるDeno向けのパッケージレジストリサービス。\nnpm registryとしても振る舞うことで、npmなどからも利用できるようになっている。\nOIDC ID tokenに対応し、GitHub Actionsからパッケージを公開できるようになっている。","relatedLinks":[{"title":"Introducing JSR - the JavaScript Registry","url":"https://deno.com/blog/jsr_open_beta"}]},{"category":"SoftwareLibrary","title":"electric-sql/pglite: Lightweight Postgres packaged as WASM into a TypeScript library for the browser, Node.js, Bun and Deno","url":"https://github.com/electric-sql/pglite","tags":["PostgreSQL","WebAssembly","library"],"content":"PostgresのWebAssemblyビルド。\nブラウザ上でPostgresを動かせる。InMemory/ファイルシステム/IndexedDBにデータを保存できる。","relatedLinks":[]}]},{"meta":{"title":"2024-03-12のJS: Tailwind CSS v4.0 alpha、TypeScript 5.4、Speedometer 3.0","author":"azu","layout":"post","date":"2024-03-12T02:18:32.384Z","category":"JSer","tags":["nodejs","TypeScript","React","browser","game"],"url":"https://jser.info/2024/03/12/tailwind-css-v4.0-alpha-typescript-5.4-speedometer-3.0/"},"items":[{"category":"Headline","title":"Release v8.0.0 · pixijs/pixijs","url":"https://github.com/pixijs/pixijs/releases/tag/v8.0.0","tags":["JavaScript","game","library","ReleaseNote"],"content":"PixiJS v8.0.0リリース。\n`pixi.js`の単体のパッケージに統合、初期化が非同期へと変更、Graphiscs APIの変更など","relatedLinks":[{"title":"v8 Migration Guide | PixiJS","url":"https://pixijs.com/guides/migrations/v8"}]},{"category":"Headline","title":"Node.js — Node v21.7.0 (Current)","url":"https://nodejs.org/en/blog/release/v21.7.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v21.7.0リリース。\n`util.styleText(format, text)`関数を追加、`process.loadEnvFile(path)`と`util.parseEnv(content)`を追加。\n`.env`で複数行の値をサポート、`node:sea`にAPIを追加、`node:vm`に`importModuleDynamically`オプションを追加、`crypto.hash()`の追加など","relatedLinks":[]},{"category":"Headline","title":"Open-sourcing our progress on Tailwind CSS v4.0 - Tailwind CSS","url":"https://tailwindcss.com/blog/tailwindcss-v4-alpha","tags":["CSS","ReleaseNote"],"content":"Tailwind CSS v4 alphaリリース。\nOxideというRustで書かれたエンジンを追加、Lightning CSSを組み込むように変更。\nv4のロードマップについてなど","relatedLinks":[]},{"category":"Headline","title":"WebKit Features in Safari 17.4 | WebKit","url":"https://webkit.org/blog/15063/webkit-features-in-safari-17-4/","tags":["safari","ReleaseNote"],"content":"Safari 17.4の変更点について。\nHTMLでは、`<input type=\"checkbox\" switch>`のサポート、フォームの縦書き表示に対応、`<select>`の区切りに`<hr>`を使えるように。\nCSSでは、`@scope`のサポート、`::spelling-error`と`::grammar-error`の擬似要素のサポート、`content: \"foo\" / \"alt\"`で代替テキストをサポート。\nWeb APIでは、`element.checkVisibility()`のサポート、`AbortSignal.any()`のサポート。\nJSでは、ES2024の`Promise.withResolvers()`/`Object.groupBy()`/`Map.groupBy()`のサポート。","relatedLinks":[{"title":"Safari 17.4 Release Notes | Apple Developer Documentation","url":"https://developer.apple.com/documentation/safari-release-notes/safari-17_4-release-notes"}]},{"category":"Headline","title":"Biome v1.6 | Biome","url":"https://biomejs.dev/blog/biome-v1-6/","tags":["JavaScript","Tools","ReleaseNote"],"content":"Biome v1.6リリース。\nAstro/Svelte/Vueのファイル内のJS/TS分析をサポート、`biome.jsonc`をサポート。\n`atributePosition`オプションの追加、ルールの更新など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.4 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-4/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.4リリース。\nクロージャーにおけるNarrowing結果の改善、`NoInfer` Utility Typeの追加、\n`--module preserve`の追加。\nES2024の`Object.groupBy`/`Map.groupBy`をサポート、Import Attributesのサポート。\n`target: \"ES3\"`や`out`オプションなどを非推奨化されたオプションは5.5で削除される予定。","relatedLinks":[]},{"category":"Headline","title":"WinterJS 1.0 · Blog · Wasmer","url":"https://wasmer.io/posts/winterjs-v1","tags":["JavaScript","WebAssembly","ReleaseNote"],"content":"SpidermonkeyベースのWinterJS-compatibleなJavaScript RuntimeであるWinterJS 1.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release v4.1.0 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v4.1.0","tags":["Hono","JavaScript","server","library","ReleaseNote"],"content":"Hono v4.1.0リリース。\nWebSocket Helperの追加、Body Limit Middlewareの追加、出力ターゲットをES2022に変更など","relatedLinks":[]},{"category":"Article","title":"フルスクラッチして理解するOpenID Connect (1) 認可エンドポイント編 - エムスリーテックブログ","url":"https://www.m3tech.blog/entry/2024/03/05/150000","tags":["OpenID","TypeScript","article"],"content":"OpenID ConnectのID ProviderをTypeScriptで実装していく連載","relatedLinks":[]},{"category":"Article","title":"&quot;react-strict-dom&quot;, why it&#039;s so great? | Szymon Rybczak","url":"https://szymonrybczak.dev/blog/react-strict-dom","tags":["React","HTML","iOS","Android","article"],"content":"react-strict-domについて。\nReact Native for WebのアプローチではReact Nativeのプリミティブをウェブ向けに変換する互換Shimが大きかった。\nreact-strict-domでは逆のアプローチを採用し、DOM APIのサブセットをネイティブ側で扱う。","relatedLinks":[{"title":"RFC: React DOM for Native (reduce API fragmentation) by necolas · Pull Request #496 · react-native-community/discussions-and-proposals","url":"https://github.com/react-native-community/discussions-and-proposals/pull/496"}]},{"category":"Article","title":"Why Should You Care About Package Metadata Interoperability? | OpenJS Foundation","url":"https://openjsf.org/blog/package-metadata-interoperability-collab-space-intro","tags":["nodejs","npm","article"],"content":"OpenJSで`package.json`のメタデータの相互運用性を向上させるためのワーキンググループが発足した。","relatedLinks":[{"title":"openjs-foundation/package-metadata-interoperability-collab-space: The goal of the Package Metadata Interoperability Collab Space is to improve how JavaScript developers define their packages across the ecosystem. The group is currently working to better understand package.json and how developers use it to define their projects.","url":"https://github.com/openjs-foundation/package-metadata-interoperability-collab-space"},{"title":"OpenJS Launches New Collaboration to Improve Interoperability of JavaScript Package Metadata  - Socket","url":"https://socket.dev/blog/openjs-improve-interoperability-of-javascript-package-metadata"}]},{"category":"Article","title":"Ultimate Guide to Visual Testing with Playwright","url":"https://www.browsercat.com/post/ultimate-guide-visual-testing-playwright","tags":["browser","test","article"],"content":"Playwrightを使ったビジュアルリグレッションテストについて","relatedLinks":[]},{"category":"Article","title":"Speedometer 3.0: The Best Way Yet to Measure Browser Performance | WebKit","url":"https://webkit.org/blog/15131/speedometer-3-0-the-best-way-yet-to-measure-browser-performance/","tags":["browser","benchmark","performance","article"],"content":"ウェブブラウザエンジンのベンチマークとして使われるSpeedometer 3.0リリース。\n同期と非同期処理の実行時間をより正確に計測、HTTP Archiveやnpmのダウンロード数を元にした利用されているフレームワークの調整。\nまた、今まではTodoMVCを利用していたが、Next.js/Nuxt を使ったメディアサイトやグラフィカルなダッシュボード、CodeMirrorとTipTapを使ったエディタなどもテストに追加など","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rolldown-rs/rolldown: Fast Rust bundler for JavaScript with Rollup-compatible API.","url":"https://github.com/rolldown-rs/rolldown","tags":["rollup","Rust","vite","library"],"content":"Rollup互換を目指すRustでのJavaScript Bundlerの実装。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"edmundhung/conform: A type-safe form validation library utilizing web fundamentals to progressively enhance HTML Forms with full support for server frameworks like Remix and Next.js.","url":"https://github.com/edmundhung/conform","tags":["React","Next.js","Remix","library"],"content":"RemixやNext.jsでのサーバ側の処理にも対応したフォームライブラリ。\nZodなどと組み合わせてサーバ側でのバリデーションやReactの`useFormState`と組み合わせて動作する","relatedLinks":[]},{"category":"Book","title":"Eloquent JavaScript","url":"https://eloquentjavascript.net/","tags":["JavaScript","book"],"content":"Eloquent JavaScripの第4版(2024)が公開された","relatedLinks":[]}]},{"meta":{"title":"2024-03-19のJS: Storybook 8、Nuxt 3.11、Cloudflare Workers + Vitest","author":"azu","layout":"post","date":"2024-03-19T03:24:43.652Z","category":"JSer","tags":["React","test","CSS","vite","Tools"],"url":"https://jser.info/2024/03/19/storybook-8-nuxt-3.11-cloudflare-workers-vitest/"},"items":[{"category":"Headline","title":"Release 5.11.0 · prisma/prisma","url":"https://github.com/prisma/prisma/releases/tag/5.11.0","tags":["prisma","ReleaseNote"],"content":"Prisma 5.11.0リリース。\nCloudflare Workers(Vercel Edge)などのEdge functionがプレビューサポートされた。","relatedLinks":[{"title":"Prisma ORM support for Edge functions is now in Preview","url":"https://www.prisma.io/blog/prisma-orm-support-for-edge-functions-is-now-in-preview"}]},{"category":"Headline","title":"Storybook 8","url":"https://storybook.js.org/blog/storybook-8/","tags":["storybook","JavaScript","Design","debug","ReleaseNote"],"content":"Storybook 8リリース。\n破壊的な変更として、`storiesOf` APIの削除、`*.stories.mdx`の削除、StoryShots addonの削除、Yarn v1のサポート終了。\n機能追加として、Chromaticとの連携機能の実装、MSWを使ったReact Server Component(RSC)のサポート。\nそのほかには、SWCを使うことでビルドパフォーマンスの改善、`react-docgen`がデフォルトとなるように変更、`react`をpeerDependenciesから除外するなど","relatedLinks":[{"title":"Storybook: UI component explorer for frontend developers","url":"https://storybook.js.org/releases/8.0"},{"title":"storybook/MIGRATION.md at next · storybookjs/storybook","url":"https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#from-version-7x-to-800"}]},{"category":"Headline","title":"Bun v1.0.31 | Bun Blog","url":"https://bun.sh/blog/bun-v1.0.31","tags":["Bun","ReleaseNote"],"content":"Bun v1.0.31リリース。\n`bun --print`の追加、Stdinからコードを実行できるように、`bun add --trust <pkg>`の追加、`bun pm trust`/`bun pm untrusted`の追加。\n`fetch()`に`unix`オプションを追加しUnix Socketsをサポート。\nNode.js 21.7.0で追加された`util.styleText`のサポートなど","relatedLinks":[{"title":"Node.js — Node v21.7.0 (Current)","url":"https://nodejs.org/en/blog/release/v21.7.0"}]},{"category":"Headline","title":"Nuxt 3.11 · Nuxt Blog","url":"https://nuxt.com/blog/v3-11","tags":["Vue","library","ReleaseNote"],"content":"Nuxt v3.11リリース。\nログ表示の改善、`usePreviewMode`の追加、`appMiddleware`の追加。\nサーバ専用の`.server.vue`とクライアント専用の`.client.vue`をページコンポーネントでもサポートなど","relatedLinks":[]},{"category":"Headline","title":"Elysia 1.0 - Lament of the Fallen | ElysiaJS","url":"https://elysiajs.com/blog/elysia-10","tags":["Bun","server","ReleaseNote"],"content":"Bun向けのHTTPサーバフレームワークのElysia 1.0リリース。\n起動時間の改善、Type Checkのパフォーマンス改善、`onBeforeHandle`などに`as`オプションを追加など","relatedLinks":[]},{"category":"Article","title":"Server Actions時代のformライブラリconform","url":"https://zenn.dev/akfm/articles/server-actions-with-conform","tags":["Next.js","React","article"],"content":"Server Actionsに対応したフォームライブラリであるConformについて","relatedLinks":[{"title":"Conform / Overview","url":"https://conform.guide/"}]},{"category":"Article","title":"Improved Cloudflare Workers testing via Vitest and workerd","url":"https://blog.cloudflare.com/workers-vitest-integration/","tags":["cloudflare","vite","test","article"],"content":"VitestでCloudflare Workersのテストを行う方法について。\n`@cloudflare/vitest-pool-workers`を使うことで、Workerに対するUnit Testができる仕組みについて。\nVitestのCustom Poolを使うことで、テストをworkerdのプロセス内で実行している。","relatedLinks":[{"title":"Vitest integration · Cloudflare Workers docs","url":"https://developers.cloudflare.com/workers/testing/vitest-integration/"}]},{"category":"Article","title":"Best Practices for Writing Tests with React Testing Library | ClarityDev blog","url":"https://claritydev.net/blog/improving-react-testing-library-tests","tags":["React","test","article"],"content":"React Testing LibraryでのReactコンポーネントのテストについて。\nコンポーネントをRoleでselectする方法やデバッグ方法、`userEvent`、\"not wrapped in act(...)\"の警告についてなど","relatedLinks":[]},{"category":"Article","title":"Implementing Vertical Form Controls | WebKit","url":"https://www.webkit.org/blog/15190/implementing-vertical-form-controls/","tags":["webkit","CSS","safari","article"],"content":"WebKitでのCSS `writing-mode`による縦書きフォームのサポートについて。","relatedLinks":[]},{"category":"SlideVideo","title":"エディター付きのReact開発環境を ブラウザーだけで実装した話 - Speaker Deck","url":"https://speakerdeck.com/steelydylan/edeitafu-kinoreactkai-fa-huan-jing-wo-burauzadakedeshi-zhuang-sitahua","tags":["React","ServiceWorker","slide"],"content":"プレビュー機能付きのエディタの実装についてのスライド。\nエディタ上の重たい処理をWeb Worker上に逃す方法、Service Worker内でTypeScriptのトランスパイルの実装などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"ECSS — Simple Rules for efficient CSS","url":"https://ecss.info/en/","tags":["CSS","document","Tools"],"content":"予測可能なCSSを書くためのデザインガイドとstylelintのルール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"guidepup/virtual-screen-reader: Virtual Screen Reader is a screen reader simulator for unit tests.","url":"https://github.com/guidepup/virtual-screen-reader","tags":["accessibility","test","library"],"content":"Unit Testに利用できるスクリーンリーダのシミュレータライブラリ","relatedLinks":[{"title":"Simple setup: Virtual Screen Reader in Storybook - DEV Community","url":"https://dev.to/scottnath/simple-setup-virtual-screen-reader-in-storybook-2efo"}]},{"category":"SoftwareLibrary","title":"MistCSS","url":"https://typicode.github.io/mistcss/","tags":["CSS","React","Tools"],"content":"CSSからReactコンポーネントを作成するツール。\nCSSを書いて、そのCSSからRectコンポーネントを生成する仕組みになっている。\ndata属性をPropsとして扱う、`@scope`でスコープを扱うなど","relatedLinks":[]}]},{"meta":{"title":"2024-03-27のJS: Firefox 124、Chrome 123、Node.jsドキュメンタリー","author":"azu","layout":"post","date":"2024-03-27T02:56:05.492Z","category":"JSer","tags":["nodejs","Tools","Chrome","document","rspack"],"url":"https://jser.info/2024/03/27/firefox-124-chrome-123-node.js/"},"items":[{"category":"Headline","title":"Announcing Rsbuild v0.5 - Rsbuild","url":"https://rsbuild.dev/community/releases/v0-5","tags":["rspack","Tools","ReleaseNote"],"content":"Rsbuild v0.5リリース。\nLightning CSSをopt-inでサポート、Custom Serverをサポート、SVGRプラグインの改善など","relatedLinks":[]},{"category":"Headline","title":"Firefox 124.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/124.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 124リリース。\n`AbortSignal.any()`のサポート、WebDriver BiDiの対応改善。\nフラグ付きで`SharedArrayBuffer.prototype.grow()`と` ArrayBuffer.prototype.resize()`のサポートなど","relatedLinks":[{"title":"Firefox 124 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/124"}]},{"category":"Headline","title":"Announcing VitePress 1.0 | The Vue Point","url":"https://blog.vuejs.org/posts/vitepress-1.0","tags":["vite","document","Tools","ReleaseNote"],"content":"VitePress 1.0リリース","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 123  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/new-in-chrome-123?hl=en","tags":["Chrome","ReleaseNote"],"content":"Chrome 123リリース。\nCSSの`light-dark()`のサポート、\nService worker Static Routing APIのサポート、Content-Encoding: zstdをサポート。\nBFCacheが利用できなかった理由を取得できる`notRestoredReasons`のサポート、ES Proposal Stage 3のImport Attributesをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v18.20.0 (LTS)","url":"https://nodejs.org/en/blog/release/v18.20.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v18.20.0リリース。\nImport Attributesのサポート、`vm.Script`とDynamic Importに関するパフォーマンス改善をbackport(Jestでメモリリークする問題の改善)","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v20.12.0 (LTS)","url":"https://nodejs.org/en/blog/release/v20.12.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v20.12.0リリース。\n`crypto.hash()`の追加、`.env`を扱う`process.loadEnvFile(path)`と`util.parseEnv(content)`を追加。\n`net.createConnection`に接続試行に関するイベントを追加、`util.styleText(format, text)`を追加など","relatedLinks":[]},{"category":"Headline","title":"Release v10.4.0 · mochajs/mocha","url":"https://github.com/mochajs/mocha/releases/tag/v10.4.0","tags":["nodejs","test","library","ReleaseNote"],"content":"Mocha v10.4.0リリース。\nError Causeの表示に対応","relatedLinks":[]},{"category":"Headline","title":"Release v9.0.0-beta.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v9.0.0-beta.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v9.0.0-beta.0リリース。\nNode.js 16のサポート終了、Lockfileバージョンをv7に変更、`dedupe-injected-deps`を`true`に変更、`link-workspace-packages`を`false`に変更。\npre/post-scriptを実行する`enable-pre-post-scripts`を`true`に変更など","relatedLinks":[]},{"category":"Article","title":"Optimizing Javascript for fun and for profit","url":"https://romgrk.com/posts/optimizing-javascript","tags":["article","performance","JavaScript"],"content":"JavaScriptのパフォーマンスの最適化について。パフォーマンスと可読性のトレードオフ。\n文字列の比較を避ける、異なる形状を避ける、配列やオブジェクトのメソッドを避けるといった実行時のコストを減らす工夫について","relatedLinks":[]},{"category":"Article","title":"Performance tooling in 2024 and beyond  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/perf-tooling-2024","tags":["Chrome","performance","article"],"content":"Chrome DevToolsに試験的に実装されていた\"Performance Insights\"パネルは2024年後半に削除される予定。\n\"Performance Insights\"は情報密度を減らすことを目的にしていたが、\"Performance\"パネルの方が使われていたという話","relatedLinks":[]},{"category":"Article","title":"Node.js — Diving into the Node.js Website Redesign","url":"https://nodejs.org/en/blog/announcements/diving-into-the-nodejs-website-redesign","tags":["nodejs","article"],"content":"Node.jsのウェブサイトがNext.jsで新しく書き直された話。\nnextraでの静的サイトとして始めたがカスタム設定が多くなり、Next.jsをVercelで動かす形に変更した。\nこのリニューアルで既存の翻訳はリセットされたため、現時点では404となっており、今後Crowdinを使った翻訳の仕組みを導入予定。","relatedLinks":[{"title":"Node.js — Run JavaScript Everywhere","url":"https://nodejs.org/en"}]},{"category":"Article","title":"Flow Nodes: How Type Inference Is Implemented","url":"https://effectivetypescript.com/2024/03/24/flownodes/","tags":["TypeScript","article"],"content":"TypeScriptのnarrowingがどのように動作しているかについて。\n上から下に型を絞り込んでいるのではなく、シンボルが参照されてるポイントから制御フローグラフを逆にたどることで型を絞り込む実装になっている話","relatedLinks":[]},{"category":"Article","title":"Chrome で text-spacing-trim プロパティがサポートされたぞ！！","url":"https://zenn.dev/inaniwaudon/articles/3ff8761773178c","tags":["Chrome","CSS","article"],"content":"Chrome 123でサポートされたCSSのtext-spacing-trimプロパティについて","relatedLinks":[]},{"category":"SlideVideo","title":"Node.js: The Documentary | An origin story - YouTube","url":"https://www.youtube.com/watch?v=LB8KwiiUGy0","tags":["nodejs","history","video"],"content":"Node.jsについてのドキュメンタリー動画。\nNode.jsが作成された理由や初期の開発、Windowの対応とlibuv。\nRyan→Isaac→TJへのオーナーの移譲、Joyentでの停滞とio.jsのfork、io.jsとNode.jsがマージされるまでの話","relatedLinks":[]},{"category":"WebsiteDocument","title":"Runtime compatibility across JavaScript runtimes","url":"https://runtime-compat.unjs.io/","tags":["JavaScript","document"],"content":"Bun/Deno/Vercel/LLRT/Node.js/wasmer/workerdなどのJavaScript RuntimeのWinterCG API互換性をまとめたテーブル","relatedLinks":[]},{"category":"WebsiteDocument","title":"Rsdoctor","url":"https://rsdoctor.dev/","tags":["webpack","rspack","Tools"],"content":"webpackやRspackのbundle結果を分析できるツール。\nbundle結果のサマリ、コンパイル/minifyの時間、loaderごとの処理時間やタイムライン、モジュールの依存関係の分析など","relatedLinks":[]}]},{"meta":{"title":"2024-04-02のJS: gulp 5.0.0、Deno 1.42、Bun 1.1(Windows)","author":"azu","layout":"post","date":"2024-04-02T03:15:02.023Z","category":"JSer","tags":["React","book","gulp","V8","Chrome"],"url":"https://jser.info/2024/04/02/gulp-5.0.0-deno-1.42-bun-1.1windows/"},"items":[{"category":"Headline","title":"Release gulp v5.0.0 · gulpjs/gulp","url":"https://github.com/gulpjs/gulp/releases/tag/v5.0.0","tags":["gulp","ReleaseNote"],"content":"gulp v5.0.0リリース。\nNode.js 10.13未満のサポート終了、ストリームエンコードをUTF-8に変更、非推奨のローダーの削除。\n`gulpfile.cjs`と`gulpfile.mjs`をサポート、`swc`/`esbuild`/`sucrase`/`mdx`ローダーの追加、`extends`構文のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Deno 1.42: Better dependency management with JSR","url":"https://deno.com/blog/v1.42","tags":["dneo","ReleaseNote"],"content":"Deno v1.42リリース。\nJSRをサポートする`deno publish`と`deno add`コマンドを追加。\n`deno task`で実行するスクリプトをクロスプラットフォームで実行できる`#!/usr/bin/env -S`というshebangをサポート。\n`DENO_FUTURE=1`でDeno2に含まれる予定の変更をopt-inでテストできるように。","relatedLinks":[]},{"category":"Headline","title":"Introducing Babylon.js 7.0. Our mission is to build one of the most… | by Babylon.js | Mar, 2024 | Medium","url":"https://babylonjs.medium.com/introducing-babylon-js-7-0-a141cd7ede0d","tags":["WebGL","JavaScript","library","ReleaseNote"],"content":"Babylon.js 7.0リリース。\nProcedural Geometry、Global Illumination、Gaussian Splat Renderingのサポート。\nApple Vision Proのサポート、MMDのコミュニティサポートの追加など","relatedLinks":[{"title":"Release 7.0.0 · BabylonJS/Babylon.js","url":"https://github.com/BabylonJS/Babylon.js/releases/tag/7.0.0"}]},{"category":"Headline","title":"Radix Themes 3.0 – Radix UI","url":"https://www.radix-ui.com/blog/themes-3","tags":["JavaScript","UI","library","ReleaseNote"],"content":"Radix Themes 3.0リリース。\nカスタムカラーパレットの作成ツールの公開、ダッシュボード向けのコンポーネントの追加、レイアウトコンポーネントに多数のPropsを追加など","relatedLinks":[{"title":"Releases – Radix Themes","url":"https://www.radix-ui.com/themes/docs/overview/releases#300"}]},{"category":"Headline","title":"Bun 1.1 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1","tags":["Bun","windows","ReleaseNote"],"content":"Bun v1.1リリース。\n`WebSocket` APIのStable化、`performance.mark()`/`performance.measure()`のサポート、Fetch APIがBrotliをサポート。\nbuilt-in modulesがMacrosでの利用に対応、conditional exportsで`worker`サポート、`NODE_ENV`のデフォルト値を`undefined`に変更など","relatedLinks":[]},{"category":"Article","title":"Iterator helpers · V8","url":"https://v8.dev/features/iterator-helpers","tags":["V8","JavaScript","Chrome","article"],"content":"Chrome 122でサポートされたES Proposal Stage 3のIterator Helpersについて。\nmap/filter/take/drop/flatMap/reduce/toArray/forEach/some/every/findなどの使い方について","relatedLinks":[{"title":"tc39/proposal-iterator-helpers: Methods for working with iterators in ECMAScript","url":"https://github.com/tc39/proposal-iterator-helpers"}]},{"category":"Article","title":"light-dark() を使用して CSS のカラーパターンに依存する色を使用する | Articles | web.dev","url":"https://web.dev/articles/light-dark?hl=ja","tags":["CSS","article"],"content":"`light-dark()`を使うことでMedia Queryを使わずにLight Mode/Dark Modeで変化する値を扱えるという話","relatedLinks":[]},{"category":"Article","title":"JavaScript Visualized - Promise Execution","url":"https://lydiahallie.framer.website/blog/promise-execution","tags":["JavaScript","Promises","article","ECMAScript"],"content":"Promiseの動作を仕様的な内部動作を使ってビジュアライズしている記事。\n非同期処理とMicrotask Queueについて","relatedLinks":[]},{"category":"Article","title":"React Server Components now in RedwoodJS | RedwoodJS","url":"https://redwoodjs.com/blog/rsc-now-in-redwoodjs","tags":["React","article"],"content":"RedwoodJSでのReact Server Components(RSC)のサポートについて。\n今までのGraphQLでのweb/apiとRSCを使った場合のサーバの構成の違い、RSCの仕組みについてなど","relatedLinks":[]},{"category":"Article","title":"Flaky Tests In React: Detection, Prevention and Tools - Semaphore","url":"https://semaphoreci.com/blog/flaky-react","tags":["React","test","article"],"content":"testing-libraryを使ったReactのテストでの不安定なパターンと解消方法について。","relatedLinks":[]},{"category":"Book","title":"実践JavaScript!: プログラミングを楽しみながらしっかり身につける | 武舎 広幸 | 本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4274231739/","tags":["JavaScript","book"],"content":"練習問題が豊富なJavaScriptの入門書","relatedLinks":[]}]},{"meta":{"title":"2024-04-11のJS: zx 8.0.0、ESLint 9.0.0、Flowの`component`構文","author":"azu","layout":"post","date":"2024-04-11T02:49:24.346Z","category":"JSer","tags":["React","Next.js","nodejs","flowtype","ShellScript"],"url":"https://jser.info/2024/04/11/zx-8.0.0-eslint-9.0.0-flowcomponent/"},"items":[{"category":"Headline","title":"Release 8.0.0 · google/zx","url":"https://github.com/google/zx/releases/tag/8.0.0","tags":["JavaScript","ShellScript","library","ReleaseNote"],"content":"zx 8.0.0リリース。\nパッケージサイズの削減、`$.sync`の追加、`input`オプションの追加、AbortControllerのサポート、`kill`メソッドの追加。\n`$.verbose`のデフォルト値を`false`に変更、`ssh` APIの削除など","relatedLinks":[]},{"category":"Headline","title":"Announcing Rspack v0.6 - Rspack","url":"https://www.rspack.dev/blog/announcing-0.6","tags":["JavaScript","webpack","ReleaseNote"],"content":"Rspack 0.6リリース。\nmini-css-extract-pluginの機能を組み込みサポート、デフォルトでTree Shakingを有効化。\nCSSの順番が複数のchunkで矛盾している場合に警告を表示するようになるなど","relatedLinks":[]},{"category":"Headline","title":"Node.js — Wednesday, April 10, 2024 Security Releases","url":"https://nodejs.org/en/blog/vulnerability/april-2024-security-releases-2","tags":["nodejs","windows","security","ReleaseNote"],"content":"Node.jsのセキュリティアップデートとして v18.20.2 (LTS)/v20.12.2 (LTS)/v21.7.3 (Current)がそれぞれリリース。\nWindowsにおける`child_process.spawn`のコマンドインジェクションの脆弱性の修正","relatedLinks":[]},{"category":"Headline","title":"ESLint v9.0.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2024/04/eslint-v9.0.0-released/","tags":["ESLint","ReleaseNote"],"content":"ESLint v9.0.0リリース。\nNode.js 18.18未満のサポート終了、Flat Configをデフォルト化、ビルトインのformatterの一部をパッケージに移動、JSDocのルールを削除。\n`eslint:recommended`の更新、`loadESLint()` APIの追加、RuleTesterのバリデーションの強化、ルールの書き方を変更など","relatedLinks":[{"title":"Migrate to v9.x - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/docs/latest/use/migrate-to-9.0.0"}]},{"category":"Article","title":"New Flow Language Features for React | by Alex Taylor | Flow | Apr, 2024 | Medium","url":"https://medium.com/flow-type/announcing-component-syntax-b6c5285660d0","tags":["flowtype","React","article"],"content":"Flow v0.233.0で導入された`component`/`hook`/`renders`構文について。\n通常の関数とは異なる構文にすることでPropsのread-onlyのチェック、refのチェック、Hooksのチェックなどが行える","relatedLinks":[]},{"category":"Article","title":"App Router移行時に0.01%の確率でCSR遷移が404エラーになる - とろろこんぶろぐ","url":"https://oisham.hatenablog.com/entry/2024/04/04/105444","tags":["Next.js","article"],"content":"Next.jsではApp RouterとPages Routerが共存しているときは、パスがどちらのRouterかを判定するのに Bloom Filter を利用している。\nこの判定は確率的に判定ミスをするが、その際にはハードナビゲーションするため本来は問題が起きない。しかし、`basePath`オプションを利用時には問題があったという話。","relatedLinks":[]},{"category":"Article","title":"Breaking Down Next.js 14 | FocusReactive","url":"https://focusreactive.com/breaking-down-next-js-14/","tags":["Next.js","article"],"content":"Next.js 14のApp Router/Server Components/Data Fetching/Caching/Metadata/Dynamic Image Generationについて。","relatedLinks":[]},{"category":"Article","title":"History of JS interop in Dart. Support for Wasm just landed in the… | by Sigmund Cherem | Dart | Mar, 2024 | Medium","url":"https://medium.com/dartlang/history-of-js-interop-in-dart-98b06991158f","tags":["dart","JavaScript","article"],"content":"DartのJavaScriptとの総合運用性の歴史について。\nDart 3.3で追加された`dart:js_interop`について","relatedLinks":[]},{"category":"Article","title":"Learn JavaScript  |  web.dev","url":"https://web.dev/learn/javascript","tags":["JavaScript","tutorial"],"content":"JavaScriptの基礎を学習するチュートリアル","relatedLinks":[]},{"category":"Article","title":"Migrating 500+ tests from Mocha to Node.js | Astro","url":"https://astro.build/blog/node-test-migration/","tags":["nodejs","JavaScript","testing","article"],"content":"Mocha/Chaiから`node:test`/`node:assert`へテストを移行した話","relatedLinks":[]},{"category":"Article","title":"Optimizing WebKit &amp; Safari for Speedometer 3.0 | WebKit","url":"https://webkit.org/blog/15249/optimizing-webkit-safari-for-speedometer-3-0/","tags":["webkit","safari","performance","article"],"content":"WebKitでSpeedometer 3.0のベンチマークに合わせた最適化を色々と取り入れた話。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Home | Ark UI","url":"https://ark-ui.com/","tags":["JavaScript","UI","library"],"content":"React/Solid/Vueで、Panda CSS/Tailwind/Vanilla CSSに対応したHeadless UIコンポーネントライブラリ","relatedLinks":[]},{"category":"Book","title":"The Framework Field Guide - Fundamentals | Unicorn Utterances","url":"https://unicorn-utterances.com/collections/framework-field-guide-fundamentals","tags":["JavaScript","React","Angular","Vue","book"],"content":"Angular/React/Vueを一度に学べることを目的にした書籍。","relatedLinks":[]}]},{"meta":{"title":"2024-04-18のJS: Next.js v14.2、Farm v1.0、Biome v1.7、pnpm v9","author":"azu","layout":"post","date":"2024-04-18T05:19:34.848Z","category":"JSer","tags":["Next.js","Tools","CSS","nodejs","deno"],"url":"https://jser.info/2024/04/18/next.js-v14.2-farm-v1.0-biome-v1.7-pnpm-v9/"},"items":[{"category":"Headline","title":"Next.js 14.2 | Next.js","url":"https://nextjs.org/blog/next-14-2","tags":["Next.js","ReleaseNote"],"content":"Next.js 14.2リリース。\nTurbopack RCをリリース、Server/Client Components間のTree Shakingの対応、CSSの読み込み順の問題の修正。\nClient側のRouter Cacheの期間を設定する`staleTimes`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release 🚀 Farm v1.0 is released! · farm-fe/farm","url":"https://github.com/farm-fe/farm/releases/tag/v1.0","tags":["JavaScript","bundler","Rust","vite","ReleaseNote"],"content":"Vite/Rollup互換のプラグインを扱えるビルドツールであるFarm 1.0リリース。\nRustで書かれていて、キャッシュを使ったIncremental Build、Lazy Compilation、モジュールをグループ化してbundleできる。\nまた、devとproductionビルドで同じ戦略を使うため、一貫性の結果となるように設計されている。","relatedLinks":[]},{"category":"Headline","title":"Biome v1.7 | Biome","url":"https://biomejs.dev/blog/biome-v1-7/","tags":["ESLint","Tools","ReleaseNote"],"content":"Biome v1.7リリース。\nESLint/Prettierの設定からマイグレーションできる`biome migrate eslint`と`biome migrate prettier`コマンドを追加。\nGitのStagingファイルをチェックする`biome check --staged`の追加など","relatedLinks":[{"title":"Release CLI v1.7.0 · biomejs/biome","url":"https://github.com/biomejs/biome/releases/tag/cli%2Fv1.7.0"}]},{"category":"Headline","title":"Release v9.0.0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v9.0.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v9.0.0リリース。\nNode.js 16のサポート終了。\nmonorepo内のバージョン指定でのlinkをする`link-workspace-packages`を`false`に変更、pre/post scriptをデフォルトで実行するように変更。\nロックファイルのバージョンをv9に変更、Gitリポジトリのサブディレクトリのみをインストールできるように。","relatedLinks":[]},{"category":"Headline","title":"Bun v1.1.4 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1.4","tags":["Bun","ReleaseNote"],"content":"Bun v1.1.4リリース。\n`bun --filter='*'`でコマンドを並列に実行できるように、`bun install`のパフォーマンスを改善、`bun:sqlite`が`using`に対応など","relatedLinks":[]},{"category":"Headline","title":"Chrome 124  |  Release notes  |  Chrome for Developers","url":"https://developer.chrome.com/release-notes/124","tags":["Chrome","ReleaseNote"],"content":"Chrome 124リリース。\n`writingsuggestions`属性のサポート、`Sec-CH-UA-Form-Factors` client hintのサポート、Document Render-Blockingのサポート。\nWebSocketStream API、`setHTMLUnsafe`と`parseHTMLUnsafe`メソッドのサポート、ReadableStream APIがAsync Iterableに対応など","relatedLinks":[{"title":"New in Chrome 124  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/new-in-chrome-124"}]},{"category":"Headline","title":"ECMAScript proposal updates @ 2024-04 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2024/04/17/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2024年4月のTC39ミーティングでのECMAScript Proposalのステータス変更のまとめ。\nSignalsがStage 1に、`.union()`などの集合演算をするSetメソッドがStage 4に。","relatedLinks":[]},{"category":"Headline","title":"Release 3.37.0 - 2024.04.17 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.37.0","tags":["JavaScript","polyfill","ReleaseNote"],"content":"core-js v3.37.0リリース。\nSet methods ProposalをStableに追加、`Math.sumPrecise`のサポート、`Symbol.customMatcher`のサポートなど","relatedLinks":[]},{"category":"Article","title":"How we built JSR","url":"https://deno.com/blog/how-we-built-jsr","tags":["deno","JavaScript","npm","article"],"content":"JSRの技術的な作りについて。\nAPIサーバはRustで書かれていて、DBにはPostgresを利用している。\nフロントエンドにはFreshを使ったIslandsアーキテクチャにしている。\nFreshを動かすRendering Serverは各地にデプロイされるがAPI ServerはUSのみなので、Server間のやり取りでウォーターフォールが起きないようにまとめている。\nまた、npmの互換レイヤーであるtarballを作成するときに.tsから.d.tsを生成する処理をRustで書いている点についてなど","relatedLinks":[{"title":"feat: Add fast-check based TypeScript type definition generation by marvinhagemeister · Pull Request #379 · denoland/deno","url":"https://github.com/denoland/deno_graph/pull/379"}]},{"category":"Article","title":"Panda CSS - The Origin Story - Segun Adebayo","url":"https://www.adebayosegun.com/blog/panda-css-the-origin-story","tags":["JavaScript","CSS","article","Interview"],"content":"Panda CSSがなぜ作られたのかについての話。\nChakra UIでCSSのパフォーマンスを向上する試みから、Vanilla ExtractでPoCを作成し、そこから同じ試みをしてるBox Extractorの作者と作業をマージして進めていった。\nPark UIやビデオチュートリアルの作成、名前をPandaにした話などについて","relatedLinks":[]},{"category":"Article","title":"Node.js — Trip report: Node.js collaboration summit (2024 London)","url":"https://nodejs.org/en/blog/events/collab-summit-2024-london","tags":["nodejs","article"],"content":"Node.js collaboration summit 2024で話されたことのサマリ記事。","relatedLinks":[]},{"category":"Article","title":"CSS in React Server Components","url":"https://www.joshwcomeau.com/react/css-in-rsc/","tags":["Next.js","CSS","React","article"],"content":"React Server ComponentとCSSについての記事。\nLinaria、Panda CSS、Material UIのPigment CSSについて","relatedLinks":[]},{"category":"Article","title":"「実装例から見る React のテストの書き方」をアップデートする","url":"https://zenn.dev/cybozu_frontend/articles/update-test-libraries","tags":["JavaScript","Tools","article"],"content":"React周りのツールやテストのアップデートについて。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sonic-technology/catena: Build type-safe APIs with ease","url":"https://github.com/sonic-technology/catena","tags":["nodejs","TypeScript","library"],"content":"ExpressにType Safeなvalidationやmiddlewareなどの仕組みをつけるライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Layer Cake","url":"https://layercake.graphics/","tags":["Svelte","SVG","library"],"content":"SvelteベースのSVGなどのグラフィカルなデータを扱うライブラリ","relatedLinks":[]}]},{"meta":{"title":"2024-04-26のJS: Electron 30、Firefox 125、Node.js 22、React 19 Beta、TypeScript 5.5 Beta","author":"azu","layout":"post","date":"2024-04-26T02:31:56.430Z","category":"JSer","tags":["React","Electron","Firefox","JSON","Tools"],"url":"https://jser.info/2024/04/26/electron-30-firefox-125-node.js-22-react-19-beta-typescript-5.5-beta/"},"items":[{"category":"Headline","title":"Electron 30.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-30-0","tags":["Electron","ReleaseNote"],"content":"Electron 30リリース。\nV8 12.4、Chromium 124、Node.js 20.11.1へアップデート。\nFile System APIをサポート、Cross Origin iframeにPermission Policyを使うように変更、`WebContentsView`/`BaseWindow`の廃止など","relatedLinks":[]},{"category":"Headline","title":"Firefox 125.0.1, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/125.0.1/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 125リリース。\n`Intl.Segmenter`のサポート、Popover APIのサポート、AV1コーデックのサポート、WasmのMulti Memoryをサポートなど","relatedLinks":[{"title":"Firefox 125 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/125"},{"title":"WebAssembly/multi-memory: Multiple per-module memories for Wasm","url":"https://github.com/WebAssembly/multi-memory"}]},{"category":"Headline","title":"Node.js — Node.js 22 is now available!","url":"https://nodejs.org/en/blog/announcements/v22-release-announce","tags":["nodejs","ReleaseNote"],"content":"Node.js 22リリース。\nV8 12.4へアップデート、`require()`でのESMモジュールのロードをサポートする`--experimental-require-module`フラグの追加。\nnpm run-scriptを実行する`node --run <script>`を追加、`node --watch`フラグを追加、WebSocketをデフォルトで有効化、`node:fs`に`glob`を追加。\nStreamのHigh Water Markのデフォルト値を16KiBから64KiBへ変更。","relatedLinks":[]},{"category":"Headline","title":"React Native 0.74 - Yoga 3.0, Bridgeless New Architecture, and more · React Native","url":"https://reactnative.dev/blog/2024/04/22/release-0.74","tags":["React","iOS","Android","ReleaseNote"],"content":"React Native 0.74リリース。\nレイアウトエンジンであるYoga 3.0へアップグレート、Bridgelessがデフォルトに変更、`onLayout`でのStateの更新がバッチ化されるように。\nAndroidの最小SDKバージョンを23 (Android 6.0)に変更、PropTypesの削除など","relatedLinks":[]},{"category":"Headline","title":"React 19 Beta – React","url":"https://react.dev/blog/2024/04/25/react-19","tags":["React","ReleaseNote"],"content":"React 19 Betaリリース。\nActionという概念の導入と`useActionState`/`useFormStatus`の追加。\n楽観的な更新を扱う`useOptimistic`、Promiseをunwrapする`use`の追加。\nServer Component/Server Actionのサポート、`forwardRef`が不要となるように変更。\nHydrationのエラーの表示の改善、`<Context>`自体が`<Context.Provider>`としての機能を持つように変更、`ref`のcleanup処理を定義できるように。\n`useDeferredValue`の第二引数に初期値をサポート、`<title>`などのメタデータタグのサポート、`<link ref=stylesheet>`でのスタイルシートのサポート。\n`<script async={true}>`のサポート、`preload`などの`<link rel=preload>`を扱う関数を追加。\nReact 18ではサードパーティによってHTMLが改変されたときはHydration時にレンダリングし直すことで消えていたが、残るように変更、Custom Elementのサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Release Version 2.0.0 · quilljs/quill","url":"https://github.com/quilljs/quill/releases/tag/v2.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"Quill 2.0リリース。\nTypeScriptのビルトインサポート、`registry`の追加、ドキュメントモデルとの同期にInputEventを使うように変更。","relatedLinks":[{"title":"Announcing Quill 2.0 - Knock Down Silos by Slab","url":"https://slab.com/blog/announcing-quill-2-0/"}]},{"category":"Headline","title":"What’s new in Apollo Client 3.10 | Apollo GraphQL Blog","url":"https://www.apollographql.com/blog/whats-new-in-apollo-client-3-10","tags":["GraphQL","JavaScript","library","ReleaseNote"],"content":"Apollo Client 3.10リリース。\n`@apollo/client/testing/experimental`にMSWと連携してスキーマ駆動テストをする`createTestSchema`の追加、`client.watchFragment`の追加。\n`createQueryPreloader`をStableに変更など","relatedLinks":[{"title":"Release v3.10.0 · apollographql/apollo-client","url":"https://github.com/apollographql/apollo-client/releases/tag/v3.10.0"}]},{"category":"Headline","title":"Announcing TypeScript 5.5 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-5-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.5リリース。\n関数からtype predicatesを推論できるようになり、`Array.prototype.filter`などでの絞り込みが簡潔に書けるように。\nJSDocで`@import {foo} from \"foo\"`をサポート、正規表現の基本的な構文チェックをサポート、`isolatedDeclarations`をサポート。\n設定ファイル内で`${configDir}`のテンプレート値をサポート。\n`typescript`パッケージのサイズを削減、Named Importをサポート、`transpileDeclaration` APIの追加。\n`out`や`target: ES3`などの非推奨となっていたオプションが無効化され、`ignoreDeprecations`オプションを指定しないと利用できなくなる変更など","relatedLinks":[{"title":"The Making of a TypeScript Feature: Inferring Type Predicates","url":"https://effectivetypescript.com/2024/04/16/inferring-a-type-predicate/"}]},{"category":"Article","title":"Rspack v1.0 Release Plan · web-infra-dev/rspack · Discussion #6315","url":"https://github.com/web-infra-dev/rspack/discussions/6315","tags":["JavaScript","rspack","article"],"content":"Rspackのロードマップ。\n2024年7月にRspack 1.0をリリースする予定","relatedLinks":[]},{"category":"Article","title":"HTML attributes vs DOM properties - JakeArchibald.com","url":"https://jakearchibald.com/2024/attributes-vs-properties/","tags":["HTML","DOM","JavaScript","article"],"content":"HTMLの属性とDOMプロパティの違いについて。\n属性とプロパティの型の違い、大文字小文字の区別、Reflectionについて。\nまた、Preact/VueやReactなどのUIフレームワークでの扱いについてなど","relatedLinks":[]},{"category":"SlideVideo","title":"LavaMoat/LavaDome: Secure DOM trees isolation and encapsulation leveraging ShadowDOM","url":"https://github.com/LavaMoat/LavaDome","tags":["WebComponents","security","library"],"content":"Shadow DOMを使い同じOriginで実行されているJavaScriptからもアクセスできないDOMを扱うライブラリ","relatedLinks":[]},{"category":"WebsiteDocument","title":"React のルール – React","url":"https://ja.react.dev/reference/rules","tags":["React","docue","translate"],"content":"Rules of Reactの翻訳。\nReactでアプリケーションを書く時のルールについて書かれている","relatedLinks":[{"title":"Rules of React – React","url":"https://react.dev/reference/rules"}]},{"category":"SoftwareLibrary","title":"JSON Fixer","url":"https://jsonfixer.com/","tags":["JSON","Tools"],"content":"JSONっぽいものをJSONに修正してくれるツール","relatedLinks":[]}]},{"meta":{"title":"2024-05-03のJS: Bun v1.1.5(cross compile)、React 18.3.0、Svelte 5 RC","author":"azu","layout":"post","date":"2024-05-03T14:32:53.375Z","category":"JSer","tags":["HTML","Bun","document","React","CSS"],"url":"https://jser.info/2024/05/03/bun-v1.1.5cross-compile-react-18.3.0-svelte-5-rc/"},"items":[{"category":"Headline","title":"Bun v1.1.6 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1.6","tags":["Bun","ReleaseNote"],"content":"Bun v1.1.6リリース。\nUDP Socketsのサポート、`node:dgram`をサポート、`dd-trace`や`@clickhouse/client`などが動作するようにバグ修正など","relatedLinks":[]},{"category":"Headline","title":"Announcement of Release - Module federation","url":"https://module-federation.io/blog/announcement.html","tags":["JavaScript","webpack","rspack","ReleaseNote"],"content":"Module Federation 2.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Bun v1.1.5 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1.5","tags":["Bun","ReleaseNote"],"content":"Bun v1.1.5リリース。\n`bun build --compile`がクロスコンパイルに対応、`package.json`の末尾カンマを許可するように、`bun.report`の追加。\nImport Attributesで任意ファイルをtext/json/toml/fileとしてインポートできるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v22.1.0 (Current)","url":"https://nodejs.org/en/blog/release/v22.1.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.1.0リリース。\nV8コンパイルキャッシュの保存場所を指定する`NODE_COMPILE_CACHE`環境変数を追加、Test Runnerに`--test-skip-pattern`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"remix/CHANGELOG.md at main · remix-run/remix","url":"https://github.com/remix-run/remix/blob/main/CHANGELOG.md#v290","tags":["Remix","ReleaseNote"],"content":"Remix 2.9.0リリース。\n`future.unstable_singleFetch`フラグで利用できるSingle Fetchの実装。\nFetch API/`undici`を使う`installGlobals({ nativeFetch: true })`の追加など","relatedLinks":[{"title":"🗺️ Single Data Fetch · remix-run/remix · Discussion #7640","url":"https://github.com/remix-run/remix/discussions/7640"},{"title":"Remix v2.9 で導入された Single Fetch","url":"https://azukiazusa.dev/blog/single-fetch-in-remix/"}]},{"category":"Headline","title":"May 1, 2024 Release – React Spectrum Releases","url":"https://react-spectrum.adobe.com/releases/2024-05-01.html","tags":["React","library","ReleaseNote"],"content":"React Aria Components May 1, 2024リリース。\nSubmenu, unavailable menu items, DropZone, FileTriggerを正式サポート。\nColor Componentの追加、TreeViewをαリリース、`RouterProvider`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release 18.3.0 (April 25, 2024) · facebook/react","url":"https://github.com/facebook/react/releases/tag/v18.3.0","tags":["React","ReleaseNote"],"content":"React v18.3.0リリース。\nReact 19での変更予定の機能に対してDeprecatedの警告を出す実装が追加されている。","relatedLinks":[{"title":"React 19 Beta Upgrade Guide – React","url":"https://react.dev/blog/2024/04/25/react-19-upgrade-guide"}]},{"category":"Headline","title":"Svelte 5 Release Candidate","url":"https://svelte.dev/blog/svelte-5-release-candidate","tags":["Svelte","ReleaseNote"],"content":"Svelte 5 RCリリース。\nrunesの追加、Snippetsの追加、イベントハンドラーの記述方法の変更など。","relatedLinks":[{"title":"Breaking changes • Docs • Svelte 5 preview","url":"https://svelte-5-preview.vercel.app/docs/breaking-changes"}]},{"category":"Article","title":"MoonBit adds JS backend, up to 25x faster than native JS | MoonBit","url":"https://www.moonbitlang.com/blog/js-support","tags":["WebAssembly","JavaScript","article"],"content":"Rustライクな構文でWebAssemblyへ出力できる言語/ツールキットであるMoonBitが、JavaScriptへの出力をサポート。\nIteratorのコストが減るような変換や文字列をUnicode Code Pointとして整数値で持つなどの工夫をしている","relatedLinks":[]},{"category":"Article","title":"Design System Generations. How to discuss and describe a design… | by Nathan Curtis | Medium","url":"https://medium.com/@nathanacurtis/design-system-generations-65f99960dc3d","tags":["Design","article","opinion"],"content":"デザインシステムについての連載。\nデザインシステムとは何か、どのように実践するか、どのようにスケールするかについて","relatedLinks":[]},{"category":"Article","title":"Popover API lands in Baseline  |  Blog  |  web.dev","url":"https://web.dev/blog/popover-api?hl=en","tags":["HTML","JavaScript","article"],"content":"Popover APIについての紹介記事。\n`popover`属性と`popovertarget`属性を使ったPopover APIの使い方について。\n`<dialog>`要素と`popover`属性の違いについて","relatedLinks":[]},{"category":"Article","title":"Combining CSS :has() And HTML &lt;select&gt; For Greater Conditional Styling — Smashing Magazine","url":"https://www.smashingmagazine.com/2024/05/combining-css-has-html-select-conditional-styling/","tags":["HTML","CSS","article"],"content":"`<select>`と`:has()`を組み合わせて、選択した値によってスタイルを変化させる方法について","relatedLinks":[]},{"category":"WebsiteDocument","title":"ARIA Authoring Practices Guide | APG | WAI | W3C","url":"https://www.w3.org/WAI/ARIA/apg/","tags":["WAI-ARIA","accessibility","document"],"content":"WAI-ARIAを使ったデザインパターン、ランドマークの使い方、名前の付け方について紹介しているドキュメント","relatedLinks":[]},{"category":"WebsiteDocument","title":"Webフロントエンド版DX Criteria (v202402)/プロダクトのユーザー体験と変化に適応するチームのためのガイドライン","url":"https://dxcriteria.cto-a.org/frontend","tags":["document"],"content":"Webフロントエンド版DX Criteria","relatedLinks":[{"title":"日本CTO協会から、プロダクトのユーザー体験と変化に適応するチームのためのガイドライン『Webフロントエンド版DX Criteria』を4月24日に新公開 | 一般社団法人日本CTO協会のプレスリリース","url":"https://prtimes.jp/main/html/rd/p/000000024.000081310.html"}]},{"category":"SoftwareLibrary","title":"jacob-ebey/turbo-stream: A streaming data transport format that aims to support built-in features such as Promises, Dates, RegExps, Maps, Sets and more.","url":"https://github.com/jacob-ebey/turbo-stream","tags":["JavaScript","library"],"content":"PromiseやDateなどをシリアライズしてWeb Streamとして送受信するためのencode/decodeライブラリ","relatedLinks":[]},{"category":"Book","title":"The Front End Developer/Engineer Handbook 2024","url":"https://frontendmasters.com/guides/front-end-handbook/2024/","tags":["HTML","CSS","JavaScript","book"],"content":"The Front End Developer/Engineer Handbookの2024年版","relatedLinks":[]}]},{"meta":{"title":"2024-05-12のJS: Headless UI v2.0 for React、Astro v4.8、外部パッケージに依存せずにNode.jsで使えるようになった機能","author":"azu","layout":"post","date":"2024-05-12T06:47:28.714Z","category":"JSer","tags":["test","nodejs","bundler","vite","Hono"],"url":"https://jser.info/2024/05/12/headless-ui-v2.0-for-react-astro-v4.8-node.js/"},"items":[{"category":"Headline","title":"Release v0.21.0 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.21.0","tags":["JavaScript","bundler","ReleaseNote"],"content":"esbuild v0.21.0リリース。\nStage 3のDecorator Proposalのサポート、プライベートメソッドの最適化、バグ修正など","relatedLinks":[]},{"category":"Headline","title":"Release v1.6.0 · vitest-dev/vitest","url":"https://github.com/vitest-dev/vitest/releases/tag/v1.6.0","tags":["vite","test","ReleaseNote"],"content":"vitest v1.6.0リリース。\n`--standalone`グラフのサポート、Snapshotをカスタマイズできる`snapshotEnvironment` オプションの追加。\n`browser.testerScripts`と`browser.indexScripts`オプションの追加。","relatedLinks":[]},{"category":"Headline","title":"Release v4.3.0 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v4.3.0","tags":["Hono","ReleaseNote"],"content":"Hono v4.3.0リリース。\nResponseに対するクライアント側での型推論の改善、`hono/jsx`のReactとの互換性改善、`createFactory`の追加など","relatedLinks":[]},{"category":"Headline","title":"Astro 4.8 | Astro","url":"https://astro.build/blog/astro-480/","tags":["astro","ReleaseNote"],"content":"Astro 4.8リリース。\n実験的な機能としてAstro Action、Request Rewritingの追加。\nパフォーマンスの改善や`injectRoute`のバグ修正など","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v20.13.0 (LTS)","url":"https://nodejs.org/en/blog/release/v20.13.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v20.13.0リリース。\nBufferの`base64`と`base64url`のパフォーマンス改善、`CustomEvent`と`node --watch`をStableに変更、`fs/promises`のスタックトレースの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v1.44.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.44.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.44.0リリース。\nアクセシビリティ用のAssertionを追加、`page.addLocatorHandler`に`noWaitAfter`オプションを追加、`page.removeLocatorHandler`メソッドを追加。\n前回失敗したテストだけを実行する`--last-failed`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v2.3.0 · mswjs/msw","url":"https://github.com/mswjs/msw/releases/tag/v2.3.0","tags":["JavaScript","test","library"],"content":"msw 2.3.0リリース。\nハンドラー内でのunhandled exceptionは500エラーとなるように変更、`unhandledException`イベントを追加など","relatedLinks":[]},{"category":"Headline","title":"Release v9.0.0 · sindresorhus/execa","url":"https://github.com/sindresorhus/execa/releases/tag/v9.0.0","tags":["nodejs","ReleaseNote"],"content":"execa v9.0.0リリース。\nzx的なTemplate Literalでのコマンド実行をサポート、行ごとに出力を処理できるように、入力や出力のフィルター、`verbose`モードの改善など","relatedLinks":[{"title":"Execa 9: our biggest release. Execa runs commands in your scripts. | by ehmicky | Medium","url":"https://medium.com/@ehmicky/execa-9-release-d0d5daaa097f"}]},{"category":"Headline","title":"Bun v1.1.8 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1.8","tags":["Bun","ReleaseNote"],"content":"Bun v1.1.8リリース。\n`process.on(\"uncaughtException\")`と`process.on(\"unhandledRejection\")`のサポート。\n`node:zlib`でBrotli APIをサポート、Bun APIがExplicit Resource Managementをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Headless UI v2.0 for React - Tailwind CSS","url":"https://tailwindcss.com/blog/headless-ui-v2","tags":["React","library","ReleaseNote"],"content":"Headless UI v2.0リリース。\nFloating UIのanchor指定をサポート、Checkboxコンポーネント、Fieldsetコンポーネント、Comboboxが`virtual` propsをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 7.0.0 · jasonkuhrt/graphql-request","url":"https://github.com/jasonkuhrt/graphql-request/releases/tag/7.0.0","tags":["GraphQL","library","ReleaseNote"],"content":"graphql-request 7.0リリース。\ncross-fetchのpolyfillを削除、Pure ESMに変更など","relatedLinks":[]},{"category":"Article","title":"Node.js の進化に伴い不要となったかもしれないパッケージたち","url":"https://zenn.dev/morinokami/articles/npm-uninstall","tags":["nodejs","article"],"content":"Node.jsのコアモジュールなどに実装されたパッケージの機能紹介。\nFetch API、`.env`のロード、`util.styleText`、`node:test`、`--watch`フラグ、`glob`、`util.parseArgs`などについて","relatedLinks":[]},{"category":"Article","title":"TypeScript の型検査にかかる時間を短縮した話","url":"https://zenn.dev/knowledgework/articles/speedup-typecheck","tags":["TypeScript","article"],"content":"TypeScriptの型チェックのパフォーマンスチェックと改善について","relatedLinks":[]},{"category":"Article","title":"Misconceptions about CSS Specificity – Bram.us","url":"https://www.bram.us/2024/05/05/misconceptions-about-css-specificity/","tags":["CSS","article"],"content":"CSSのSpecificityについて","relatedLinks":[]},{"category":"Article","title":"Monitor Third-Party Resources that Impact UX with Playwright","url":"https://www.checklyhq.com/blog/how-playwright-can-monitor-third-party-resources/","tags":["browser","test","article"],"content":"PlaywrightのRequest Block/Delayを使ってユーザー影響のあるサードパーティスクリプトを特定する方法について","relatedLinks":[]},{"category":"Article","title":"Why Patching Globals Is Harmful - kettanaito.com","url":"https://kettanaito.com/blog/why-patching-globals-is-harmful","tags":["Fetch","JavaScript","article","opinion"],"content":"Global APIにmonkey patchする弊害について。\nFetch APIの仕様を各種上書きしているReact/Next.js/Bunについて","relatedLinks":[]}]},{"meta":{"title":"2024-05-19のJS: Remix + React Router = React Router、State of HTML 2023","author":"azu","layout":"post","date":"2024-05-19T14:15:49.809Z","category":"JSer","tags":["React","Angular","nodejs","Next.js","safari"],"url":"https://jser.info/2024/05/19/remix-react-router-react-router-state-of-html-2023/"},"items":[{"category":"Headline","title":"WebKit Features in Safari 17.5 | WebKit","url":"https://webkit.org/blog/15383/webkit-features-in-safari-17-5/","tags":["safari","ReleaseNote"],"content":"Safari 17.5の変更点について。\nCSSの`text-wrap: balance`、`light-dark()`、`@starting-style`、`@import <url> supports(<feature>)`のサポート。\nAV1 for WebCodecsのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Firefox 126.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/126.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 126リリース。\nzstdをサポート、CSSの`zoom`プロパティをサポート、`URL.parse()`をサポート、 Screen Wake Lock APIをサポート。\nCustom ElementのCustomStateSetと`:state()`擬似クラスをサポートなど","relatedLinks":[{"title":"Firefox 126 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/126"}]},{"category":"Headline","title":"Node.js — Node v22.2.0 (Current)","url":"https://nodejs.org/en/blog/release/v22.2.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.2.0リリース。\nfs.globが`withFileTypes`をサポート、`--inspect-wait=host:port`をサポート、`--experimental-policy`を削除。\n`node:test`に`test.plan`メソッドの追加など","relatedLinks":[]},{"category":"Headline","title":"Release 8.1.0 · google/zx","url":"https://github.com/google/zx/releases/tag/8.1.0","tags":["nodejs","ShellScript","library","ReleaseNote"],"content":"zx 8.1.0リリース。\nESMとCJSの両方をサポート、Node.js 12から22までサポート、Deno 1.xとの互換性のサポート。\n`usePwsh()`の追加、`$.timeout`のサポート、`--cwd`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v0.21.3 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.21.3","tags":["esbuild","ReleaseNote"],"content":"esbuild v0.21.3リリース。\ndecorator metadata proposalのサポート","relatedLinks":[]},{"category":"Article","title":"Merging Remix and React Router | Remix","url":"https://remix.run/blog/merging-remix-and-react-router","tags":["React","Remix","article"],"content":"RemixはReact Router v7としてリリースする予定という話。\nRemixとReact Routerは、Viteとサーバ以外はほぼ同等の機能になってきている。\nそのため、React RouterをRemixにマイグレーションするのではなく、React RouterをアップデートするだけでRemixの機能を使えるようにしたいという話。\n既存のRemixアプリは、import先のパッケージを`react-router`に変更するだけで動く予定という話。","relatedLinks":[]},{"category":"Article","title":"Angular 17 Update: Control Flow &amp; App Builder Migration - ANGULARarchitects","url":"https://www.angulararchitects.io/blog/angular-17-update-control-flow-app-builder-migration/","tags":["Angular","article"],"content":"Angular 18が2024-05-20にリリースされるため、その前にAngular 17へアップデートしようという記事。\nAngular 17では新しい制御フローやViteへの変更なども含まれていて、アップデート方法について。","relatedLinks":[]},{"category":"Article","title":"Introducing Firebase App Hosting","url":"https://firebase.blog/posts/2024/05/introducing-app-hosting/","tags":["firebase","Next.js","Angular","article"],"content":"Firebase App Hostingについて。\n設定なしでAngularとNext.jsをサポートするCloud Runベースのホスティングサービス","relatedLinks":[]},{"category":"Article","title":"State of HTML 2023","url":"https://2023.stateofhtml.com/en-US/","tags":["HTML","Survey"],"content":"State of HTML 2023の結果が公開された。\nHTMLの要素や属性、Web Components、アクセシビリティ、課題や欲しい機能についてのアンケート","relatedLinks":[]},{"category":"Article","title":"Digging for SSRF in NextJS apps","url":"https://www.assetnote.io/resources/research/digging-for-ssrf-in-nextjs-apps","tags":["Next.js","security","article"],"content":"Next.js 14.1.1で修正されたSSRFの脆弱性について。\nServer Actionsで`redirect()`を使ったパスリダイレクトをしてるAPIがある場合に、Next.jsから任意のURLに対してGETリクエストした内容を取得できるSSRF脆弱性について","relatedLinks":[{"title":"Next.js Server-Side Request Forgery in Server Actions · CVE-2024-34351 · GitHub Advisory Database","url":"https://github.com/advisories/GHSA-fr5h-rqp8-mj6g"},{"title":"azu/nextjs-CVE-2024-34351: poc","url":"https://github.com/azu/nextjs-CVE-2024-34351"}]},{"category":"Article","title":"Introducing the CSS anchor positioning API  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/anchor-positioning-api","tags":["CSS","article"],"content":"CSS Anchor Positioning APIについて。\nコンセプト、基本的な使い方、popover属性や`<dialog>`との組み合わせ、`@position-try`での代替の位置指定、スクロールとの組み合わせなど","relatedLinks":[]},{"category":"Article","title":"React Compiler – React","url":"https://react.dev/learn/react-compiler","tags":["React","babel","document"],"content":"React Compilerが実験的に公開された。\nBabelプラグインとして実装されていて、opt-inでの導入方法や`react-compiler-healthcheck`での互換性のチェック、ESLintプラグインについて書かれている","relatedLinks":[]},{"category":"WebsiteDocument","title":"Web Platform Status","url":"https://webstatus.dev/","tags":["browser","webservice"],"content":"ウェブプラットフォームのブラウザのステータスをまとめてるページ。\n機能ごとのブラウザサポートの表示、検索などができる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"farzher/fuzzysort: Fast SublimeText-like fuzzy search for JavaScript.","url":"https://github.com/farzher/fuzzysort","tags":["JavaScript","search","library"],"content":"fuzzy searchライブラリ","relatedLinks":[]}]},{"meta":{"title":"2024-05-26のJS: Next.js 15 RC、SolidStart 1.0、Angular v18(zoneless)","author":"azu","layout":"post","date":"2024-05-26T14:42:03.718Z","category":"JSer","tags":["CSS","HTTP","PDF","security","Electron"],"url":"https://jser.info/2024/05/26/next.js-15-rc-solidstart-1.0-angular-v18zoneless/"},"items":[{"category":"Headline","title":"Release Release v1.7.0 · axios/axios","url":"https://github.com/axios/axios/releases/tag/v1.7.0","tags":["HTTP","library","JavaScript","ReleaseNote"],"content":"axios v1.7.0リリース。\nFetch APIを使ったadapterを追加など","relatedLinks":[]},{"category":"Headline","title":"Bun v1.1.9 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1.9","tags":["Bun","ReleaseNote"],"content":"Bun v1.1.9リリース。\n最大255 DNSレコードを最大30秒キャッシュするように、`dns.prefetch()`/` dns.getCacheStats()`の追加。\n`bun --no-clear-screen --watch`のサポート、`msw`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release @ark-ui/react@3.0.0 · chakra-ui/ark","url":"https://github.com/chakra-ui/ark/releases/tag/%40ark-ui%2Freact%403.0.0","tags":["JavaScript","React","library","ReleaseNote"],"content":"Ark UI 3.0リリース。\nReact/Vue/Solid対応版がそれぞれリリースされている。\n3.0では`Context`/`Format`コンポーネントの追加、`HiddenInput`の扱いの変更、React 19に対応など","relatedLinks":[]},{"category":"Headline","title":"Next.js 15 RC | Next.js","url":"https://nextjs.org/blog/next-15-rc","tags":["Next.js","ReleaseNote"],"content":"Next.js 15 RCリリース。\nReact 19 RCに対応、React Compilerを実験的にサポート、Hydration Error表示の改善。\nFetch/`GET` Route Handler/Client Routerをデフォルトでキャッシュしないように変更、Partial Prerenderingの`incremental`オプションを追加。\n遅延処理をする`next/after`を追加、`create-next-app`のアップデート。\n非推奨だった`@next/font`のサポート削除など","relatedLinks":[]},{"category":"Headline","title":"SolidStart 1.0: The Shape of Frameworks to Come | SolidJS","url":"https://www.solidjs.com/blog/solid-start-the-shape-frameworks-to-come","tags":["Solid","ReleaseNote"],"content":"SolidStart 1.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Angular v18 is now available!. Today we are excited to share the next… | by Minko Gechev | May, 2024 | Angular Blog","url":"https://blog.angular.dev/angular-v18-is-now-available-e79d5ac0affe","tags":["Angular","ReleaseNote"],"content":"Angular v18リリース。\nzone.jsを使わない変更検知の仕組みを実験的にサポート、Material 3を正式サポート、Deferrable views/Built-in control flowをStableに変更。\nまた、Angular DevToolsの改善などが含まれている","relatedLinks":[]},{"category":"Article","title":"CVE-2024-4367 - Arbitrary JavaScript execution in PDF.js — Codean Labs","url":"https://codeanlabs.com/blog/research/cve-2024-4367-arbitrary-js-execution-in-pdf-js/","tags":["PDF","JavaScript","security","Electron","article"],"content":"細工したPDFファイルをPDF.jsで表示すると任意のJavaScriptが実行できるXSS脆弱性について。\nPDF.js v4.2.67で修正されている。また`isEvalSupported: false`にすることでも回避できる。","relatedLinks":[{"title":"PDF.js vulnerable to arbitrary JavaScript execution upon opening a malicious PDF · CVE-2024-4367 · GitHub Advisory Database","url":"https://github.com/advisories/GHSA-wgrm-67xf-hhpq"}]},{"category":"Article","title":"CSSでチェックボックスやラジオボタンをカスタマイズする 2024年版: Days on the Moon","url":"https://nanto.asablo.jp/blog/2024/05/24/9686885","tags":["HTML","CSS","article"],"content":"チェックボックス（`<input type=\"checkbox\">`）やラジオボタン（`<input type=\"radio\">`）をCSSでカスタマイズする方法について。","relatedLinks":[]},{"category":"Article","title":"A virtual DOM in 200 lines of JavaScript – Marcelo Lazaroni – Developing for the Interwebs","url":"https://lazamar.github.io/virtual-dom/","tags":["JavaScript","DOM","article"],"content":"Virtual DOMを実装しながら仕組みについてみていく記事","relatedLinks":[]},{"category":"Article","title":"Understand errors and warnings better with Gemini  |  Chrome DevTools  |  Chrome for Developers","url":"https://developer.chrome.com/docs/devtools/console/understand-messages","tags":["Chrome","debug","LanguageModel","article"],"content":"Chrome DevToolsのGeminiを使ったエラーの解説機能について。","relatedLinks":[]},{"category":"Article","title":"Rethinking Text Resizing on Web. Airbnb has made significant strides in… | by Steven Bassett | The Airbnb Tech Blog | May, 2024 | Medium","url":"https://medium.com/airbnb-engineering/rethinking-text-resizing-on-web-1047b12d2881","tags":["accessibility","article","CSS"],"content":"Airbnbのアクセシビリティの取り組みとしてテキストサイズ/ズームを考慮して、`rem`を優先として使う意思決定をした背景、テストのアプローチ、Figma/デザイナーとの連携方法についてなど","relatedLinks":[]},{"category":"SlideVideo","title":"esbuild 最適化芸人 - Speaker Deck","url":"https://speakerdeck.com/exoego/esbuild-zui-shi-hua-yun-ren","tags":["Lambda","esbuild","slide"],"content":"esbuildを使ってバンドルサイズを最適化することでAWS LambdaのCold Startの時間を短縮することについてのスライド。","relatedLinks":[{"title":"exoego/esbuild-bundle-analyzer: Analyzes each PR","url":"https://github.com/exoego/esbuild-bundle-analyzer"}]},{"category":"WebsiteDocument","title":"andrico1234/the-dilemmas-youll-face: The Dilemmas You&#039;ll Face When Creating Your First Component Library","url":"https://github.com/andrico1234/the-dilemmas-youll-face?tab=readme-ov-file","tags":["UI","document"],"content":"コンポーネントライブラリを作成する際のガイド。\nライブラリを使う、npmパッケージとしての公開方法、リポジトリの構成、bundlerなどについて","relatedLinks":[]}]},{"meta":{"title":"2024-06-03のJS: vitest v2.0.0-beta.5(browser mode)、Rspack v0.7、ESLint Migrator","author":"azu","layout":"post","date":"2024-06-03T13:18:59.009Z","category":"JSer","tags":["test","book","TypeScript","ESLint","Design"],"url":"https://jser.info/2024/06/03/vitest-v2.0.0-beta.5browser-mode-rspack-v0.7-eslint-migrator/"},"items":[{"category":"Headline","title":"Release v2.0.0-beta.5 · vitest-dev/vitest","url":"https://github.com/vitest-dev/vitest/releases/tag/v2.0.0-beta.5","tags":["vite","test","library","ReleaseNote"],"content":"vitest v2.0.0-beta.5リリース。\n`--merge-reports`がカバレッジをサポート、Promiseベースのmockに対するAssertionの追加、ブラウザモードの改善など","relatedLinks":[]},{"category":"Headline","title":"Prettier 3.3: New Flow features and a lot of bug fixes · Prettier","url":"https://prettier.io/blog/2024/06/01/3.3.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 3.3リリース。\nFlowに追加された`declare name`/`component`構文をサポート、`gql` template literal内のGraphQLをサポート、pnpmの`package.yaml`のサポートなど","relatedLinks":[{"title":"feat: support package.yaml and package.json5 by zkochan · Pull Request #1799 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/pull/1799"}]},{"category":"Headline","title":"Release v4.4.0 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v4.4.0","tags":["Hono","ReleaseNote"],"content":"Hono v4.4.0リリース。\nJSRにパッケージを公開するように、`getConnInfo`を追加、`timeout` middlewareの追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing Rspack v0.7 - Rspack","url":"https://www.rspack.dev/blog/announcing-0-7","tags":["JavaScript","bundler","ReleaseNote"],"content":"Rspack v0.7リリース。\nLazy Compilationのサポート、CSSビルドのパフォーマンス改善。\nUnstableなJavaScript APIを非推奨化、`@import`は他のルールよりも前にあるかをチェックするように。","relatedLinks":[{"title":"Release v0.7.0 · web-infra-dev/rspack","url":"https://github.com/web-infra-dev/rspack/releases/tag/v0.7.0"}]},{"category":"Headline","title":"Deno 1.44: Private npm registries, improved Node.js compat, and performance boosts","url":"https://deno.com/blog/v1.44","tags":["dneo","ReleaseNote"],"content":"Deno v1.44リリース。\n`.npmrc`を使ったprivate npm registryのサポート、gRPC接続のサポート、V8のポインター圧縮によるメモリ使用量の削減。\n`Deno.exitCode`をStable化、`Response.prototype.bytes()`のサポートなど","relatedLinks":[]},{"category":"Article","title":"Introducing the ESLint Configuration Migrator - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2024/05/eslint-configuration-migrator/","tags":["ESLint","article"],"content":"ESLint 9のFlatConfigへ移行するためのマイグレーションツールが公開された","relatedLinks":[]},{"category":"Article","title":"Live types in a TypeScript monorepo","url":"https://colinhacks.com/essays/live-types-typescript-monorepo","tags":["TypeScript","article"],"content":"monorepo内でパッケージとして分けたTypeScriptのコードをビルドなしで参照する方法について。\n`exports`と`tsconfig-paths`を使った方法、`publishConfig`と組み合わせてnpm registryにもpubilsh可能な手法について","relatedLinks":[]},{"category":"Article","title":"How 1Password Used Esbuild to Cut Browser Extension Build Times | 1Password","url":"https://blog.1password.com/new-extension-build-system/","tags":["TypeScript","esbuild","article"],"content":"esbuildのbundleとtscを使った型チェックを並列で実行するパターン、esbuildのMetafileを使ってbundle sizeを分析する方法について","relatedLinks":[]},{"category":"Book","title":"デジタル庁デザインシステムβ版","url":"https://design.digital.go.jp/","tags":["Design","accessibility","figma","document"],"content":"デジタル庁のデザインシステム。\nデザイン、コンポーネント、ガイドライン、アクセシビリティについてまとめられている","relatedLinks":[]},{"category":"Book","title":"テスト自動化実践ガイド 継続的にWebアプリケーションを改善するための知識と技法 | 末村 拓也 | 本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4798172359/","tags":["E2E","test","playwright","book"],"content":"2024年7月30日発売\nCodeceptJSとPlaywrightを使ったE2Eテストについての書籍","relatedLinks":[]},{"category":"Book","title":"React 19の新機能まるわかり","url":"https://zenn.dev/uhyo/books/react-19-new","tags":["React","book"],"content":"React 19の変更点についてまとめた書籍。\nActionと`useTransition`、`useActionState`、`useOptimistic`、`use`などのHooksについて。\nまた、`<title>`などの対応、refCallback、Contextやrefの変更、`onCaughtError`オプションについてなど","relatedLinks":[{"title":"React 19を概念から理解する - Speaker Deck","url":"https://speakerdeck.com/player/98422ddec1914f339c53f9c299f80ce6?title=false&skipResize=true"}]}]},{"meta":{"title":"2024-06-13のJS: Storybook 8.1、Turborepo 2.0、Node v22.3.0(Snapshot Testing)","author":"azu","layout":"post","date":"2024-06-13T04:55:14.651Z","category":"JSer","tags":["nodejs","TypeScript","Tools","test","RegExp"],"url":"https://jser.info/2024/06/13/storybook-8.1-turborepo-2.0-node-v22.3.0snapshot-testing/"},"items":[{"category":"Headline","title":"Announcing TypeScript 5.5 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-5-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.5 RCリリース。\n関数からtype predicatesを推論できるようになり、`Array.prototype.filter`などでの絞り込みが簡潔に書けるように。\nStage 3のSet Methodsをサポート。\nJSDocで`@import {foo} from \"foo\"`をサポート、正規表現の基本的な構文チェックをサポート、`isolatedDeclarations`をサポート。\n設定ファイル内で`${configDir}`のテンプレート値をサポート。\n`typescript`パッケージのサイズを削減、Named Importをサポート、`transpileDeclaration` APIの追加。\n`transpileModule`と`transpileDeclaration`でのビルド時間を改善。\n`out`や`target: ES3`などの非推奨となっていたオプションが無効化され、`ignoreDeprecations`オプションを指定しないと利用できなくなる変更など","relatedLinks":[]},{"category":"Headline","title":"Release CLI v1.8.0 · biomejs/biome","url":"https://github.com/biomejs/biome/releases/tag/cli%2Fv1.8.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"Biome v1.8.0リリース。\n`biome clean`コマンドを追加、`biome lint`に`--only`と`--skip`フラグを追加、CSSのformatとlintをサポートなど","relatedLinks":[]},{"category":"Headline","title":"power-assert-monorepo/packages/node at main · twada/power-assert-monorepo","url":"https://github.com/twada/power-assert-monorepo/tree/main/packages/node","tags":["nodejs","JavaScript","test","library"],"content":"Node.jsの`--import`に対応したpower-assert","relatedLinks":[]},{"category":"Headline","title":"Storybook 8.1","url":"https://storybook.js.org/blog/storybook-8-1/","tags":["JavaScript","UI","test","ReleaseNote"],"content":"Storybook 8.1リリース。\nStoryファイルを作成するUIの追加、Subpath importsを使ったモックの対応、Playwright Component Testの対応。\nReact 19/Angular 18のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0 · tinylibs/tinypool","url":"https://github.com/tinylibs/tinypool/releases/tag/v1.0.0","tags":["nodejs","library","ReleaseNote"],"content":"tinypool 1.0.0リリース。\nNode.jsの`worker_threads`のWorker Poolの実装ライブラリ","relatedLinks":[]},{"category":"Headline","title":"Turborepo 2.0","url":"https://turbo.build/blog/turbo-2-0","tags":["JavaScript","monorepo","Tools","ReleaseNote"],"content":"Turborepo 2.0リリース。\nターミナルUIの刷新、`persistent`オプションの追加、`turbo watch`の追加、ドキュメントの刷新など。","relatedLinks":[]},{"category":"Headline","title":"Firefox 127.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/127.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 127リリース。\n`<base>`要素に`data:`と`javascript:`が指定できないように変更、Stage 3のSet Methodsをサポート、async Clipboard APIのサポートなど","relatedLinks":[{"title":"Firefox 127 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/127"}]},{"category":"Headline","title":"Node.js — Node v22.3.0 (Current)","url":"https://nodejs.org/en/blog/release/v22.3.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.3.0リリース。\n`Buffer`に`bytes()`を実装、experimentalフラグ付きでTest RunnerでのSnapshot Testingを実装、`NODE_RUN_SCRIPT_NAME`を追加など","relatedLinks":[]},{"category":"Headline","title":"News from WWDC24: WebKit in Safari 18 beta | WebKit","url":"https://webkit.org/blog/15443/news-from-wwdc24-webkit-in-safari-18-beta/","tags":["webkit","safari","ReleaseNote"],"content":"Safari 18 betaの変更点について。\nView Transition APIのサポート、Style Queriesのサポート、`@starting-style`と　`display: none`の組み合わせをサポート。\n`justify-content: safe center`のサポート、`content-visibility`をサポート。\n`<input type=date>`のアクセシビリティの改善、`URL.parse()`のサポート、JPEG2000のサポートを削除など","relatedLinks":[]},{"category":"Article","title":"Data Fetching Patterns in Single-Page Applications","url":"https://martinfowler.com/articles/data-fetch-spa.html","tags":["React","article"],"content":"ReactのクライアントサイドでのData Fetchのパターンについて","relatedLinks":[]},{"category":"Article","title":"Mastering Node.js Performance Hooks","url":"https://pavel-romanov.com/nodejs-performance-hooks-mastering-the-mental-model","tags":["nodejs","performance","article"],"content":"ユーザーの端末の影響を受けるwall clockとパフォーマンスの計測に適したmonotonic clockについて。\nNode.jsの`perf_hooks`モジュールで利用できる`PerformanceObserver`では monotonic clockの時間を取得でき、基本的な使い方についてなど","relatedLinks":[]},{"category":"Article","title":"WebAssembly JSPI has a new API · V8","url":"https://v8.dev/blog/jspi-newapi","tags":["WebAssembly","Promises","article"],"content":"WebAssemblyのJavaScript Promise Integrationについて","relatedLinks":[]},{"category":"Article","title":"TypeScriptの型と値とバリデーション","url":"https://zenn.dev/mizchi/articles/typescript-type-value-validation","tags":["JavaScript","TypeScript","article"],"content":"TypeScriptは基本的にはJavaScriptへ型情報を付与するだけであるため、Runtimeの動作としてはJavaScriptと変わらないという話。\nバリデーションと型について","relatedLinks":[{"title":"TypeScript Design Goals · microsoft/TypeScript Wiki","url":"https://github.com/microsoft/TypeScript/wiki/TypeScript-Design-Goals"}]},{"category":"SoftwareLibrary","title":"slevithan/regex: Context-aware regex template tag with best practices built-in and advanced features","url":"https://github.com/slevithan/regex","tags":["JavaScript","RegExp","library"],"content":"正規表現をTagged Templateで書けるライブラリ","relatedLinks":[]}]},{"meta":{"title":"2024-06-22のJS: Nuxt 2 EOL、TypeScript 5.5、State of JavaScript 2023の結果","author":"azu","layout":"post","date":"2024-06-22T06:30:30.339Z","category":"JSer","tags":["Vue","ECMAScript","nodejs","Chrome","proposal"],"url":"https://jser.info/2024/06/22/nuxt-2-eol-typescript-5.5-state-of-javascript-2023/"},"items":[{"category":"Headline","title":"Nuxt 2 End-of-Life (EOL) · Nuxt Blog","url":"https://nuxt.com/blog/nuxt2-eol","tags":["Vue","news"],"content":"Nuxt 2は2024年6月30日でEnd-of-Life (EOL)となる。\nNuxt 2.xの最終版となる2.18.0が6月末にリリースされる予定","relatedLinks":[]},{"category":"Headline","title":"Nuxt 3.12 · Nuxt Blog","url":"https://nuxt.com/blog/v3-12","tags":["Vue","ReleaseNote"],"content":"Nuxt v3.12リリース。\nNuxt 4の動作をopt-inして試せる`compatibilityVersion: 4`オプションの追加、`multiApp`オプションの追加、不要になったexprimentalオプションの削除など","relatedLinks":[{"title":"Upgrade Guide · Get Started with Nuxt","url":"https://nuxt.com/docs/getting-started/upgrade#testing-nuxt-4"}]},{"category":"Headline","title":"New in Chrome 126  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/new-in-chrome-126?hl=en","tags":["Chrome","ReleaseNote"],"content":"Chrome 126リリース。\nCross-document view transitionsのサポート、CloseWatcher APIを再有効化。\nimport assertionの`assert`構文を削除など","relatedLinks":[{"title":"Chrome 126  |  Release notes  |  Chrome for Developers","url":"https://developer.chrome.com/release-notes/126"}]},{"category":"Headline","title":"Electron 31.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-31-0","tags":["Electron","ReleaseNote"],"content":"Electron 31リリース。\nChromium 125、Node.js 20.14、V8 12.6へアップデート。\nWebSQLの削除、File System APIのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release Version 8.12.0 · acornjs/acorn","url":"https://github.com/acornjs/acorn/releases/tag/8.12.0","tags":["JavaScript","ECMAScript","ReleaseNote"],"content":"acorn 8.12.0リリース。\nES2025のduplicate capture group names in regular expressionsをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Bun v1.1.13 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1.13","tags":["Bun","ReleaseNote"],"content":"Bun v1.1.13リリース。\n`worker_thread`の`eval`オプションをサポート、`URL.createObjectURL`のサポート、`expect`のカスタムメッセージをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Version 4.0 released : Node-RED","url":"https://nodered.org/blog/2024/06/20/version-4-0-released","tags":["nodejs","ReleaseNote"],"content":"Node-RED 4.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.5 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-5/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.5リリース。\n関数からtype predicatesを推論できるようになり、`Array.prototype.filter`などでの絞り込みが簡潔に書けるように。\nStage 3のSet Methodsをサポート。\nJSDocで`@import {foo} from \"foo\"`をサポート、正規表現の基本的な構文チェックをサポート、`isolatedDeclarations`をサポート。\n設定ファイル内で`${configDir}`のテンプレート値をサポート。\n`typescript`パッケージのサイズを削減、Named Importをサポート、`transpileDeclaration` APIの追加。\n`transpileModule`と`transpileDeclaration`でのビルド時間を改善。\n`out`や`target: ES3`などの非推奨となっていたオプションが無効化され、`ignoreDeprecations`オプションを指定しないと利用できなくなる変更など","relatedLinks":[]},{"category":"Article","title":"ECMAScript proposal updates @ 2024-06 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2024/06/15/ecmascript-proposal-update","tags":["ECMAScript","proposal","article"],"content":"2024年6月のTC39 MeetingにおけるECMAScript Proposalのステータス変更のまとめ。","relatedLinks":[]},{"category":"Article","title":"Codemod partnering with the React team","url":"https://codemod.com/blog/react-announcement","tags":["React","article"],"content":"React 19に関するcodemod","relatedLinks":[{"title":"codemod/packages/codemods/react/19 at main · codemod-com/codemod","url":"https://github.com/codemod-com/codemod/tree/main/packages/codemods/react/19"}]},{"category":"Article","title":"Build Stunning Responsive Card Tables with CSS4 &amp; CSS5 - DEV Community","url":"https://dev.to/subu_hunter/build-stunning-responsive-card-tables-with-css4-css5-1fai","tags":["CSS","article"],"content":"Tableとscroll-snapを使ったカヌーセル的なカード型のテーブルデザインについて","relatedLinks":[]},{"category":"Article","title":"Node.js Security Progress Report: Redefining Security Processes and Key Initiatives | OpenJS Foundation","url":"https://openjsf.org/blog/nodejs-security-progress-report-may-2024?utm_content=297186945&utm_medium=social&utm_source=twitter&hss_channel=tw-91985735","tags":["nodejs","article"],"content":"Node.jsのセキュリティについてのレポート。\n`--experimental-policy`の削除、Permission ModelのInitiative phaseの完了など","relatedLinks":[]},{"category":"Article","title":"State of JavaScript 2023","url":"https://2023.stateofjs.com/en-US/","tags":["JavaScript","Survey"],"content":"State of JavaScript 2023の結果が公開された。\nJavaScriptの言語機能、フレームワーク、ツール、テスト、TypeScriptなどについてのアンケート","relatedLinks":[]}]},{"meta":{"title":"2024-07-01のJS: ES2024、Playwright v1.45.0、e18e(Ecosystem Performance) ","author":"azu","layout":"post","date":"2024-07-01T13:22:00.731Z","category":"JSer","tags":["ECMAScript","React","npm","nodejs","TypeScript"],"url":"https://jser.info/2024/07/01/es2024-playwright-v1.45.0-e18eecosystem-performance/"},"items":[{"category":"Headline","title":"Node.js — Node v20.15.0 (LTS)","url":"https://nodejs.org/en/blog/release/v20.15.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v20.15.0リリース。\n`node:test`が`plan`メソッドをサポート、`--inspect-wait`フラグを追加、`zlib.crc32()`を追加、`--disable-wasm-trap-handler`フラグを追加など","relatedLinks":[]},{"category":"Headline","title":"Release ES2024 Candidate February 28th 2024 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2024-candidate-2024-02-28","tags":["ECMAScript","news"],"content":"ECMAScript 2024がEcma GAで承認されたため正式にリリースされた。","relatedLinks":[{"title":"Ecma International approves ECMAScript 2024: What’s new?","url":"https://2ality.com/2024/06/ecmascript-2024.html"}]},{"category":"Headline","title":"Announcing Rspack v1.0 Alpha - Rspack","url":"https://www.rspack.dev/blog/announcing-1-0-alpha","tags":["rspack","ReleaseNote"],"content":"Rspack 1.0 Aplhaリリース\n`optimization.concatenateModule`の有効化、Lightning CSSをビルトインサポート。\nオプションを一部変更など","relatedLinks":[]},{"category":"Headline","title":"Release Version 17.0.0 Release Notes · facebook/relay","url":"https://github.com/facebook/relay/releases/tag/v17.0.0","tags":["GraphQL","React","library","ReleaseNote"],"content":"Relay v17.0.0リリース。\nSchema Validationの追加、explicit error handlingとsemantic nullabilityを実験的に追加など","relatedLinks":[]},{"category":"Headline","title":"Release v1.45.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.45.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.45.0リリース。\n時間を操作できるClock APIの追加、`--fail-on-flaky-tests`フラグの追加、`testConfig. respectGitIgnore`の追加など","relatedLinks":[]},{"category":"Headline","title":"Introducing React-Admin V5","url":"https://marmelab.com/blog/2024/06/20/react-admin-v5.html","tags":["React","library","ReleaseNote"],"content":"React-admin v5 リリース","relatedLinks":[{"title":"Release 5.0.0 · marmelab/react-admin","url":"https://github.com/marmelab/react-admin/releases/tag/v5.0.0"}]},{"category":"Headline","title":"Polyfill supply chain attack hits 100K+ sites","url":"https://sansec.io/research/polyfill-supply-chain-attack","tags":["JavaScript","polyfill","security","news"],"content":"`polyfill.io`から読み込んでるコードにはマルウェア的なバックドアが含まれるようになったという話。","relatedLinks":[]},{"category":"Article","title":"New JavaScript Set methods | MDN Blog","url":"https://developer.mozilla.org/en-US/blog/javascript-set-methods/","tags":["JavaScript","ECMAScript","article"],"content":"ES2025に入るSet Methodsについて。\nFirefox 127で実装されている","relatedLinks":[]},{"category":"Article","title":"TypeScript v4.9からv5.5で追加された機能のおさらい - STORES Product Blog","url":"https://product.st.inc/entry/2024/06/24/152109","tags":["TypeScript","article"],"content":"最近のTypeScriptに追加された構文や型推論の機能について","relatedLinks":[]},{"category":"Article","title":"Ecma International approves ECMAScript 2024: What’s new?","url":"https://2ality.com/2024/06/ecmascript-2024.html","tags":["ECMAScript","article"],"content":"ES2024で追加された機能や構文についてのまとめ。\n`Object.groupBy`/`Map.groupBy`、`Promise.withResolvers`、`ArrayBuffers.prototype.resize`、`Atomics.waitAsync`など","relatedLinks":[]},{"category":"Article","title":"Bun の非互換な拡張 API - moriken&#039;s project","url":"https://scrapbox.io/petamoriken/Bun_%E3%81%AE%E9%9D%9E%E4%BA%92%E6%8F%9B%E3%81%AA%E6%8B%A1%E5%BC%B5_API","tags":["Bun","article"],"content":"Bunの非標準な拡張APIについて","relatedLinks":[]},{"category":"Article","title":"Migrating to Next.js App Router with zero downtime — WorkOS","url":"https://workos.com/blog/migrating-to-next-js-app-router-with-zero-downtime","tags":["Next.js","article"],"content":"Next.jsのPages RouterからApp Routerへの段階的な移行方法について。\n\n1. Next.jsのアップデート\n2. `useRouter`の移行\n3. 一時的な`/app/new`を作成\n4. `rewrites`を使ってクエリでのリダイレクト\n5. `/pages`の削除\n\nという手順で移行する方法について","relatedLinks":[]},{"category":"Article","title":"React 19 and Suspense - A Drama in 3 Acts | TkDodo&#039;s blog","url":"https://tkdodo.eu/blog/react-19-and-suspense-a-drama-in-3-acts","tags":["React","article"],"content":"React 19 RCでのSuspense内の挙動の変更について。\nfetch-on-renderとrender-as-your-fetchのパターン、Fetch以外の非同期処理、React 19での修正予定についてなど","relatedLinks":[]},{"category":"Article","title":"Inline conditionals in CSS, now? • Lea Verou","url":"https://lea.verou.me/blog/2024/css-conditionals-now/","tags":["CSS","article"],"content":"CSSでif文を表現するテクニックについて。\nBinary Linear Interpolation、Toggles、Paused animations、Type Grinding、Variable animation nameなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"e18e/e18e","url":"https://github.com/e18e/e18e","tags":["JavaScript","npm","performance","document"],"content":"JavaScriptのパッケージに関するガイドライン。\n依存を最新化するcleanup、無駄な依存を減らすspeedup、代替え方法を提供するlevelupという項目でそれぞれガイドが書かれている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"es-tooling/eslint-plugin-depend: An ESLint plugin for suggesting optimisations in choice of dependency, native equivalents, etc.","url":"https://github.com/es-tooling/eslint-plugin-depend","tags":["ESLint","plugin","npm"],"content":"ネイティブで利用できるため無駄な依存やメンテナンスされていないパッケージなどを検出するESLintルール","relatedLinks":[]}]},{"meta":{"title":"2024-07-11のJS: esbuild v0.22/0.23、Node.js 22.4.0、pnpm 9.5 Catalogs","author":"azu","layout":"post","date":"2024-07-11T00:56:49.385Z","category":"JSer","tags":["nodejs","TypeScript","pnpm","esbuild","Bun"],"url":"https://jser.info/2024/07/11/esbuild-v0.220.23-node.js-22.4.0-pnpm-9.5-catalogs/"},"items":[{"category":"Headline","title":"Release v0.22.0 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.22.0","tags":["esbuild","ReleaseNote"],"content":"esbuild v0.22.0リリース。\n`--platform=node`を指定した時に`--package=external`をデフォルトにしたが、AWS CDKなどで問題が起きたため0.23.0では元の挙動へとrevertされている。\nWindows7,8など古いOSのサポート終了、`es2024`のサポート、`@esbuild/wasi-preview1`パッケージの公開など","relatedLinks":[{"title":"Release v0.23.0 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.23.0"}]},{"category":"Headline","title":"Bun v1.1.18 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1.18","tags":["Bun","ReleaseNote"],"content":"Bun v1.1.18リリース。\n`.npmrc`のサポート、`enum`のinliningの対応、定数のfoldingの改善など","relatedLinks":[]},{"category":"Headline","title":"Release 2024-07-02, Version 22.4.0 (Current), @targos · nodejs/node","url":"https://github.com/nodejs/node/releases/tag/v22.4.0","tags":["nodejs","ReleaseNote"],"content":"Node.js 22.4.0リリース。\n実験的にWeb Storage API(`localStorage`/`sessionStorage`)のサポート、WebSocket APIをStableに変更など","relatedLinks":[]},{"category":"Headline","title":"Support typescript with --experimental-strip-types · Issue #208 · nodejs/loaders","url":"https://github.com/nodejs/loaders/issues/208","tags":["nodejs","TypeScript","issue"],"content":"Node.jsでTypeScriptのコード実行のサポートに関する議論が行われているIssue","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 9.5 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v9.5.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v9.5.0リリース。\n複数のパッケージのバージョンをまとめて管理できるcatalogs機能を追加など","relatedLinks":[]},{"category":"Headline","title":"Node.js — Monday, July 8, 2024 Security Releases","url":"https://nodejs.org/en/blog/vulnerability/july-2024-security-releases","tags":["nodejs","security","ReleaseNote"],"content":"Node.jsのセキュリティアップデートとして\n\n- Node v22.4.1 (Current)\n- Node v20.15.1 (LTS)\n- Node v18.20.4 (LTS)\n\nがリリースされている。","relatedLinks":[]},{"category":"Article","title":"What&#039;s coming next for ESLint - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2024/07/whats-coming-next-for-eslint/","tags":["ESLint","article"],"content":"ESLintの今後について。\n今まではJavaScriptのみをターゲットにしていたが、language pluginsによってjs以外の言語にも対応できるようにしたという話","relatedLinks":[]},{"category":"Article","title":"Ladybird","url":"https://ladybird.org/announcement/","tags":["browser","article"],"content":"LadybirdというSerenityOSの中で開発されていたブラウザがプロジェクトとして独立した。\nChromiumやWebKitなど既存のエンジンを使わずに一から書いているブラウザプロジェクト","relatedLinks":[{"title":"SerenityOS","url":"https://serenityos.org/"}]},{"category":"Article","title":"pnpm 9.5 Introduces Catalogs: Shareable Dependency Version Specifiers - Socket","url":"https://socket.dev/blog/pnpm-9-5-introduces-catalogs-shareable-dependency-version-specifiers","tags":["pnpm","article"],"content":"pnpm 9.5で導入されたカタログ機能について。\nmonorepoで同じパッケージのバージョンを参照させるパッケージのカタログを定義できる","relatedLinks":[]},{"category":"Article","title":"ESModules プラットフォームとエコシステムの狭間で | poteboy","url":"https://poteboy.dev/posts/20240708-esm-platform-and-ecosystem","tags":["ECMAScript","module","article"],"content":"モジュールの評価グラフとBundlerでのTop-Level awaitの扱いについて","relatedLinks":[]},{"category":"Article","title":"How to use container queries now  |  Blog  |  web.dev","url":"https://web.dev/blog/how-to-use-container-queries-now?hl=en","tags":["CSS","article"],"content":"CSSのcontainer queryについて","relatedLinks":[]},{"category":"Article","title":"Understanding React Compiler | Tony Alicea","url":"https://tonyalicea.dev/blog/understanding-react-compiler/","tags":["React","article"],"content":"React Compilerについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Web Performance Guide | SpeedCurve","url":"https://www.speedcurve.com/web-performance-guide/","tags":["performance","document"],"content":"ウェブパフォーマンスについてのサイト。\nビジネスのメトリクスとしてのパフォーマンス、WebVitals、最適化の手法について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"OpenAPI TypeScript","url":"https://openapi-ts.dev/","tags":["TypeScript","OpenAPI","Tools","library"],"content":"OpenAPIのスキーマからTypeScriptの型定義やFetchするクライアントを扱えるツール/ライブラリ","relatedLinks":[]}]},{"meta":{"title":"2024-07-18のJS: #700 - Vitest 2.0.0、Node.js 22.5.0(sqlite)、Private Browsing Mode","author":"azu","layout":"post","date":"2024-07-18T01:03:45.614Z","category":"JSer","tags":["nodejs","deno","Tools","Bun","test"],"url":"https://jser.info/2024/07/18/700-vitest-2.0.0-node.js-22.5.0sqlite-private-browsing-mode/"},"items":[{"category":"Headline","title":"Deno 1.45: Workspace and Monorepo Support","url":"https://deno.com/blog/v1.45","tags":["deno","ReleaseNote"],"content":"Deno v1.45リリース。\nnpm workspacesのサポート、Node.jsのコアパッケージとの互換性の向上、`--frozen`フラグの追加。\n`DENO_FUTURE=1`で`deno install <pkg>`ローカルにインストールするように変更、npm life-cycle scriptのサポート。\n`deno init --lib`でJSRに対応したプロジェクトのセットアップをサポート、`deno vendor`を非推奨化。","relatedLinks":[]},{"category":"Headline","title":"Firefox 128.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/128.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 128リリース。\nCSSのRelative color構文をサポート、`content`でのalt textをサポート。\n`ArrayBuffer.prototype.resize()`のサポート、`CSS.registerProperty()`のサポート。\n実験フラグ付きでCookies Having Independent Partitioned State (CHIPS)をサポートなど","relatedLinks":[{"title":"Firefox 128 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/128"}]},{"category":"Headline","title":"Bun v1.1.19 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1.19","tags":["Bun","ReleaseNote"],"content":"Bun v1.1.19リリース。\nWindowsでFTL JITが有効化、Raspberry Pi 4のサポート、`pacakge.json`のインデントを維持するように変更など","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · vitest-dev/vitest","url":"https://github.com/vitest-dev/vitest/releases/tag/v2.0.0","tags":["vite","test","ReleaseNote"],"content":"vitest v2.0.0リリース。\n非推奨のオプションを削除、一部オプションのデフォルト値の変更。\nbrower modeの改善、`expect.poll `の追加、`test.for`の追加など","relatedLinks":[{"title":"Migration Guide | Guide | Vitest","url":"https://vitest.dev/guide/migration.html#migrating-to-vitest-2-0"}]},{"category":"Headline","title":"Node.js — Node v22.5.0 (Current)","url":"https://nodejs.org/en/blog/release/v22.5.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.5.0リリース。\n`node:sqlite`モジュールの追加、`--experimental-require-module`で`__esModule`プロパティを考慮するように、`matchesGlob`メソッドの追加。\n`worker_threads`に`postMessageToThread`メソッドを追加など","relatedLinks":[]},{"category":"Headline","title":"Second Beta of jQuery 4.0.0 | Official jQuery Blog","url":"https://blog.jquery.com/2024/07/17/second-beta-of-jquery-4-0-0/","tags":["jQuery","ReleaseNote"],"content":"jQuery 4.0.0 beta 2リリース。\nESM Wrapperを使ったdual packagesのサポート、`hidden`属性などのbooleanと値を扱う属性のハンドリングのために`.attr`でboolean値の特別な処理を削除など","relatedLinks":[]},{"category":"Article","title":"Moving from express to fastify, pt 1","url":"https://blog.val.town/blog/fastify/","tags":["nodejs","article"],"content":"expressからfastifyへの段階的な移行について。\n`@fastify/express`を使うことでルーティングごとに移行していった話","relatedLinks":[]},{"category":"Article","title":"Private Browsing 2.0 | WebKit","url":"https://webkit.org/blog/15697/private-browsing-2-0/","tags":["safari","privacy","article"],"content":"SafariのPrivate Browsingモードについて。\nSafari 17では、Link Tracking Protection、CNAME-cloakingの対策、Fingerpritingの対策。\nまた、third-party IPアドレスを使ったcloakingの対策、Storageやblob URLsのparititionなども行われている。","relatedLinks":[]},{"category":"Article","title":"Reading and writing Node.js streams","url":"https://blog.platformatic.dev/a-guide-to-reading-and-writing-nodejs-streams","tags":["nodejs","stream","article"],"content":"Node.js Streamについて。\nStreamの用途、Backpressure、基本的な読み込み、Async Iteratorを使った処理方法についてなど","relatedLinks":[]},{"category":"Article","title":"Misconceptions about view transitions  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/view-transitions-misconceptions?hl=en","tags":["Chrome","article"],"content":"View Transition APIの現状の動作について。\nView Transition APIとスナップショットの動作、`blocking=render`との組み合わせについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"Mako - Extremely fast, Production-grade web bundler","url":"https://makojs.dev/","tags":["webpack","bundler","Rust","Tools","JavaScript"],"content":"Rustで書かれたbundler","relatedLinks":[{"title":"Mako - Mako is Now Open Source","url":"https://makojs.dev/blog/mako-open-sourced"}]},{"category":"WebsiteDocument","title":"toss/es-toolkit: A modern JavaScript utility library that&#039;s 2-3 times faster and up to 97% smaller—a major upgrade to lodash.","url":"https://github.com/toss/es-toolkit?tab=readme-ov-file","tags":["JavaScript","library"],"content":"lodash的なutilityライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mjackson/fetch-super-headers: A drop-in replacement for JavaScript \\`Headers\\` with type-safe access","url":"https://github.com/mjackson/fetch-super-headers","tags":["TypeScript","library"],"content":"Type Safeな`Headers`互換のライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Poku - Making Testing Easy","url":"https://poku.io/","tags":["JavaScript","nodejs","Bun","deno","test","library"],"content":"Node.js/Bun/Denoで動作するテストフレームワーク。\n外部依存を最小限にして下位互換性を意識して作られており、assertionやサーバプロセスとの連携などテストフレームワークとして必要な機能を揃えている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"CSS Grid Generator","url":"https://cssgridgenerator.io/","tags":["CSS","Tools"],"content":"CSS Gridジェネレータ","relatedLinks":[]},{"category":"Book","title":"動かして学ぶ！Next.js/React開発入門 | 三好アキ | 本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4798184675/","tags":["React","Next.js","book"],"content":"2024年09月19日発売\nNext.jsについての書籍","relatedLinks":[]}]},{"meta":{"title":"2024-07-29のJS: TypeScript 5.6 Beta、Node.jsの実験的なTypeScriptサポート、State of React 2023","author":"azu","layout":"post","date":"2024-07-29T01:18:59.277Z","category":"JSer","tags":["nodejs","ECMAScript","React","TypeScript","Conference"],"url":"https://jser.info/2024/07/29/typescript-5.6-beta-node.jstypescript-state-of-react-2023/"},"items":[{"category":"Headline","title":"Node.js — Node v22.5.1 (Current)","url":"https://nodejs.org/en/blog/release/v22.5.1","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.5.1リリース。\nNode.js v22.5.0に含まれていた`npm ci`などがクラッシュするリグレッションを修正","relatedLinks":[{"title":"Fix the bug caused by fast api changes in v22.5.0 and have a post-mortem by anonrig · Pull Request #53934 · nodejs/node","url":"https://github.com/nodejs/node/pull/53934?hss_channel=tw-91985735"}]},{"category":"Headline","title":"Release pnpm 9.6 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v9.6.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v9.6.0リリース。\n`pnpm.executionEnv.nodeVersion`でNode.jsのバージョンを指定できるように。\n`catalogs:`のサポートの改善や修正など","relatedLinks":[]},{"category":"Headline","title":"It&#039;s official, Meteor 3.0 Official Release is out! - announce - Meteor.js forums","url":"https://forums.meteor.com/t/its-official-meteor-3-0-official-release-is-out/61860","tags":["JavaScript","library","ReleaseNote","nodejs"],"content":"Meteor.js 3.0リリース。\n非同期の対応改善、Node.js 20のサポート、Expressのmiddlewareに対応など","relatedLinks":[{"title":"Meteor 3.0 Migration Guide | Meteor 3.0 Migration Guide","url":"https://v3-migration-docs.meteor.com/"}]},{"category":"Headline","title":"July 22, 2024 Release – React Spectrum Releases","url":"https://react-spectrum.adobe.com/releases/2024-07-22.html","tags":["React","library","ReleaseNote"],"content":"React Spectrum July 22, 2024リリース。\nReact 19 RCの対応、TableView/ListView/ListBoxのVirtualizationの改善、Toastのfocus managementの改善など。\nアイコンをApache 2.0 Licenseに変更など","relatedLinks":[]},{"category":"Headline","title":"A new path for Privacy Sandbox on the web","url":"https://privacysandbox.com/news/privacy-sandbox-update/","tags":["Chrome","privacy","news"],"content":"Chromeの3rd Party Cookie廃止計画は撤回することになった。","relatedLinks":[]},{"category":"Headline","title":"Sass: Node Sass is end-of-life","url":"https://sass-lang.com/blog/node-sass-is-end-of-life/","tags":["nodejs","Sass","news"],"content":"LibSassのNode.jsラッパーであるNode Sassのサポートが終了された。\nDartSassがアクティブメンテナンスされているため、そちらへの移行を推奨している","relatedLinks":[]},{"category":"Headline","title":"Bun v1.1.21 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1.21","tags":["Bun","ReleaseNote"],"content":"Bun v1.1.21リリース。\n`--fetch-preconnect=<url>`フラグの追加、Remixの対応改善、`bun build --packages=external`の追加など","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v20.16.0 (LTS)","url":"https://nodejs.org/en/blog/release/v20.16.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v20.16.0リリース。\n`process.getBuiltinModule(id)`を追加、OpenSSLのカスタムエンジンサポートの廃止に伴い `clientCertEngine` オプションを非推奨に変更など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.6 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-6-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.6 Betaリリース。\nESLintの`no-constant-binary-expression`と似た常にtrue/nullishとなる間違った書き方をエラーにする変更、Iterator Helperのサポート。\nES2022のArbitrary module namespace identifier namesをサポート、`--noUncheckedSideEffectImports`フラグの追加。\n型チェックせずにファイルを出力できる`--noCheck`フラグの追加など","relatedLinks":[{"title":"Interesting bugs caught by no-constant-binary-expression - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2022/07/interesting-bugs-caught-by-no-constant-binary-expression/"}]},{"category":"Headline","title":"Astro 4.12: Server Islands | Astro","url":"https://astro.build/blog/astro-4120/","tags":["astro","ReleaseNote"],"content":"Astro 4.12リリース。\nNext.jsのPartial Prerenderingに類似する機能としてServer Islandsを実験的に追加、`inferRemoteSize`の追加など","relatedLinks":[]},{"category":"Article","title":"CSS Grid Areas","url":"https://ishadeed.com/article/css-grid-area/","tags":["CSS","article"],"content":"CSS Gridについての解説。\ngrid-template-areasを使ったGridのレイアウト方法について色々な例とともに解説している","relatedLinks":[]},{"category":"Article","title":"State of React 2023","url":"https://2023.stateofreact.com/en-US","tags":["React","Survey"],"content":"State of React 2023の結果が公開された。\nReactの機能、状態管理、データ取得、Meta-Framework、どのようなアプリケーションを作っているかについてなど","relatedLinks":[]},{"category":"SlideVideo","title":"JSConf Budapest 2024 - YouTube","url":"https://www.youtube.com/playlist?list=PL37ZVnwpeshEczPCbFGVGd-hj1DR7_SKy","tags":["JavaScript","Conference","video"],"content":"JSConf Budapest 2024 の動画一覧","relatedLinks":[{"title":"26-28 June, JSConfBP 2024","url":"https://jsconfbp.com/"}]},{"category":"SlideVideo","title":"Temporalを取り巻く仕様を整理する - Speaker Deck","url":"https://speakerdeck.com/sajikix/temporalwoqu-rijuan-kushi-yang-wozheng-li-suru","tags":["ECMAScript","i18n","slide"],"content":"ECMAScript Proposal Stage 3のTemporalに関連する仕様についてのスライド。\nECMA-402、Unicode(CLDR)、IETF(BCP47/RFC3339/RFC9557)、IANA(Timezone)について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Node.jsのTypeScriptサポートについて","url":"https://gist.github.com/azu/ac5dafbf211ef8b5ecf386930ac75250","tags":["nodejs","TypeScript"],"content":"Node.jsに実験的な機能としてTypeScriptのコードから型定義を取り除いてJavaScriptとして実行する`--experimental-strip-types`フラグが実装された経緯について","relatedLinks":[]},{"category":"Book","title":"Exploring JavaScript (ES2024 Edition)","url":"https://exploringjs.com/js/index.html","tags":["JavaScript","ECMAScript","book"],"content":"Exploring JavaScriptのES2024対応版が公開された","relatedLinks":[]}]},{"meta":{"title":"2024-08-06のJS: typescript-eslint v8、jQuery UI 1.14.0(IEサポートの終了)、Porffor","author":"azu","layout":"post","date":"2024-08-06T00:30:13.575Z","category":"JSer","tags":["TypeScript","browser","ESLint","React","Extension"],"url":"https://jser.info/2024/08/06/typescript-eslint-v8-jquery-ui-1.14.0ie-porffor/"},"items":[{"category":"Headline","title":"Announcing typescript-eslint v8 | typescript-eslint","url":"https://typescript-eslint.io/blog/announcing-typescript-eslint-v8/","tags":["TypeScript","ESLint","ReleaseNote"],"content":"typescript-eslint v8リリース。\nESLint 9のサポート、`projectService`をStableに変更、プリセットのルール変更など","relatedLinks":[]},{"category":"Headline","title":"jQuery UI 1.14.0 released | jQuery UI Blog","url":"https://blog.jqueryui.com/2024/08/jquery-ui-1-14-0-released/","tags":["jQuery","ReleaseNote"],"content":"jQuery UI 1.14.0リリース。\nIEのサポート終了、1.11のAPIとの互換性を有効にする`jQuery.uiBackCompat`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release 3.38.0 - 2024.08.05 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.38.0","tags":["polyfill","JavaScript","ReleaseNote"],"content":"core-js v3.38.0リリース。\n`RegExp.escape`/`Promise.try`/Uint8Array to/from base64 and hexをそれぞれのStage 3に移動。\nNode.js 22.3.0で追加された`process.getBuiltinModule`を利用するように","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2024-07 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2024/08/06/ecmascript-proposal-update","tags":["ECMAScript","news"],"content":"2024年7月のTC39ミーティングでのECMAScript Proposalのステータス変更まとめ。\n`RegExp.escape`がStage 3となった","relatedLinks":[]},{"category":"Article","title":"tsconfig.json の include オプションには何を指定すべきか - mizdra&#039;s blog","url":"https://www.mizdra.net/entry/2024/07/27/193815","tags":["TypeScript","article"],"content":"tsconfig.jsonの`includes`オプションについて","relatedLinks":[]},{"category":"Article","title":"【2024年夏】ブラウザ拡張機能開発を加速するフレームワーク・ツール3選をコードベース付きで紹介！","url":"https://zenn.dev/cybozu_frontend/articles/introduction-browser-extensions-tools","tags":["browser","Extension","article","library"],"content":"ブラウザ拡張を開発するツールであるWXT/Plasmo/Extension.jsについて","relatedLinks":[]},{"category":"Article","title":"Patterns for Memory Efficient DOM Manipulation with Modern Vanilla JavaScript – Frontend Masters Boost","url":"https://frontendmasters.com/blog/patterns-for-memory-efficient-dom-manipulation/","tags":["DOM","performance","article"],"content":"DOM APIでのDOMの変更を効率的に行う方法について。\n`textContent`と`innerText`、`insertAdjacentHTML`と`innerHTML`、DOM Nodeの削除とGC、イベントリスナーのクリーンアップなどについて","relatedLinks":[]},{"category":"Article","title":"Migrate to ESLint 9.x • ~/Z","url":"https://tduyng.com/blog/migrating-to-eslint9x/","tags":["ESLint","article"],"content":"ESLint 9のFlat Configへの移行方法について。","relatedLinks":[]},{"category":"Article","title":"How Airbnb Smoothly Upgrades React | by Andre Wiggins | The Airbnb Tech Blog | Jul, 2024 | Medium","url":"https://medium.com/airbnb-engineering/how-airbnb-smoothly-upgrades-react-b1d772a565fd","tags":["React","article"],"content":"AirbnbでのReactのアップデートについて。\nパッケージのalias機能を使い複数のReactバージョンを利用、SSRを行うサーバもあるため環境変数で使うバージョンを指定。\n同じコードから2つのReactバージョンで動くようにして、テストしながら段階的に移行していったという話。","relatedLinks":[]},{"category":"Article","title":"How Google handles JavaScript throughout the indexing process – Vercel","url":"https://vercel.com/blog/how-google-handles-javascript-throughout-the-indexing-process","tags":["google","SEO","JavaScript","article"],"content":"Google BotsによるインデックスとJavaScript/CSSのレンダリングの影響についての調査","relatedLinks":[]},{"category":"Article","title":"フロントエンド開発に役立つ Datadog 活用法 - LegalOn Technologies Engineering Blog","url":"https://tech.legalforce.co.jp/entry/2024/08/05/154617","tags":["Datadog","browser","article"],"content":"Datadog RUMを使ったフロントエンドのモニタリングについて。\nユーザーアクションのトラッキングの設定や可視化について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Porffor","url":"https://porffor.dev/","tags":["JavaScript","WebAssembly","Tools"],"content":"WasmにコンパイルできるJavaScriptエンジン/コンパイラー/ランタイム。\nJavaScript/TypeScriptのコードをAOTコンパイルしてWasmにできるため、Wasmのファイルサイズが小さく効率的に動かせる。\nWasm to Cへのコンパイラなども実装している","relatedLinks":[{"title":"CanadaHonk/porffor: A from-scratch experimental AOT JS engine, written in JS","url":"https://github.com/CanadaHonk/porffor"}]},{"category":"SlideVideo","title":"React Conf 2024 Talks","url":"https://conf.react.dev/talks","tags":["React","video"],"content":"React Conf 2024の動画まとめ","relatedLinks":[]}]},{"meta":{"title":"2024-08-15のJS: Node v22.6.0(`--experimental-strip-types`)、Firefox 129","author":"azu","layout":"post","date":"2024-08-14T15:21:42.119Z","category":"JSer","tags":["browser","nodejs","Firefox","security","RegExp"],"url":"https://jser.info/2024/08/15/node-v22.6.0-experimental-strip-types-firefox-129-/"},"items":[{"category":"Headline","title":"Node.js — Node v22.6.0 (Current)","url":"https://nodejs.org/en/blog/release/v22.6.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.6.0リリース。\n実験的な機能として、型の記述を取り除いてTypeScriptファイルを実行する`--experimental-strip-types`フラグを追加。\nNode.js DevToolsでNetwork Inspectionをサポートする`--experimental-network-inspection`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 9.7 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v9.7.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v9.7.0リリース。\ncorepackのように`packageManager`フィールドを参照してpnpmのバージョン切り替える`manage-package-manager-versions`オプションを追加。\n`pnpm patch pkg`で全てのバージョンのパッケージにパッチを当てられるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Firefox 129.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/129.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 129リリース。\nCSSの`@starting-style`/`transition-behavior`プロパティのサポート。\n`Float16Array`のサポート、Web Crypto APIでの`Ed25519`のサポートなど","relatedLinks":[{"title":"Firefox 129 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/129"}]},{"category":"Headline","title":"ESLint v9.9.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2024/08/eslint-v9.9.0-released/","tags":["ESLint","ReleaseNote"],"content":"ESLint v9.9.0リリース。\n`eslint.config.ts`のサポート。\nTypeScriptの実行には`jiti`を利用している","relatedLinks":[{"title":"jiti - npm","url":"https://www.npmjs.com/package/jiti"}]},{"category":"Headline","title":"Release Release v1.7.4 · axios/axios","url":"https://github.com/axios/axios/releases/tag/v1.7.4","tags":["HTTP","security","library","ReleaseNote"],"content":"axios v1.7.4リリース。\nCVE-2024-39338のSSRFの対応。\nサーバでのみ`baseURL`が指定されている場合でも、`//example.com`のようなprotocol-relative URLで`baseURL`を無視できたのを、強制的に相対パスとして扱うように変更。","relatedLinks":[]},{"category":"Article","title":"JSで書かれたECMAScript RegExpパーサーの比較 | Memory ice cubes","url":"https://leaysgur.github.io/posts/2024/08/05/143855/","tags":["JavaScript","RegExp","AST","article"],"content":"JavaScriptで書かれた正規表現パーサの比較。\nregjsparser/regexp-tree/regexpp","relatedLinks":[]},{"category":"Article","title":"Now in Baseline: animating entry effects  |  Blog  |  web.dev","url":"https://web.dev/blog/baseline-entry-animations?hl=en","tags":["css ","article"],"content":"CSSの`@starting-style` と `transition-behavior:allow-discrete`について。\n`@starting-style`にtransition開始時のスタイルが指定でき、`allow-discrete`によって`display:none`などの離散プロパティに対してtransitionが動くように","relatedLinks":[]},{"category":"Article","title":"postgres.new: In-browser Postgres with an AI interface","url":"https://supabase.com/blog/postgres-new","tags":["PostgreSQL","browser","article"],"content":"PostgresをWasmとして動かすPGliteを使ってブラウザ上で分析やビジュアライズができる postgres.new について","relatedLinks":[]},{"category":"Article","title":"0.0.0.0 Day: Exploiting Localhost APIs From the Browser | Oligo Security","url":"https://www.oligo.security/blog/0-0-0-0-day-exploiting-localhost-apis-from-the-browser","tags":["browser","security","article"],"content":"ウェブサイトから`0.0.0.0`へのリクエストが通る問題とその対策について。\nブラウザからのロールポートスキャンやPrivate Network Accessのブロック方法についてなど","relatedLinks":[]},{"category":"Article","title":"WebDriver BiDi production-ready in Firefox, Chrome and Puppeteer  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/firefox-support-in-puppeteer-with-webdriver-bidi","tags":["Firefox","puppeteer","article"],"content":"Firefox 129でWebDriver BiDiをサポートしたため、Puppeteerが正式にFirefoxをサポートした。\n今まではFirefoxがCDP(Chrome DevTools Protocol)を部分的に実装していたが、Firefox 129でCDPはデフォルトで無効となる","relatedLinks":[{"title":"Firefox 129 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/129"},{"title":"Announcing Official Puppeteer Support for Firefox - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2024/08/puppeteer-support-for-firefox/"}]},{"category":"Article","title":"ソースコードを解析して社内向けUIライブラリの使用状況を自動で集計する","url":"https://tech.plaid.co.jp/analyze-internal-ui-library-usage","tags":["TypeScript","JavaScript","Design","React","Tools","article"],"content":"デザインシステムのUIコンポーネントがどのプロダクトで利用されているかを集計するGitHub Actionsで動くスクリプトについて。\n実際にデザインシステムが提供してるUIを利用している回数や場所などの使用状況を可視化することで、使われてないものを削除できるようにする仕組み","relatedLinks":[]},{"category":"WebsiteDocument","title":"versotile-org/verso: A web browser that plays old world blues to build new world hope","url":"https://github.com/versotile-org/verso","tags":["Rust","browser"],"content":"ServoベースのWebブラウザを作成するプロジェクト","relatedLinks":[{"title":"servo/servo: Servo, the embeddable, independent, memory-safe, modular, parallel web rendering engine","url":"https://github.com/servo/servo"},{"title":"Tauri update: embedding prototype, offscreen rendering, multiple webviews, and more! - Servo, the embeddable, independent, memory-safe, modular, parallel web rendering engine","url":"https://servo.org/blog/2024/01/19/embedding-update/"}]},{"category":"WebsiteDocument","title":"goldbergyoni/nodebestpractices: :white\\_check\\_mark: The Node.js best practices list (July 2024)","url":"https://github.com/goldbergyoni/nodebestpractices","tags":["nodejs","document"],"content":"Node.jsに関するガイドの2024年版が公開された","relatedLinks":[]}]},{"meta":{"title":"2024-08-25のJS: WebdriverIO v9、Node v22.7.0(TS `enum`と`namespace`の対応)、Deno 1.46(Last 1.x)","author":"azu","layout":"post","date":"2024-08-25T01:34:12.084Z","category":"JSer","tags":["nodejs","Vue","TypeScript","webdriver","Bun"],"url":"https://jser.info/2024/08/25/webdriverio-v9-node-v22.7.0ts-enumnamespace-deno-1.46last-1.x/"},"items":[{"category":"Headline","title":"Release v11.0.0 · vueuse/vueuse","url":"https://github.com/vueuse/vueuse/releases/tag/v11.0.0","tags":["Vue","library","ReleaseNote"],"content":"vueuse v11.0.0リリース。\n依存のmajorアップデート、オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"WebdriverIO v9 Released | WebdriverIO","url":"https://webdriver.io/blog/2024/08/15/webdriverio-v9-release/","tags":["webdriver","library","ReleaseNote"],"content":"WebdriverIO v9.リリース。\nWebDriver BiDiをサポート、`url`コマンドの追加、`addInitScript`コマンドの追加、`setViewport`コマンドの追加、ShadowRootのサポート。\n`emulate`コマンドでClockのエミュレーションサポート、要素がinteractiveになるまで自動的に待機する変更など。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v20.17.0 (LTS)","url":"https://nodejs.org/en/blog/release/v20.17.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v20.17.0リリース。\nESMを`require()`でロードできる`--experimental-require-module`フラグを追加,\nGlobパターンの判定ができる`path.matchesGlob`を追加。\nDuplexPair APIの公開など","relatedLinks":[]},{"category":"Headline","title":"Bun v1.1.25 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1.25","tags":["Bun","ReleaseNote"],"content":"Bun v1.1.25リリース。\n`node:cluster`のサポート、V8のinteral APIを部分的にサポート、`bun build --compile`で指定したファイルをバイナリ内にファイルを埋め込めるようになるなど","relatedLinks":[]},{"category":"Headline","title":"stackblitz-labs/pkg.pr.new: Continuous (Preview) Releases for your libraries!","url":"https://github.com/stackblitz-labs/pkg.pr.new","tags":["npm","github","CI"],"content":"CIからコミットごとにnpmパッケージを公開できるツールとサービス。","relatedLinks":[]},{"category":"Headline","title":"Release v15.0.0 · capricorn86/happy-dom","url":"https://github.com/capricorn86/happy-dom/releases/tag/v15.0.0","tags":["nodejs","DOM","library","ReleaseNote"],"content":"Happy DOM v15.0.0リリース。\nNode.js 18未満のサポート終了、`HTML*Element`のサポートの追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.6 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-6-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.6 RCリリース。\nESLintの`no-constant-binary-expression`と似た常にtrue/nullishとなる間違った書き方をエラーにする変更、Iterator Helperのサポート。\nES2022のArbitrary module namespace identifier namesをサポート、`--noUncheckedSideEffectImports`フラグの追加。\n型チェックせずにファイルを出力できる`--noCheck`フラグの追加、`--stopOnBuildErrors`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v22.7.0 (Current)","url":"https://nodejs.org/en/blog/release/v22.7.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.7.0リリース。\nTypeScriptの`enum`と`namaspace`の変換を行う`--experimental-transform-types`フラグの追加。\nあいまいなJSをCommonJSかES Modulesかを判定して実行する`--experimental-detect-module`フラグをデフォルトで有効化、Bufferのパフォーマンス改善など","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0-rc.0 · web-infra-dev/rspack","url":"https://github.com/web-infra-dev/rspack/releases/tag/v1.0.0-rc.0","tags":["bundler","ReleaseNote"],"content":"rspack v1.0.0-rc.0リリース。\neval-source-mapのパフォーマンス改善、`HtmlRspackPlugin`がエスケープ構文をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Nuxt 3.13 · Nuxt Blog","url":"https://nuxt.com/blog/v3-13","tags":["Vue","Nuxt","library","ReleaseNote"],"content":"Nuxt v3.13リリース。\nRoute Groupsのサポート、`NuxtLink`に`prefetchOn`を追加、`@vue/runtime-core`の型を拡張しないように変更など","relatedLinks":[]},{"category":"Headline","title":"Electron 32.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-32-0","tags":["Electron","ReleaseNote"],"content":"Electron 32リリース。\nChromium 128/Node.js 20.16.0/V8 12.8にアップデート、`webcontents.navigationHistory` APIの追加、`zstd`に対応など。\n`File`オブジェクトから非標準な`path`プロパティを削除といった破壊的な変更も含まれている","relatedLinks":[]},{"category":"Headline","title":"Deno 1.46: The Last 1.x Release","url":"https://deno.com/blog/v1.46","tags":["deno","ReleaseNote"],"content":"Deno v1.46リリース。\nDenov 1.xの最終リリース。\n`deno run`の`run`を省略できるように、`deno task`を`deno run`でも呼べるように、`--allow-*`/`--deny-*`の省略形を追加。\n`--env`を`--env-file`に名前を変更、`deno fmt`がHTML/CSS/YAMLなどをサポート、`deno remove`/`deno clean`コマンドの追加。\n`deno compile`がCode Signに対応、stdをStable変更など","relatedLinks":[]},{"category":"Article","title":"blocking=render: Why would you do that?! – Harry Roberts – Web Performance Consultant","url":"https://csswizardry.com/2024/08/blocking-render-why-whould-you-do-that/","tags":["HTML","browser","article"],"content":"`blocking=render`について。\nアンチフリッカースニペットのような意図的にページを非表示状態にしたい場合のユースケースについて","relatedLinks":[]},{"category":"Article","title":"Node.jsで型安全な環境変数を扱うスニペット | Web Scratch","url":"https://efcl.info/2024/08/24/type-safe-env/","tags":["nodejs","TypeScript","article"],"content":"Node.jsで環境変数をTypeScript定義、コマンドに対して環境変数のセットを型安全に渡す方法について","relatedLinks":[]},{"category":"WebsiteDocument","title":"vitest-dev/eslint-plugin-vitest: eslint plugin for vitest","url":"https://github.com/vitest-dev/eslint-plugin-vitest?tab=readme-ov-file","tags":["test","ESLint","plugin"],"content":"vitest向けのESLintプラグイン","relatedLinks":[{"title":"Vitest公式になったeslint-plugin-vitestを導入して、適切なVitestのお作法を学んでみる","url":"https://zenn.dev/bs_kansai/articles/8ff70404804f60"}]},{"category":"Book","title":"Tailwind CSSフロントエンド開発の教科書 | 仮 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4798070971/","tags":["css ","book"],"content":"2024年12月31日発売\nTailwind CSSについての書籍","relatedLinks":[]}]},{"meta":{"title":"2024-09-01のJS: Rspack 1.0、Safari Technology Preview 202、Material UI v6","author":"azu","layout":"post","date":"2024-09-01T05:25:04.712Z","category":"JSer","tags":["webpack","css","React","security","Next.js"],"url":"https://jser.info/2024/09/01/rspack-1.0-safari-technology-preview-202-material-ui-v6/"},"items":[{"category":"Headline","title":"Chrome 129 beta  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/chrome-129-beta?hl=en","tags":["Chrome","ReleaseNote"],"content":"Chrome 129 betaリリース。\nCSSの`interpolate-size`プロパティと`calc-size()`をサポート、`Intl.DurationFormat`のサポート、`scheduler.yield()`のサポート。\nOrigin TraialとしてFile System Observer APIの追加、`0.0.0.0`を利用したPrivate Network AccessをDeprecateにするなど","relatedLinks":[]},{"category":"Headline","title":"Release Version 25.0.0 · jsdom/jsdom","url":"https://github.com/jsdom/jsdom/releases/tag/25.0.0","tags":["JavaScript","DOM","ReleaseNote"],"content":"jsdom 25.0.0リリース。\n`EventTarget.prototype`の参照先をjsdom内の`Object.prototype`に変更。","relatedLinks":[]},{"category":"Headline","title":"Announcing Rspack 1.0 - Rspack","url":"https://rspack.dev/blog/announcing-1-0","tags":["rspack","ReleaseNote","webpack"],"content":"webpackとの互換性を持つようにRustで書かれたbundlerであるRspack 1.0がリリース。","relatedLinks":[{"title":"Migrating from Rspack 0.x - Rspack","url":"https://rspack.dev/guide/migration/rspack_0.x"}]},{"category":"Headline","title":"Release 5.19.0 · prisma/prisma","url":"https://github.com/prisma/prisma/releases/tag/5.19.0","tags":["prisma","MySQL"],"content":"Prisma 5.19.0リリース。\nTypedSQLの導入","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · pmndrs/valtio","url":"https://github.com/pmndrs/valtio/releases/tag/v2.0.0","tags":["React","JavaScript","library","ReleaseNote"],"content":"Valito 2.0.0リリース。\nReact 19で`use` hookが入るため、Promiseの扱い方を変更など","relatedLinks":[{"title":"valtio/docs/guides/migrating-to-v2.mdx at main · pmndrs/valtio","url":"https://github.com/pmndrs/valtio/blob/main/docs/guides/migrating-to-v2.mdx"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 202 | WebKit","url":"https://webkit.org/blog/15798/release-notes-for-safari-technology-preview-202/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 202リリース。\nCSSの`background-clip: border-area`/`ruby-align`、`shape()` function/`@page`で`jis-b4`と`jis-b5`のサポートなど。\nES Proposal Stage 3のFloat16Arrayの実装、`WebAssembly.{Memory/Table}.prototype.type()`の実装。\nWasm GC/Wasm Tail Callsのサポート、JITなしでWebAssemblyを実行できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Svelte has a potential mXSS vulnerability due to improper HTML escaping · CVE-2024-45047 · GitHub Advisory Database","url":"https://github.com/advisories/GHSA-8266-84wp-wv5c","tags":["Svelte","security","ReleaseNote","XSS"],"content":"Svelteの`<noscript>`内の要素の属性値にユーザー入力を入れている場合に発生するXSSを修正。\nSvelte 4.2.19で修正されている。","relatedLinks":[{"title":"Release svelte@4.2.19 · sveltejs/svelte","url":"https://github.com/sveltejs/svelte/releases/tag/svelte%404.2.19"}]},{"category":"Headline","title":"Material UI v6 is out now 🎉 - MUI","url":"https://mui.com/blog/material-ui-v6-is-out/","tags":["React","UI","library","ReleaseNote"],"content":"Material UI v6リリース。\nCSS theme variablesの追加、Color schemesでのLight/Dark modeの切り替え、Container queriesのサポート。\nPigment CSSによるZero Runtime Stylingの仕組みをopt-inで導入、React 19の対応など","relatedLinks":[]},{"category":"Headline","title":"DOM Clobbering Gadget found in Webpack&#039;s AutoPublicPathRuntimeModule that leads to XSS · Advisory · webpack/webpack","url":"https://github.com/webpack/webpack/security/advisories/GHSA-4vvj-4cpr-p986","tags":["webpack","ReleaseNote","security"],"content":"webpackのセキュリティリリース。\nユーザーが任意の属性を含む`<img>`タグをかける場合に、webpackの`publicPath: 'auto'`が有効なbundleを読み込むとXSSが発生する問題。\nwebpack 5.94.0で修正された。","relatedLinks":[{"title":"Release v5.94.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.94.0"},{"title":"security: fix DOM clobbering in auto public path by alexander-akait · Pull Request #18700 · webpack/webpack","url":"https://github.com/webpack/webpack/pull/18700"}]},{"category":"Article","title":"State of CSS 2024","url":"https://survey.devographics.com/en-US/survey/state-of-css/2024","tags":["css ","Survey"],"content":"State of CSS 2024の開発者アンケートの受付が開始された","relatedLinks":[]},{"category":"Article","title":"monorepo内でのパッケージのバージョンを1つだけに統一するOne Version Ruleをpnpm catalogで実装する - newmo 技術ブログ","url":"https://tech.newmo.me/entry/one-version-rule-built-on-pnpm-catalog","tags":["npm","pnpm","monorepo","JavaScript","article"],"content":"pnpm catalogを使い、monorepo内で依存するライブラリのバージョンを1つだけにする方法について。\npnpm 9.5で導入されたcatalogを使い依存するパッケージの一覧を管理、`.pnpmfile.cjs`のhooksを使いcatalogで管理されてない依存をエラーとする実装について。","relatedLinks":[]},{"category":"Article","title":"ジャンプTOON Next.js App Router の活用〜得られた恩恵と課題〜 | CyberAgent Developers Blog","url":"https://developers.cyberagent.co.jp/blog/archives/49429/","tags":["Next.js","article"],"content":"Next.js App RouterとServer Components/Server Actionsを使った開発と注意点について","relatedLinks":[]},{"category":"Article","title":"Common misconceptions about how to optimize LCP  |  Blog  |  web.dev","url":"https://web.dev/blog/common-misconceptions-lcp?hl=en","tags":["browser","performance","article"],"content":"Largest Contentful Paint (LCP)の最適化に関するよくある誤解について。\n画像サイズの最適化は、p75タイルのLCPの10%未満の影響であることが多く、TTFBやリソースロードの優先度の問題がLCPに強く影響してるケースについて","relatedLinks":[]},{"category":"SlideVideo","title":"フロントエンドカンファレンス北海道 2024 公開資料・Xアカウントリンクまとめ","url":"https://zenn.dev/yumemi_inc/articles/2024-08-25-frontend-conf-hokkaido-2024","tags":["Conference","slide"],"content":"フロントエンドカンファレンス北海道 2024のスライドまとめ","relatedLinks":[{"title":"フロントエンドカンファレンス北海道2024","url":"https://www.frontend-conf.jp/"}]},{"category":"SlideVideo","title":"bramus/style-observer: MutationObserver for CSS. Get notified when the computed value of a CSS property changes.","url":"https://github.com/bramus/style-observer","tags":["css ","JavaScript","library"],"content":"Mutation Observerのようにスタイルの変化を監視するライブラリ。\n短いtransitionと`transition-behavior: allow-discrete;`を使うことで、`transitionstart`イベントを見て変化を検知している","relatedLinks":[{"title":"Introducing @bramus/style-observer, a MutationObserver for CSS – Bram.us","url":"https://www.bram.us/2024/08/31/introducing-bramus-style-observer-a-mutationobserver-for-css/"}]},{"category":"WebsiteDocument","title":"vue-email/vue-email: 💌 Write email templates with vue","url":"https://github.com/vue-email/vue-email?tab=readme-ov-file","tags":["Vue","mail"],"content":"Vueでメールのコンテンツを扱うライブラリ","relatedLinks":[]},{"category":"WebsiteDocument","title":"hoppergee/heic-to: Convert HEIC/HEIF images to JPEG, PNG in browser","url":"https://github.com/hoppergee/heic-to?tab=readme-ov-file","tags":["JavaScript","browser","Image","library"],"content":"libheifを使ってHEIC/HEIFの画像をJPEG/PNGに変換するライブラリ","relatedLinks":[]},{"category":"Book","title":"Next.jsの考え方","url":"https://zenn.dev/akfm/books/nextjs-basic-principle","tags":["Next.js","book"],"content":"Next.jsのServer Componentについて","relatedLinks":[]}]},{"meta":{"title":"2024-09-09のJS: Vue 3.5、jsprimer v6、a11y-visualizer","author":"azu","layout":"post","date":"2024-09-09T00:48:44.816Z","category":"JSer","tags":["nodejs","Firefox","ECMAScript","book","Vue"],"url":"https://jser.info/2024/09/09/vue-3.5-jsprimer-v6-a11y-visualizer/"},"items":[{"category":"Headline","title":"JavaScript Primer v6.0.0リリース: ES2024の対応とNode.jsのユースケースを刷新 | Web Scratch","url":"https://efcl.info/2024/09/02/jsprimer-v6/","tags":["JavaScript","ReleaseNote","book"],"content":"JavaScript Primer v6リリース。\nECMAScript 2024の対応とNode.jsの標準モジュールの追加に対応した更新。\n`Map.groupBy`/`Object.groupBy`、ECMAScript Proposal Stage 2.7、`node:util`の`parseArgs`、`node:test`の対応など","relatedLinks":[]},{"category":"Headline","title":"Release v9.0.0 · faker-js/faker","url":"https://github.com/faker-js/faker/releases/tag/v9.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"Node.js Faker v9.0.0リリース。\nNode.js 14,16のサポート終了、localeごとのimportができるように、RNGのseedの扱いの変更など、非推奨なAPIの削除など","relatedLinks":[{"title":"Upgrading to v9 | Faker","url":"https://v9.fakerjs.dev/guide/upgrading.html"}]},{"category":"Headline","title":"Node.js — Node v22.8.0 (Current)","url":"https://nodejs.org/en/blog/release/v22.8.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.8.0リリース。\n`module.enableCompileCache()` APIの追加、`vm.createContext()`に`vm.constants.DONT_CONTEXTIFY`を追加。\nカバレッジのしきい値をチェックできる`--experimental-test-coverage`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing Vue 3.5 | The Vue Point","url":"https://blog.vuejs.org/posts/vue-3-5","tags":["Vue","ReleaseNote"],"content":"Vue 3.5リリース。\nパフォーマンス改善、`defineProps`の返り値をDestructureできるように、`useId()`の追加、`data-allow-mismatch`属性の追加。\n`defineCustomElement()` APIを追加しCustom Elementの対応を改善、`useTemplateRef()`、`onWatcherCleanup()`の追加など","relatedLinks":[]},{"category":"Headline","title":"Firefox 130.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/130.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 130リリース。\n`<details name>`の対応、X25519 digital signature algorithmのサポート、Web Codecs API のサポート。\n実験的な機能として`requestVideoFrameCallback()`、`ReportingObserver`でCSP違反を監視できるようになるなど","relatedLinks":[{"title":"Firefox 130 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/130"}]},{"category":"Headline","title":"Release v1.47.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.47.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.47.0リリース。\nNetwork Tabの改善、`--tsconfig`フラグの追加、Playwright ImageをUbuntu 24.04ベースに変更など","relatedLinks":[]},{"category":"Headline","title":"ESLint v9.10.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2024/09/eslint-v9.10.0-released/","tags":["ESLint","ReleaseNote"],"content":"ESLint v9.10.0リリース。\n`eslint`パッケージに`@types/eslint`と同じ型定義ファイルが含まれるようになる変更など","relatedLinks":[]},{"category":"Headline","title":"Bun v1.1.27 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1.27","tags":["bum","ReleaseNote"],"content":"Bun v1.1.27リリース。\n`node:zlib`のパフォーマンス改善、`npm pack`と同等の処理をする`bun pm pack`コマンドを追加。\n`Bun.serve()`にStatic routesの追加、`--max-http-header-size`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v8.0.0 · redwoodjs/redwood","url":"https://github.com/redwoodjs/redwood/releases/tag/v8.0.0","tags":["nodejs","library","ReleaseNote"],"content":"Redwood v8.0.0リリース。\nBackground Jobの対応、SSRとRSCの対応改善、StorybookにViteを使うように、Dockerのサポートなど","relatedLinks":[{"title":"Upgrade Guide","url":"https://redwoodjs.com/upgrade/v8"}]},{"category":"Article","title":"JS Dates Are About to Be Fixed | TimeTime","url":"https://docs.timetime.in/blog/js-dates-finally-fixed/","tags":["ECMAScript","JavaScript","article"],"content":"ECMAScript Proposal Stage 3のTemporal APIについて","relatedLinks":[]},{"category":"Article","title":"What’s new in React 19 – Vercel","url":"https://vercel.com/blog/whats-new-in-react-19","tags":["React","article"],"content":"React 19の新しい機能についての紹介。\nServer Component、Server Action、`useActionState`/`useFormState`/`useOptimistic`/`use`などの新しいHooks。\nリソースのpreload、`ref` callback、`<title>`などのメタデータの対応。\nCustom Elementの対応、エラー表示の改善など","relatedLinks":[]},{"category":"Article","title":"The Ultimate Guide to Font Performance Optimization | DebugBear","url":"https://www.debugbear.com/blog/website-font-performance","tags":["article","fonts","performance"],"content":"WebFontのパフォーマンス最適化について","relatedLinks":[]},{"category":"WebsiteDocument","title":"ymrl/a11y-visualizer: A Browser Extension for Enhanced Web Accessibility Checking","url":"https://github.com/ymrl/a11y-visualizer?tab=readme-ov-file","tags":["accessibility","Firefox","Chrome","Extension"],"content":"アクセシビリティの情報を視覚的に表示するブラウザ拡張。\nアクセシビリティの構造を可視化することで、問題を見つけやすくするツール","relatedLinks":[]}]},{"meta":{"title":"2024-09-16のJS: Biome v1.9、ESLint 8.xのEOL、TypeScript 5.6、ES5の現状","author":"azu","layout":"post","date":"2024-09-16T03:04:06.569Z","category":"JSer","tags":["nodejs","UI","Rust","Tools","TypeScript"],"url":"https://jser.info/2024/09/16/biome-v1.9-eslint-8.xeol-typescript-5.6-es5/"},"items":[{"category":"Headline","title":"Biome v1.9 Anniversary Release | Biome","url":"https://biomejs.dev/blog/biome-v1-9/","tags":["JavaScript","Rust","Tools","ReleaseNote"],"content":"Biome v1.9リリース。\nCSSのFormatter/LinterがStableに、GraphQLのFormatter/Linterを追加。\nGritQLを使った`biome search`コマンドを追加、`.editorconfig`をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.6 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-6/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.6 リリース。\nESLintの`no-constant-binary-expression`と似た常にtrue/nullishとなる間違った書き方をエラーにする変更、Iterator Helperのサポート。\nES2022のArbitrary module namespace identifier namesをサポート、`--noUncheckedSideEffectImports`フラグの追加。\n型チェックせずにファイルを出力できる`--noCheck`フラグの追加、`--stopOnBuildErrors`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Version support policy and ESLint v8.x end of life - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2024/09/eslint-v8-eol-version-support/","tags":["ESLint","news"],"content":"ESLint v8のサポートは2024年10月5日に終了し、End Of Life(EOL)となる予定","relatedLinks":[]},{"category":"Headline","title":"Release 5.0.0 · expressjs/express","url":"https://github.com/expressjs/express/releases/tag/v5.0.0","tags":["express","ReleaseNote"],"content":"express v5.0.0のpreリリース。\nマイグレーションガイドやTypeScriptの型の更新などがまだ残っている","relatedLinks":[{"title":"Express v4 -","url":"https://github.com/expressjs/express/issues/5944"}]},{"category":"Headline","title":"Release v1.0.2 · jimp-dev/jimp","url":"https://github.com/jimp-dev/jimp/releases/tag/v1.0.2","tags":["nodejs","Image","library","ReleaseNote"],"content":"Jimp v1リリース。\nネイティブアドオンに依存していないNode.jsでの画像処理ライブラリ","relatedLinks":[]},{"category":"Headline","title":"storybook/CHANGELOG.md at next · storybookjs/storybook","url":"https://github.com/storybookjs/storybook/blob/next/CHANGELOG.md#830","tags":["JavaScript","UI","library","ReleaseNote"],"content":"Storybook 8.3リリース。\nVitestを使ったComponent Testのサポート、バンドルサイズの改善など","relatedLinks":[{"title":"Component testing in Storybook","url":"https://storybook.js.org/blog/component-testing/"},{"title":"Storybook 8.3 で導入された Vitest 対応を React と Next.js で試す","url":"https://zenn.dev/yumemi_inc/articles/storybook-8-3-vitest"}]},{"category":"Article","title":"The Undeniable Utility Of CSS :has • Josh W. Comeau","url":"https://www.joshwcomeau.com/css/has/","tags":["css ","article"],"content":"`:has`のユースケースについて。\n`:focus-visible`との組み合わせ、document scroll lock、兄弟/親子要素の選択などについて","relatedLinks":[]},{"category":"Article","title":"More NPM packages on Cloudflare Workers: Combining polyfills and native code to support Node.js APIs","url":"https://blog.cloudflare.com/more-npm-packages-on-cloudflare-workers-combining-polyfills-and-native-code/","tags":["cloudflare","article","nodejs"],"content":"Cloudflare WorkerのNode.js互換性のアップデートについて。\n`node:` prefixのサポート、Node.jsの標準モジュールのサポート改善などが含まれる。\n`nodejs_compat_v2`が設定されている場合に有効となる。","relatedLinks":[]},{"category":"Article","title":"The State of ES5 on the Web — Philip Walton","url":"https://philipwalton.com/articles/the-state-of-es5-on-the-web/","tags":["JavaScript","article"],"content":"ビルドツール/著名なライブラリ/ウェブサイトのES5対応の現状についてまとめた記事。\nBabelとTypeScriptはデフォルトでES5として出力している。\n多くのライブラリはES2015+以降のコードを含んでいる。\n89%のサイトはES2015+の構文を含むコードを配信している。","relatedLinks":[]},{"category":"Article","title":"Brand New Performance Features in Chrome DevTools | DebugBear","url":"https://www.debugbear.com/blog/fix-web-performance-devtools","tags":["Chrome","performance","article"],"content":"Chrome DevToolの新しいPerformanceパネルについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"govuk-vue/govuk-vue: A Vue 3 component library for GOV.UK Frontend and the GOV.UK Design System","url":"https://github.com/govuk-vue/govuk-vue","tags":["Vue","Design","UI","library"],"content":"GOV.UK Design SystemのUIコンポーネントのVue実装","relatedLinks":[]}]},{"meta":{"title":"2024-09-23のJS: date-fns v.4.0.0(timezone)、Deno 2.0 RC、Safari 18.0","author":"azu","layout":"post","date":"2024-09-23T03:06:53.334Z","category":"JSer","tags":["nodejs","TypeScript","server","esbuild","Tools"],"url":"https://jser.info/2024/09/23/date-fns-v.4.0.0timezone-deno-2.0-rc-safari-18.0/"},"items":[{"category":"Headline","title":"Release v4.0.0 · date-fns/date-fns","url":"https://github.com/date-fns/date-fns/releases/tag/v4.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"date-fns v4.0.0リリース。\nTimeZoneをサポート、ESMとCJSのdual packageに変更など","relatedLinks":[{"title":"v4.0 is out with first-class time zones support!","url":"https://blog.date-fns.org/v40-with-time-zone-support/"}]},{"category":"Headline","title":"Node.js — Node v22.9.0 (Current)","url":"https://nodejs.org/en/blog/release/v22.9.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.9.0リリース。\n`node:util`に`getCallSite`を追加、V8 Maglevを無効化など","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · fastify/fastify","url":"https://github.com/fastify/fastify/releases/tag/v5.0.0","tags":["nodejs","server","library","ReleaseNote"],"content":"fastify v5.0.0リリース。\nNode.js 20未満のサポート終了、非推奨のAPIを削除など","relatedLinks":[{"title":"Fastify v5 is HERE! - YouTube","url":"https://www.youtube.com/watch?v=M57Vi8NnxUM"},{"title":"V5 Migration Guide | Fastify","url":"https://fastify.dev/docs/latest/Guides/Migration-Guide-V5/"}]},{"category":"Headline","title":"Release v0.24.0 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.24.0","tags":["esbuild","ReleaseNote"],"content":"esbuild v0.24.0リリース。\nmacOS 10.15のサポート終了、tsconfig.jsonの`useDefineForClassFields`の扱いを修正など","relatedLinks":[]},{"category":"Headline","title":"Release 4.0.0 · paulmillr/chokidar","url":"https://github.com/paulmillr/chokidar/releases/tag/4.0.0","tags":["nodejs","library","ReleaseNote"],"content":"chokidar 4.0.0リリース。\nglobサポートの削除、fseventsを削除、TypeScriptでの書き直し、Node.js 14未満のサポートを削除など","relatedLinks":[]},{"category":"Headline","title":"Astro 5.0 Beta Release | Astro","url":"https://astro.build/blog/astro-5-beta/","tags":["astro","ReleaseNote"],"content":"Astro 5.0 betaリリース。\nContent LayerとServer IslandsがStableに、`astro:env`の追加など","relatedLinks":[{"title":"Astro v5.0-beta | Docs","url":"https://5-0-0-beta.docs.astro.build/en/guides/upgrade-to/v5/"}]},{"category":"Headline","title":"Release v4.6.0 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v4.6.0","tags":["Hono","ReleaseNote"],"content":"Hono v4.6.0リリース。\nasyncLocalStorageを使った`hono/context-storage`を追加など","relatedLinks":[]},{"category":"Headline","title":"WebKit Features in Safari 18.0 | WebKit","url":"https://webkit.org/blog/15865/webkit-features-in-safari-18-0/","tags":["safari","ReleaseNote"],"content":"Safari 18.0の変更点について。\nCSSでは、View Transitions、Style Queries、`content-visibility`、`@starting-style`と`display: none`の組み合わせをサポート。\nHTMLでは、`picture`要素でHEICをサポート、`writingsuggestions`属性のサポート、`<input switch>`のサポート。\nJavaScriptでは、正規表現の`v`フラグをサポート、`URL.parse()`のサポート。\nAppCacheのサポートを削除、標準化されていない`-webkit` prefixの擬似クラスのサポートを廃止、`picture`要素ではJPEG2000のサポートを削除など","relatedLinks":[]},{"category":"Headline","title":"Deno 2.0 Release Candidate","url":"https://deno.com/blog/v2.0-release-candidate","tags":["deno","ReleaseNote"],"content":"Deno v2.0 RCリリース。\nグローバルな`window`を削除/`process`を追加、`deno add`で`jsr:`と`npm:`の識別子を指定して追加できるように、パーミッションの指定に関する挙動の変更。\nWebGPU/`Deno.dlopen()`/`Deno.createHttpClient()`がStableに、非推奨なAPIやコマンドの削除。\n`deno run`でCommonJSを実行可能に、Top Level awaitを含まないESMを`require()`で読み込めるように、Node.jsとの互換性を改善。\n`deno test --doc`でDocTestをサポート、TypeScript 5.6へアップデートなど","relatedLinks":[]},{"category":"Article","title":"Introducing TanStack Router – Frontend Masters Boost","url":"https://frontendmasters.com/blog/introducing-tanstack-router/","tags":["article","JavaScript"],"content":"TanStack Routerの基本的な使い方について","relatedLinks":[]},{"category":"Article","title":"Request for developer feedback: customizable select  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/rfc-customizable-select","tags":["Chrome","HTML","article"],"content":"Chrome Canary 130で実験的な機能として利用できるselect要素のカスタマイズについて。\nCSSの`::picker(select)`でselect要素の見た目を変更できる。","relatedLinks":[]},{"category":"Article","title":"Don&#039;t Sleep on AbortController - kettanaito.com","url":"https://kettanaito.com/blog/dont-sleep-on-abort-controller","tags":["JavaScript","article"],"content":"`AbortController`の使い方について。\nイベントリスナーの解除、Fetchのキャンセル、`AbortSignal.timeout`/`AbortSignal.any`について。\nまた汎用的なキャンセルの実装についてなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bloomberg/ts-blank-space: A small, fast, pure JavaScript type-stripper that uses the official TypeScript parser.","url":"https://github.com/bloomberg/ts-blank-space","tags":["nodejs","TypeScript","library"],"content":"TypeScriptのコードから型だけを取り除いてJavaScriptとして実行するツール。\n元のコードの位置をそのまま保つことでSource Mapを不要な変換を行っている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"line/ts-remove-unused: Remove unused code from your TypeScript project","url":"https://github.com/line/ts-remove-unused","tags":["TypeScript","Tools"],"content":"TypeScriptのコードの利用されてない変数やexportを削除するツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Nova.js - A collection of dependency-free React hooks","url":"https://novajs.co/","tags":["React","library"],"content":"React Hooksのコレクションライブラリ。\nそれぞれのHookがコピーペーストして使えるようにHooks同士の依存がないように作られている","relatedLinks":[]}]},{"meta":{"title":"2024-10-01のJS: Oxc Transformer Alpha、Node.jsの9つの柱、Express 5.0 pre-release","author":"azu","layout":"post","date":"2024-10-01T01:40:30.220Z","category":"JSer","tags":["nodejs","TypeScript","Tools","Rust","React"],"url":"https://jser.info/2024/10/01/oxc-transformer-alpha-node.js9-express-5.0-pre-release/"},"items":[{"category":"Headline","title":"Release v1.9.0 - LGTM! · solidjs/solid","url":"https://github.com/solidjs/solid/releases/tag/v1.9.0","tags":["Solid","ReleaseNote"],"content":"Solid v1.9.0リリース。\nJSXの検証の改善、Custom Elementのサポート改善、`handleEvent`のサポート","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 · unjs/jiti","url":"https://github.com/unjs/jiti/releases/tag/v2.0.0","tags":["nodejs","JavaScript","library","TypeScript","ReleaseNote"],"content":"jiti v2.0.0リリース。\nJSXのサポート、CJS/ESMのdual pacakgeとして公開するように、`jiti/native`の追加、`jiti/register`の追加など。","relatedLinks":[]},{"category":"Headline","title":"OpenNext - OpenNext","url":"https://opennext.js.org/","tags":["Next.js","cloudflare","aws","library"],"content":"Next.jsをVercel以外でセルフホストできるようにするため、アーキテクチャの設計やアダプターの実装。\nAWSとCloudflare向けのアダプターが開発されている","relatedLinks":[]},{"category":"Headline","title":"End of life for Actions Node16 - GitHub Changelog","url":"https://github.blog/changelog/2024-09-25-end-of-life-for-actions-node16/","tags":["nodejs","github","Actions","news"],"content":"2024年10月15日にGitHub ActionsでのNode.js 16のサポートが終了する。","relatedLinks":[]},{"category":"Headline","title":"helmet/CHANGELOG.md at main · helmetjs/helmet","url":"https://github.com/helmetjs/helmet/blob/main/CHANGELOG.md#800","tags":["nodejs","security","library"],"content":"helmet v8.0.0リリース。\nNode.js 18未満のサポートを終了、\n`Strict-Transport-Security`のmax-ageがデフォルトで365日に変更など","relatedLinks":[]},{"category":"Headline","title":"Oxc Transformer Alpha | The JavaScript Oxidation Compiler","url":"https://oxc.rs/blog/2024-09-29-transformer-alpha.html","tags":["TypeScript","Tools","Rust","ReleaseNote"],"content":"TypeScriptのTranspilerであるoxc-transformのαリリース。","relatedLinks":[]},{"category":"Headline","title":"The Nine Node Pillars","url":"https://www.platformatichq.com/node-principles","tags":["nodejs","document"],"content":"Node.jsアプリケーションの9つのプラクティスについて書かれたドキュメント。\n\n- イベントループをブロックしない\n- メトリクスを監視して行動する\n- Node.js LTSを使う\n- テスト、レビューなどの自動化\n- 依存関係の管理、monorepo\n- 依存関係のリスクとアップデート\n- グローバルを避ける\n- エラーハンドリング、意味あるログを出す\n- API Specとクライアントの自動生成","relatedLinks":[]},{"category":"Headline","title":"Release @ark-ui/react@4.0.0 · chakra-ui/ark","url":"https://github.com/chakra-ui/ark/releases/tag/%40ark-ui%2Freact%404.0.0","tags":["React","ReleaseNote","library"],"content":"Ark UI v4.0.0リリース。\nColorPicker/Select/Combobox/DatePickerの値の渡し方の変更など","relatedLinks":[{"title":"Release @ark-ui/solid@4.0.0 · chakra-ui/ark","url":"https://github.com/chakra-ui/ark/releases/tag/%40ark-ui%2Fsolid%404.0.0"},{"title":"Release @ark-ui/vue@4.0.0 · chakra-ui/ark","url":"https://github.com/chakra-ui/ark/releases/tag/%40ark-ui%2Fvue%404.0.0"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 204 | WebKit","url":"https://webkit.org/blog/15978/release-notes-for-safari-technology-preview-204/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 204リリース。\nCSSの`line-clamp`をpreviewサポート、Cookie Store APIのサポートなど","relatedLinks":[]},{"category":"Article","title":"What&#039;s New in Express.js v5.0","url":"https://www.trevorlasn.com/blog/whats-new-in-express-5","tags":["nodejs","express","article"],"content":"Express 5.0(pre-release)の変更点について。\n`app.del()`/`app.param(fn)`/`req.param(name)`の削除、Path Routeのマッチングが正規表現としてStrictなものへと変更。\nRouterのHandlerがasync awaitをサポート、Node.js 18未満のサポートを終了など","relatedLinks":[{"title":"Migrating to Express 5","url":"https://expressjs.com/en/guide/migrating-5.html"}]},{"category":"Article","title":"Jotaiのatomを自由にテストしたいときに見る記事","url":"https://zenn.dev/yuneco/articles/jotai-atom-testing","tags":["React","test","article"],"content":"Jotaiのテスト方法について","relatedLinks":[]},{"category":"Article","title":"Node.js 20 upgrade: a journey through unexpected HEAP issues with Kubernetes | by Ztec | Sep, 2024 | Deezer I/O","url":"https://deezer.io/node-js-20-upgrade-a-journey-through-unexpected-heap-issues-with-kubernetes-27ae3d325646","tags":["nodejs","article"],"content":"Node.js 18から20へアップデートすると平均応答時間やCPUの使用率がわずかに増加し、その原因を探索していく記事。\nHeapとGCのメトリクスを見ていくと、GCが頻繁に起きるようになっており、リリースノートを探すとV8のHeapスペースのデフォルト値が変更されていることを発見するまでの話","relatedLinks":[]},{"category":"SoftwareLibrary","title":"mieszkosabo/tartak: Tartak is a functional programming language that compiles to TypeScript types.","url":"https://github.com/mieszkosabo/tartak","tags":["TypeScript","language","Tools"],"content":"TypeScriptの型へとコンパイルできる関数型言語","relatedLinks":[]},{"category":"Book","title":"［作って学ぶ］ブラウザのしくみ──HTTP、HTML、CSS、JavaScriptの裏側 | 土井 麻未 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4297145464/","tags":["browser","book","Rust"],"content":"2024年11月9日 発売\nRustでシンプルなブラウザを作成しながら仕組みについて学ぶ書籍","relatedLinks":[]}]},{"meta":{"title":"2024-10-08のJS: WebPlatformのリリースノート、Node v20.18.0(networkのinspect)、StyleX 0.8.0","author":"azu","layout":"post","date":"2024-10-08T11:13:58.188Z","category":"JSer","tags":["webservice","nodejs","React","WebPlatformAPI","npm"],"url":"https://jser.info/2024/10/08/webplatform-node-v20.18.0networkinspect-stylex-0.8.0/"},"items":[{"category":"Headline","title":"Web features explorer - Web platform release notes","url":"https://web-platform-dx.github.io/web-features-explorer/release-notes/","tags":["WebPlatformAPI","news","webservice"],"content":"web-featuresやbrowser-compat-dataを元にしたブラウザの新しい機能をリリースノート形式でまとめたサイト","relatedLinks":[]},{"category":"Headline","title":"Release v10.9.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v10.9.0","tags":["npm","ReleaseNote"],"content":"npm v10.9.0リリース。\n開発時のランタイム情報を定義できる`devEngines`フィールドのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v20.18.0 (LTS)","url":"https://nodejs.org/en/blog/release/v20.18.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v20.18.0リリース。\n`--experimental-network-inspection`フラグでNetwork Inspectionをサポート。\n`vm`内の`globalThis`をfreezeする`vm.constants.DONT_CONTEXTIFY`を追加など","relatedLinks":[]},{"category":"Headline","title":"Tauri 2.0 Stable Release | Tauri","url":"https://v2.tauri.app/blog/tauri-20/","tags":["Rust","JavaScript","GUI","ReleaseNote"],"content":"Tauri 2.0リリース。\niOS/Androidのサポート、モバイルアプリのシミューレーターでもHMRが有効に、プラグインシステムの刷新、アクセス制御の仕組みを刷新など","relatedLinks":[]},{"category":"Headline","title":"September 30, 2024 Release – React Spectrum Releases","url":"https://react-spectrum.adobe.com/releases/2024-09-30.html","tags":["React","library","ReleaseNote"],"content":"React Aria September 30, 2024リリース。\nColorPicker/ColorArea/ColorField/ColorSlider/ColorSwatch/ColorSwatchPicker/ColorWheelの追加。\nButtonにPendingのstateを追加。\n実験的なコンポーネントして、`Tree`/`TreeView`と`Disclosure`/`DisclosureGroup`を追加など","relatedLinks":[]},{"category":"Headline","title":"Release 20.0.0 · nrwl/nx","url":"https://github.com/nrwl/nx/releases/tag/20.0.0","tags":["nodejs","Tools","ReleaseNote"],"content":"Nx 20.0.0リリース。\nrspackプラグインの追加など","relatedLinks":[]},{"category":"Headline","title":"Release 0.8.0 | StyleX","url":"https://stylexjs.com/blog/v0.8.0","tags":["css ","JavaScript","library","React","ReleaseNote"],"content":"StyleX 0.8.0リリース。\nshorthandを禁止する`valid-shorthands`ルールの追加、`enforce-extension`ルールの追加。\nlightningcssを使ったminifyやautoprefixのpost-processを行うように","relatedLinks":[]},{"category":"Article","title":"ESLint now officially supports linting of JSON and Markdown - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2024/10/eslint-json-markdown-support/","tags":["ESLint","JSON","Markdown","article"],"content":"ESLintのJSONとMarkdownのサポートについて","relatedLinks":[]},{"category":"Article","title":"How Bun supports V8 APIs without using V8 (part 1) | Bun Blog","url":"https://bun.sh/blog/how-bun-supports-v8-apis-without-using-v8-part-1","tags":["Bun","V8","webkit","C++","article"],"content":"BunがどのようにV8 APIをJSC上に実装しているかについて。\nC++のポインタ、レイアウトの互換性のレイヤー、V8とJSCの値の表現の違い、NaNボクシング、GC、メモリレイアウトについて","relatedLinks":[]},{"category":"Article","title":"Web Components are not Framework Components — and That’s Okay • Lea Verou","url":"https://lea.verou.me/blog/2024/wcs-vs-frameworks/","tags":["WebComponents","article","opinion"],"content":"Web ComponentsはHTMLの拡張とリアクティブテンプレートという2つのカテゴリを使っているという話","relatedLinks":[]},{"category":"Article","title":"webpack to Rspack ~ Rspack移行の結果と注意点 ~","url":"https://zenn.dev/ryo_kawamata/articles/b2df9989fe2c6e","tags":["webpack","rspack","article"],"content":"webpackからRspackへのマイグレーションについて。\nproductionビルドでの問題と対応について","relatedLinks":[]},{"category":"SlideVideo","title":"ViteConf 2024 - YouTube","url":"https://www.youtube.com/playlist?list=PLqGQbXn_GDmnObDzgjUF4Krsfl6OUKxtp","tags":["vite","Conference","video"],"content":"ViteConf 2024の動画一覧","relatedLinks":[]},{"category":"WebsiteDocument","title":"CrUX Vis","url":"https://cruxvis.withgoogle.com/","tags":["webservice","performance"],"content":"CrUXのデータを使って指定したサイトのWeb Vitalなどのパフォーマンスメトリクスの傾向をビジュアライズしてみれるサイト","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dimdenGD/ultimate-express: The Ultimate Express. Fastest http server with full Express compatibility, based on µWebSockets.","url":"https://github.com/dimdenGD/ultimate-express","tags":["express","library"],"content":"µWebSocketsベースのexpress互換のAPIを持つライブラリ","relatedLinks":[]}]},{"meta":{"title":"2024-10-16のJS: Deno v2、TypeScript 5.7 Beta、ES2025に入る5つのProposal","author":"azu","layout":"post","date":"2024-10-15T15:41:43.168Z","category":"JSer","tags":["deno","Tools","Bun","css","ESLint"],"url":"https://jser.info/2024/10/16/deno-v2-typescript-5.7-beta-es20255proposal/"},"items":[{"category":"Headline","title":"Bun v1.1.30 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1.30","tags":["Bun","css","ReleaseNote"],"content":"Bun v1.1.30リリース。\nCSSのparseとbundleのサポート、`bun publish`コマンドの追加、`bun build --bytecode --compile`のパフォーマンス改善。\n`--compile`フラグなしの`--bytecode`フラグをサポート、`bun build --format=cjs`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing Deno 2","url":"https://deno.com/blog/v2.0","tags":["deno","ReleaseNote"],"content":"Deno v2.0リリース。\nグローバルな`window`を削除/`process`を追加、`deno add`で`jsr:`と`npm:`の識別子を指定して追加に対応、パーミッションの指定に関する挙動の変更、`deno bundle`コマンドの削除など","relatedLinks":[{"title":"Deno 2.0 Release Candidate","url":"https://deno.com/blog/v2.0-release-candidate"},{"title":"Deno 1.x to 2.x Migration Guide","url":"https://docs.deno.com/runtime/reference/migration_guide/"}]},{"category":"Headline","title":"Release eslint-plugin-react-hooks@5.0.0 (Oct 11, 2024) · facebook/react","url":"https://github.com/facebook/react/releases/tag/eslint-plugin-react-hooks%405.0.0","tags":["ESLint","ReleaseNote"],"content":"eslint-plugin-react-hooks 5.0.0リリース。\nESLint v9のサポート、コンポーネント名は大文字で開始するルールを追加、React 19の対応、`useEffect(fn, undefined)`を許可するように変更など","relatedLinks":[]},{"category":"Headline","title":"Release v1.48.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.48.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.48.0リリース。\n`page.routeWebSocket()` APIを追加、`page.requestGC()`メソッドの追加、`location`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 205 | WebKit","url":"https://webkit.org/blog/15999/release-notes-for-safari-technology-preview-205/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 205リリース。\n`Math.sumPrecise`、`Iterator.prototype.reduce`のサポート。\nWebAssemblyの例外処理をサポート","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.7 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-7-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.7 Betaリリース。\n初期化されてない変数のチェック、相対パスの`.ts`を出力時に`.js`へと書き換える`--rewriteRelativeImportExtensions`フラグの追加。\n`--target es2024`のサポート、Node.js 22のV8 Compile Cacheをサポートして実行速度の改善など","relatedLinks":[]},{"category":"Headline","title":"Release v0.81.0 · facebook/metro","url":"https://github.com/facebook/metro/releases/tag/v0.81.0","tags":["React","Native","Tools","ReleaseNote","bundler"],"content":"metro 0.81.0リリース。\nNode.js 18未満のサポート終了、`#`から開始するパスは将来のsubpath importサポートのため予約されるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v2.3.0 · reduxjs/redux-toolkit","url":"https://github.com/reduxjs/redux-toolkit/releases/tag/v2.3.0","tags":["redux","library","ReleaseNote"],"content":"Redux Toolkit v2.3.0リリース。\n`upsertQueryEntries`を追加、`prepareHeaders`オプションの改善など","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2024-10 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2024/10/12/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2024年10月のTC39 MeetingでのECMAScript ProposalのStatus変更のまとめ。\n`Promise.try`/Import attributes/RegExp Modifiers/Iterator helpers/JSON modulesがStage 4となりES2025に入る","relatedLinks":[]},{"category":"Article","title":"The Popover API: Your New Best Friend for Tooltips","url":"https://www.voorhoede.nl/en/blog/the-popover-api-your-new-best-friend-for-tooltips/","tags":["HTML","PostCSS","article"],"content":"Popover APIを使ったツールチップの表示について","relatedLinks":[]},{"category":"Article","title":"Deno v2がリリース🎉 - Deno v1.0.0の頃からの変化と現在のプラクティスについて","url":"https://zenn.dev/uki00a/articles/deno-v2-what-has-changed-from-v1","tags":["deno","article"],"content":"Deno v1からv2への変化について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"trynova/nova: JS engine lolz","url":"https://github.com/trynova/nova","tags":["JavaScript","Rust","Tools"],"content":"Rustで書かれたJavaScriptエンジン。\nデータ指向なデザインで実装されている","relatedLinks":[]}]},{"meta":{"title":"2024-10-22のJS: Node.js v23.0.0、Next.js 15、Express v5(pre)","author":"azu","layout":"post","date":"2024-10-21T23:38:56.412Z","category":"JSer","tags":["nodejs","Tools","monorepo","ESLint","Next.js"],"url":"https://jser.info/2024/10/22/node.js-v23.0.0-next.js-15-express-v5pre/"},"items":[{"category":"Headline","title":"Announcing Nx 20 | Nx Blog","url":"https://nx.dev/blog/announcing-nx-20","tags":["nodejs","Tools","monorepo","ReleaseNote"],"content":"Nx 20リリース。\nTypeScript Project Referencesの同期をサポートする`nx sync`の追加、`@nx/rspack`の追加、` nx release`の改善など","relatedLinks":[]},{"category":"Headline","title":"Oxlint v0.10 Migration Guide | The JavaScript Oxidation Compiler","url":"https://oxc.rs/blog/2024-10-18-oxlint-v0.10-release","tags":["ESLint","Tools","ReleaseNote"],"content":"Oxlint 0.10リリース。\n`categories`でルールをまとめて設定できるように、CLIのフラグを設定ファイルより優先するように変更など","relatedLinks":[]},{"category":"Headline","title":"ESLint v9.13.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2024/10/eslint-v9.13.0-released/","tags":["ESLint","ReleaseNote"],"content":"ESLint v9.13.0リリース。\n`ESLint.defaultConfig`でビルトイン設定にアクセスできるように、Node.js v22.8.0で追加されたV8キャッシュを有効化など","relatedLinks":[{"title":"Node.js — Node v22.8.0 (Current)","url":"https://nodejs.org/en/blog/release/v22.8.0#new-js-api-for-compile-cache"}]},{"category":"Headline","title":"Electron 33.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-33-0","tags":["Electron","ReleaseNote"],"content":"Electron 33リリース。\nV8 13、Chromium 130、Node.js 20.18へアップデート。\nmacOS 10.15のサポート終了、Custom Protocolの処理方法の変更。\n`app.setClientCertRequestPasswordHandler`の追加、`View.setBorderRadius`の追加、`navigationHistory`の追加など","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v22.10.0 (Current)","url":"https://nodejs.org/en/blog/release/v22.10.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.10.0リリース。\n`require(esm)`時に読み込む対象を指定できる`\"module-sync\"` exports conditionの追加、`node --run`がStableになるなど","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v23.0.0 (Current)","url":"https://nodejs.org/en/blog/release/v23.0.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v23.0.0リリース。\n`require(esm)`をデフォルトで有効化、32 bit Windowsのサポートを削除、`node --run`をStableに変更。\n非推奨な`--huge-max-old-generation-size`を削除、`node:util`パッケージから非推奨な`_extend()`や`isBoolean()`などを削除。","relatedLinks":[{"title":"Node.js v23の主な変更点 - 別にしんどくないブログ","url":"https://shisama.hatenablog.com/entry/2024/10/18/080000"}]},{"category":"Headline","title":"Turborepo 2.2","url":"https://turbo.build/blog/turbo-2-2-0","tags":["monorepo","Tools","ReleaseNote"],"content":"Turborepo 2.2リリース。\nGraphQLでリポジトリデータのクエリができる`turbo query`を追加、`TURBO_PLATFORM_ENV`を追加、`eslint-config-turbo`の改善、`--affected`の改善など","relatedLinks":[]},{"category":"Headline","title":"Next.js 15 RC 2 | Next.js","url":"https://nextjs.org/blog/next-15-rc2","tags":["Next.js","ReleaseNote"],"content":"Next.js 15 RC 2リリース。\n`header`/`cookies`/`params`/`searchParams`へのアクセスが非同期APIへと変更、Server Actionで使用してないActionは公開されないように変更。\nStatic Route Indicatorの追加、`<Form>`コンポーネントの追加、`next.config.ts`のサポート。\n`instrumentation.js`がStableに変更、Static Generationのリクエスト処理の改善、ESLint 9のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Bun v1.1.31 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1.31","tags":["Bun","ReleaseNote"],"content":"Bun v1.1.31リリース。\n`node:http2`のサポート、`bun build --drop`で特定の関数を削除できるように、`Bun.inspect.table()`の追加\nIterator Helpersのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Next.js 15 | Next.js","url":"https://nextjs.org/blog/next-15","tags":["Next.js","ReleaseNote"],"content":"Next.js 15リリース。\n`fetch`はデフォルトで`no-store`に変更、`GET`ルートハンドラーはデフォルトでキャッシュしないように、クライアントルーターキャッシュもデフォルトではキャッシュしないように変更。\nReact 19 RCへ対応、実験的なReactコンパイラのサポート、Hydration Errorの改善、TurbopackがStableに、Static Route Indicatorの追加。\n`unstable_after`の追加、`instrumentation.js`がStableに、`<Form>`コンポーネントの追加、`next.config.ts`のサポート、ESLint 9のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Introducing Express v5: A New Era for Node.js Framework","url":"https://expressjs.com/2024/10/15/v5-release.html","tags":["express","ReleaseNote"],"content":"Express v5 pre-release。\nNode.js 18未満のサポート終了、パスマッチングの挙動の変更、Promiseのサポート、body parserの挙動変更、非推奨のメソッドを削除など","relatedLinks":[]},{"category":"Headline","title":"JavaScriptプログラマーのためのTypeScript厳選ガイド 〜JavaScriptプロジェクトを型安全で堅牢にする書き方を理解する | 藤 吾郎 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/4297145774/","tags":["TypeScript","ReleaseNote","book"],"content":"2024年11月9日発売\nTypeScriptについての書籍","relatedLinks":[]},{"category":"Article","title":"The story of web framework Hono, from the creator of Hono","url":"https://blog.cloudflare.com/the-story-of-web-framework-hono-from-the-creator-of-hono/","tags":["Hono","article"],"content":"Honoがなぜ作られたのかやアーキテクチャについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"pkg-graph | Visualize the dependency graph of npm packages.","url":"https://pkg-graph.info/","tags":["npm","webservice"],"content":"npmパッケージの依存関係を可視化してくれるツール","relatedLinks":[]},{"category":"WebsiteDocument","title":"gosub-io/gosub-engine: Our main browser engine repository.","url":"https://github.com/gosub-io/gosub-engine?tab=readme-ov-file","tags":["Rust","browser"],"content":"HTMLとCSSのパーサとレンダリングを実装しているブラウザエンジン。\nJavaScriptは既存のV8などと組み合わせ利用する想定。\nWebAssemblyへのコンパイルにも対応している。","relatedLinks":[]},{"category":"Book","title":"JavaScriptによるはじめてのアルゴリズム入門：書籍案内｜技術評論社","url":"https://gihyo.jp/book/2024/978-4-297-14494-4","tags":["JavaScript","algorithm","book"],"content":"2024年11月5日発売\nJavaScriptでのアルゴリズム入門本","relatedLinks":[]}]},{"meta":{"title":"2024-10-29のJS: Svelte 5、MSW v2.6.0(WebSockets API)、State of CSS 2024","author":"azu","layout":"post","date":"2024-10-29T14:06:46.298Z","category":"JSer","tags":["React","Svelte","Unicode","Next.js","nodejs"],"url":"https://jser.info/2024/10/29/svelte-5-msw-v2.6.0websockets-api-state-of-css-2024/"},"items":[{"category":"Headline","title":"Svelte 5 is alive","url":"https://svelte.dev/blog/svelte-5-is-alive","tags":["Svelte","ReleaseNote"],"content":"Svelte 5リリース。\nruneのサポート、イベント属性の渡し方の変更、Slotの作成方法の変更、コンポーネントはClassではなくなり`new`できないように変更など","relatedLinks":[{"title":"Svelte 5 migration guide • Docs • Svelte","url":"https://svelte.dev/docs/svelte/v5-migration-guide"}]},{"category":"Headline","title":"Release v5.0.0 · pmndrs/zustand","url":"https://github.com/pmndrs/zustand/releases/tag/v5.0.0","tags":["JavaScript","React","library","ReleaseNote"],"content":"Zustand v5リリース。\ndefault exportの削除、deprecatedな機能の削除、ES5のサポートを削除、無限ループを起こすケースを明示的にエラーにするなど","relatedLinks":[{"title":"zustand/docs/migrations/migrating-to-v5.md at main · pmndrs/zustand","url":"https://github.com/pmndrs/zustand/blob/main/docs/migrations/migrating-to-v5.md"}]},{"category":"Headline","title":"Node.js — Node v23.1.0 (Current)","url":"https://nodejs.org/en/blog/release/v23.1.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v23.1.0リリース。\n`Buffer`が`ArrayBuffer`のresizeに対応、`node:test`のMockTimersをStableになるなど","relatedLinks":[]},{"category":"Headline","title":"WebStorm and Rider Are Now Free for Non-Commercial Use | The JetBrains Blog","url":"https://blog.jetbrains.com/blog/2024/10/24/webstorm-and-rider-are-now-free-for-non-commercial-use/","tags":["WebStorm","editor","JavaScript","software"],"content":"非商用の場合は、WebStormとRiderが無料で利用できるようになった。","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 10.0 Alpha 0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.0.0-alpha.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.0.0 alpha.0リリース。\n`pnpm link`の挙動の変更、`packageManager`を参照してpnpmのバージョンを確認するように、storeバージョンの更新など","relatedLinks":[]},{"category":"Headline","title":"Release Version 8.14.0 · acornjs/acorn","url":"https://github.com/acornjs/acorn/releases/tag/8.14.0","tags":["JavaScript","ECMAScript","library","ReleaseNote"],"content":"acorn 8.14.0リリース。\nES2025 import attributes/RegExp modifiersのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · tinylibs/tinybench","url":"https://github.com/tinylibs/tinybench/releases/tag/v3.0.0","tags":["JavaScript","benchmark","library","ReleaseNote"],"content":"tinybench v3.0.0リリース。\nNode.js 16のサポートを終了、`*Concurrently`メソッドの削除、`warmup()`メソッドを削除し`warmup`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v2.6.0 · mswjs/msw","url":"https://github.com/mswjs/msw/releases/tag/v2.6.0","tags":["JavaScript","test","library","ReleaseNote"],"content":"msw 2.6.0リリース。\nWebSocket APIのモックをサポート","relatedLinks":[]},{"category":"Headline","title":"WebKit Features in Safari 18.1 | WebKit","url":"https://webkit.org/blog/16188/webkit-features-in-safari-18-1/","tags":["safari","ReleaseNote"],"content":"Safari 18.1リリース。","relatedLinks":[]},{"category":"Article","title":"The nuances of base64 encoding strings in JavaScript  |  Articles  |  web.dev","url":"https://web.dev/articles/base64-encoding","tags":["Unicode","JavaScript","article"],"content":"絵文字やサロゲートペアを安全に扱えるBase64エンコードについて。\n`btoa()`/`atob()`はUnicodeを扱うときに問題があるため`TextEncoder`でエンコードしてから扱う。\n`TextEncoder`は単独のサロゲートを持つ文字列を不正なデータとして � に置き換えてしまうため、`isWellFormed()`を使い判定する話","relatedLinks":[]},{"category":"Article","title":"Our Journey with Caching | Next.js","url":"https://nextjs.org/blog/our-journey-with-caching","tags":["Next.js","article"],"content":"`\"use cache\"` directiveを使ったNext.jsの新しいキャッシュの仕組みについて","relatedLinks":[]},{"category":"Article","title":"State of CSS 2024","url":"https://2024.stateofcss.com/en-US/","tags":["css ","Survey"],"content":"State of CSS 2024のアンケート結果が公開された。\nCSSの言語機能、ライブラリやフレームワーク、開発ターゲット、学習リソースなどについてのアンケート","relatedLinks":[]},{"category":"WebsiteDocument","title":"Homepage » Jeasx - JSX with Ease","url":"https://www.jeasx.dev/","tags":["JavaScript","jsx","server","library"],"content":"JSXをテンプレートとして利用してSSRを行うフレームワーク。\n非同期処理、ディレクトリベースのルーティング、Static Assetsの扱いなどに対応している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"One, a React Framework","url":"https://onestack.dev/","tags":["React","iOS","Android","library"],"content":"ウェブとネイティブに対応したReactフレームワーク。\ntamaguiのチームが開発している","relatedLinks":[]}]},{"meta":{"title":"2024-11-07のJS: Node v22.11.0 (LTS)、Nuxt 3.14、vlt Package Manager","author":"azu","layout":"post","date":"2024-11-07T01:43:14.610Z","category":"JSer","tags":["css","nodejs","Extension","npm","security"],"url":"https://jser.info/2024/11/07/node-v22.11.0-lts-nuxt-3.14-vlt-package-manager-/"},"items":[{"category":"Headline","title":"Node.js — Node v22.11.0 (LTS)","url":"https://nodejs.org/en/blog/release/v22.11.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.11.0リリース。\nNode.js 22.xがLTSとなり、2027年4月までメンテナンスされる。","relatedLinks":[]},{"category":"Headline","title":"Nuxt 3.14 · Nuxt Blog","url":"https://nuxt.com/blog/v3-14","tags":["Nuxt","ReleaseNote"],"content":"Nuxt v3.14リリース。\n`jiti`のアップデート、クライアントとサーバで共有するコードを置く`shared/`フォルダの追加、`rspack`の対応。\n`useResponseHeader`と`useRuntimeHook`の追加。\nv4での変更をopt-inできる`compatibilityVersion: 4`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · immutable-js/immutable-js","url":"https://github.com/immutable-js/immutable-js/releases/tag/v5.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"imutable-js v5.0.0リリース。\n非推奨のメソッドを削除、default exportを削除、TypeScriptの型定義を改善など","relatedLinks":[]},{"category":"Headline","title":"mylesmmurphy/prettify-ts: Prettify TypeScript: Better Type Previews","url":"https://github.com/mylesmmurphy/prettify-ts","tags":["TypeScript","VSCode","Extension"],"content":"TypeScriptの型情報を読みやすい形に展開して表示してくれるVSCode拡張","relatedLinks":[{"title":"TypeScriptの型を展開してホバー表示してくれるVSCode拡張「Prettify TypeScript」が便利","url":"https://zenn.dev/atamaplus/articles/0ecd883bcc9edd"}]},{"category":"Headline","title":"happy-dom allows for server side code to be executed by a &lt;script&gt; tag · CVE-2024-51757 · GitHub Advisory Database","url":"https://github.com/advisories/GHSA-96g7-g7g9-jxw8","tags":["JavaScript","DOM","nodejs","ReleaseNote","security"],"content":"happy-domのSSRFのセキュリティ修正。\n`<script>`の`src`属性に書かれているコードを実行してしまう問題の修正。\nhappy-dom v15.10.2で修正されている。","relatedLinks":[{"title":"Release v15.10.2 · capricorn86/happy-dom","url":"https://github.com/capricorn86/happy-dom/releases/tag/v15.10.2"}]},{"category":"Article","title":"Making content-aware components using CSS :has(), grid, and quantity queries - Piccalilli","url":"https://piccalil.li/blog/making-content-aware-components-using-css-has-grid-and-quantity-queries/","tags":["css ","article"],"content":"Quantity QueriesやContainer Queriesを使って要素の数や横幅でGrid Layoutを変更するテクニックについて。","relatedLinks":[]},{"category":"Article","title":"Re-implementing JavaScript&#039;s == in JavaScript","url":"https://evanhahn.com/re-implementing-javascript-double-equals-in-javascript/","tags":["ECMAScript","JavaScript","article"],"content":"`==` をJavaScriptで実装していく話。\n`==` がどのような変換や比較を行っているかを仕様のStepごとに実装していき、そのアルゴリズムを見ていく記事","relatedLinks":[]},{"category":"Article","title":"CSS sprite sheet animations · leanrada.com","url":"https://leanrada.com/notes/css-sprite-sheets/","tags":["css ","animation","article"],"content":"CSS spriteでのアニメーションについて。\nAPNGやSVGでのアニメーションと比べたメリットやデメリット、CSS spriteでのアニメーションの実装方法について","relatedLinks":[]},{"category":"Article","title":"Introducing the vlt Package Manager &amp; Serverless Registry","url":"https://blog.vlt.sh/blog/introducing-vlt-and-vsr","tags":["npm","article"],"content":"npmと互換性のあるパッケージマネージャーのvltとnpm registry互換のvsrが公開された。","relatedLinks":[]},{"category":"SlideVideo","title":"Next.js App Router セキュリティ - Speaker Deck","url":"https://speakerdeck.com/zaru_sakuraba/nextjssekiyuritei","tags":["Next.js","security","slide"],"content":"Next.jsのServer Actionなどのセキュリティについてのスライド。\n`\"use server\";`で意図せずにサーバの関数を公開してしまうケース、Server ComponentからClientにデータを丸ごとPropsとして渡してしてしまうケースなどについて。","relatedLinks":[]},{"category":"WebsiteDocument","title":"astahmer/atomic-css-devtools: A devtool panel for debugging Atomic CSS rules as if they were not atomic. Available on chrome &amp; firefox","url":"https://github.com/astahmer/atomic-css-devtools","tags":["css ","debug","browser","Extension"],"content":"Atomic CSSのスタイルをまとめたパネルを提供することで、Atomic CSSのデバッグをしやすくするブラウザ拡張","relatedLinks":[]},{"category":"WebsiteDocument","title":"NPM Chart","url":"https://npm.chart.dev/","tags":["npm","webservice"],"content":"npmパッケージのインストール数のグラフを生成してくれるサービス","relatedLinks":[]}]},{"meta":{"title":"2024-11-16のJS: Node v23.2.0、Storybook 8.4、i-html","author":"azu","layout":"post","date":"2024-11-16T02:19:18.183Z","category":"JSer","tags":["safari","TypeScript","rspack","WebAssembly","Tools"],"url":"https://jser.info/2024/11/16/node-v23.2.0-storybook-8.4-i-html/"},"items":[{"category":"Headline","title":"Release Notes for Safari Technology Preview 207 | WebKit","url":"https://webkit.org/blog/16205/release-notes-for-safari-technology-preview-207/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 207リリース。\nCross-Origin-Opener-Policyの`noopener-allow-popups`をサポート、Compression StreamsでBrotliをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.7 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-7-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.7 RCリリース。\n初期化されてない変数のチェック、相対パスの`.ts`を出力時に`.js`へと書き換える`--rewriteRelativeImportExtensions`フラグの追加。\n`--target es2024`のサポート、Node.js 22のV8 Compile Cacheをサポートして実行速度の改善など","relatedLinks":[]},{"category":"Headline","title":"Announcing Rspack 1.1 - Rspack","url":"https://rspack.dev/blog/announcing-1-1","tags":["rspack","ReleaseNote"],"content":"Rspack 1.1リリース\nパフォーマンスの改善、`experiments.incrementalRebuild`オプションの追加、`HtmlRspackPlugin`の改善など","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v23.2.0 (Current)","url":"https://nodejs.org/en/blog/release/v23.2.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v23.2.0リリース。\nルート証明書の更新、TypeScriptサポートのステータスをActive developmentに更新。`module.findPackageJSON`、`module.stripTypeScriptTypes`の追加など","relatedLinks":[]},{"category":"Headline","title":"First Public Working Draft: Web Audio API 1.1 | 2024 | News | W3C","url":"https://www.w3.org/news/2024/first-public-working-draft-web-audio-api-1-1/","tags":["web ","audio","spec","news"],"content":"Web Audio API 1.1のWorking Draftの公開","relatedLinks":[]},{"category":"Headline","title":"Storybook 8.4","url":"https://storybook.js.org/blog/storybook-8-4/","tags":["storybook","ReleaseNote"],"content":"Storybook 8.4リリース。\nUIからVitestでのコンポーネントテストの実行に対応、パッケージサイズの改善、Svelte 5のサポート、React Nativeの改善、タグベースのフィルタリングの対応など","relatedLinks":[{"title":"storybook/CHANGELOG.md at next · storybookjs/storybook","url":"https://github.com/storybookjs/storybook/blob/next/CHANGELOG.md#840"}]},{"category":"Headline","title":"Release v2.13.0 · parcel-bundler/parcel","url":"https://github.com/parcel-bundler/parcel/releases/tag/v2.13.0","tags":["parcel","ReleaseNote"],"content":"Parcel v2.13.0リリース。\n`@parcel/bundler-library`の追加、`.proxyrc.ts`のサポート、resolverのパフォーマンス改善など","relatedLinks":[]},{"category":"Headline","title":"A better Next.js? • Nue 1.0 (RC) is out - Nue","url":"https://nuejs.org/blog/nue-release-candidate/","tags":["JavaScript","library","ReleaseNote"],"content":"静的サイトジェネレータのNue 1.0 RCリリース。\nMarkdownパーサを再実装など","relatedLinks":[{"title":"Release v1.0.0-RC.1 · nuejs/nue","url":"https://github.com/nuejs/nue/releases/tag/v1.0.0-RC.1"}]},{"category":"Article","title":"i-html, an inline-html import element","url":"https://www.keithcirkel.co.uk/i-html/","tags":["HTML","WebComponents","JavaScript","library"],"content":"htmxのようにHTMLでインタラクティブな動作を実装したり、外部のHTMLフラグメントをロードできるCustom Elementライブラリ","relatedLinks":[]},{"category":"Article","title":"Exploring the DOMPurify library: Bypasses and Fixes | mizu.re","url":"https://mizu.re/post/exploring-the-dompurify-library-bypasses-and-fixes","tags":["XSS","JavaScript","DOM","security","article"],"content":"DOMのサニタイズライブラリであるDOMPurifyのバイパス手法について。\nHTMLのパースにおける仕様やFuzzingからどのようにバイパスするか調べたかについて","relatedLinks":[]},{"category":"Article","title":"How To Optimize Performance In Vue Apps | DebugBear","url":"https://www.debugbear.com/blog/optimize-vue-performance","tags":["Vue","performance","article"],"content":"Vueアプリケーションのパフォーマンスについての記事。\nVueのDirectiveでのDOM更新の最適化、メモリリークの回避、画像の最適化などについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"drogus/jawsm: JavaScript to WASM compiler","url":"https://github.com/drogus/jawsm","tags":["JavaScript","WebAssembly","Tools"],"content":"JavaScriptをWebAssemblyにコンパイルするツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"React Query Builder","url":"https://react-querybuilder.js.org/","tags":["React","library","GUI"],"content":"複雑な条件設定をするUIを提供するReactコンポーネント。\n設定した条件からSQLやJSONなどの形式で出力できる","relatedLinks":[]}]},{"meta":{"title":"2024-11-26のJS: Angular v19、Deno 2.1(LTS)、React Router v7(from Remix)","author":"azu","layout":"post","date":"2024-11-26T02:04:02.199Z","category":"JSer","tags":["React","nodejs","playwright","TypeScript","tool"],"url":"https://jser.info/2024/11/26/angular-v19-deno-2.1lts-react-router-v7from-remix/"},"items":[{"category":"Headline","title":"Bun v1.1.35 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1.35","tags":["Bun","ReleaseNote"],"content":"Bun v1.1.35リリース。\nMuslとAlpine Linux のネイティブサポート、`bun test`の結果をJUnit XML形式で出力できるように、`Worker`のpreloadのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Meet Angular v19. In the past two years we doubled down… | by Minko Gechev | Nov, 2024 | Angular Blog","url":"https://blog.angular.dev/meet-angular-v19-7b29dfd05b84","tags":["Angular","ReleaseNote"],"content":"Angular v19リリース。\nDeveloper previewとして新しいIncremental Hydrationの仕組みを追加、ServerRouteでレンダリングモードを指定できるように、HMRのサポート。\nStandalone componentがデフォルトで`true`に変更、`linkedSignal`の追加、`resource()` APIの追加など","relatedLinks":[{"title":"Release v19.0.0 · angular/angular","url":"https://github.com/angular/angular/releases/tag/19.0.0"},{"title":"Angular v19 Developer Event - YouTube","url":"https://www.youtube.com/watch?v=JvkX2_46gUY"}]},{"category":"Headline","title":"Node.js — Node v23.3.0 (Current)","url":"https://nodejs.org/en/blog/release/v23.3.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v23.3.0リリース。\n`util.getCallSite()`がSource Mapをサポート。\nNode.jsに対する変更でSEMVER-MAJORのコミットがmainブランチに入る時のルールを厳格化など","relatedLinks":[]},{"category":"Headline","title":"Deno 2.1: Wasm Imports and other enhancements","url":"https://deno.com/blog/v2.1","tags":["dneo","ReleaseNote"],"content":"Deno v2.1リリース。\nLTSとなるリリースで、2025年4月までサポートされる。\n`.wasm`のインポートに対応、`deno init --npm`を追加、`deno outdated`の追加、`deno compile`がAssetsを埋め込めるように。\n`deno task`にdescriptionを表示できるように、task間の依存関係を定義できるようになるなど","relatedLinks":[{"title":"Stability and releases","url":"https://docs.deno.com/runtime/fundamentals/stability_and_releases/"}]},{"category":"Headline","title":"November 20, 2024 Release – React Spectrum Releases","url":"https://react-spectrum.adobe.com/releases/2024-11-20.html","tags":["React","UI","library","ReleaseNote"],"content":"react-aria-components 1.5.0 リリース。\n`ToggleButtonGroup`の追加、`MenuSection`ごとに設定を持たせられるように、TypeScriptの設定をStrictに変更、AccordionとDisclosureをGAに変更など","relatedLinks":[]},{"category":"Headline","title":"Node.js 22 runtime now available in AWS Lambda | AWS Compute Blog","url":"https://aws.amazon.com/jp/blogs/compute/node-js-22-runtime-now-available-in-aws-lambda/","tags":["aws","Lambda","nodejs","news"],"content":"AWS LambdaでNode.js 22をサポート","relatedLinks":[]},{"category":"Headline","title":"React Router v7 | Remix","url":"https://remix.run/blog/react-router-v7","tags":["React","Remix","ReleaseNote"],"content":"React Router v7リリース。\nReact Router v7はRemix v2のメジャーアップデートバージョンとなる。\nReact Router v6とRemix v2からのアップデートガイドも公開されている。","relatedLinks":[{"title":"Upgrading from v6 | React Router","url":"https://reactrouter.com/upgrading/v6"},{"title":"Upgrading from Remix | React Router","url":"https://reactrouter.com/upgrading/remix"}]},{"category":"Headline","title":"Announcing TypeScript 5.7 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-7/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.7リリース。\n初期化されてない変数のチェック、相対パスの`.ts`を出力時に`.js`へと書き換える`--rewriteRelativeImportExtensions`フラグの追加。\n`--target es2024`のサポート、Node.js 22のV8 Compile Cacheをサポートして実行速度の改善など","relatedLinks":[]},{"category":"Headline","title":"Release v1.49.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.49.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.49.0リリース。\nAria Snapshotの追加、古いヘッドレスモード(`chromium-headless-shell`)と新しいヘッドレスモードが両方ダウンロードされるように変更。\n`--only-shell`を使うことで古いヘッドレスモードのみをダウンロードできる。新しいヘッドレスモードへ`channel: 'chromium'`で切り替えができる。","relatedLinks":[{"title":"Changes in Chromium headless in Playwright v1.49 · Issue #33566 · microsoft/playwright","url":"https://github.com/microsoft/playwright/issues/33566"},{"title":"Download old Headless Chrome as chrome-headless-shell  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/chrome-headless-shell"}]},{"category":"Headline","title":"State of HTML 2024","url":"https://2024.stateofhtml.com/en-US/","tags":["HTML","Survey","news"],"content":"State of HTML 2024の結果が公開された","relatedLinks":[]},{"category":"Article","title":"アクセシビリティツリーを比較する Playwright の Aria snapshots がよさそう","url":"https://azukiazusa.dev/blog/playwright-aria-snapshot/","tags":["playwright","article","test","accessibility"],"content":"PlaywrightのAria snapshotsについて","relatedLinks":[]},{"category":"SlideVideo","title":"JSConf JP 2024 公開資料・Xアカウントリンクまとめ","url":"https://zenn.dev/yumemi_inc/articles/2024-11-24-jsconf-jp-2024","tags":["JavaScript","Conference","slide"],"content":"JSConf JP 2024のスライドまとめ","relatedLinks":[{"title":"JSConf JP","url":"https://jsconf.jp/2024/"}]},{"category":"WebsiteDocument","title":"React Scan","url":"https://react-scan.million.dev/","tags":["React","performance","tool"],"content":"タグを埋め込むことでReactアプリのレンダリングのプロファイルを取得したり、なぜレンダリングされているのかをみたり、レンダリング回数などの可視化をするツール。\nMillion Lintが開発している。","relatedLinks":[{"title":"aidenybai/react-scan: Scan for React performance issues and eliminate slow renders in your app","url":"https://github.com/aidenybai/react-scan"}]},{"category":"SoftwareLibrary","title":"ysk8hori/typescript-graph: A CLI to visualize the dependencies between files in the TypeScript codebase.","url":"https://github.com/ysk8hori/typescript-graph","tags":["TypeScript","tool"],"content":"TypeScriptのコードの依存関係をMermaidでビジュアライズできるツール","relatedLinks":[]}]},{"meta":{"title":"2024-12-04のJS: Node.js v22.12.0、Vite 6.0、Tailwind CSS v4.0 Beta 1","author":"azu","layout":"post","date":"2024-12-03T23:34:51.334Z","category":"JSer","tags":["nodejs","TypeScript","css","npm","Vue"],"url":"https://jser.info/2024/12/04/node.js-v22.12.0-vite-6.0-tailwind-css-v4.0-beta-1/"},"items":[{"category":"Headline","title":"Release v11.0.0-pre.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v11.0.0-pre.0","tags":["npm","ReleaseNote"],"content":"npm v11.0.0-pre.0リリース。\nprereleaseの場合はtagを指定を必須に変更、`--ignore-scripts`が全てのコマンドで動作するように、`npm hook`コマンドの削除など","relatedLinks":[]},{"category":"Headline","title":"Release v12.0.0 · vueuse/vueuse","url":"https://github.com/vueuse/vueuse/releases/tag/v12.0.0","tags":["Vue","library","ReleaseNote"],"content":"vueuse v12.0.0リリース。\nvue 2のサポートを終了","relatedLinks":[]},{"category":"Headline","title":"Firefox 133.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/133.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 133リリース。\nviewport metaタグで`interactive-widgets`の値をサポート、`Uint8Array.fromBase64`/`toBase64`をサポート。\nPermissions APIがWorkerで利用できるように、WebCodecs APIの`ImageDecoder` APIをサポート、Fetch APIの`keepalive`をサポート。\n実験的な機能として`contenteditable=plaintext-only`をサポート、CSSの`:has-slotted`をサポートなど","relatedLinks":[{"title":"Firefox 133 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/133"}]},{"category":"Headline","title":"Release v7.0.0 · nodejs/undici","url":"https://github.com/nodejs/undici/releases/tag/v7.0.0","tags":["nodejs","Fetch","library","ReleaseNote"],"content":"undici v7.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release pnpm v10.0 Beta 1 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.0.0-beta.1","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.0.0-beta.1リリース。\n`pnpm link`の挙動の変更、`packageManager`を参照してpnpmのバージョンを確認するように、storeバージョンの更新。\n`verifyDepsBeforeRun`オプションが追加され、lockと`node_modules/`の状態を比較して自動インストールなどができるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release 6.0.0 · prisma/prisma","url":"https://github.com/prisma/prisma/releases/tag/6.0.0","tags":["prisma","TypeScript","ReleaseNote"],"content":"Prisma 6.0.0リリース。\nNode.js 18未満のサポート終了、PostgreSQLのm-n relationのスキーマを変更、`Buffer`を利用していた箇所を`Uint8Array`に変更など","relatedLinks":[]},{"category":"Headline","title":"Release v2.4.0 · reduxjs/redux-toolkit","url":"https://github.com/reduxjs/redux-toolkit/releases/tag/v2.4.0","tags":["redux","library","ReleaseNote"],"content":"Redux Toolkit v2.4.0リリース。\nRTKクエリの改善、型の改善など","relatedLinks":[]},{"category":"Headline","title":"Vite 6.0 is out! | Vite","url":"https://vite.dev/blog/announcing-vite6","tags":["vite","ReleaseNote"],"content":"Vite 6.0リリース。\n実験的なAPIとしてEnvironment API を追加、`resolve.conditions`のデフォルト値を変更、Sassのmodern APIを使うように変更など","relatedLinks":[{"title":"Migration from v5 | Vite","url":"https://vite.dev/guide/migration.html"}]},{"category":"Headline","title":"Tailwind CSS v4.0 Beta 1 - Tailwind CSS","url":"https://tailwindcss.com/blog/tailwindcss-v4-beta","tags":["css ","ReleaseNote"],"content":"Tailwind CSS v4.0 Beta 1リリース。\nCSS-first configurationの追加、`@starting-style`に対応するvariantの追加など","relatedLinks":[{"title":"Tailwind CSS v4.0 Beta - Tailwind CSS","url":"https://tailwindcss.com/docs/v4-beta"}]},{"category":"Headline","title":"Node.js — Node v22.12.0 (LTS)","url":"https://nodejs.org/en/blog/release/v22.12.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.12.0リリース。\n`require(esm)`をデフォルトで有効化、ルート証明書の更新など","relatedLinks":[]},{"category":"Article","title":"Node.js — Trip report: Node.js collaboration summit (2024 Dublin)","url":"https://nodejs.org/en/blog/events/collab-summit-2024-dublin","tags":["nodejs","article"],"content":"Node.js collaboration summitについてのまとめ","relatedLinks":[]},{"category":"Article","title":"DevTools の使い方を可能な限りスクショ付きで解説してみる","url":"https://zenn.dev/mizchi/scraps/c72e6a55deca18","tags":["Chrome","debug","article"],"content":"Chrome DevToolsの使い方","relatedLinks":[]},{"category":"SlideVideo","title":"JavaScriptのモジュール解決の相互運用性 / JSConf JP 2024 - Interoperability of Module Resolutions in JavaScript - Speaker Deck","url":"https://speakerdeck.com/berlysia/interoperability-of-module-resolutions-in-javascript","tags":["JavaScript","ECMAScript","nodejs","module","slide"],"content":"CJS/ESM/Node.js/TypeScriptのモジュール解決と相互運用性について。\nimport path aliasとツールの相互運用性について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"eslint/css: CSS language plugin for ESLint","url":"https://github.com/eslint/css","tags":["ESLint","css ","plugin"],"content":"ESLintのCSSプラグイン。\nESLintでCSSのLintを行うプラグイン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"litdb/litdb: Lightweight RDBMS agnostic TypeScript/JS abstraction for SQLite, PostgreSQL and MySQL","url":"https://github.com/litdb/litdb","tags":["TypeScript","database","library"],"content":"型安全なSQLクエリビルダーライブラリ。\nRDBMSのテーブルスキーマをTypeScript/Decoratorで定義して、クエリを安全に書けるようにしている。","relatedLinks":[]}]},{"meta":{"title":"2024-12-11のJS: React v19、Astro v5、The 2024 Web Almanac","author":"azu","layout":"post","date":"2024-12-11T02:51:36.980Z","category":"JSer","tags":["React","TypeScript","Chrome","document","performance"],"url":"https://jser.info/2024/12/11/react-v19-astro-v5-the-2024-web-almanac/"},"items":[{"category":"Headline","title":"React v19 – React","url":"https://react.dev/blog/2024/12/05/react-19","tags":["React","ReleaseNote"],"content":"React 19リリース。\n非同期遷移を扱うアクションの概念の追加と`useActionState`/`useFormStatus`/`useOptimistic`/`use` APIの追加。\nreact-domにprerender APIの追加、Server ComponentとServer Actionの追加。\n`ref`をpropsとして渡す際に`forwardRef`は不要に、Hydration Errorの改善、`ref` callbackがcleanup関数を返せるように。\n`<title>`/`<meta>`/`<link>`などのメタタグをサポート、`<link rel=stylesheet>`や`<script async={true} src=...>`をサポート。\nリソースのpreload APIのサポート、Custom Elementをサポートなど","relatedLinks":[{"title":"Release 19.0.0 (December 5, 2024) · facebook/react","url":"https://github.com/facebook/react/releases/tag/v19.0.0"},{"title":"Release v15.0.4 · vercel/next.js","url":"https://github.com/vercel/next.js/releases/tag/v15.0.4"}]},{"category":"Headline","title":"ECMAScript proposal updates @ 2024-12 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2024/12/08/ecmascript-proposal-update","tags":["ECMAScript","news"],"content":"2024年12月のTC39ミーティングでのECMAScript Proposalのステータス変更のまとめ。\nSync Importsの追加、`Error.isError`がStage 3に、`Intl.DurationFormat`がStage 4となるなど","relatedLinks":[]},{"category":"Headline","title":"Astro 5.0 | Astro","url":"https://astro.build/blog/astro-5/","tags":["astro","ReleaseNote"],"content":"Astro 5.0リリース。\nContent Layerの改善、Server Islands/astro:envをStableに、Vite 6へアップデートなど","relatedLinks":[{"title":"astro/packages/astro/CHANGELOG.md at main · withastro/astro","url":"https://github.com/withastro/astro/blob/main/packages/astro/CHANGELOG.md#500"}]},{"category":"Headline","title":"Next.js 15.1 | Next.js","url":"https://nextjs.org/blog/next-15-1","tags":["Next.js","ReleaseNote"],"content":"Next.js 15.1リリース。\nReact 19 Stableに対応、Source Mapsの改善、エラースタックトレースの改善。\n実験的な機能として`forbidden()`と`unauthorized()`を追加、`<link>`と`<style>`のインライン化の対応。","relatedLinks":[]},{"category":"Article","title":"改めて学ぶ satisfies 演算子","url":"https://zenn.dev/okkun/articles/ed6f146e03c60a","tags":["TypeScript","article"],"content":"TypeScriptの`satisfies`演算子の使い方について","relatedLinks":[]},{"category":"Article","title":"ニコニコ生放送のアプリケーションにRspackを導入している話","url":"https://zenn.dev/thiry/articles/0f671d086b2fb0","tags":["webpack","rspack","article"],"content":"webpackからrspackへの移行について。\ncss modules周りのいくつかの動作の問題があるが、ほとんどの部分でwebpackと互換性がある状態でbundleのパフォーマンスが改善できたという話","relatedLinks":[]},{"category":"Article","title":"Introducing Nuxt Icon v1 · Nuxt Blog","url":"https://nuxt.com/blog/nuxt-icon-v1-0","tags":["Nuxt","article"],"content":"Nuxt Icon v1.0リリース。\nアイコンロードの方法の比較とNuxt Iconでの実装について。\nimgタグ/Webフォント/インラインSVG/動的なAPI/コンポーネント/CSSアイコンのアプローチの比較。\nNuxt Iconで時はCSSモードとSVGモードを両方サポートし、アイコンごとに切り替えられる。","relatedLinks":[]},{"category":"Article","title":"What&#039;s new in DevTools, Chrome 132  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/new-in-devtools-132?hl=en","tags":["Chrome","article"],"content":"Chrome 132でのChrome DevToolsの変更点について。\nAI assistanceの改善、パフォーマンスタブのNetworkパネルにそのリソースがレンダリングブロックしてるかを表示、`scheduler.postTask`の可視化など","relatedLinks":[]},{"category":"Article","title":"How To Improve INP: Yield Patterns | Jacob &#039;Kurt&#039; Groß","url":"https://kurtextrem.de/posts/improve-inp","tags":["React","performance","article"],"content":"ReactアプリケーションでInteraction-to-Next-Paint(INP)を改善するアプローチについての連載記事","relatedLinks":[]},{"category":"Article","title":"State of JavaScript 2024","url":"https://survey.devographics.com/survey/state-of-js/2024","tags":["JavaScript","Survey"],"content":"JavaScriptについての開発者アンケートであるState of JavaScript 2024の募集が開始された","relatedLinks":[]},{"category":"Article","title":"A leap in the evolution of Airtable’s codebase: Scaling TypeScript to thousands of projects | by Michael Mitchell | The Airtable Engineering Blog | Dec, 2024 | Medium","url":"https://medium.com/airtable-eng/a-leap-in-the-evolution-of-airtables-codebase-scaling-typescript-to-thousands-of-projects-734326c3a553","tags":["TypeScript","article","performance"],"content":"Bazelを使ったTypeScriptの並列ビルドを最適化する話。\nTypeScriptのプロジェクト同士が循環参照していたのをCopilotを使ってインターフェースの分離、Isolated Declarationsを使った並列ビルドができるような明示的な型付けなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"CSS Wrapped 2024","url":"https://chrome.dev/css-wrapped-2024/","tags":["browser","css ","document","example","Chrome"],"content":"2024年にChromeへ追加されたCSSの機能を体験できるサイト。","relatedLinks":[]},{"category":"WebsiteDocument","title":"onlook-dev/onlook: The open source, local-first Figma for React. Design directly in your live React app and publish your changes to code.","url":"https://github.com/onlook-dev/onlook","tags":["React","figma","editor","software"],"content":"FigmaライクなUIでReactアプリケーションを編集できるエディタアプリ","relatedLinks":[]},{"category":"WebsiteDocument","title":"The 2024 Web Almanac","url":"https://almanac.httparchive.org/en/2024/","tags":["document","HTTP"],"content":"Web Almanacの2024年版が公開された。\nHTTP Archiveのデータを元にしたウェブのステータスをまとめたレポート。","relatedLinks":[]}]},{"meta":{"title":"2024-12-19のJS: Safari 18.2、State of Node.js Performance 2024、Astro Server Islands","author":"azu","layout":"post","date":"2024-12-19T01:35:31.013Z","category":"JSer","tags":["React","nodejs","sourcemap","ecma","spec"],"url":"https://jser.info/2024/12/19/safari-18.2-state-of-node.js-performance-2024-astro-server-islands/"},"items":[{"category":"Headline","title":"Node.js — Node v23.4.0 (Current)","url":"https://nodejs.org/en/blog/release/v23.4.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v23.4.0リリース。\n`assert.partialDeepStrictEqual`の追加、`--trace-env`フラグの追加、`net.connect`に`blockList`オプションの追加","relatedLinks":[]},{"category":"Headline","title":"Source map format specification","url":"https://tc39.es/ecma426/","tags":["sourcemap","ecma","spec"],"content":"Source Mapの仕様がECMA426として公開された","relatedLinks":[]},{"category":"Headline","title":"WebKit Features in Safari 18.2 | WebKit","url":"https://webkit.org/blog/16301/webkit-features-in-safari-18-2/","tags":["safari","ReleaseNote"],"content":"Safari 18.2の変更点について。\nCSSの`text-box`(Leading Trim)/`@view-transition`/`background-clip`/`scrollbar-width`のサポート。またルビ対応が改善されている。\nHTMLの`input type=week`のサポート、`blocking=render`属性と`<link rel=expect>`のサポート。\nWasm GC/Wasm Tail Callsのサポート、PointerEventの対応の改善。\nJavaScriptでは、`Float16Array`/`Promise.try`/`RegExp.escape`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v9.2.0 · reduxjs/react-redux","url":"https://github.com/reduxjs/react-redux/releases/tag/v9.2.0","tags":["redux","React","library","ReleaseNote"],"content":"React-Redux v9.2.0リリース。\nReact 19の対応など","relatedLinks":[{"title":"Release v2.5.0 · reduxjs/redux-toolkit","url":"https://github.com/reduxjs/redux-toolkit/releases/tag/v2.5.0"}]},{"category":"Headline","title":"Release v11.0.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v11.0.0","tags":["npm","ReleaseNote"],"content":"npm v11.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Bun v1.1.40 | Bun Blog","url":"https://bun.sh/blog/bun-v1.1.40","tags":["Bun","ReleaseNote"],"content":"Bun v1.1.40リリース。\nテキストベースのロックファイルを扱う` install.saveTextLockfile`の設定を追加など","relatedLinks":[]},{"category":"Headline","title":"Release v7.1.0 · nodejs/undici","url":"https://github.com/nodejs/undici/releases/tag/v7.1.0","tags":["nodejs","HTTP","Fetch","library"],"content":"undici v7.1.0リリース。\nhttp/2サポートがStableとなった","relatedLinks":[]},{"category":"Article","title":"State of Node.js Performance 2024","url":"https://nodesource.com/blog/State-of-Nodejs-Performance-2024","tags":["nodejs","performance","article"],"content":"Node.js 20と22のコアモジュールごとのパフォーマンスの比較。\nどれぐらいパフォーマンスが改善されているかについて","relatedLinks":[]},{"category":"Article","title":"Next.js PPR と比較して理解する Astro Server Islands","url":"https://zenn.dev/morinokami/articles/astro-server-islands-vs-nextjs-ppr","tags":["astro","article"],"content":"astroのServer IslandsとNext.jsのPPR(Partial Prerendering)について","relatedLinks":[]},{"category":"SlideVideo","title":"Recoilを剥がしている話 - Speaker Deck","url":"https://speakerdeck.com/kirik/recoilwobo-gasiteiruhua","tags":["React","slide"],"content":"Recoilがメンテナンスされていないため、RecoilからReact Contextなどへの移行していく話","relatedLinks":[]},{"category":"WebsiteDocument","title":"lingui/js-lingui: 🌍 📖 A readable, automated, and optimized (3 kb) internationalization for JavaScript","url":"https://github.com/lingui/js-lingui?tab=readme-ov-file","tags":["JavaScript","React","i18n","library"],"content":"ICU MessageFormatを使ったi18nライブラリとツール。\nコードをスキャンしてメッセージを抽出するextract、実際に利用しているメッセージだけを含める仕組み、ロケールに基づいて動的にメッセージカタログを読み込む仕組みなどを持つ。\n翻訳を行うJavaScriptの関数やReactのコンポーネントなどを提供している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nissy-dev/tenbin: Tenbin provides tools to minimize the differences in test execution times across shards.","url":"https://github.com/nissy-dev/tenbin","tags":["test","library"],"content":"過去のテストの実行時間を利用してテストのsharding を行うツール。\nJest/Vitest/Playwrightをサポートしている","relatedLinks":[{"title":"テストの sharding を効率化する Tenbin というツールを作った","url":"https://zenn.dev/cybozu_frontend/articles/create-tenbin"}]},{"category":"SoftwareLibrary","title":"mui/base-ui: Base UI is an open-source library of accessible, unstyled UI components for React.","url":"https://github.com/mui/base-ui","tags":["React","library","UI","accessibility"],"content":"MUIのHeadless UIコンポーネントライブラリ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Termo - An Easy to use terminal for your browser","url":"https://termo.rajnandan.com/","tags":["JavaScript","GUI","library"],"content":"ターミナルライクなUIを作るライブラリ","relatedLinks":[]}]},{"meta":{"title":"2024-12-28のJS: pnpm 10.0 RC.1、State of JavaScript 2024、Design Token-Based UI Architecture","author":"azu","layout":"post","date":"2024-12-28T07:53:27.289Z","category":"JSer","tags":["React","Remix","Design","UI","architecture"],"url":"https://jser.info/2024/12/28/pnpm-10.0-rc.1-state-of-javascript-2024-design-token-based-ui-architecture/"},"items":[{"category":"Headline","title":"react-router/CHANGELOG.md at main · remix-run/react-router","url":"https://github.com/remix-run/react-router/blob/main/CHANGELOG.md#v710","tags":["React","Remix","library","ReleaseNote"],"content":"React Router 7.1.0リリース。\nVite 6をサポート","relatedLinks":[]},{"category":"Headline","title":"Release v2.3.0 · vercel/swr","url":"https://github.com/vercel/swr/releases/tag/v2.3.0","tags":["React","library","ReleaseNote"],"content":"SWR v2.3.0リリース。\nfallbackとしてPromiseデータを指定できるように、React 19のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 8.3.0 – Pipes of Steel · google/zx","url":"https://github.com/google/zx/releases/tag/8.3.0","tags":["nodejs","ShellScript","library","ReleaseNote"],"content":"zx 8.3.0リリース。\nAsync Iteratorの対応、`pipe()`の改善、`--env`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Nuxt 3.15 · Nuxt Blog","url":"https://nuxt.com/blog/v3-15","tags":["Nuxt","ReleaseNote"],"content":"Nuxt v3.15リリース。\nVite 6のサポート、`callOnce()`の追加、`definePageMeta`の改善など","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 10.0 RC 1 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.0.0-rc.1","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.0.0-rc.1リリース。\nインストールするパッケージのlifecycle scriptをデフォルトで実行しないように変更。\n `pnpm link`の挙動の変更、`packageManager`を参照してpnpmのバージョンを確認するように、ハッシュアルゴリズムをSHA256に変更、storeバージョンの更新。\n `verifyDepsBeforeRun`オプションが追加され、lockと`node_modules/`の状態を比較して自動インストールなどの挙動を選択できるようになるなど。","relatedLinks":[]},{"category":"Headline","title":"Release v1.1.8 · web-infra-dev/rspack","url":"https://github.com/web-infra-dev/rspack/releases/tag/v1.1.8","tags":["rspack","security","ReleaseNote"],"content":"rspack v1.1.8リリース。\n`@rspack/core`と`@rspack/cli` v1.1.7のパッケージがハイジャックされマルウェアを含むバージョンが公開された問題への対応としてのリリース。","relatedLinks":[]},{"category":"Article","title":"Design Token-Based UI Architecture","url":"https://martinfowler.com/articles/design-token-based-ui-architecture.html","tags":["Design","UI","architecture","article"],"content":"Design TokenとUIの開発について。\nDesign Tokenを2つ or 3つのレイヤーへの分割する理由、Tokenのスコープ、Design Tokenのメリット/デメリットについて","relatedLinks":[]},{"category":"Article","title":"State of JavaScript 2024","url":"https://2024.stateofjs.com/en-US","tags":["JavaScript","Survey"],"content":"State of JavaScript 2024のアンケート結果が公開された。\nJavaScriptの言語機能/ライブラリ/テスト/monorepoについて。\nまたJSとTSの比率、AIの利用率、学習リソースなどについて","relatedLinks":[]},{"category":"Article","title":"Service Worker がページをコントロールし始めるタイミングを skipWaiting と clients.claim から理解する - カミナシ エンジニアブログ","url":"https://kaminashi-developer.hatenablog.jp/entry/2024/12/20/080000","tags":["ServiceWorker","article"],"content":"Service Workerの`skipWaiting`と`clients.claim`の挙動について。","relatedLinks":[]},{"category":"Article","title":"React Ariaの実装読むぞ - Qiita Advent Calendar 2024 - Qiita","url":"https://qiita.com/advent-calendar/2024/react-aria","tags":["React","accessibility","article"],"content":"React Ariaのアクセシビリティ対応の実装についての連載記事","relatedLinks":[]},{"category":"Article","title":"Why I’m excited about text-box-trim as a designer - Piccalilli","url":"https://piccalil.li/blog/why-im-excited-about-text-box-trim-as-a-designer/","tags":["css ","article","fonts"],"content":"CSSのtext-box-trim/text-edge/text-boxでのタイポグラフィについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Zero Docs","url":"https://zero.rocicorp.dev/","tags":["JavaScript","React","WebSocket","library","database"],"content":"クライアントとバックエンドのデータベースの状態を同期するクエリエンジン。\nクライアントからORMでクエリを書き、その結果がバックエンドのデータベースに反映される。またクエリの結果はクライアントのローカルでもキャッシュして再利用することで、クライアントには高速に反映される。\n権限はZero Schemaというスキーマに定義することでクライアントから実行できるクエリを制御している。","relatedLinks":[]}]},{"meta":{"title":"2025-01-09のJS: pnpm 10、Node v23.6.0(` --experimental-strip-types`をデフォルトで有効化)、e18e","author":"azu","layout":"post","date":"2025-01-09T11:30:40.138Z","category":"JSer","tags":["nodejs","React","Tools","performance","pnpm"],"url":"https://jser.info/2025/01/09/pnpm-10-node-v23.6.0-experimental-strip-types-e18e/"},"items":[{"category":"Headline","title":"Release v12.3.0 · vueuse/vueuse","url":"https://github.com/vueuse/vueuse/releases/tag/v12.3.0","tags":["Vue","library","ReleaseNote"],"content":"vueuse v12.3.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release @pandacss/dev@0.50.0 · chakra-ui/panda","url":"https://github.com/chakra-ui/panda/releases/tag/%40pandacss%2Fdev%400.50.0","tags":["pandacs","library","ReleaseNote"],"content":"Panda CSS 0.50.0リリース。\n`panda analyze`でDesign Tokenやハードコードされている値の割合を表示できるように","relatedLinks":[]},{"category":"Headline","title":"Release 0.10.0 | StyleX","url":"https://stylexjs.com/blog/v0.10.0","tags":["React","css ","PostCSS","library","ReleaseNote"],"content":"StyleX v0.10.0リリース。\nPostCSSプラグインを刷新し、`@stylexjs/nextjs-plugin`を非推奨に変更。\n`debug`オプションの追加、`inherit: false`の`@property`を使って動的なCSS Custom Propertyを管理することでパフォーマンスの改善など","relatedLinks":[]},{"category":"Headline","title":"Release v3.11.0 · lerna-lite/lerna-lite","url":"https://github.com/lerna-lite/lerna-lite/releases/tag/v3.11.0","tags":["npm","monorepo","Tools","ReleaseNote"],"content":"lerna-lite v3.11.0リリース。\npnpmの`catalog:` protocolの限定的なサポートを追加","relatedLinks":[]},{"category":"Headline","title":"facebookexperimental/Recoil: Recoil is an experimental state management library for React apps. It provides several capabilities that are difficult to achieve with React alone, while being compatible with the newest features of React.","url":"https://github.com/facebookexperimental/Recoil","tags":["React","library","news"],"content":"Recoilのリポジトリがアーカイブ化された","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 10 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.0.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.0.0リリース。\nインストールするパッケージのlifecycle scriptをデフォルトで実行しないように変更。\n `pnpm link`の挙動の変更、`packageManager`を参照してpnpmのバージョンを確認するように、ハッシュアルゴリズムをSHA256に変更、storeバージョンの更新。\npnpmに関する設定を共有できる`configDependencies`を追加。 `verifyDepsBeforeRun`オプションが追加され、lockと`node_modules/`の状態を比較して自動インストールなどの挙動を選択できるようになるなど。","relatedLinks":[]},{"category":"Headline","title":"Firefox 134.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/134.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 134リリース。\nStage 3の`RegExp.escape()`、Stage 4の`Promise.try()`をサポートなど","relatedLinks":[{"title":"Firefox 134 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/134"}]},{"category":"Headline","title":"Release v26.0 Reactime · open-source-labs/Reactime","url":"https://github.com/open-source-labs/Reactime/releases/tag/v26.0","tags":["React","performance","Tools","ReleaseNote"],"content":"Reactのデバッグ拡張ツールであるReactime 26.0リリース。\nUIの刷新、useContextの状態の視覚化、タイムトラベルデバッグ機能の改善など","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v22.13.0 (LTS)","url":"https://nodejs.org/en/blog/release/v22.13.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.13.0リリース。\nPermission ModelをStableに変更、","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v23.6.0 (Current)","url":"https://nodejs.org/en/blog/release/v23.6.0","tags":["nodejs","TypeScript","ReleaseNote"],"content":"Node.js v23.6.0リリース。\n`--experimental-strip-types`をデフォルトで有効にして、TypeScriptファイルをフラグなしで実行できるように変更。","relatedLinks":[]},{"category":"Article","title":"Composable Caching with Next.js | Next.js","url":"https://nextjs.org/blog/composable-caching","tags":["Next.js","article"],"content":"Next.jsの\"use cache\" directiveについて。\n\"use cache\"をつけた関数はserver functionに変換されメモ化された結果を返すようになる。\nクロージャーの場合のキャッシュの動作や`cache()`関数について","relatedLinks":[]},{"category":"Article","title":"The journey so far | e18e","url":"https://e18e.dev/blog/journey-so-far.html","tags":["performance","nodejs","JavaScript","article"],"content":"e18eでのJavaScriptのエコシステムのクリーンアップの取り組みについて。","relatedLinks":[]},{"category":"Article","title":"1人 Intl Advent Calendar 2024 - Adventar","url":"https://adventar.org/calendars/10555","tags":["JavaScript","i18n","article"],"content":"Intl APIについての連載記事","relatedLinks":[{"title":"1人Intl Advent Calendar を完走しました","url":"https://zenn.dev/cybozu_frontend/articles/intl-advent-calendar-24-recap"}]},{"category":"WebsiteDocument","title":"CodSpeed: Optimize Performance, Eliminate Regressions","url":"https://codspeed.io/","tags":["webservice","benchmark","python","Rust","nodejs"],"content":"CIでベンチマークを取得してリグレッションを検知するサービス。\nPython/Rust/Node.jsに対応している","relatedLinks":[]}]},{"meta":{"title":"2025-01-16のJS: WinterTC (TC55)、Node.jsのTypeScriptサポートの背景、Angular 2025","author":"azu","layout":"post","date":"2025-01-16T13:42:36.358Z","category":"JSer","tags":["TypeScript","nodejs","React","pnpm","security"],"url":"https://jser.info/2025/01/16/wintertc-tc55-node.jstypescript-angular-2025/"},"items":[{"category":"Headline","title":"ESLint v9.18.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2025/01/eslint-v9.18.0-released/","tags":["ESLint","TypeScript"],"content":"ESLint v9.18.0リリース。\nTypeScriptで設定ファイルを書ける`eslint.config.ts`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Collaborating across W3C and Ecma for web-interoperable server runtimes through WinterTC - Ecma International","url":"https://ecma-international.org/news/collaborating-across-w3c-and-ecma-for-web-interoperable-server-runtimes-through-wintertc/","tags":["ecma","news","nodejs","deno","cloudflare"],"content":"サーバサイドJavaScript APIの相互運用性について議論していたWinterCGはEcmaのTC55として標準化などの議論を進めていく方針","relatedLinks":[{"title":"WinterTC","url":"https://wintercg.org/"}]},{"category":"Headline","title":"Release 3.40.0 - 2025.01.08 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.40.0","tags":["JavaScript","polyfill","ReleaseNote"],"content":"core-js v3.40.0リリース。\nStage 3の`Error.isError`を追加、バグの修正など","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · Automattic/node-canvas","url":"https://github.com/Automattic/node-canvas/releases/tag/v3.0.0","tags":["nodejs","canvas","library","ReleaseNote"],"content":"node-canvas 3.0.0リリース。\nNode.js 16のサポート終了、N-APIを利用するように変更など","relatedLinks":[]},{"category":"Headline","title":"Release Version 26.0.0 · jsdom/jsdom","url":"https://github.com/jsdom/jsdom/releases/tag/26.0.0","tags":["JavaScript","DOM","ReleaseNote"],"content":"jsdom 26.0.0リリース。\nnode-canvasをv3にアップデート、`AbortSignal.any()`のサポート、`URL.parse()`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v136 · esm-dev/esm.sh","url":"https://github.com/esm-dev/esm.sh/releases/tag/v136","tags":["JavaScript","cdn","ReleaseNote"],"content":"esm.sh v136リリース。\njsrのサポート、pkg.pr.newのサポート。\nビルドパフォーマンスの改善、`build` API/Deno CLIスクリプトの非推奨化など","relatedLinks":[]},{"category":"Headline","title":"2024 JavaScript Rising Stars","url":"https://risingstars.js.org/2024/en","tags":["JavaScript","library","news"],"content":"GitHubのスター数の比較をするJavaScript Rising Starsの2024年の結果が公開された","relatedLinks":[]},{"category":"Headline","title":"January 15, 2025 Release – React Spectrum Releases","url":"https://react-spectrum.adobe.com/releases/2025-01-15.html","tags":["React","library","ReleaseNote"],"content":"React Aria January 15, 2025リリース。\nAutocompleteコンポーネントの追加、OverlayコンポーネントでのCSS Transitionsのサポート、`@react-aria/test-utils`パッケージの追加。\n`usePress`からiOS 13のバグ対応のコードを削除など","relatedLinks":[]},{"category":"Article","title":"pnpm 10.0.0 Blocks Lifecycle Scripts by Default - Socket","url":"https://socket.dev/blog/pnpm-10-0-0-blocks-lifecycle-scripts-by-default","tags":["pnpm","security","article"],"content":"pnpm 10ではインストールしたパッケージのlifecycle scriptの実行をデフォルトで無効にしている。","relatedLinks":[]},{"category":"Article","title":"Introducing TanStack Start – Frontend Masters Boost","url":"https://frontendmasters.com/blog/introducing-tanstack-start/","tags":["React","article"],"content":"TanStack Router を利用したフルスタック React フレームワークであるTanStack Startについて","relatedLinks":[]},{"category":"Article","title":"Node.js Type Stripping Explained","url":"https://satanacchio.hashnode.dev/everything-you-need-to-know-about-nodejs-type-stripping","tags":["nodejs","TypeScript","article"],"content":"Node.jsのTypeScriptサポートに対するアプローチについて。\nまた、今後のTypeScriptチームとの取り組みやロードマップについて","relatedLinks":[]},{"category":"Article","title":"Angular 2025 Strategy. For the past two and a half years… | by Minko Gechev | Jan, 2025 | Angular Blog","url":"https://blog.angular.dev/angular-2025-strategy-9ca333dfc334","tags":["Angular","article"],"content":"Angularの2024年のアンケート結果の分析、2025年に取り組む点について。\n開発者体験に対するものとしてzoneless、Signal forms、Karmaを置き換えることについてなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"standard-schema/standard-schema: A standard interface for TypeScript schema validation libraries","url":"https://github.com/standard-schema/standard-schema","tags":["TypeScript","proposal"],"content":"zodなどのスキーマバリデーションライブラリの標準インターフェースを議論しているリポジトリ。\n標準的なインターフェースを決めることで、UIライブラリなどが特定のスキーマバリデーションライブラリへ依存しないようにしたいという目的","relatedLinks":[]}]},{"meta":{"title":"2025-01-23のJS: Vitest 3.0、Rspack 1.2(永続キャッシュ)、react-server","author":"azu","layout":"post","date":"2025-01-23T01:14:18.320Z","category":"JSer","tags":["React","vite","test","Native","nodejs"],"url":"https://jser.info/2025/01/23/vitest-3.0-rspack-1.2-react-server/"},"items":[{"category":"Headline","title":"Announcing Nuxt Content version 3","url":"https://content.nuxt.com/blog/v3","tags":["Nuxt","ReleaseNote"],"content":"Nuxt Content v3リリース。\nファイルベースの代わりにPostgreSQL/Cloudflare D1/LibSQLなどのデータベースを利用できるように。\nブラウザでは、Wasm SQLiteをIn-Memory DBとして利用している。\n`content.config.ts`にコレクションを定義できるように、`queryCollection` APIでコレクションを取得できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v8.5.0 · storybookjs/storybook","url":"https://github.com/storybookjs/storybook/releases/tag/v8.5.0","tags":["storybook","ReleaseNote"],"content":"Storybook v8.5.0リリース。\n`@storybook/addon-a11y`の改善、`@storybook/experimental-addon-test`の改善、React 19のサポート。\nReact Native Webをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Chrome 132  |  Release notes  |  Chrome for Developers","url":"https://developer.chrome.com/release-notes/132","tags":["Chrome","ReleaseNote"],"content":"Chrome 132リリース。\n`<dialog>`の`toggle`イベントをサポート、CSSの`writing-mode`が`sideways-{rl,lr}`(横書きモード)をサポート。\n`Request.bytes()`/`Response.bytes()`をサポート、すべての画面をキャプチャする`getAllScreensMedia()`のサポート、Element captureのサポート。\nOrigin TrialとしてExplicit compile hints with magic comments、`Document-Isolation-Policy`のサポートなど","relatedLinks":[{"title":"New in Chrome 132  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/new-in-chrome-132?hl=en"}]},{"category":"Headline","title":"Vitest 3.0 is out! | Vitest","url":"https://vitest.dev/blog/vitest-3","tags":["vite","test","library","ReleaseNote"],"content":"Vitest 3.0リリース。\nVite 6をサポート、`spy.mockReset`の変更、CLIのrepoterの書き直し、ワークスペースの設定を`vitest.config`ファイルに書けるように、`vitest/node`を公開。\n`describe.for` APIの追加、`toBeOneOf`/`toSatisfy`/`toHaveBeenCalledAfter`/`toHaveBeenCalledOnceWith`の追加など","relatedLinks":[{"title":"Release v3.0.0 · vitest-dev/vitest","url":"https://github.com/vitest-dev/vitest/releases/tag/v3.0.0"}]},{"category":"Headline","title":"Changelog: Cypress App | Cypress Documentation","url":"https://docs.cypress.io/app/references/changelog#14-0-0","tags":["JavaScript","browser","test","ReleaseNote"],"content":"Cypress 14.0.0リリース。\nNode.js 16のサポート終了、`document.domain`をデフォルトで設定しないように変更、サブドメイン間を移動する時は`cy.origin`を利用するように変更など","relatedLinks":[]},{"category":"Headline","title":"Electron 34.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-34-0","tags":["Electron","ReleaseNote"],"content":"Electron 34.0.0リリース。\nChromium 132/V8 13.2/Node 20.18.1へアップデート。`WebFrameMain.collectJavaScriptCallStack()` APIの追加、Brotli/ZStandardの共有辞書を管理するためのAPIを追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing Rspack 1.2 - Rspack","url":"https://rspack.dev/blog/announcing-1-2","tags":["rspack","ReleaseNote"],"content":"Rspack 1.2リリース。\n実験的な機能として永続キャッシュのサポート、Code Splittingのマルチスレッドサポート、Yarn PnPのサポート。\nデフォルトで`node_modules`の変更を監視しないように変更、SWC minimizerの`passes`のデフォルト値を`2`に変更など","relatedLinks":[]},{"category":"Headline","title":"React Native 0.77 - New Styling Features, Android’s 16KB page support, Swift Template · React Native","url":"https://reactnative.dev/blog/2025/01/21/version-0.77","tags":["React","Native","ReleaseNote"],"content":"React Native 0.77リリース。\n`display: contents`のサポート、`mixBlendMode`のサポート、outline propsのサポート。\nAndroidの16 KB page sizeのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node.js — Tuesday, January 21, 2025 Security Releases","url":"https://nodejs.org/en/blog/vulnerability/january-2025-security-releases","tags":["nodejs","ReleaseNote","security"],"content":"Node.jsのセキュリティアップデートとして、それぞれのバージョンのアップデートが公開された。\n\n- Node.js v18.20.6\n- Node.js v20.18.2\n- Node.js v22.13.1\n- Node.js v23.6.1\n\nすでにメンテナンスが終了(EOL)したNode.js 16.xにも影響する脆弱性であるため、EOLとなったバージョンにもCVEは発行されている。","relatedLinks":[]},{"category":"Article","title":"A checklist for your \\`tsconfig.json\\`","url":"https://2ality.com/2025/01/tsconfig-json.html","tags":["TypeScript","article"],"content":"`tsconfig.json`の設定や動作について。\nそれぞれのオプションの意味や典型的な設定についての解説","relatedLinks":[]},{"category":"Article","title":"Five years of React Native at Shopify (2025) - Shopify","url":"https://shopify.engineering/five-years-of-react-native-at-shopify","tags":["React","Native","article"],"content":"ShopifyでのReact Nativeの利用について。","relatedLinks":[]},{"category":"WebsiteDocument","title":"ircam-ismm/node-web-audio-api: Web Audio API implementation for Node.js","url":"https://github.com/ircam-ismm/node-web-audio-api?tab=readme-ov-file","tags":["nodejs","Rust","audio","library"],"content":"Web Audio APIのRust実装を使ったNode.js向けのバインディング。\nWeb Audio API互換のAPIでAudioを扱える","relatedLinks":[{"title":"orottier/web-audio-api-rs: A Rust implementation of the Web Audio API, for use in non-browser contexts","url":"https://github.com/orottier/web-audio-api-rs/?tab=readme-ov-file"}]},{"category":"SoftwareLibrary","title":"desko27/react-call: ⚛️ 📡 Call your React components","url":"https://github.com/desko27/react-call","tags":["React","library"],"content":"Reactで`window.confirm`のように手続き的なモーダル表示などを管理できるライブラリ","relatedLinks":[{"title":"React で Modal や Confirm の実装を簡単にする react-call というライブラリがアツい！！！","url":"https://zenn.dev/ykicchan/articles/5415871c017b22"}]},{"category":"SoftwareLibrary","title":"@lazarv/react-server","url":"https://react-server.dev/","tags":["React","vite","server","library"],"content":"ViteベースのReact Server ComponentやServer Actionに対応したReactフレームワーク。\nファイルシステムベースのルーティング、Static generation、React Server Componentなどに対応している","relatedLinks":[{"title":"lazarv/react-server: The easiest way to build React apps with server-side rendering","url":"https://github.com/lazarv/react-server"}]}]},{"meta":{"title":"2025-02-01のJS: Bun 1.2、Tailwind CSS v4.0、TypeScript 5.8 Beta","author":"azu","layout":"post","date":"2025-02-01T05:55:22.854Z","category":"JSer","tags":["Bun","ESLint","pnpm","TypeScript","npm"],"url":"https://jser.info/2025/02/01/bun-1.2-tailwind-css-v4.0-typescript-5.8-beta/"},"items":[{"category":"Headline","title":"Bun 1.2 | Bun Blog","url":"https://bun.sh/blog/bun-v1.2","tags":["Bun","ReleaseNote"],"content":"Bun v1.2リリース。\nNode.jsとの互換性の向上、`node:http2`/`node:dgram`/`node:cluster`のサポート。\n`Bun.s3`のS3 APIの追加、`Bun.sql`のPostgresのサポート、テキストベースの`bun.lock`ファイルのサポート。\n`package.json`にコメントを書けるように、`.npmrc`ファイルのサポート。\n`bun run --filter`、`bun publish`コマンドのサポート、`bun patch`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.50.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.50.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.50.0リリース。\n`test.step`に`timeout`オプションの追加、`test.step.skip()`の追加、`toMatchAriaSnapshot()`の結果をYAMLファイルとして保存できるように。\n`toHaveAccessibleErrorMessage()`の追加、`testConfig.webServer`に`gracefulShutdown`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Tailwind CSS v4.0 - Tailwind CSS","url":"https://tailwindcss.com/blog/tailwindcss-v4","tags":["css ","library","ReleaseNote"],"content":"Tailwind CSS v4リリース。\nLightning CSSを使った新しいエンジンに変更、PostCSSの外部プラグインに非依存な形へ変更、Viteプラグインの追加。\n`@source`ディレクティブの追加、CSS-first configurationのサポート。\n`@container`/`starting` variant/`not-*` variantsの追加など","relatedLinks":[]},{"category":"Headline","title":"ESLint v9.19.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2025/01/eslint-v9.19.0-released/","tags":["ESLint","ReleaseNote"],"content":"ESLint v9.19.0リリース。\n`linterOptions.reportUnusedInlineConfigs`オプションの追加","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 10.1 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.1.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.1.0リリース。\n無視されたビルドスクリプトの依存を表示する`pnpm ignored-builds`コマンド/承認する`pnpm approve-builds`コマンドの追加。\nビルドスクリプトを無視する依存を定義する`pnpm.ignoredBuiltDependencies`オプションを追加。\nreinstallの最適化を有効にする`optimistic-repeat-install`の設定を追加など","relatedLinks":[]},{"category":"Headline","title":"Bun v1.2.1 | Bun Blog","url":"https://bun.sh/blog/bun-v1.2.1","tags":["Bun","ReleaseNote"],"content":"Bun v1.2.1リリース。\nS3の`storageClass`をサポート、`crypto.generateKeyPair`でX25519をサポート、`toMatchInlineSnapshot()`をサポート。\nBufferをデフォルトでzero fillする`--zero-fill-buffers`をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.8 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-8-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.8 Betaリリース。\nconditional return typeの改善、`require(esm)`の対応、`--module node18`を追加。\nNode.jsの`--experimental-strip-types`と合わせた設定をする`--erasableSyntaxOnly`フラグの追加、`--libReplacement`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v11.1.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v11.1.0","tags":["npm","ReleaseNote"],"content":"npm v11.1.0リリース。\n非推奨を解除する`npm unprecate`コマンドの追加など","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v23.7.0 (Current)","url":"https://nodejs.org/en/blog/release/v23.7.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v23.7.0リリース。\n`fs.glob`が`exclude`オプションをサポート。\nTextContextに`waitFor()`を追加、`assert.fileSnapshot()`でスナップショットテストをサポート、`assert.register()`で独自のassertionをサポート。","relatedLinks":[]},{"category":"Headline","title":"Release v0.31.0 · nodejs/corepack","url":"https://github.com/nodejs/corepack/releases/tag/v0.31.0","tags":["nodejs","npm","pnpm","ReleaseNote"],"content":"corepack v0.31.0リリース。\nnpm registryにsignaturesが複数ある場合に失敗する問題を修正(`corepack use pnpm`でインストールできない問題の修正)","relatedLinks":[{"title":"`","url":"https://github.com/nodejs/corepack/issues/612"}]},{"category":"Article","title":"eslint-plugin-no-barrel-filesを導入してBarrel filesをやめた話 | PR TIMES 開発者ブログ","url":"https://developers.prtimes.jp/2025/01/28/avoid-barrel-files-in-prtimes/","tags":["ESLint","article"],"content":"複数のモジュールを1つのindexファイルからまとめてexportするBarrel filesをESLintでチェックして廃止する方法について","relatedLinks":[]},{"category":"Article","title":"Accessibility essentials every front-end developer should know by Martijn Hols","url":"https://martijnhols.nl/blog/accessibility-essentials-every-front-end-developer-should-know","tags":["accessibility","article"],"content":"ウェブアクセシビリティの基本的な部分についての解説","relatedLinks":[]},{"category":"SoftwareLibrary","title":"irsyadadl/justd: Justd is a chill set of React components, built on top of React Aria Components and Tailwind CSS. Easy to customize and just copy &amp; paste into your React projects.","url":"https://github.com/irsyadadl/justd","tags":["React","UI","library"],"content":"React Aria + Tailwindでコピーペースト可能なコンポーネントを生成するツールキット","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Standard Schema","url":"https://standardschema.dev/","tags":["TypeScript","spec","library"],"content":"TypeScriptのスキーマバリデーションライブラリの共通インターフェースの定義。バリデーションライブラリを利用するライブラリが、外から共通インターフェースの実装を受け取ることで特定のライブラリへの依存をしないための仕組み。\nzod/Valibot/Arktypeなどが対応していて、各種ライブラリの対応状況などがまとめられている。","relatedLinks":[]},{"category":"Book","title":"いきなりプログラミング JavaScript | 高岡 佑輔 |本 | 通販 | Amazon","url":"https://www.amazon.co.jp/dp/479818439X/","tags":["JavaScript","book"],"content":"JavaScriptの入門書","relatedLinks":[]}]},{"meta":{"title":"2025-02-14のJS: Node.js v22.14.0, Prettier v3.5.0, Chrome 133","author":"azu","layout":"post","date":"2025-02-14T01:15:25.998Z","category":"JSer","tags":["nodejs","Tools","graphic","chart","Azure"],"url":"https://jser.info/2025/02/14/node.js-v22.14.0-prettier-v3.5.0-chrome-133/"},"items":[{"category":"Headline","title":"Release v3.0.0 · plotly/plotly.js","url":"https://github.com/plotly/plotly.js/releases/tag/v3.0.0","tags":["JavaScript","graphic","chart","library","Azure"],"content":"plotly.js 3.0.0リリース。\n非推奨なAPIやオプションを削除、IEサポートのためのコードを削除、AMDサポートの削除など","relatedLinks":[]},{"category":"Headline","title":"Dependabot now supports pnpm workspace catalogs (GA) - GitHub Changelog","url":"https://github.blog/changelog/2025-02-04-dependabot-now-supports-pnpm-workspace-catalogs-ga/","tags":["github","pnpm","news"],"content":"Dependabotがpnpm catalogをサポート","relatedLinks":[]},{"category":"Headline","title":"Prettier 3.5: New objectWrap option, experimentalOperatorPosition option and TS config file support! · Prettier","url":"https://prettier.io/blog/2025/02/09/3.5.0.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 3.5リリース。\n`--experimental-operator-position`フラグの追加、`objectWrap`オプションの追加、設定ファイルのTypeScript形式をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Chrome 133  |  Release notes  |  Chrome for Developers","url":"https://developer.chrome.com/release-notes/133","tags":["Chrome","ReleaseNote"],"content":"Chrome 133リリース。\n`popover=hint`のサポート。\nCSSの`attr()`での`type()`のサポート、`@container scroll-state`のサポート、`text-box`/`text-box-trim`/`text-box-edge`のサポート。\nDOMの移動を行う`Node.prototype.moveBefore`のサポート、WebAssembly Memory64のサポートなど","relatedLinks":[{"title":"New in Chrome 133  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/new-in-chrome-133?hl=en"}]},{"category":"Headline","title":"Firefox 135.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/135.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 135リリース。\nStage 3のJSON.parse with sourceをサポート、`PublicKeyCredential.getClientCapabilities()`のサポート。\n実験的な機能としてTemporal API、Task Scheduling APIのサポートなど","relatedLinks":[{"title":"Firefox 135 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/135"}]},{"category":"Headline","title":"Release v0.25.0 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.25.0","tags":["esbuild","ReleaseNote"],"content":"esbuild v0.25.0リリース。\n開発サーバのCORSの問題を修正、CSS nestingのバグ修正、Source Mapのバグ修正など","relatedLinks":[]},{"category":"Headline","title":"Release v4.7.0 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v4.7.0","tags":["Hono","ReleaseNote"],"content":"Hono v4.7.0リリース。\n`hono/proxy`モジュールの追加、`hono/language`モジュールの追加、`hono/jwk`モジュールの追加。\nStandard Schema validatorのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.1.0 - Gear 5 · solidjs/solid-start","url":"https://github.com/solidjs/solid-start/releases/tag/%40solidjs%2Fstart%401.1.0","tags":["Solid","ReleaseNote"],"content":"Splid v1.1.0リリース。\nVite 6のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v20.18.3 (LTS)","url":"https://nodejs.org/en/blog/release/v20.18.3","tags":["nodejs","ReleaseNote"],"content":"Node.js v20.18.3リリース。\nImport Attribute with JSONをstableに変更","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v22.14.0 (LTS)","url":"https://nodejs.org/en/blog/release/v22.14.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.14.0リリース。\nglobに`exclude`オプションを追加、`node --eval`フラグがTypeScriptをサポート、`util`モジュールに`findPackageJSON`を追加。\n`TestContext.prototype.waitFor()`の追加、`assert.fileSnapshot()`、`assert.register()`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v5.98.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.98.0","tags":["webpack","ReleaseNote"],"content":"webpack v5.98.0リリース。\nパフォーマンスの改善、`require.resolve(/* webpackIgnore: true */ 'x');`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v23.8.0 (Current)","url":"https://nodejs.org/en/blog/release/v23.8.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v23.8.0リリース。\n`--use-system-ca`フラグの追加、`URLPattern` APIのサポート、`node:zlib`がzstdをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v3.13.0 · apollographql/apollo-client","url":"https://github.com/apollographql/apollo-client/releases/tag/v3.13.0","tags":["GraphQL","JavaScript","library","ReleaseNote"],"content":"Apollo Client 3.13.0リリース。\n`useFragment`のSuspense版である`useSuspenseFragment`の追加、`useMutation`のコールバックのバグの修正。\n`useQuery`/`useLazyQury`の`onCompleted`/`onError`コールバックを非推奨に変更し、4.0で削除する予定","relatedLinks":[{"title":"Heads up: Deprecation of ","url":"https://github.com/apollographql/apollo-client/issues/12352"}]},{"category":"Headline","title":"Valibot v1 RC is now available | Valibot","url":"https://valibot.dev/blog/valibot-v1-rc-is-available/","tags":["JavaScript","library","ReleaseNote"],"content":"Valibot v1 RCリリース。\nStandard Schemaの対応、`@valibot/to-json-schema`でのJSONスキーマ出力、TSの`exactOptionalPropertyTypes`の対応など","relatedLinks":[]},{"category":"Article","title":"Considerations for making a tree view component accessible - The GitHub Blog","url":"https://github.blog/engineering/user-experience/considerations-for-making-a-tree-view-component-accessible/","tags":["Github","accessibility","article"],"content":"GitHubのツリービューティーコンポーネントのアクセシビリティ実装について","relatedLinks":[]},{"category":"Article","title":"TypeScript: the \\`satisfies\\` operator","url":"https://2ality.com/2025/02/satisfies-operator.html","tags":["TypeScript","article"],"content":"TypeScriptの`satisfies` operatorについて","relatedLinks":[]},{"category":"SlideVideo","title":"Angular: The Documentary | An origin story - YouTube","url":"https://www.youtube.com/watch?v=cRC9DlH45lA","tags":["Angular","video","history"],"content":"Angularのドキュメンタリー動画。\nHTMLの拡張から始まったAngularJS、AtScriptとTypeScript、1から2への移行、Angular Dart、Ivyの導入。\nRxJSとSignals、Googleの社内フレームワークのWizとAngularについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"antfu/node-modules-inspector: Interactive UI for local node modules inspection","url":"https://github.com/antfu/node-modules-inspector?tab=readme-ov-file","tags":["nodejs","npm","Tools"],"content":"node_modulesの依存関係、ESM/CJS/DUALパッケージの可視化ツール","relatedLinks":[]}]},{"meta":{"title":"2025-02-24のJS: Create React Appが非推奨に、Deno 2.2、Bun 1.2.3、ESLintのCSSサポート","author":"azu","layout":"post","date":"2025-02-24T13:09:04.703Z","category":"JSer","tags":["vite","browser","WebPlatformAPI","TypeScript","pnpm"],"url":"https://jser.info/2025/02/24/create-react-app-deno-2.2-bun-1.2.3-eslintcss/"},"items":[{"category":"Headline","title":"Announcing TypeScript 5.8 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-8-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.8 RCリリース。\nconditional return typeの改善、`require(esm)`の対応、`--module node18`を追加。 Node.jsの`--experimental-strip-types`と合わせた設定をする`--erasableSyntaxOnly`フラグの追加、`--libReplacement`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 10.4 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.4.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.4.0リリース。\n`pnpm approve-builds --global`の追加、`pnpm --allow-build=<pkg> add`の追加、`pnpm approve-builds`のバグ修正など","relatedLinks":[]},{"category":"Headline","title":"Sunsetting Create React App – React","url":"https://react.dev/blog/2025/02/14/sunsetting-create-react-app","tags":["React","news"],"content":"`create-react-app`は非推奨として、Reactを使ったフレームワークへの移行を推奨するドキュメントが公開された。","relatedLinks":[]},{"category":"Headline","title":"vite/packages/vite/CHANGELOG.md at main · vitejs/vite","url":"https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md#610-2025-02-05","tags":["vite","ReleaseNote"],"content":"Vite 6.1.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.5 · vitest-dev/vitest","url":"https://github.com/vitest-dev/vitest/releases/tag/v3.0.5","tags":["vite","security","ReleaseNote"],"content":"vitest v3.0.5リリース。\nVitest UIのAPIサーバはリクエストのOriginチェックをしていなかったため、罠サイトへのアクセス時にホストマシンで任意のコード実行ができるRCEの脆弱性の修正が含まれている。","relatedLinks":[]},{"category":"Headline","title":"Release v2.20.0 · codesandbox/sandpack","url":"https://github.com/codesandbox/sandpack/releases/tag/v2.20.0","tags":["JavaScript","library","editor","ReleaseNote"],"content":"sandpack 2.20.0リリース。\nReact 19に対応","relatedLinks":[]},{"category":"Headline","title":"Deno 2.2: OpenTelemetry, Lint Plugins, node:sqlite","url":"https://deno.com/blog/v2.2","tags":["deno","ReleaseNote"],"content":"Deno v2.2リリース。\nlintのビルトインルールの追加、JavaScriptで書けるLint Plugin APIの追加、`deno task`がwildcard(`*`)指定に対応。\n`deno outdated`にinteractive modeを追加、`deno compile`の改善。\nunstableな機能としてOpenTelemetryのサポート、`WebTransport` APIのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Bun v1.2.3 | Bun Blog","url":"https://bun.sh/blog/bun-v1.2.3","tags":["Bun","ReleaseNote"],"content":"Bun v1.2.3リリース。\n`bun ./index.html`で開発サーバが立ち上がるように、`Bun.serve`の`static`オプションを`routes`オプションに変更。\n`bun init`でReactプロジェクトを作成できるように、`bun install --analyze`で不足してる依存を`pacakge.json`に追加。\nWasmのinterpreterとしてLLIntではなくIPINTを使うのをデフォルトにして、`BUN_JSC_useWasmIPInt=0`で元に戻せるように","relatedLinks":[]},{"category":"Headline","title":"Release v2.6.0 · reduxjs/redux-toolkit","url":"https://github.com/reduxjs/redux-toolkit/releases/tag/v2.6.0","tags":["redux","ReleaseNote"],"content":"Redux Toolkit v2.6.0リリース。\nInfinite Queryのサポートなど","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2025-02 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2025/02/24/ecmascript-proposal-update","tags":["ECMAScript","news"],"content":"2025年2月のTC39 MeetingでのECMAScript Proposalのステータス変更まとめ。\n`RegExp.escape`とFloat16がStage 4となり、ECMAScript 2025に入ることが決まった","relatedLinks":[]},{"category":"Article","title":"ESLint now officially supports linting of CSS - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2025/02/eslint-css-support/","tags":["ESLint","css","article"],"content":"ESLintがCSSのLintを正式にサポート。\n`@eslint/css`プラグインでCSSのLintに対応、`tolerant`オプションで構文エラーのケースにも対応、`customSyntax`で独自の`@at-rule`などにも対応している","relatedLinks":[]},{"category":"Article","title":"The Popover API is now Baseline Newly available  |  Blog  |  web.dev","url":"https://web.dev/blog/popover-baseline?hl=en","tags":["browser","article"],"content":"Popover APIがBaselineとなり多くのブラウザで利用できるようになった。","relatedLinks":[]},{"category":"Article","title":"Interop 2025がスタート | フロントエンドBlog | ミツエーリンクス","url":"https://www.mitsue.co.jp/knowledge/blog/frontend/202502/17_0829.html","tags":["browser","article","WebPlatformAPI"],"content":"ブラウザの相互運用性向上の取り組みであるInterop 2025が発表された。","relatedLinks":[{"title":"Announcing Interop 2025 | WebKit","url":"https://webkit.org/blog/16458/announcing-interop-2025/"},{"title":"Interop 2025 Launch - Bocoup","url":"https://www.bocoup.com/blog/interop-2025"},{"title":"Interop 2025: another year of web platform improvements  |  Blog  |  web.dev","url":"https://web.dev/blog/interop-2025"},{"title":"Interop 2025 | Igalia","url":"https://www.igalia.com/2025/02/13/Interop-2025.html"},{"title":"Microsoft Edge and Interop 2025 - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2025/02/13/microsoft-edge-and-interop-2025/"},{"title":"Launching Interop 2025 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2025/02/interop-2025/"}]},{"category":"Article","title":"Web技術の互換性を把握するためのBaselineとWeb Platform Status Dashboard","url":"https://zenn.dev/sakito/articles/26cba8397c4dbe","tags":["WebPlatformAPI","article"],"content":"BaselineとWeb Platform Status Dashboardについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"The Typescript AI framework - Mastra","url":"https://mastra.ai/","tags":["nodejs","JavaScript","LanguageModel","API","library"],"content":"OpenAI/Anthropic/Google GeminiなどのLLM ProviderのAPIを使ったAgentやツールなどを書けるAIフレームワーク。\nGatsbyの人たちが作成している","relatedLinks":[]},{"category":"SoftwareLibrary","title":"le0pard/re2js: RE2JS is the JavaScript port of RE2, a regular expression engine that provides linear time matching","url":"https://github.com/le0pard/re2js","tags":["JavaScript","RegExp","library"],"content":"正規表現エンジンのRE2のJavaScript Port","relatedLinks":[]}]},{"meta":{"title":"2025-03-06のJS: TypeScript 5.8(erasableSyntaxOnly)、Next.js 15.2、Lynx","author":"azu","layout":"post","date":"2025-03-06T02:01:38.698Z","category":"JSer","tags":["TypeScript","React","Native","ESLint","css"],"url":"https://jser.info/2025/03/06/typescript-5.8erasablesyntaxonly-next.js-15.2-lynx/"},"items":[{"category":"Headline","title":"ArkType Docs: Optimized runtime validation for TypeScript syntax","url":"https://arktype.io/docs/blog/2.1","tags":["TypeScript","library","ReleaseNote"],"content":"ArkType 2.1リリース。\nパターンマッチを行う`match`　APIを追加、`configure`でキーワードに対するエラーメッセージをカスタマイズできるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release 0.11.0 | StyleX","url":"https://stylexjs.com/blog/v0.11.0","tags":["React","css","library","ReleaseNote"],"content":"StyleX v0.11.0リリース。\nデバッグ情報の改善、CLIキャッシュの改善など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.8 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-8/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.8リリース。\nconditional return typeの改善、`require(esm)`の対応、`--module node18`を追加。 Node.jsの`--experimental-strip-types`と合わせた設定をする`--erasableSyntaxOnly`フラグの追加、`--libReplacement`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Release 3.41.0 - 2025.03.01 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.41.0","tags":["JavaScript","polyfill","ReleaseNote"],"content":"core-js v3.41.0リリース。\nStage 4となった`RegExp.escape`/Float16、Stage 1の`Math.clamp`への対応など","relatedLinks":[]},{"category":"Headline","title":"Next.js 15.2 | Next.js","url":"https://nextjs.org/blog/next-15-2","tags":["Next.js","ReleaseNote"],"content":"Next.js 15.2リリース。\nError Overlayのスタックトレースの表示を改善、Dev indicatorの改善、`generateMetadata`の処理を非同期対応、Turbopackのパフォーマンス改善。\n実験的な機能としてView Transition APIの対応、Node.js middlewareのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Re.Pack 5: Mobile Microfrontends, 5x Faster, Less Configuration - Re.Pack","url":"https://re-pack.dev/blog/repack-5-release","tags":["React","Native","bundler","ReleaseNote"],"content":"React Native向けのビルドツールであるRe.Pack 5リリース。\nwebpackの代わりにRspackを利用するように、Module Federationの対応など","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 10.5 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.5.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.5.0リリース。\n`package.json`に分散していた`pnpm.*`の設定を`pnpm-workspace.yaml`にかけるように変更など","relatedLinks":[]},{"category":"Headline","title":"Chrome 134  |  Release notes  |  Chrome for Developers","url":"https://developer.chrome.com/release-notes/134","tags":["Chrome","ReleaseNote"],"content":"Chrome 134リリース。\n`<select>`のカスタマイズをサポート、`<dialog>`の`closedby`属性のサポート、Document-Policyに`expect-no-linked-resources`を追加。\nShared StorageでWeb Locks APIをサポート、Canvasで`imageSmoothingQuality`オプションをサポート。\n`getUserMedia`の非標準なAPIを削除など","relatedLinks":[{"title":"WICG/shared-storage: Explainer for proposed web platform Shared Storage API","url":"https://github.com/WICG/shared-storage"}]},{"category":"Headline","title":"Lynx","url":"https://lynxjs.org/","tags":["React","Native","iOS","Android"],"content":"React 17ベースのAPIとJavaScript/TypeScript/CSSを使ってネイティブアプリを開発できるツールキット。","relatedLinks":[]},{"category":"Headline","title":"Release v8.26.0 · typescript-eslint/typescript-eslint","url":"https://github.com/typescript-eslint/typescript-eslint/releases/tag/v8.26.0","tags":["TypeScript","ESLint","ReleaseNote"],"content":"typescript-eslint v8.26.0リリース。\nTypeScript 5.8のサポートなど","relatedLinks":[]},{"category":"Article","title":"What is TypeScript? An overview for JavaScript programmers","url":"https://2ality.com/2025/02/what-is-typescript.html","tags":["TypeScript","article"],"content":"TypeScriptとは何かという概要的な記事。\nTypeScriptはJavaScriptに型構文を足したものである点、TypeScriptのビルド、type strippingなどの`tsc`以外のコンパイルについてなど","relatedLinks":[]},{"category":"Article","title":"Migrating 160,000 Lines of Production Banking JavaScript to TypeScript with Zero Downtime - Ben Howdle - Software Consultant &amp; Advisor","url":"https://benhowdle.im/migrating-js-to-ts-zero-downtime.html","tags":["JavaScript","TypeScript","article"],"content":"JavaScriptからTypeScriptへの移行について。\n移行ブランチを使った移行のアプローチについて","relatedLinks":[]},{"category":"Article","title":"Temporalで変わるJavaScriptの日時操作 ［JS Modern Features no.1］ | gihyo.jp","url":"https://gihyo.jp/article/2025/02/ride-modern-frontend-07","tags":["JavaScript","ECMAScript","article"],"content":"ECMAScript Proposal Stage 3のTemporalについて","relatedLinks":[]},{"category":"Article","title":"Lynx: Unlock Native for More - Lynx","url":"https://lynxjs.org/blog/lynx-unlock-native-for-more.html","tags":["React","Native","article"],"content":"ReactベースのAPIとCSSを使ってネイティブアプリ開発ができるLynxについて。\nInstant First-Frame Rendering (IFR)やMain Thread Scriptについて","relatedLinks":[]},{"category":"Article","title":"oxlint で eslint を高速化させる","url":"https://zenn.dev/hiruno_tarte/articles/how-to-use-oxlint","tags":["ESLint","article"],"content":"oxlintとESLintを組み合わせて利用する設定について。\noxlintとESLintで被っている内容をoxlintに寄せて、ESLintはプラグイン周りのものだけをチェックするようにする設定について","relatedLinks":[]},{"category":"WebsiteDocument","title":"lynx-family/primjs: JavaScript Engine Optimized for Lynx","url":"https://github.com/lynx-family/primjs","tags":["JavaScript","Native","Tools","library"],"content":"Lynxで使われているJavaScriptエンジン。\nQuickJSをベースにしていて、GCの実装やChrome DevTools Protocol (CDP)の実装などが追加されている","relatedLinks":[]}]},{"meta":{"title":"2025-03-12のJS: React Aria March 5, 2025、Firefox 136.0、TypeScriptコンパイラをGoに移植","author":"azu","layout":"post","date":"2025-03-12T03:37:21.235Z","category":"JSer","tags":["React","TypeScript","Vue","Electron","pnpm"],"url":"https://jser.info/2025/03/12/react-aria-march-5-2025-firefox-136.0-typescriptgo/"},"items":[{"category":"Headline","title":"March 5, 2025 Release – React Spectrum Releases","url":"https://react-spectrum.adobe.com/releases/2025-03-05.html","tags":["React","library","ReleaseNote"],"content":"React Aria March 5, 2025リリース。\nToast/Tree/Virtualizerコンポーネントを追加、AutocompleteをMenu/Selectなどと組み合わせて利用できるように。\n`<Pressable>`/`<Focusable>`の追加、\n`usePress`のリファクタリング。\nドキュメントをTailwind v4に対応など","relatedLinks":[]},{"category":"Headline","title":"Electron 35.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-35-0","tags":["Electron","ReleaseNote"],"content":"Electron 35.0.0リリース。\nChromium 134/Node.js 22.14.0/V8 13.5へアップデート、Service Worker Preload Scriptsのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v3.16.0 · nuxt/nuxt","url":"https://github.com/nuxt/nuxt/releases/tag/v3.16.0","tags":["Vue","library","ReleaseNote"],"content":"Nuxt.js v3.16.0リリース。\n`create-nuxt`パッケージの追加、パフォーマンスの改善、delayed/lazy hydrationのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 10.6 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.6.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.6.0リリース。\n`.npmrc`の設定を全て`pnpm-workspace.yaml`に記述できるように","relatedLinks":[]},{"category":"Headline","title":"Release v1.51.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.51.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.51.0リリース。\n`browserContext.storageState()`がIndexedDBをサポート、`filter({ visible })`を追加、`expect(page).toHaveURL(fn)`をサポート。\nLLM向けのCopy promptをレポーターに追加など","relatedLinks":[]},{"category":"Headline","title":"Release @ark-ui/react@5.0.0 · chakra-ui/ark","url":"https://github.com/chakra-ui/ark/releases/tag/%40ark-ui%2Freact%405.0.0","tags":["React","Vue","Solid","library","ReleaseNote"],"content":"Ark UI v5リリース。\nパフォーマンスとBundle Sizeの改善、コンポーネントにデフォルト値を指定するオプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Firefox 136.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/136.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 136リリース。\nHTMLの`autocorrect`属性をサポート、`Intl.DurationFormat`のサポート、Data URLsの最大サイズを32MBからChromeと同じ512MBに変更。\nCookie Storage APIのサポート、HTTPS-Firstに変更。\n実験的な機能として、`Error.captureStackTrace()`のサポート、`Clear-Site-Data`ヘッダのサポート、SVGの`<discard>`要素のサポートなど","relatedLinks":[{"title":"Firefox 136 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/136"}]},{"category":"Headline","title":"Bun v1.2.5 | Bun Blog","url":"https://bun.sh/blog/bun-v1.2.5","tags":["Bun","ReleaseNote"],"content":"Bun v1.2.5リリース。\nNode-APIとの互換性の改善、`node:timers`の追加、`Bun.CSRF`の追加。\ndev serverがsvelteをサポート、CSS modulesのサポートなど","relatedLinks":[]},{"category":"Article","title":"A 10x Faster TypeScript - TypeScript","url":"https://devblogs.microsoft.com/typescript/typescript-native-port/","tags":["TypeScript","article","performance"],"content":"TypeScriptの型チェックやLSPのパフォーマンスを改善するために、TypeScriptコンパイルやLSPなどのツールをGo言語へポートするという話。\n移植したnative版をTypeScript 7としてリリースする予定で、native版が安定するまではJS版もメンテナンスしていく予定。","relatedLinks":[]},{"category":"Article","title":"Split Route Modules | Remix","url":"https://remix.run/blog/split-route-modules","tags":["React","article"],"content":"React Router v7.2.0で追加されたSplit Route Modulesについて。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"microsoft/typescript-go: Staging repo for development of native port of TypeScript","url":"https://github.com/microsoft/typescript-go","tags":["TypeScript","golang","Tools"],"content":"TypeScriptをGo言語にポートした実装。\n型チェック以外は並行に処理できる。型チェックはいくつかのブロックに分けて処理するようになっている。","relatedLinks":[{"title":"A 10x faster TypeScript - YouTube","url":"https://www.youtube.com/embed/pNlq-EVld70?si=OaEgTg6ROtfYDYLt"}]},{"category":"SoftwareLibrary","title":"Pikku - A Function-First Framework for Node.js | Pikku","url":"https://pikku.dev/","tags":["TypeScript","library","server"],"content":"TypeScriptで書かれたウェブフレームワーク。\nただの関数としてハンドラーなどを定義できる。TypeScriptのコードからJSONスキーマを生成してバリデーションを行え、クライアントコードも自動的に生成される","relatedLinks":[]}]},{"meta":{"title":"2025-03-25のJS: Node.js v20.19.0、Valibot v1、CSS Relative Colors","author":"azu","layout":"post","date":"2025-03-24T15:53:13.161Z","category":"JSer","tags":["Vue","nodejs","css","Tools","React"],"url":"https://jser.info/2025/03/25/node.js-v20.19.0-valibot-v1-css-relative-colors/"},"items":[{"category":"Headline","title":"Node.js — Node v20.19.0 (LTS)","url":"https://nodejs.org/en/blog/release/v20.19.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v20.19.0リリース。\nNode.js 20.xに`require(esm)`をバックポート、`--experimental-detect-module`をデフォルトで有効に変更など","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v23.10.0 (Current)","url":"https://nodejs.org/en/blog/release/v23.10.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v23.10.0リリース。\n`--experimental-config-file`フラグを追加し`node.config.json`ファイルにNode.js Optionの設定をかけるように","relatedLinks":[]},{"category":"Headline","title":"Oxc Minifier Alpha | The JavaScript Oxidation Compiler","url":"https://oxc.rs/blog/2025-03-13-minifier-alpha","tags":["JavaScript","Tools","ReleaseNote"],"content":"Oxc Minifier Alphaリリース。\nOxcベースのminifierでRolldownにも組み込まれている","relatedLinks":[]},{"category":"Headline","title":"Oxlint Beta | The JavaScript Oxidation Compiler","url":"https://oxc.rs/blog/2025-03-15-oxlint-beta.html","tags":["ESLint","Tools","ReleaseNote"],"content":"Oxlint Betaリリース\n`eslint-plugin-oxlint`を使ったESLintとの併用について、`.oxlintrc.json`ファイルの解決方法の変更。\n`.vue`ファイルなどの`<script>`に対するLintのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Nuxt UI v3 · Nuxt Blog","url":"https://nuxt.com/blog/nuxt-ui-v3","tags":["Vue","UI","library","ReleaseNote"],"content":"Nuxt UI v3リリース。\nHeadlesUIからReka UIへの移行、Tailwind CSS v4へアップデート、型安全なテーマ設定など","relatedLinks":[{"title":"Reka UI - Unstyled, fully accessible UI library | Reka UI","url":"https://reka-ui.com/"}]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 215 | WebKit","url":"https://webkit.org/blog/16523/release-notes-for-safari-technology-preview-215/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 215リリース。\nScroll Driven Animation、`text-wrap-style: pretty`のサポート、Anchor Positioningのサポート。\nTrusted Typesのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Valibot v1 - The 1 kB schema library | Valibot","url":"https://valibot.dev/blog/valibot-v1-the-1-kb-schema-library/","tags":["JavaScript","library","ReleaseNote"],"content":"バリデーションライブラリのValibot v1.リリース。","relatedLinks":[]},{"category":"Headline","title":"Should Corepack stay in the Node.js distribution? by github-actions\\[bot\\] · Pull Request #1697 · nodejs/TSC","url":"https://github.com/nodejs/TSC/pull/1697#issuecomment-2737093616","tags":["nodejs","news"],"content":"corepackはNode.js 25+からは同梱されなくなる。\nNode.js 24にはexperimentalなものとして含まれるが、Node.js 24がEOLとなった後のcorepackのメンテナンスはどうなるかは不明","relatedLinks":[]},{"category":"Headline","title":"Authorization Bypass in Next.js Middleware · CVE-2025-29927 · GitHub Advisory Database","url":"https://github.com/advisories/GHSA-f82v-jwr5-mffw","tags":["Next.js","security","ReleaseNote"],"content":"Next.jsのセキュリティ修正として 15.2.3 と 14.2.25がリリースされた。\n特定のHTTPヘッダをつけると、middlewareが完全にバイパスされてしまう脆弱性が修正されている","relatedLinks":[{"title":"Next.js and the corrupt middleware: the authorizing artifact - zhero","url":"https://zhero-web-sec.github.io/research-and-things/nextjs-and-the-corrupt-middleware"},{"title":"Release v15.2.3 · vercel/next.js","url":"https://github.com/vercel/next.js/releases/tag/v15.2.3"}]},{"category":"Headline","title":"Introducing Motion for Vue - Motion Blog","url":"https://motion.dev/blog/introducing-motion-for-vue","tags":["Vue","library","ReleaseNote","animation"],"content":"MotionのVueサポートがリリースされた","relatedLinks":[]},{"category":"Headline","title":"Thank you - Open Collective","url":"https://opencollective.com/styled-components/updates/thank-you","tags":["news","React","css","library"],"content":"styled-componentsはメンテナンスモードとなり、新しい機能を入れるといった機能開発は行わなくなる予定","relatedLinks":[{"title":"styled-components","url":"https://styled-components.com/"}]},{"category":"Headline","title":"Release v4.0.0-alpha.0 · apollographql/apollo-client","url":"https://github.com/apollographql/apollo-client/releases/tag/v4.0.0-alpha.0","tags":["GraphQL","JavaScript","library","ReleaseNote"],"content":"Apollo Client v4.0.0-alpha.0リリース。\n`asyncMap`/`isApolloError`/`addTypename`オプションの削除。\nReact 16のサポート終了、非推奨だったメソッドやオプションの削除、`ApolloError`の各種エラーは排他的なエラーであることを明確にするように変更。\nObservableの実装を`rxjs`に変更、パッケージのビルドターゲットの変更など","relatedLinks":[]},{"category":"Article","title":"Webフロントエンドでのリアクティビティからalien-signalsを知ろう","url":"https://zenn.dev/comm_vue_nuxt/articles/about-alien-signals","tags":["Vue","article"],"content":"ReactiveのPush/Pull型について。\nVue 3.6で利用されているalien-signalsについて","relatedLinks":[]},{"category":"Article","title":"CSS Relative Colors","url":"https://ishadeed.com/article/css-relative-colors/","tags":["css","article"],"content":"CSSの相対カラーについてのインタラクティブなガイド","relatedLinks":[]},{"category":"Article","title":"Functions in CSS?! | CSS-Tricks","url":"https://css-tricks.com/functions-in-css/","tags":["css","article"],"content":"CSSの関数定義である`@function` について","relatedLinks":[]},{"category":"SoftwareLibrary","title":"inokawa/virtua: A zero-config, fast and small (~3kB) virtual list (and grid) component for React, Vue, Solid and Svelte.","url":"https://github.com/inokawa/virtua","tags":["React","Vue","Solid","Svelte","library"],"content":"表示してる範囲だけを描画するVirtual Listライブラリ。React/Vue/Solid/Svelteをサポートしている。","relatedLinks":[]}]},{"meta":{"title":"2025-04-03のJS: Next.js LTS Policy、Rsdoctor 1.0、zx@lite","author":"azu","layout":"post","date":"2025-04-03T03:54:10.058Z","category":"JSer","tags":["nodejs","Tools","rspack","css","Next.js"],"url":"https://jser.info/2025/04/03/next.js-lts-policy-rsdoctor-1.0-zxlite/"},"items":[{"category":"Headline","title":"Biome v2.0 beta | Biome","url":"https://biomejs.dev/blog/biome-v2-0-beta/","tags":["JavaScript","Tools","ReleaseNote"],"content":"Biome v2.0 Betaリリース。\nGritQLでのプラグインの追加、Linterに`domains`オプションを追加、複数のファイルにまたがるLintのサポート、`// biome-ignore-all`のサポート。\nHTML Formatterのサポート、ルールの追加など","relatedLinks":[]},{"category":"Headline","title":"Next.js Support Policy | Next.js by Vercel - The React Framework","url":"https://nextjs.org/support-policy","tags":["Next.js","security","document"],"content":"Next.jsのLTSポリシーが公開された。\n現在のメジャーバージョンをActive LTSとし、それ以前のメジャーバージョンは最初のリリースから2年間はMaintenance LTSとしてメンテナンスするポリシー","relatedLinks":[{"title":"Postmortem on Next.js Middleware bypass - Vercel","url":"https://vercel.com/blog/postmortem-on-next-js-middleware-bypass"}]},{"category":"Headline","title":"Release 19.1.0 (March 28, 2025) · facebook/react","url":"https://github.com/facebook/react/releases/tag/v19.1.0","tags":["React","ReleaseNote"],"content":"React v19.1.0リリース。\ndevelopment buildでのみ利用できる`captureOwnerStack` APIの追加、`<Suspense>`を`<body>`より上にも書けるように、`useId`の返す形式の変更。\n`react-server-dom-parcel`パッケージの追加など","relatedLinks":[]},{"category":"Headline","title":"Bun v1.2.7 | Bun Blog","url":"https://bun.sh/blog/bun-v1.2.7","tags":["Bun","ReleaseNote"],"content":"Bun v1.2.7リリース。\nCookieの読み書きを行う`Bun.Cookie`/`Bun.CookieMap`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · lerna-lite/lerna-lite","url":"https://github.com/lerna-lite/lerna-lite/releases/tag/v4.0.0","tags":["nodejs","ReleaseNote"],"content":"lerna-lite v4.0.0リリース。\nNode.js 18のサポート終了、依存のアップデートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing Rspack 1.3 - Rspack","url":"https://rspack.dev/blog/announcing-1-3","tags":["rspack","ReleaseNote"],"content":"Rspack 1.3リリース。\n循環参照を検出する`CircularDependencyRspackPlugin`の追加、`experiments.buildHttp`オプションの追加。\nLazy compilationをmiddlewareとして利用できるように、AMDモジュールのサポート、bundle sizeとメモリ使用量の改善。","relatedLinks":[]},{"category":"Headline","title":"Announcing Rsdoctor 1.0 - Rsdoctor","url":"https://rsdoctor.dev/blog/release/release-note-1_0","tags":["webpack","rspack","ReleaseNote"],"content":"Rsdoctor 1.0リリース。\nwebpack-bundle-analyzerのようにbundle sizeの分析やビルドの分析が行えるツール。\nrspackまたはwebpackで利用できる","relatedLinks":[]},{"category":"Headline","title":"Release ES2025 Candidate March 31st 2025 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2025-candidate-2025-03-31","tags":["ECMAScript","ReleaseNote"],"content":"ES2025 Candicateリリース。\n2025年6月のEcma GAで承認されたら正式にリリースされる","relatedLinks":[]},{"category":"Headline","title":"Release v4.1.0 · tailwindlabs/tailwindcss","url":"https://github.com/tailwindlabs/tailwindcss/releases/tag/v4.1.0","tags":["css","library","ReleaseNote"],"content":"tailwindcss v4.1.0リリース。\n`details-content`/`inverted-colors`/`noscript`/`pointer-*`のvariantの追加。\n`items-baseline-last`/`self-baseline-last`/`text-shadow` utilitiesの追加。\n`@source inline(…)`/`@source not inline(…)`の追加など","relatedLinks":[]},{"category":"Headline","title":"Release 8.5.0 — Flow Splitter · google/zx","url":"https://github.com/google/zx/releases/tag/8.5.0","tags":["JavaScript","nodejs","Tools","ReleaseNote"],"content":"zx 8.5.0リリース。\n`zx@lite`でより小さいサイズのパッケージとして利用できるように、npm/GitHub/JSR/homebrew/Dockerなど色々な方法でインストールできるように","relatedLinks":[]},{"category":"Headline","title":"Firefox 137.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/137.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 137リリース。\nCSSの`hyphenate-limit-chars`プロパティのサポート。\nJavaScriptの`Math.sumPrecise()`, `Atpmics.pause()`のサポート。\nSVGで`<discard>`要素のサポートなど。\nDevToolsでフォントのメタデータの表示、Network Panelからレスポンスをローカルファイルで置き換えできるようになるなど","relatedLinks":[{"title":"Firefox 137 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/137"},{"title":"Network override in Firefox DevTools – Firefox Developer Experience","url":"https://fxdx.dev/network-override-in-firefox-devtools/"}]},{"category":"Headline","title":"Node.js — Node v23.11.0 (Current)","url":"https://nodejs.org/en/blog/release/v23.11.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v23.11.0リリース。\n`assert.partialDeepStrictEqual`の追加、`crypto.diffieHellman`の追加、`process.execve`の追加、`util.diff`の追加など","relatedLinks":[]},{"category":"Article","title":"New URLPattern API brings improved pattern matching to Node.js and Cloudflare Workers","url":"https://blog.cloudflare.com/improving-web-standards-urlpattern/","tags":["nodejs","cloudflare","JavaScript","article"],"content":"Node.js, Cloudflare Workers, Denoなどサポートされている `URLPattern` APIについて。\nWHATWGで定義されているAPIだが、WinterTC Minimum Common APIにも含まれている","relatedLinks":[]},{"category":"Article","title":"Item Flow, Part 1: A new unified concept for layout | WebKit","url":"https://webkit.org/blog/16587/item-flow-part-1-a-new-unified-concept-for-layout/","tags":["css","article"],"content":"`display: masonry`という新しいCSSのレイアウトパターンを増やすのではなく、flexbox, gridに対するプロパティの追加で解決できないかという議論について","relatedLinks":[]},{"category":"Book","title":"Effective TypeScript 第2版 - O&#039;Reilly Japan","url":"https://www.oreilly.co.jp/books/9784814401093/?utm_mediun=referral","tags":["TypeScript","ebook"],"content":"Effective TypeScript 第2版","relatedLinks":[]}]},{"meta":{"title":"2025-04-09のJS: express 5.1(正式リリース)、Safari 18.4、ESLint bulk suppressions","author":"azu","layout":"post","date":"2025-04-09T03:51:38.606Z","category":"JSer","tags":["safari","css","Tools","nodejs","express"],"url":"https://jser.info/2025/04/09/express-5.1-safari-18.4-eslint-bulk-suppressions/"},"items":[{"category":"Headline","title":"Express@5.1.0: Now the Default on npm with LTS Timeline","url":"https://expressjs.com/2025/03/31/v5-1-latest-release.html","tags":["express","ReleaseNote"],"content":"Express 5.1.0リリース。\nexpress 5.xの正式リリースとなるバージョン。\nドキュメントの刷新、codemodでのマイグレーションツールの提供。\nまた、LTS Policyについても定義され、4.xは2026-10-01でサポートが終了する。","relatedLinks":[]},{"category":"Headline","title":"WebKit Features in Safari 18.4 | WebKit","url":"https://webkit.org/blog/16574/webkit-features-in-safari-18-4/","tags":["safari","ReleaseNote"],"content":"Safari 18.4リリース。\nDeclarative Web Pushのサポート。\nCSSの`shape()`/`writing-mode`の横書きモード/`text-autospace`のサポート。\nHTMLの`<input type=\"color\" />`の改善。\nWeb InspectorのLocal Overridesで一部データだけ変更できるように、`console.screenshot()` APIの追加。\nImage Capture APIのサポート、Screen Wake Lock APIがiOS/iPad OSでも動くように、Cookie Store APIのサポート。\nES2025のIterator Helpersのサポート、Stage 3の`Error.isError`をサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Introducing bulk suppressions - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2025/04/introducing-bulk-suppressions/","tags":["ESLint","article"],"content":"ESLintのbulk suppressionsについて。\n一度全てのエラーを抑制して、新規追加されたファイルに対してはLintエラーにするための仕組み。","relatedLinks":[]},{"category":"Article","title":"Meet Declarative Web Push | WebKit","url":"https://webkit.org/blog/16535/meet-declarative-web-push/","tags":["safari","article"],"content":"Safari 18.4でサポートされたDeclarative Web Pushについて。\nSafariはITP対応のために、一定時間アクセスがないService Worker(SW)も削除していたが、Web PushはSWに依存していたためプッシュを使えないケースがあった。\nDeclarative Web PushはService Workerを利用せずにプッシュ通知を管理できる","relatedLinks":[{"title":"explainers/DeclarativeWebPush at main · WebKit/explainers","url":"https://github.com/WebKit/explainers/tree/main/DeclarativeWebPush"}]},{"category":"Article","title":"Modern Cookie Management with the Cookie Store API","url":"https://www.telerik.com/blogs/modern-cookie-management-cookie-store-api","tags":["JavaScript","WebPlatformAPI","article"],"content":"Cookie Store APIについて。\n`document.cookie`との違いやCookie Store API を使ったCookieの読み書きについて","relatedLinks":[]},{"category":"Article","title":"Introducing bulk suppressions - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2025/04/introducing-bulk-suppressions/","tags":["ESLint","article"],"content":"ESLintのbulk suppressionsについて。\n一度全てのエラーを抑制して、新規追加されたファイルに対してはLintエラーにするための仕組み。","relatedLinks":[]},{"category":"Article","title":"あらためて理解するArrayBuffer - JavaScriptでバイナリデータを扱う方法 - ICS MEDIA","url":"https://ics.media/entry/250408/","tags":["JavaScript","article"],"content":"ArrayBufferとTypedArrayについての解説記事。\n通常の配列(Array)との違いやTypedArrayの使い方について","relatedLinks":[]},{"category":"SlideVideo","title":"React Query API Design – Lessons Learned - Dominik Dorfmeister - YouTube","url":"https://www.youtube.com/watch?v=l3PxErcKeAI","tags":["React","slide","video"],"content":"React QueryのAPIデザインから学んだことについて発表。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"harrysolovay/standard-json-schema: Turn standard types into JSON schemas","url":"https://github.com/harrysolovay/standard-json-schema","tags":["JavaScript","TypeScript","JSON","library"],"content":"Standard SchemaをJSON Schemaへと変換するAdaptorライブラリ。\nzod/arktype/valibot/typeboxなどに対応していて、それぞれpeerDependenciesとして定義している","relatedLinks":[{"title":"[","url":"https://github.com/standard-schema/standard-schema/issues/21"}]},{"category":"SoftwareLibrary","title":"bytecodealliance/StarlingMonkey: The StarlingMonkey JS runtime","url":"https://github.com/bytecodealliance/StarlingMonkey","tags":["JavaScript","WebAssembly"],"content":"Wasmの最適化されたSpiderMonkeyをベースにしたJavaScriptエンジン","relatedLinks":[]},{"category":"SoftwareLibrary","title":"holepunchto/bare: Small and modular JavaScript runtime for desktop and mobile","url":"https://github.com/holepunchto/bare","tags":["JavaScript","nodejs","Tools"],"content":"組み込みやモバイルでの利用を目的にしたJavaScript Runtime。\nlibjsというJavaScriptエンジンに依存しないBindingを定義して、エンジンとしてはV8/JSC/QuickJS/JerryScriptなどを利用できる。\nCJS/ESMのモジュールの仕組みやNative Addonの仕組み、軽量スレッドなどをサポートしている","relatedLinks":[{"title":"Bare | Fast, Lightweight Runtime for Modular JavaScript Apps","url":"https://bare.pears.com/"}]},{"category":"SoftwareLibrary","title":"toss/es-git: A modern Git library built for Node.js with blazing-fast installation and rock-solid stability, powered by N-API.","url":"https://github.com/toss/es-git","tags":["nodejs","Rust","git ","library"],"content":"Node.jsのN-APIを使ったGitのbindingライブラリ","relatedLinks":[]}]},{"meta":{"title":"2025-04-17のJS: Zod 4 beta、Next.js 15.3とRspack、LLMを使ったテストのマイグレーション","author":"azu","layout":"post","date":"2025-04-17T14:41:52.073Z","category":"JSer","tags":["Next.js","React","TypeScript","test","css"],"url":"https://jser.info/2025/04/17/zod-4-beta-next.js-15.3rspack-llm/"},"items":[{"category":"Headline","title":"Bun v1.2.9 | Bun Blog","url":"https://bun.sh/blog/bun-v1.2.9","tags":["Bun","ReleaseNote"],"content":"Bun v1.2.9リリース。\nRedisクライアントである`Bun.redis`の追加、`require.extensions`のサポート、`require.resolve`の`paths`オプションのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Introducing Zod 4 | Zod Docs","url":"https://v4.zod.dev/v4","tags":["TypeScript","library","ReleaseNote"],"content":"Zod 4 betaリリース。\nパフォーマンスの改善、Bundle Sizeの改善、Tree Shaking可能なAPIを提供する`@zod/mini`と`@zod/core`パッケージを公開。\n再帰も可能なオブジェクトの定義をする`z.interface()` APIの追加、メタデータを管理 `z.registry()` API、`toJSONSchema()` APIの追加。\n文字列のTop Level APIの追加や変更、エラーメッセージを`message`から`error`パラメータへ変更など","relatedLinks":[]},{"category":"Headline","title":"Next.js 15.3 | Next.js","url":"https://nextjs.org/blog/next-15-3","tags":["Next.js","ReleaseNote"],"content":"Next.js 15.3リリース。\nTurbopackを`next build`でも利用可能に、Rspackのサポート、`instrumentation-client.{js,ts}`のサポート、Navigation Hooksのサポート。\n`useLinkStatus`の追加、TypeScript LSPのパフォーマンス改善。\n実験的な機能として`<Link unstable_dynamicOnHovertrue>`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 0.12.0 | StyleX","url":"https://stylexjs.com/blog/v0.12.0","tags":["React","css","library","ReleaseNote"],"content":"StyleX v0.12.0リリース。\nパフォーマンスの改善、ESLintプラグインに`no-legacy-media-queries`を追加。\n`@stylexjs/esbuild-plugin`/`@stylexjs/nextjs-plugin`/`@stylexjs/webpack-plugin`などを非推奨に変更など","relatedLinks":[]},{"category":"Headline","title":"Shipping Temporal | SpiderMonkey JavaScript/WebAssembly Engine","url":"https://spidermonkey.dev/blog/2025/04/11/shipping-temporal.html","tags":["Firefox","JavaScript","news"],"content":"SpinderMonkeyがECMAScript Proposal Stage 3のTemporalの実装がFirefox 139でリリースされる。","relatedLinks":[]},{"category":"Headline","title":"Astro 5.7 | Astro","url":"https://astro.build/blog/astro-570/","tags":["astro","ReleaseNote"],"content":"Astro 5.7リリース。\n実験的なFont APIの追加、Sessions APIがStableに変更、SVGファイルをコンポーネントとして読み込めるように、`astro:config`がStableへ変更など","relatedLinks":[]},{"category":"Article","title":"Accelerating Large-Scale Test Migration with LLMs | by Charles Covey-Brandt | The Airbnb Tech Blog | Mar, 2025 | Medium","url":"https://medium.com/airbnb-engineering/accelerating-large-scale-test-migration-with-llms-9565c208023b","tags":["React","JavaScript","test","LanguageModel","article"],"content":"EnzymeからReact Testing Libraryへの移行をLLMを活用してマイグレーションした話。\n移行のプロセスのステップ化、再試行ループ、コンテキストに関連するテスト/移行ガイドラインの追加することで75%は移行できた。\nそこからどのステップでうまくいっていないかをコメントに残して、そのファイルを使った学習をすることで97%まで自動的に移行ができたという話","relatedLinks":[]},{"category":"Article","title":"Deploy your Next.js app to Cloudflare Workers with the Cloudflare adapter for OpenNext","url":"https://blog.cloudflare.com/deploying-nextjs-apps-to-cloudflare-workers-with-the-opennext-adapter/","tags":["Next.js","cloudflare","article"],"content":"Cloudflare WorkersでNext.jsを動かすOpenNextについて。","relatedLinks":[]},{"category":"Article","title":"WebAssembly の歩き方","url":"https://zenn.dev/canary_techblog/articles/47af6331b4ecfb","tags":["WebAssembly","article"],"content":"WebAssemblyとはどういうものかについて。\nWebAssemblyが定義しているもの、バイトコード表現とテキスト表現、仕様の実装であるEmbedderについて","relatedLinks":[]},{"category":"Article","title":"Rspack joins the Next.js ecosystem - Rspack","url":"https://rspack.dev/blog/rspack-next-partner","tags":["Next.js","rspack","article"],"content":"Next.jsのRspackサポートについて","relatedLinks":[]},{"category":"Article","title":"Advanced React in the Wild","url":"https://largeapps.dev/case-studies/advanced/","tags":["React","performance","article"],"content":"Reactで書かれたアプリケーションのパフォーマンス改善の事例集","relatedLinks":[]},{"category":"Article","title":"Default styles for h1 elements are changing | MDN Blog","url":"https://developer.mozilla.org/en-US/blog/h1-element-styles/","tags":["HTML","article","browser","css"],"content":"セクションに基づいた暗黙的な`<h1>`要素のデフォルトのスタイル(UAのスタイル)が変更される。\nFirefox 138、Chrome 136以降にこの変更が含まれる","relatedLinks":[]},{"category":"WebsiteDocument","title":"goldbergyoni/nodejs-testing-best-practices: Beyond the basics of Node.js testing. Including a super-comprehensive best practices list and an example app (April 2025)","url":"https://github.com/goldbergyoni/nodejs-testing-best-practices","tags":["nodejs","test","document"],"content":"Node.jsでのテストについてのドキュメント","relatedLinks":[]},{"category":"WebsiteDocument","title":"lightpanda-io/browser: Lightpanda: the headless browser designed for AI and automation","url":"https://github.com/lightpanda-io/browser","tags":["zig","browser","software"],"content":"ZigとV8を使って書かれたヘッドレスブラウザ","relatedLinks":[]},{"category":"WebsiteDocument","title":"Ray-D-Song/lexe: Package your Node.js application into a single executable file, but only 10MB.🔥","url":"https://github.com/Ray-D-Song/lexe?tab=readme-ov-file","tags":["JavaScript","Tools"],"content":"LLRTをRuntimeとして使ったSingle Executable Binaryを作成するツール。\nNode.jsの一部に互換のあるAPIを提供し、バイナリサイズが小さいという特徴がある","relatedLinks":[]},{"category":"Book","title":"「型システムのしくみ」発売のお知らせ - まめめも","url":"https://mametter.hatenablog.com/entry/2025/04/10/063009","tags":["TypeScript","book","program"],"content":"TypeScriptのサブセットの型チェッカを実装していく型システムについての書籍","relatedLinks":[]}]},{"meta":{"title":"2025-04-27のJS: Node v22.15.0、Reactの実験的な機能、Node.jsとV8 GC","author":"azu","layout":"post","date":"2025-04-27T02:43:58.849Z","category":"JSer","tags":["nodejs","React","pnpm","css","performance"],"url":"https://jser.info/2025/04/27/node-v22.15.0-react-node.jsv8-gc/"},"items":[{"category":"Headline","title":"Release v1.52.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.52.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.52.0リリース。\n破壊的な変更として`page.route()`で`?`はwildcardとして扱わないように変更、`route.continue()`で`Cookie`ヘッダを上書きできないように変更。\n`expect(locator).toContainClass()`の追加、Aria Snapshotの更新。\nプロジェクトごとに`workers`を設定できるように、`failOnFlakyTests`オプションの追加。","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2025-04 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2025/04/19/ecmascript-proposal-update","tags":["ECMAScript","proposal","news"],"content":"2025年4月のTC39ミーティングでのECMAScript ProposalのStatus変更のまとめ。\nRecord & Tupleがwithdrawnとなった。","relatedLinks":[]},{"category":"Headline","title":"Release @fastify/react@1.0.0 · fastify/fastify-vite","url":"https://github.com/fastify/fastify-vite/releases/tag/react-v1.0.0","tags":["nodejs","React","ReleaseNote"],"content":"@fastify/react 1.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v22.15.0 (LTS)","url":"https://nodejs.org/en/blog/release/v22.15.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.15.0リリース。\n`assert.partialDeepStrictEqual()`の追加、` module.registerHooks()`の追加、`util.diff()`の追加、zstdのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 10.9 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.9.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.9.0リリース。\n`pnpm add jsr:<pkg_name>`でJSRをサポート、`dangerouslyAllowAllBuilds`オプションを追加","relatedLinks":[]},{"category":"Headline","title":"Release Release v1.9.0 · axios/axios","url":"https://github.com/axios/axios/releases/tag/v1.9.0","tags":["JavaScript","HTTP","library","ReleaseNote"],"content":"axios v1.9.0リリース。\n`getSetCookie`のサポート","relatedLinks":[]},{"category":"Article","title":"React Labs: View Transitions, Activity, and more – React","url":"https://react.dev/blog/2025/04/23/react-labs-view-transitions-activity-and-more","tags":["React","article"],"content":"Reactの実験的な機能の紹介。\n`<ViewTransition>`/`addTransitionType`/`<Activity>`。\nDevToolsでReactのPerformance Profilerの可視化、依存のない`useEffect`、React Compilerなどについて","relatedLinks":[]},{"category":"Article","title":"Tailwind vs Linaria: Performance Investigation","url":"https://www.developerway.com/posts/tailwind-vs-linaria-performance","tags":["css","performance","article"],"content":"TailwindとLinariaのパフォーマンスを比較調査した記事。\n調査していくと、ベースとなるスタイルで`*`に対するスタイルが存在することで実行時のパフォーマンスに差異が発生していたという話","relatedLinks":[]},{"category":"Article","title":"Introducing Socket Fix for Safe, Automated Dependency Upgrad...","url":"https://socket.dev/blog/introducing-socket-fix","tags":["npm","pnpm","article"],"content":"パッケージのセキュリティアップデートの修正を行う`socket fix`コマンドについて。\nnpm/pnpmをサポートしている。","relatedLinks":[]},{"category":"Article","title":"Polishing your typography with line height units | WebKit","url":"https://webkit.org/blog/16831/line-height-units/","tags":["css","article"],"content":"`1lh`は1 line heightで1行の高さを表す単位、`1rlh`はremと同じくRootの1行の高さを表す単位。\n`1lh`を使ったタイポグラフィについて","relatedLinks":[]},{"category":"Article","title":"Boost Node.js with V8 GC Optimization","url":"https://blog.platformatic.dev/optimizing-nodejs-performance-v8-memory-management-and-gc-tuning","tags":["nodejs","V8","article","performance"],"content":"V8の世代別GCは、Scavengeという高速なGCをsemi-spaceのオブジェクトに行い、何回か生き残ったオブジェクトを昇格し、GCの頻度が少ないspaceに移動させる。\n間違って昇格したオブジェクトが多いとなかなかメモリから解放されないため、このsemi-spaceのサイズを調整するオプションやメモリチューニングの方法についてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"unnoq/orpc: Typesafe APIs Made Simple 🪄","url":"https://github.com/unnoq/orpc?tab=readme-ov-file","tags":["OpenAPI","nodejs","library"],"content":"ルーティングの定義からOpen API Specを出力できるサーバ/クライアントのHTTPフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"slevithan/oniguruma-to-es: Convert patterns from Oniguruma (the regex flavor used by Ruby, TextMate grammars, etc.) to native JavaScript RegExp","url":"https://github.com/slevithan/oniguruma-to-es","tags":["JavaScript","library","RegExp"],"content":"Onigurumaの正規表現をJavaScriptの正規表現に変換するライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Nom-nom-hub/flash-install: A fast, drop-in replacement for npm install, focused on drastically speeding up Node.js dependency installation through deterministic caching, parallel operations, and .flashpack archive snapshotting.","url":"https://github.com/Nom-nom-hub/flash-install","tags":["npm","console","Tools"],"content":"キャッシュとスナップショットをサポートしたnpmパッケージのインストールを行うツール。\nハッシュベースのパスとhard linkを使ったキャッシュ、`.flashpack`というスナップショットファイルを扱うことができブランチ切り替え時の復元が高速に行える。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"andrewmd5/hako: An embeddable, lightweight, secure, high-performance JavaScript engine.","url":"https://github.com/andrewmd5/hako","tags":["WebAssembly","JavaScript","Tools","library"],"content":"QuickJSベースのWebAssemblyにコンパイルして利用するJavaScriptエンジン。\nLynx/primjsをforkしたものをベースにしている。","relatedLinks":[{"title":"lynx-family/primjs: JavaScript Engine Optimized for Lynx","url":"https://github.com/lynx-family/primjs"},{"title":"Hako - by Andrew Sampson - ./make","url":"https://andrews.substack.com/p/hako"}]}]},{"meta":{"title":"2025-05-07のJS: koa v3.0.0、Node.js 24とNode.js 18 EOL、`//# allFunctionsCalledOnLoad`","author":"azu","layout":"post","date":"2025-05-07T00:31:48.346Z","category":"JSer","tags":["nodejs","React","esbuild","Firefox","polyfill"],"url":"https://jser.info/2025/05/07/koa-v3.0.0-node.js-24node.js-18-eol-allfunctionscalledonload/"},"items":[{"category":"Headline","title":"react-router/CHANGELOG.md at main · remix-run/react-router","url":"https://github.com/remix-run/react-router/blob/main/CHANGELOG.md#v752","tags":["React","library","ReleaseNote"],"content":"React Router v7.5.2リリース。\n`X-React-Router-Prerender-Data`ヘッダーと`X-React-Router-SPA-Mode`ヘッダーに関する脆弱性を修正するセキュリティ修正","relatedLinks":[{"title":"URL manipulation via Host / X-Forwarded-Host headers · Advisory · remix-run/react-router","url":"https://github.com/remix-run/react-router/security/advisories/GHSA-4q56-crqp-v477"},{"title":"React Router and the Remix’ed path - zhero","url":"https://zhero-web-sec.github.io/research-and-things/react-router-and-the-remixed-path"}]},{"category":"Headline","title":"Release v0.25.3 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.25.3","tags":["esbuild","ReleaseNote"],"content":"esbuild v0.25.3リリース。\n`--serve=`オプションでカスタムホストの指定を許可するように、CSS Nestingの制限を追加など","relatedLinks":[]},{"category":"Headline","title":"Firefox 138.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/138.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 138リリース。\n`importmap`の`integrity`をサポート、`Error.captureStackTrace()`をサポート、ES Proposal Stage 3の`Error.isError()`をサポート。\nImport Attributesを使ったJSONのimportをサポート、`Clear-Site-Data`で`cache`ディレクティブをサポート。\nFedCM APIのLogin Status APIをサポート、Web Audio APIのMessage Portをサポート。\nフラグ付きでMutationEventの削除、HTML Sanitizer APIのサポートなど","relatedLinks":[{"title":"Firefox 138 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/138"}]},{"category":"Headline","title":"Release 3.42.0 - 2025.04.30 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.42.0","tags":["JavaScript","polyfill","ReleaseNote"],"content":"core-js v3.42.0リリース。\nMap upsert proposalの更新、Iterator HelpersをES2025の仕様に合わせた変更など","relatedLinks":[]},{"category":"Headline","title":"Deno 2.3: Improved deno compile, local npm packages, and more","url":"https://deno.com/blog/v2.3","tags":["deno","ReleaseNote"],"content":"Deno v2.3リリース。\n`deno compile`でFFIとNode.js Native Addonのサポート、ローカルのnpmパッケージを参照できるように、`deno fmt`のオプションを追加。\nWindowsの`deno`バイナリにコード署名をするように変更など","relatedLinks":[]},{"category":"Headline","title":"ESLint v9.26.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2025/05/eslint-v9.26.0-released/","tags":["ESLint","ReleaseNote"],"content":"ESLint v9.26.0リリース。\n`eslint --mcp`でMCPサーバとして起動できるように、`no-unused-expressions`ルールに`ignoreDirectives`オプションを追加など","relatedLinks":[]},{"category":"Headline","title":"Electron 36.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-36-0","tags":["Electron","ReleaseNote"],"content":"Electron 36.0.0リリース。  \nChromium 136、V8 13.6、Node 22.14.0にアップグレード。  \nmacOSのWriting ToolsやAutofill、Servicesメニューをサポートする新しい`menu.popup`オプションを追加。  \nGTK 4がGNOMEでのデフォルトに変更。`NativeImage.getBitmap()`が非推奨に、`session.loadExtension`などが非推奨となり`Extensions`オブジェクトに移動された。","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · koajs/koa","url":"https://github.com/koajs/koa/releases/tag/v3.0.0","tags":["nodejs","ReleaseNote"],"content":"Koa v3.0.0リリース。\nNode.js 18未満のサポート終了、Generatorを使ったMiddlewaのサポートを終了、`res.redirect('back')`を削除し`ctx.back()`を追加。\n`app.currentContext`でAsyncLocalStorageを使用した現在のコンテキスト取得をサポート。`Blob`/`ReadableStream`/`Response`のサポート、カスタムストリームのサポートなど","relatedLinks":[{"title":"koa/docs/migration-v2-to-v3.md at master · koajs/koa","url":"https://github.com/koajs/koa/blob/master/docs/migration-v2-to-v3.md"}]},{"category":"Headline","title":"Node.js — Node.js Releases","url":"https://nodejs.org/en/about/previous-releases","tags":["nodejs","news"],"content":"Node.js 18は2025年4月30日でEOL(End Of Support)となった。","relatedLinks":[]},{"category":"Headline","title":"Release 21.0.0 · nrwl/nx","url":"https://github.com/nrwl/nx/releases/tag/21.0.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"Nx 21.0.0リリース。\nNode.js 20.19.0以上が必要となり、`outputStyle=compact`の削除、`readWorkspaceConfig`の廃止などの破壊的変更を含む。\ncontinuous taskの追加、タスク用のTerminal UI機能の追加、GitLabリリースのサポートなど","relatedLinks":[{"title":"RFC: Continuous Tasks · nrwl/nx · Discussion #29025","url":"https://github.com/nrwl/nx/discussions/29025"}]},{"category":"Headline","title":"Release v0.25.4 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.25.4","tags":["esbuild","ReleaseNote"],"content":"esbuild v0.25.4リリース。\n開発サーバーに`cors`オプションで`Access-Control-Allow-Origin`ヘッダを設定できるように。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v24.0.0 (Current)","url":"https://nodejs.org/en/blog/release/v24.0.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v24.0.0リリース。\nV8 13.6へアップデート、npm 11を同梱、AsyncLocalStorageがAsyncContextFrameをデフォルトで使用するように。\n`URLPattern`をグローバルに追加、パーミッションモデルが`--permission`フラグで利用できるように、テストランナーの改善、Undici 7を同梱。\n`url.parse()`を非推奨に変更など。\n2025年10月にLTSとなる予定。","relatedLinks":[{"title":"What’s New with Node.js 24 | OpenJS Foundation","url":"https://openjsf.org/blog/nodejs-24-released"}]},{"category":"Article","title":"フロントエンド API コール時のエラーハンドリングを軽く整理（Fetch API・typescript-fetch・TanStack Query） - カミナシ エンジニアブログ","url":"https://kaminashi-developer.hatenablog.jp/entry/2025/04/30/080000","tags":["Fetch","TypeScript","JavaScript","article","HTTP"],"content":"Fetch API/Open APIの`typescript-fetch`、TanStack QueryのFetchの例外処理について","relatedLinks":[]},{"category":"Article","title":"Giving V8 a Heads-Up: Faster JavaScript Startup with Explicit Compile Hints · V8","url":"https://v8.dev/blog/explicit-compile-hints","tags":["JavaScript","V8","article"],"content":"`//# allFunctionsCalledOnLoad` のコメントで、JavaScriptファイルをeager compilationをする仕組みをV8に実装している話。\nJavaScriptは関数をコンパイルするにはファイルをパースをする必要があるため、コンパイルが必要かを判断するにも時間がかかってしまう。そのため、ファイルの先頭のコメントでコンパイルするべきかを判断できるようにするための仕組み","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Intent UI","url":"https://intentui.com/","tags":["React","UI","library"],"content":"React Aria Componentsベースのshadcnライクなコピーペースト可能なコンポーネントライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"zumerlab/snapdom: snapDOM captures DOM nodes as images with exceptional speed and accuracy.","url":"https://github.com/zumerlab/snapdom","tags":["JavaScript","SVG","Image","library"],"content":"SVGの`<foreignObject>`を使いDOM要素を画像にするライブラリ。\nShadow DOM、疑似要素、背景画像、フォントの埋め込みやdata属性での除外などに対応している","relatedLinks":[{"title":"bubkoo/html-to-image: ✂️ Generates an image from a DOM node using HTML5 canvas and SVG.","url":"https://github.com/bubkoo/html-to-image"}]},{"category":"SoftwareLibrary","title":"pulsar-edit/pulsar: A Community-led Hyper-Hackable Text Editor","url":"https://github.com/pulsar-edit/pulsar","tags":["atom","editor","JavaScript"],"content":"Atom EditorをForkしたエディタ。\nAtom向けに作られたパッケージも動くようにしている","relatedLinks":[]}]},{"meta":{"title":"JSer.info のMCPサーバを公開しました","author":"azu","layout":"post","date":"2025-05-09T03:30:00.000Z","category":"雑記","tags":["JSer.info"],"url":"https://jser.info/2025/05/09/jser-mcp/"},"items":[]},{"meta":{"title":"2025-05-20のJS: Zod 4、\"use client\"、Fresh 2 Roadmap","author":"azu","layout":"post","date":"2025-05-20T14:11:55.779Z","category":"JSer","tags":["React","Design","video","GraphQL","jsx"],"url":"https://jser.info/2025/05/20/zod-4-use-client-fresh-2-roadmap/"},"items":[{"category":"Headline","title":"Release v19.0.0 · facebook/relay","url":"https://github.com/facebook/relay/releases/tag/v19.0.0","tags":["GraphQL","React","library","ReleaseNote"],"content":"Relay v19.0.0リリース。\n`@alias`がconditional fragmentsに必須となるように変更、ドキュメントの改善、React 19の対応など。","relatedLinks":[]},{"category":"Headline","title":"Version v8.0.0 | Mantine","url":"https://mantine.dev/changelog/8-0-0/","tags":["React","library","ReleaseNote"],"content":"Mantine v8.0.0リリース。\nDatePickerが`Date`ではなく`string`を扱うように変更、CodeHighlightにshikiを使うように変更。\nMenuコンポーネントがsubmenusをサポート、TimePickerコンポーネントを追加など","relatedLinks":[]},{"category":"Headline","title":"WebKit Features in Safari 18.5 | WebKit","url":"https://webkit.org/blog/16923/webkit-features-in-safari-18-5/","tags":["webkit","safari","ReleaseNote"],"content":"Safari 18.5の変更点。\nDeclarative Web PushをmacOSでもサポート。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Wednesday, May 14, 2025 Security Releases","url":"https://nodejs.org/en/blog/vulnerability/may-2025-security-releases","tags":["nodejs","security","ReleaseNote"],"content":"Node.js 24.x、23.x、22.x、20.x に対するセキュリティアップデートがそれぞれ公開されている。","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 10.11 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.11.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.11.0リリース。\n`pnpm init`に`init-type=module`オプションの追加、`pnpm audit`に`--ignore`と`--ignore-unfixable`フラグの追加","relatedLinks":[]},{"category":"Headline","title":"Introducing Zod 4 | Zod","url":"https://zod.dev/v4","tags":["JavaScript","TypeScript","library","Electron","ReleaseNote"],"content":"zod 4リリース。\nzod 3.25.0がリリースされ`zod/v4`として参照できるようになっている。\n型チェックのパフォーマンスとbundle sizeの改善、zod miniパッケージの追加。スキーマに紐付けたメタデータを管理する`z.regisry()`の追加、`toJSONSchema()`の追加、i18nのサポート。\nトップレベルの文字列形式の変更、メールアドレスの正規表現を変更できるように、テンプレートリテラル型のサポートなど","relatedLinks":[{"title":"Migration guide | Zod","url":"https://zod.dev/v4/changelog"}]},{"category":"Headline","title":"May 19, 2025 Release – React Spectrum Releases","url":"https://react-spectrum.adobe.com/releases/2025-05-19.html","tags":["React","library","ReleaseNote"],"content":"React Aria May 19, 2025リリース。\n`useTreeData`に`moveBefore`と`moveAfter`メソッドの追加、`shouldSelectOnPressUp` propsをcollection componentsに追加など。\nReact 19のref cleanup callbackのサポートなど","relatedLinks":[]},{"category":"Article","title":"Converting values to strings in JavaScript has pitfalls","url":"https://2ality.com/2025/04/stringification-javascript.html","tags":["JavaScript","article"],"content":"JavaScriptで値を文字列に変換する方法の比較","relatedLinks":[]},{"category":"Article","title":"An Update on Fresh | Deno","url":"https://deno.com/blog/an-update-on-fresh","tags":["deno","article"],"content":"Fresh 2のマイルストーンについて。\n2025年9月にリリースする予定で、alpha版を公開している","relatedLinks":[]},{"category":"Article","title":"ESLint can now lint HTML using the html-eslint language plugin - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2025/05/eslint-html-plugin/","tags":["ESLint","HTML","article"],"content":"ESLintでHTMLをLintするための`html-eslint`がリリースされた","relatedLinks":[]},{"category":"Article","title":"What Does &quot;use client&quot; Do? — overreacted","url":"https://overreacted.io/what-does-use-client-do/","tags":["React","article"],"content":"`\"use client\"`と`\"use server\"`とは何かについて。\nクライアント側/サーバ側とマークする手段ではなく、`\"use client\"`はクライアント関数をサーバにexportするものとして認識していることについて","relatedLinks":[]},{"category":"SlideVideo","title":"Design Tokens Course with Brad Frost and Ian Frost","url":"https://designtokenscourse.com/","tags":["Design","video"],"content":"Design Tokenについての講座","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ije/mono-jsx: \\`&lt;html&gt;\\` as a \\`Response\\`.","url":"https://github.com/ije/mono-jsx","tags":["JavaScript","jsx","server","library"],"content":"JSX Runtimeライブラリ。\nサーバサイドのテンプレートとしてJSXを利用でき、コンポーネントのStateやStreaming Renderingをサポートしている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"aidenybai/bippy: ⚠️ hack into react internals","url":"https://github.com/aidenybai/bippy","tags":["React","debug","Tools","library"],"content":"Reactの内部状態を使ってReactアプリケーションをデバッグするツール/ライブラリ。\nReact DevTools向けの処理を使って内部状態を見ている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"webdiscus/ansis: CJS/ESM ANSI color library for CI, terminals and Chromium-based browser consoles. Compatible with Bun, Deno, Next.JS.","url":"https://github.com/webdiscus/ansis","tags":["JavaScript","library","color"],"content":"ANSI colorライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"macieklamberski/feedsmith: Robust and fast parser and generator for RSS, Atom, JSON Feed, and RDF feeds, with support for Podcast, iTunes, Dublin Core, and OPML files.","url":"https://github.com/macieklamberski/feedsmith","tags":["JavaScript","rss","library"],"content":"RSSとOPMLのパーサ/ジェネレータライブラリ","relatedLinks":[]},{"category":"Book","title":"ハイパーメディアシステム | 技術評論社","url":"https://gihyo.jp/book/2025/978-4-297-14945-1","tags":["JavaScript","book"],"content":"2025年6月11日発売\nhtmxについての書籍。","relatedLinks":[]}]},{"meta":{"title":"JSer.info 14周年","author":"azu","layout":"post","date":"2025-05-24T12:00:00.000Z","category":"Article","tags":["JSer"],"url":"https://jser.info/2025/05/24/jser-14th/"},"items":[]},{"meta":{"title":"2025-05-29のJS: TypeScript Native Previews、Firefox 139、Angular 20、Chrome 137","author":"azu","layout":"post","date":"2025-05-29T01:31:32.863Z","category":"JSer","tags":["TypeScript","Bun","nodejs","ESLint","golang"],"url":"https://jser.info/2025/05/29/typescript-native-previews-firefox-139-angular-20-chrome-137/"},"items":[{"category":"Headline","title":"Node.js — Node v24.1.0 (Current)","url":"https://nodejs.org/en/blog/release/v24.1.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v24.1.0リリース。\n`node:fs`の`glob`がStableとなり、experimentalのwarningが出ないようになった","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript Native Previews - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-native-previews/","tags":["TypeScript","golang","ReleaseNote"],"content":"TypeScriptのGo言語のネイティブ実装である`@typescript/native-preview`が公開された","relatedLinks":[]},{"category":"Headline","title":"Bun v1.2.14 | Bun Blog","url":"https://bun.sh/blog/bun-v1.2.14","tags":["Bun","ReleaseNote"],"content":"Bun v1.2.14リリース。\n`bun install`が`catalog:`をサポート、Fetch APIがzstdをサポート、`\"module\": \"Preserve\"`をデフォルト値に変更など","relatedLinks":[]},{"category":"Headline","title":"Release v9.0.0 · storybookjs/storybook","url":"https://github.com/storybookjs/storybook/releases/tag/v9.0.0","tags":["storybook","ReleaseNote"],"content":"Storybook v9.0.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Firefox 139.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/139.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 139リリース。\n`hidden=until-found`のサポート、Temporarl APIをサポート。\n実験的な機能として、Prioritized Task Scheduling API/View Transition API/属性における`<`と`>`を自動エスケープなど","relatedLinks":[{"title":"Firefox 139 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/139"}]},{"category":"Headline","title":"Bun v1.2.15 | Bun Blog","url":"https://bun.sh/blog/bun-v1.2.15","tags":["Bun","ReleaseNote"],"content":"Bun v1.2.15リリース。\n`bun audit`の追加、`BUN_OPTIONS`の環境変数を追加、`vm.SourceTextModule`をサポート、`perf_hooks.createHistogram()`をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Announcing Angular v20. The past couple of years have been… | by Minko Gechev | May, 2025 | Angular Blog","url":"https://blog.angular.dev/announcing-angular-v20-b5c9c06cf301","tags":["Angular","ReleaseNote"],"content":"Angular v20.リリース。\n`effect`/`linkedSignal`/`toSignal`、Incremental hydrationとroute-level render mode configがStableに変更。\nZonelessがDeveloper Previewに変更。\n実験的な機能として`httpResource`を追加、vitestのサポート。\nChrome DevToolsでAngular特有のパフォーマンス情報を扱う`ng.enableProfiling()` APIを追加。\ntemplate expressionで`**`と`in`演算子。\n`*ngIf`/`*ngFor`/`*ngSwitch`の非推奨化など","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 137  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/new-in-chrome-137?hl=en","tags":["Chrome","ReleaseNote"],"content":"Chrome 137リリース。\nCSS関連では、条件付き値を表現する `if()` 関数が追加。\nフォーカスナビゲーション順序を制御する `reading-flow`/`reading-order`プロパティを追加。筆記体での文字間隔を無視する改善、`accent-color` プロパティでのシステムアクセントカラー対応を実装。`offset-path: shape()` サポート。\n\nWeb API関連では、Selection APIに `getComposedRanges()` と `direction` プロパティが追加。Blob URLのパーティショニング（fetch/navigation）が実装。\nWeb Cryptographyでの `Ed25519` サポートが追加。HSTSキャッシュを使ったトラッキングを防止する機能を実装。応答しないWebページのクラッシュレポートをReporting APIでサポート。\n\nWebAssemblyでは、JavaScript Promise Integration（JSPI）の正式サポートが追加。\nbranch hintのサポートなど","relatedLinks":[{"title":"Chrome 137  |  Release notes  |  Chrome for Developers","url":"https://developer.chrome.com/release-notes/137"}]},{"category":"Article","title":"ESLint v9.0.0: A retrospective - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2025/05/eslint-v9.0.0-retrospective/","tags":["ESLint","article"],"content":"ESLint v9.0.0のretrospective。\nうまくいった点とうまくいかなかった点について。\nサポートバージョンのポリシーとv8.x/v9.xの共存とバックポートはうまく行った。\n一方で破壊的な変更が多すぎた問題と、ツールが足りなくてアップデートが大変になっていた問題やエコシステムとの協調性が不足していた点について","relatedLinks":[]},{"category":"Article","title":"TSKaigi資料まとめ","url":"https://zenn.dev/m_n/articles/a1189e28e43313","tags":["TypeScript","Conference","document"],"content":"TSKaigi 2025のスライドまとめ","relatedLinks":[{"title":"TSKaigi 2025","url":"https://2025.tskaigi.org/"}]},{"category":"Article","title":"Wake up, Remix! | Remix","url":"https://remix.run/blog/wake-up-remix","tags":["Remix","article"],"content":"Remixの今後の方向性について。\nRemix v2はReact Routerの薄いラッパーとなった。\nRemix v3ではDBや組み込みコンポーネントを含むフレームワークとなり、またReactではなくPreactのforkをベースにしたものを組み込む予定。\nRemixの基本的な方針について書かれている","relatedLinks":[]},{"category":"Article","title":"A brief history of JavaScript | Deno","url":"https://deno.com/blog/history-of-javascript","tags":["browser","JavaScript","history"],"content":"ブラウザ/JavaScript/ライブラリの歴史をタイムラインでまとめたもの","relatedLinks":[]},{"category":"Article","title":"Introducing \\`jsr:\\` Support","url":"https://blog.vlt.sh/blog/jsr-support","tags":["JavaScript","npm","article"],"content":"vltが`jsr:` prefixでJSRパッケージのインストールをサポート","relatedLinks":[]},{"category":"Article","title":"React, visualized – react.gg","url":"https://react.gg/visualized","tags":["React","tutorial"],"content":"Reactの動作をビジュアライズして紹介しているサイト","relatedLinks":[]},{"category":"SlideVideo","title":"2025-05-23 SignalとObservable ― 新たなデータモデルを解きほぐす (TSKaigi 2025) - Google スライド","url":"https://docs.google.com/presentation/d/1c7fYqn7-v3hnbKtmwXHbvwuCs6cNq_ThLKVDZ7rvbA0/preview#slide=id.g260298bad6d_0_77","tags":["JavaScript","slide"],"content":"ECMAScript Stage 1のSignalsとWCIG Observableについてのスライド。\nPull/Pushベースの連続する値の扱いについて","relatedLinks":[]}]},{"meta":{"title":"2025-06-06のJS: Rolldown-Vite、Vitest 3.2、React RouterのGovernance Model","author":"azu","layout":"post","date":"2025-06-05T22:17:29.129Z","category":"JSer","tags":["vitest","Rust","nodejs","babel","DOM"],"url":"https://jser.info/2025/06/06/rolldown-vite-vite-3.2-react-routergovernance-model/"},"items":[{"category":"Headline","title":"Release v8.0.0-beta.0 · babel/babel","url":"https://github.com/babel/babel/releases/tag/v8.0.0-beta.0","tags":["babel","ReleaseNote"],"content":"Babel v8.0.0-beta.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Vitest 3.2 is out! | Vitest","url":"https://vitest.dev/blog/vitest-3-2.html","tags":["vite","test","ReleaseNote"],"content":"Vitest 3.2リリース。\n`workspace`オプションを非推奨にし`vitest.workspace`ファイルを推奨するように変更。\n`context.annotate` APIの追加、`test.extends`に`scope`オプションを追加、`locators.extend`を追加、`context.signal`の追加。\n`using`でモック関数の自動クリーンアップができるようになり、`sequence.groupOrder`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release astro@5.9.0 · withastro/astro","url":"https://github.com/withastro/astro/releases/tag/astro%405.9.0","tags":["astro","ReleaseNote"],"content":"Astro v5.9.0リリース。\n実験的な機能としてContent Security Policy（CSP）サポートの追加、content loaderにMarkdownレンダラーの提供。\nアダプター向けに`supportedAstroFeatures`オプションを追加など","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2025-05 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2025/06/05/ecmascript-proposal-update","tags":["ECMAScript","news"],"content":"2025年5月のTC39ミーティングでのECMAScript Proposalのステータス変更まとめ。\nInspector/More Random FunctionsがStage 1に新規追加。\nSeededPRNG/`Math.clamp`がStage 2に。\nError.isErrorがStage 4になりES2026で入る。","relatedLinks":[]},{"category":"Article","title":"Announcing Rolldown-Vite | VoidZero","url":"https://voidzero.dev/posts/announcing-rolldown-vite","tags":["vite","Rust","article"],"content":"Rolldown-Viteのリリース。\nRolldownベースのViteで`rolldown-vite`パッケージとして公開されている","relatedLinks":[]},{"category":"Article","title":"Resilient Import Maps - Better Theme Development and Beyond (2025) - Shopify","url":"https://shopify.engineering/resilient-import-maps","tags":["HTML","JavaScript","module","article"],"content":"Import Mapsは複数定義があると動かないなど問題があったが、仕様やブラウザ側を修正していったという話","relatedLinks":[]},{"category":"Article","title":"Seamlessly Blend PHP with Node.js","url":"https://blog.platformatic.dev/seamlessly-blend-php-with-nodejs","tags":["nodejs","php","article","Rust"],"content":"Node.jsの中でPHPを動かす`@platformatic/php-node`について。","relatedLinks":[{"title":"platformatic/php-node: PHP HTTP Request handler for Node.js","url":"https://github.com/platformatic/php-node"}]},{"category":"Article","title":"minify の効果を最大限に引き出す TypeScript コードを書く","url":"https://zenn.dev/j_sakamoto/articles/1b5e1d563b1c30","tags":["JavaScript","TypeScript","article"],"content":"minifyされやすいコードについて","relatedLinks":[]},{"category":"Article","title":"React Router Open Governance | Remix","url":"https://remix.run/blog/rr-governance","tags":["Remix","article"],"content":"React RouterのGovernance Modelについて。\nステージ制を含む開発のプロセスについて","relatedLinks":[{"title":"react-router/GOVERNANCE.md at main · remix-run/react-router","url":"https://github.com/remix-run/react-router/blob/main/GOVERNANCE.md#new-feature-process"}]},{"category":"Article","title":"Exploring the OKLCH ecosystem and its tools—Martian Chronicles, Evil Martians’ team blog","url":"https://evilmartians.com/chronicles/exploring-the-oklch-ecosystem-and-its-tools","tags":["css","color","article"],"content":"OKLCHを使い明度と彩度を一定に維持しながらテーマを扱う方法について","relatedLinks":[]},{"category":"Article","title":"プロファイラを利用して Node.js サーバーのレスポンス時間を 200 秒 → 20 秒に短縮した話","url":"https://zenn.dev/dinii/articles/improve-latency-with-profiler","tags":["nodejs","performance","article"],"content":"`node:async_hooks`を使ったログから、ブロッキング処理を見つけてCloud Profilerなどを使った処理を改善していった話","relatedLinks":[]},{"category":"SlideVideo","title":"JavaScriptフレームワークがDOMをレンダリングする3つの方法 - YouTube","url":"https://www.youtube.com/watch?v=0C-y59betmY","tags":["JavaScript","DOM","video"],"content":"フレームワークのDOMのレンダリング方法について解説している動画、Dirty Check、Virtual DOM、Fine-Grained Renderingについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"almadoro/react-just: React Server Components without a framework. Powered by Vite","url":"https://github.com/almadoro/react-just","tags":["vite","React","Tools"],"content":"ViteベースのReact Server Componentをサポートするフレームワーク。","relatedLinks":[]}]},{"meta":{"title":"2025-06-15のJS: Safari 26 Beta、pnpm 10.12、Jest 30","author":"azu","layout":"post","date":"2025-06-15T11:38:12.338Z","category":"JSer","tags":["test","Tools","rspack","ESLint","polyfill"],"url":"https://jser.info/2025/06/15/safari-26-beta-pnpm-10.12-jest-30/"},"items":[{"category":"Headline","title":"Oxlint v1.0 Stable | The JavaScript Oxidation Compiler","url":"https://oxc.rs/blog/2025-06-10-oxlint-stable","tags":["ESLint","ReleaseNote"],"content":"Oxlint 1.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release 3.43.0 - 2025.06.09 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.43.0","tags":["JavaScript","polyfill","ReleaseNote"],"content":"core-js v3.43.0リリース。\nExplicit Resource Management/Array.fromAsync/Error.isErrorがStableに移行。\nJoint iteration/Iterator chunkingのStage 2 proposalを追加、`Math.clamp`から`Number.prototype.clamp`への変更など","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v24.2.0 (Current)","url":"https://nodejs.org/en/blog/release/v24.2.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v24.2.0リリース。\nHTTP/2 priority signalingの削除、`import.meta.main`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 10.12.1 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.12.1","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.12.1リリース。\n実験的な機能として`enableGlobalVirtualStore`オプションでグローバル仮想ストアをサポート。\n依存関係グラフのハッシュを名前とするグローバルなストアへハードリンクするためキャッシュがある時のインストール速度が高速になる。\n`pnpm update`がcatalogをサポート、`catalogMode`オプションの追加、`--save-catalog`の追加など","relatedLinks":[{"title":"pnpm 10.12 Introduces Global Virtual Store and Expanded Vers...","url":"https://socket.dev/blog/pnpm-introduces-global-virtual-store-and-expanded-version-catalogs"}]},{"category":"Headline","title":"Jest 30: Faster, Leaner, Better · Jest","url":"https://jestjs.io/blog/2025/06/04/jest-30","tags":["jest","test","ReleaseNote"],"content":"Jest 30リリース。\nNode.js 14/16/19/21のサポート終了、TypeScript 5.4+、jsdom 26へアップデート。  \n`expect`のエイリアスメソッド削除、`--testPathPattern`を`--testPathPatterns`にリネーム。  \nunrs-resolverを使ったパフォーマンスとメモリの改善、設定ファイルのTSサポート、`import.meta`のサポート、`using`を使ったspyの自動復元。\n`expect.arrayOf`の追加、`jest.advanceTimersToNextFrame()`の追加、`jest.unstable_unmockModule()`の追加など","relatedLinks":[]},{"category":"Headline","title":"News from WWDC25: WebKit in Safari 26 beta | WebKit","url":"https://webkit.org/blog/16993/news-from-wwdc25-web-technology-coming-this-fall-in-safari-26-beta/","tags":["safari","webkit","ReleaseNote"],"content":"Safari 26 betaの変更点について。\nCSSでは、Anchor Positioning/Scroll-driven Animations/`text-wrap:pretty`/`contrast-color()`/`progress()`をサポート。\nWeb APIでは、WebGPU/HDR Images/Digital Credentials API/Trusted Types API/URL Patternをサポート。\nWeb InspectorでService Workerや非同期処理のデバッグの改善。\nその他、SVGファビコンの対応、WebAssemblyをインタープリタ対応し実行開始速度の改善など","relatedLinks":[]},{"category":"Article","title":"State of CSS 2025","url":"https://survey.devographics.com/en-US/survey/state-of-css/2025","tags":["css","Survey"],"content":"CSSの開発者アンケートであるState of CSS 2025の募集が始まった","relatedLinks":[]},{"category":"Article","title":"WebStatus.dev: Now with more data, deeper insights, and a clearer path to Baseline  |  Blog  |  web.dev","url":"https://web.dev/blog/web-platform-dashboard-evolution?hl=en","tags":["article","browser"],"content":"ウェブプラットフォームのBaselineの実装状態などを可視化するダッシュボードである WebStatus.dev について","relatedLinks":[{"title":"Web Platform Status","url":"https://webstatus.dev/"}]},{"category":"Article","title":"We shipped FinalizationRegistry in Workers: why you should never use it","url":"https://blog.cloudflare.com/we-shipped-finalizationregistry-in-workers-why-you-should-never-use-it/","tags":["cloudflare","JavaScript","article"],"content":"Cloudflare Workersの`FinalizationRegistry` APIのサポートについて。\nWebAssemblyと連携する際のメモリ管理で、JavaScriptオブジェクトがガベージコレクションされる際にコールバックを実行するAPI。  \n非決定的な実行タイミングのため使用を推奨せず、代わりにExplicit Resource Managementの使用を推奨。I/O操作を無効化するなどの安全対策を実装して提供している","relatedLinks":[]},{"category":"Article","title":"Storybook 9","url":"https://storybook.js.org/blog/storybook-9/","tags":["debug","JavaScript","Tools","article"],"content":"Storybook 9の変更点について。\n破壊的な変更として、`@storybook/addon-essentials`を削除してcoreに統合、パッケージ構造の変更。\nVitestとPlaywrightを使ったStorybookテスト機能をStableに変更、パッケージサイズを48%削減。\nInteraction/Accessibility/Visualテスト機能の統合、Story生成機能、Tags-basedの管理機能の追加。\nVite-powered Next.js、Svelte 5、React Nativeの改善など","relatedLinks":[{"title":"Migration guide for Storybook 9.0 | Storybook docs","url":"https://storybook.js.org/docs/migration-guide?ref=storybookblog.ghost.io"}]},{"category":"SoftwareLibrary","title":"web-infra-dev/rstest: The testing framework powered by Rspack (WIP).","url":"https://github.com/web-infra-dev/rstest","tags":["test","library","JavaScript","rspack"],"content":"Rspackを使ったVitestのようなテストフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"aymericzip/intlayer: Internationalisation solution for JS application focusing on scalability. Make your JavaScript / TypeScript application multilingue.","url":"https://github.com/aymericzip/intlayer","tags":["React","Vue","Next.js","i18n","library"],"content":"React/Next.js/Vue などに対応したi18nフレームワーク。\nコード生成とロケールファイルを使った翻訳、ビジュアルエディタ、middlewareの提供、Markdownのサポートなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Nergie/no-barrel-file","url":"https://github.com/Nergie/no-barrel-file","tags":["JavaScript","Tools"],"content":"barrel importsを検知して修正できるツール","relatedLinks":[]}]},{"meta":{"title":"2025-06-26のJS: Biome v2、Vite 7.0、Chrome 138、Firefox 140","author":"azu","layout":"post","date":"2025-06-26T01:18:47.315Z","category":"JSer","tags":["ECMAScript","book","React","nodejs","JSON"],"url":"https://jser.info/2025/06/26/biome-v2-vite-7.0-chrome-138-firefox-140/"},"items":[{"category":"Headline","title":"Biome v2—codename: Biotype | Biome","url":"https://biomejs.dev/blog/biome-v2/","tags":["biome","ReleaseNote"],"content":"Biome v2リリース。\n設定ファイルのネストをサポート、Linterプラグインのサポート。\nImport OrganizerのようなLinterを範囲を超えたものを扱うAssist機能の追加、HTML formatterのサポート。\n破壊的変更として`--apply`/`--apply-unsafe`の廃止、設定ファイルの`include`/`ignore`から`includes`への変更など。","relatedLinks":[{"title":"Upgrade to Biome v2 | Biome","url":"https://biomejs.dev/guides/upgrade-to-biome-v2/"},{"title":"Changelog | Biome","url":"https://biomejs.dev/internals/changelog/#200"}]},{"category":"Headline","title":"React Native 0.80 - React 19.1, JS API Changes, Freezing Legacy Arch and much more · React Native","url":"https://reactnative.dev/blog/2025/06/12/react-native-0.80","tags":["React","Native","ReleaseNote"],"content":"React Native 0.80リリース。\nReact 19.1.0にアップデート、パス指定をしてインポートを行うDeep importsを非推奨化、Legacy Architectureの非推奨化。\niOS依存関係のprebuild機能を実験的にサポート、AndroidのAPKサイズの削減、JSCサポートをコミュニティパッケージに移動など","relatedLinks":[]},{"category":"Headline","title":"Prettier 3.6: Experimental fast CLI and new OXC and Hermes plugins! · Prettier","url":"https://prettier.io/blog/2025/06/23/3.6.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 3.6リリース。\n`--experimental-cli`で新しいCLIを利用可能に、`@prettier/plugin-oxc`/`@prettier/plugin-hermes`プラグインの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v4.0.0 · svg/svgo","url":"https://github.com/svg/svgo/releases/tag/v4.0.0","tags":["SVG","javas","library","ReleaseNote"],"content":"SVGO 4.0.0リリース。\nNode.js 14のサポート終了、デフォルトプラグインから`removeTitle`と`removeViewBox`を削除、`removeScriptElement`を`removeScripts`にリネーム。\nパッケージのインポート方法の変更など","relatedLinks":[]},{"category":"Headline","title":"Bun v1.2.17 | Bun Blog","url":"https://bun.sh/blog/bun-v1.2.17","tags":["Bun","ReleaseNote"],"content":"Bun v1.2.17リリース。\n`bun build`で`.html`ファイルをbundleできるように、`node:zlib`のサポート、`--unhandled-rejections`フラグのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Vite 7.0 is out! | Vite","url":"https://vite.dev/blog/announcing-vite7.html","tags":["vite","serverless"],"content":"Vite 7.0リリース。\n`require(esm)`が利用できるNode.js 20.19+/22.12+をサポート対象に変更。\nデフォルトのブラウザターゲットがBaseline Widely Availableに変更、SassのレガシーAPIのサポートを終了。\nEnvironment APIの拡張、非推奨機能の削除など。","relatedLinks":[{"title":"Migration from v6 | Vite","url":"https://vite.dev/guide/migration"}]},{"category":"Headline","title":"Node.js — Node v22.17.0 (LTS)","url":"https://nodejs.org/en/blog/release/v22.17.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.17.0リリース。\n`assert.partialDeepStrictEqual()`の安定化、HTTP/2 priority signalingの非推奨化。\n`IncomingMessage`などを`new`なしでのインスタンス化するのを非推奨、`child_process`の`shell=\"\"`の非推奨化。\n`fs.FileHandle.readableWebStream`の`autoClose`オプション、`fs.Dir`のExplicit Resource Management対応。\nPermissionsでエントリーポイントの暗黙的読み取り許可、`util.styleText()`の`'none'`でスタイルの削除の対応など","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node v24.3.0 (Current)","url":"https://nodejs.org/en/blog/release/v24.3.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v24.3.0リリース。\n`--experimental-transform-types`の警告を削除、`node:test`でプロパティのモックをサポート、`url.fileURLToPathBuffer()`を追加など","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 138  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/new-in-chrome-138","tags":["Chrome","ReleaseNote"],"content":"Chrome 138リリース。\nローカルのGemini Nanoを使ったTranslator/Language Detector/Summarizer APIを追加。\nCSSでは、`abs()`/`sign()`/`progress()`/`sibling-index()`/`sibling-count()`を追加。\n`width`プロパティで`stretch`キーワードをサポート、CSS環境変数でOS レベルのフォントスケール（`env(preferred-text-scale)`）をサポート。\nViewport Segments APIで折りたたみデバイスに対応、`Clear-Site-Data`ヘッダーに`prefetchCache`/`prerenderCache`値を追加。\nHTML属性値の`<`/`>`のエスケープ対応など。","relatedLinks":[{"title":"Chrome 138  |  Release notes  |  Chrome for Developers","url":"https://developer.chrome.com/release-notes/138"}]},{"category":"Headline","title":"Firefox 140.0, See All New Features, Updates and Fixes","url":"https://www.mozilla.org/en-US/firefox/140.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 140リリース。\nCSS Custom Highlight APIのサポート、Cookie Store APIで非同期cookie操作をサポート。\n低遅延なポインターの移動を検知する`pointerrawupdate`イベントのサポート、SVGの`fetchpriority`属性をサポート。\nPrivate Browsingモードでもservice worker利用可能に、HTML属性シリアライズ時の`<`/`>`エスケープ対応。\n`<h1>`要素のUA styleの変更（セクション要素ネスト時のサイズ変化を廃止）、MutationEventインターフェースの削除","relatedLinks":[]},{"category":"Article","title":"JSON module scripts are now Baseline Newly available  |  Blog  |  web.dev","url":"https://web.dev/blog/json-imports-baseline-newly-available?hl=en","tags":["ECMAScript","JSON","article"],"content":"JSON moduleがBaselineとなった","relatedLinks":[]},{"category":"SoftwareLibrary","title":"modelcontextprotocol/use-mcp","url":"https://github.com/modelcontextprotocol/use-mcp","tags":["React","MCP","library"],"content":"MCPサーバとの接続管理をするReact Hooks","relatedLinks":[]},{"category":"Book","title":"Astro フロントエンド開発の教科書 | 技術評論社","url":"https://gihyo.jp/book/2025/978-4-297-15008-2","tags":["JavaScript","book"],"content":"2025年7月7日発売\nAstroについての書籍","relatedLinks":[]},{"category":"Book","title":"Exploring JavaScript (ES2025 Edition)","url":"https://exploringjs.com/js/","tags":["ECMAScript","book"],"content":"Exploring JavaScript ES2025 Editionのリリース","relatedLinks":[]}]},{"meta":{"title":"2025-07-04のJS: ECMAScript 2025、Rspack 1.4、Deno 2.4、Bundle Sizeの改善","author":"azu","layout":"post","date":"2025-07-04T02:54:31.532Z","category":"JSer","tags":["React","css","rspack","Chrome","ECMAScript"],"url":"https://jser.info/2025/07/04/ecmascript-2025-rspack-1.4-deno-2.4-bundle-size/"},"items":[{"category":"Headline","title":"Announcing Rspack 1.4 - Rspack","url":"https://rspack.rs/blog/announcing-1-4","tags":["rspack","ReleaseNote"],"content":"Rspack 1.4 リリース。\nWasm を利用してブラウザ環境での実行サポート、bundle size の改善。\nデフォルトで Incremental build を有効化。\n実験的な CssChunkingPlugin の追加、MultiCompiler で lazy compilation をサポート、`useInputFileSystem`オプションをサポート。\nPerfetto ベースのパフォーマンス分析ツール、Zod v4 への更新など","relatedLinks":[]},{"category":"Headline","title":"Chrome 139 beta  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/chrome-139-beta?hl=en","tags":["Chrome","ReleaseNote"],"content":"Chrome 139 beta リリース。\nCSS では、`var()`/`attr()`の短絡評価のサポート、`caret-animation`/`corner-shape`/CSS Custom Functions のサポート。\nWHATWG の仕様に合わせて`+json`の JSON MIME type をサポート。\nOrigin trials で Prompt API、WebGPU Compatibility mode の追加。\nmacOS 11 サポート終了、ISO-2022-JP の自動検出の削除など","relatedLinks":[{"title":"Intent to Ship: Spec-compliant JSON MIME type detection","url":"https://groups.google.com/a/chromium.org/g/blink-dev/c/-lZFLXH7_Y8/m/ZzgLXc91AQAJ"}]},{"category":"Headline","title":"Ecma International approves new standards - Ecma International","url":"https://ecma-international.org/news/ecma-international-approves-new-standards-11/","tags":["ECMAScript","news"],"content":"ECMAScript 2025 が Ecma の GA で承認され正式にリリースされた。","relatedLinks":[{"title":"Release ES2025 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2025"}]},{"category":"Headline","title":"Release 0.14.0 | StyleX","url":"https://stylexjs.com/blog/v0.14.0","tags":["React","css","library"],"content":"StyleX v0.14.0 リリース。\n`viewTransitionClass` API を追加、lint に`validImports`オプションを追加。\n破壊的な変更としてスタイルをマージするときの戦略を設定する`styleResolution`オプションのデフォルト値を`application-order`から`property-specificity`に変更","relatedLinks":[]},{"category":"Headline","title":"Electron 37.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-37-0","tags":["Electron","ReleaseNote"],"content":"Electron 37.0 リリース。\nChromium 138.0.7204.35/Node 22.16.0/V8 13.8 にアップデート。\n`window.open`で`innerWidth`と`innerHeight`オプションをサポート、Node.js の`--experimental-network-inspection`をサポート。\nunhandled rejection 動作変更、WebUSB/WebSerial API の blocklist サポートなど。","relatedLinks":[]},{"category":"Headline","title":"Deno 2.4: deno bundle is back | Deno","url":"https://deno.com/blog/v2.4","tags":["deno","ReleaseNote"],"content":"Deno v2.4 リリース。\n`deno bundle`コマンドの復活/テキストの`byte`インポート機能/OpenTelemetry の安定化。  \n`--preload`フラグの追加/`deno update`コマンドの追加/`DENO_COMPAT`環境変数の追加、package.json の conditional exports をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v3.0.0 · recharts/recharts","url":"https://github.com/recharts/recharts/releases/tag/v3.0.0","tags":["React","graphic","library"],"content":"Recharts 3 リリース。\nCustom components のサポート、デフォルトで`accessibilityLayera11y`を有効に変更など","relatedLinks":[{"title":"3.0 migration guide · recharts/recharts Wiki","url":"https://github.com/recharts/recharts/wiki/3.0-migration-guide#breaking-code-changes"}]},{"category":"Headline","title":"dahlia/logtape: Simple logging library with zero dependencies for Deno, Node.js, Bun, browsers, and edge functions","url":"https://github.com/dahlia/logtape?tab=readme-ov-file","tags":["nodejs","JavaScript","library","ReleaseNote"],"content":"ロガーライブラリ。\nライブラリとアプリケーションの利用を想定していて、Node.js/Deno/Browser などで動作し、構造化ログをサポートしている。\nまた、pino や winston などの別のロガーとの Integration を行う Adapter を提供している","relatedLinks":[]},{"category":"Article","title":"CSS conditionals with the new if() function  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/if-article?hl=en","tags":["css","article"],"content":"CSS の`if()`関数について。\nプロパティの値に対して`if()`と`style()`/`media()`/`suports()`を使った条件分岐を書く方法について","relatedLinks":[]},{"category":"Article","title":"How We Reduced CKEditor’s Bundle Size by 40% | CKEditor","url":"https://ckeditor.com/blog/how-we-reduced-ckeditor-bundle-size/","tags":["JavaScript","bundler","article"],"content":"CKEditor 5 の bundle size 最適化について。\nバージョンずれの対策として re-export でパッケージをまとめたパッケージを公開していたが tree-shaking が効かずに bundle サイズの問題が起きた。\n`/* #__PURE__ */`コメントの活用、ES2022 への target 変更、`sideEffects`フラグの設定などを行う tree shaking の問題を解決していった話。\nまた、Sonda を使った bundle 分析について","relatedLinks":[{"title":"Sonda","url":"https://sonda.dev/"}]},{"category":"Article","title":"\\`useOptimistic\\` to Make Your App Feel Instant | Epic React by Kent C. Dodds","url":"https://www.epicreact.dev/use-optimistic-to-make-your-app-feel-instant-zvyuv","tags":["React","article"],"content":"React の`useOptimistic` hooks の使い方や`setState`との違いについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"photostructure/tz-lookup: JavaScript Library for Timezone Lookup by Location","url":"https://github.com/photostructure/tz-lookup","tags":["JavaScript","library"],"content":"緯度経度からタイムゾーンを検索するライブラリ","relatedLinks":[]}]},{"meta":{"title":"2025-07-12のJS: TypeScript 5.9 Beta、i18nとローカライズ、Node.jsのモダンな機能","author":"azu","layout":"post","date":"2025-07-12T07:52:38.994Z","category":"JSer","tags":["TypeScript","nodejs","MCP","Vue","vercel"],"url":"https://jser.info/2025/07/12/typescript-5.9-beta-i18n-node.js/"},"items":[{"category":"Headline","title":"Announcing TypeScript 5.9 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-9-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.9 Betaリリース。\n`tsc --init`で生成する設定を変更、`import defer`のサポート、`--module node20`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"The future of Nuxt​ · nuxt/nuxt · Discussion #32559","url":"https://github.com/nuxt/nuxt/discussions/32559","tags":["Vue","vercel","news"],"content":"Nuxt.jsを開発してるNuxtLabsがVercelに買収された","relatedLinks":[{"title":"NuxtLabs joins Vercel - Vercel","url":"https://vercel.com/blog/nuxtlabs-joins-vercel"}]},{"category":"Headline","title":"Node.js — Node v24.4.0 (Current)","url":"https://nodejs.org/en/blog/release/v24.4.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v24.4.0リリース。\n`fs.mkdtempDisposableSync`の追加、`--watch-kill-signal`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v5.100.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.100.0","tags":["webpack","ReleaseNote"],"content":"webpack v5.100.0リリース。\nHMRのES Modules outputのサポート、`using`のサポート、Defer Module Evaluationのサポート。\n`virtual:`スキーマをサポートするVirtualUrlPluginを追加など","relatedLinks":[]},{"category":"Headline","title":"Release v1.54.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.54.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.54.0リリース。\n`partitionKey`オプションの追加、html reporterに`noSnippets`オプションを追加。\n`--user-data-dir`フラグでユーザーデータディレクトリを指定できるようになるなど","relatedLinks":[]},{"category":"Article","title":"Modern JavaScript in NGINX: QuickJS Engine Support for njs – NGINX Community Blog","url":"https://blog.nginx.org/blog/quickjs-engine-support-for-njs","tags":["nginx","JavaScript","article"],"content":"NGINXのnjsはQuickJSのエンジンを選択して利用できるようになった","relatedLinks":[]},{"category":"Article","title":"JavaScript scope hoisting is broken","url":"https://devongovett.me/blog/scope-hoisting.html","tags":["JavaScript","bundler","article"],"content":"Rollupなどが行うScope Hoistingは、Code splittingと概念が反発しあっているという問題について。\nモジュールの実行順序の問題やモジュールを関数でラップした時の最適化の問題についてなど","relatedLinks":[]},{"category":"Article","title":"4 Untranslatable Words Behind Patreon's Internationalization Overhaul","url":"https://www.patreon.com/posts/133137028","tags":["i18n","JavaScript","article"],"content":"ローカライズされるコンテンツを作成するときに気をつけることについて。\n\n- 条件式で文を分けるときは、完全な文として分ける\n- 数値表現は常にIntlを利用する\n- 複数系の表現もローカライズする\n\nローカライズシステム移行時に起きた問題や解決方法についてなど","relatedLinks":[]},{"category":"Article","title":"Modern Node.js Patterns for 2025","url":"https://kashw1n.com/blog/nodejs-2025/","tags":["nodejs","article"],"content":"最近のNode.jsで利用できる機能について。\nESM、`node:` prefix、built-in fetch APIやtesting frameworkの使用、top-level await。\nWorker threadsによる並列処理、AbortControllerによるキャンセル処理、async iteratorsによるイベント処理。\nPermission model、import mapsによるモジュール解決、Single Executable Applicationsによる単一実行可能ファイルの作成などについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"xmcp — The TypeScript MCP framework","url":"https://xmcp.dev/","tags":["TypeScript","MCP","library"],"content":"TypeScriptのMCPサーバフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"typescript-eslint/tsgolint: ✨ Experimental proof-of-concept typescript-go powered JS/TS linter written in Go","url":"https://github.com/typescript-eslint/tsgolint","tags":["TypeScript","ESLint","library"],"content":"TSLintのルールをtsgoで動くようにしてどれぐらい早くなるかの試験的な実装。\nESLintのASTへの変換をせずにTS ASTをそのまま扱うようにする変更も行なっていて、20-40倍程度早くチェックできている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"josdejong/jsonrepair: Repair invalid JSON documents","url":"https://github.com/josdejong/jsonrepair","tags":["JSON","JavaScript","library"],"content":"InvalidなJSON文字列をJSONに修復するツール","relatedLinks":[]}]},{"meta":{"title":"2025-07-21のJS: Nuxt 4.0、Next.js 15.4、npmのパッケージメンテナーを狙ったフィッシング","author":"azu","layout":"post","date":"2025-07-21T08:39:23.768Z","category":"JSer","tags":["React","editor","Vue","vite","test"],"url":"https://jser.info/2025/07/21/nuxt-4.0-next.js-15.4-npm/"},"items":[{"category":"Headline","title":"Release v3.0.1 · ueberdosis/tiptap","url":"https://github.com/ueberdosis/tiptap/releases/tag/v3.0.1","tags":["JavaScript","editor","library"],"content":"tiptap v3.0.1リリース。\ntsupへの移行でUMDビルドサポート廃止、型定義の改善。\nMarkViews追加、`editor.unmount()`メソッドの追加、SSRモードでのエディタ利用サポート。\nTippy.jsからFloating UIへの移行、React 19対応、`@tiptap/extensions`に拡張機能をまとめるなど","relatedLinks":[]},{"category":"Headline","title":"Announcing Nuxt 4.0 · Nuxt Blog","url":"https://nuxt.com/blog/v4","tags":["Vue","library","ReleaseNote"],"content":"Nuxt v4リリース。\n新しいプロジェクト構造として`app/`ディレクトリがデフォルトに。\n`useAsyncData`と`useFetch`が同じキーでキャッシュを共有するように、`useFetch`などがデフォルトでshallow equalに変更。\nTypeScriptの設定ファイルを`app`/`server`/`node`/`shared`用にそれぞれ作成するように、CLIの改善など","relatedLinks":[{"title":"Upgrade Guide · Get Started with Nuxt v4","url":"https://nuxt.com/docs/4.x/getting-started/upgrade"}]},{"category":"Headline","title":"Release v0.25.7 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.25.7","tags":["esbuild","ReleaseNote"],"content":"esbuild v0.25.7リリース。\n`import defer`と`import source`をサポート、`--abs-paths=` flagを追加、特定の条件における文字列定数のinline化のサポート。","relatedLinks":[]},{"category":"Headline","title":"Next.js 15.4 | Next.js","url":"https://nextjs.org/blog/next-15-4","tags":["Next.js","ReleaseNote"],"content":"Next.js 15.4リリース。\nTurbopackが全てのIntegration Testを通るように、Next.js 16に向け機能をexperimentalフラグで利用できるように。","relatedLinks":[]},{"category":"Headline","title":"Active Supply Chain Attack: npm Phishing Campaign Leads to P...","url":"https://socket.dev/blog/npm-phishing-campaign-leads-to-prettier-tooling-packages-compromise","tags":["npm","security","news"],"content":"npmパッケージを狙ったフィッシングキャンペーンが増加しているという話。\n次のnpmパッケージにマルウェアが含まれるため、該当するバージョンを利用している場合は対応が必要となる。\n\n- eslint-config-prettier: 8.10.1, 9.1.1, 10.1.6, 10.1.7\n- eslint-plugin-prettier: 4.2.2, 4.2.3\n- synckit: 0.11.9\n- @pkgr/core: 0.2.8\n- napi-postinstall: 0.3.1\n- is: 3.3.1\n\n関連: ","relatedLinks":[{"title":"Jordan Harband on X: ","url":"https://x.com/ljharb/status/1946636509601538233"}]},{"category":"Article","title":"vitestではbeforeEachを使わない","url":"https://blog.koh.dev/2025-07-11-vitest-beforeeach/","tags":["vite","JavaScript","test","article"],"content":"beforeEach + letではなく、`test.extends`を使ったTest Contextを使うことで、実際にアクセスするテストケースだけで準備をする方法について","relatedLinks":[]},{"category":"Article","title":"The world’s longest React hooks migration | by Chris Krogh | Jul, 2025 | The Craft","url":"https://craft.faire.com/the-worlds-longest-react-hooks-migration-8f357cdcdbe9","tags":["React","article"],"content":"React Class Component + MobxからReact Hooksへの移行について。\nGritQLを使ったマイグレーション、手動での移行とレビューについてなど","relatedLinks":[]},{"category":"Article","title":"The History of React Through Code | Playful Programming","url":"https://playfulprogramming.com/posts/react-history-through-code","tags":["React","article","history"],"content":"ReactのAPIの変遷やアーキテクチャについて。\nJSX/VDOM、Class Component、Hooks。Fiber、Suspense/`use`、React Server Componentについて","relatedLinks":[]},{"category":"Article","title":"Parsing 1 Billion Rows in Bun/Typescript Under 10 Seconds","url":"https://www.taekim.dev/writing/parsing-1b-rows-in-bun","tags":["Bun","JavaScript","article"],"content":"Bunで10億行のファイルを効率的に読み取る方法についての話","relatedLinks":[]},{"category":"SlideVideo","title":"Vanilagy/mediabunny: Pure TypeScript media toolkit for reading, writing, and converting video and audio files, directly in the browser.","url":"https://github.com/Vanilagy/mediabunny","tags":["JavaScript","video","audio","library"],"content":"WebCodecs APIを使ったメディアの読み書きや変換を行うライブラリ。\nWebCodecs APIを使ったメディアデータのEncode/Decodeを行い、そのデータをコンテナに読み書きするMuxerの処理を行う","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ArnaudBarre/tsl: An extension of tsc for type-aware linting","url":"https://github.com/ArnaudBarre/tsl","tags":["TypeScript","plugin","ESLint"],"content":"TypeScriptプラグインとしてtypescript-eslintのような型情報を使ったLintを実装している。\n型チェックと同時にTypeScriptのASTを使ったLintができる","relatedLinks":[]}]},{"meta":{"title":"2025-07-31のJS: Nuxt 3.18、Bun v1.2.19、SVG入門","author":"azu","layout":"post","date":"2025-07-30T15:46:45.929Z","category":"JSer","tags":["React","HTML","TypeScript","document","Survey"],"url":"https://jser.info/2025/07/31/nuxt-3.18-bun-v1.2.19-svg/"},"items":[{"category":"Headline","title":"Release v0.34.0 · nodejs/corepack","url":"https://github.com/nodejs/corepack/releases/tag/v0.34.0","tags":["nodejs","ReleaseNote"],"content":"corepack v0.34.0リリース。\nNode.js 18とNode.js 23のサポート終了","relatedLinks":[]},{"category":"Headline","title":"Release v5.8.0 · gvergnaud/ts-pattern","url":"https://github.com/gvergnaud/ts-pattern/releases/tag/v5.8.0","tags":["TypeScript","library","ReleaseNote"],"content":"ts-pattern 5.8.0リリース。\n`.narrwo()`メソッドの追加など","relatedLinks":[]},{"category":"Headline","title":"npm &#039;accidentally&#039; removes Stylus package, breaks builds and pipelines","url":"https://www.bleepingcomputer.com/news/security/npm-accidentally-removes-stylus-package-breaks-builds-and-pipelines/","tags":["npm","security","news"],"content":"`stylus`パッケージがnpmから消えた問題について。\n関連するメンテナーが悪意あるパッケージを公開した件に巻き込まれて、一時的にnpmから削除されていた。現在は元に戻っている","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.9 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-9-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.9 RCリリース。\n`tsc --init`で生成する設定を変更、`import defer`のサポート、`--module node20`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Nuxt 3.18 · Nuxt Blog","url":"https://nuxt.com/blog/v3-18","tags":["Vue","library","ReleaseNote"],"content":"Nuxt v3.18リリース。\n遅延ハイドレーション用のLazy Hydration Macros、`<NuxtRouteAnnouncer>`によるアクセシビリティ改善、Chrome DevToolsワークスペース統合の追加。  \n`onWatcherCleanup`のauto-import、パフォーマンスの改善など","relatedLinks":[]},{"category":"Headline","title":"Bun v1.2.19 | Bun Blog","url":"https://bun.sh/blog/bun-v1.2.19","tags":["Bun","ReleaseNote"],"content":"Bun v1.2.19リリース。\n`bun install --linker=isolated`のサポート、`bun update --interactive`でインタラクティブに依存関係の更新の対応、`bun pm pkg`の追加。\n`process.features.typescript`のサポート、`fs.glob`の`exclude`オプションサポートなど","relatedLinks":[]},{"category":"Article","title":"State of HTML 2025","url":"https://survey.devographics.com/en-US/survey/state-of-html/2025","tags":["HTML","Survey"],"content":"State of HTML 2025のアンケート募集が開始された","relatedLinks":[]},{"category":"Article","title":"A Friendly Introduction to SVG • Josh W. Comeau","url":"https://www.joshwcomeau.com/svg/friendly-introduction-to-svg/","tags":["SVG","article"],"content":"SVGの基本的な概念を手書きしながら紹介している記事。  \n基本図形、スケーラブルな仕組み、viewBoxの使い方、stroke属性を使ったアニメーションについて。","relatedLinks":[]},{"category":"Article","title":"最近のHTMLを改めてちゃんと学んでみた","url":"https://zenn.dev/dinii/articles/16b3e71b580b6c","tags":["HTML","article"],"content":"最近のHTMLの機能について。\n\n- Popover API\n- dialog要素\n- details要素\n- inert属性\n- search要素\n- loading属性\n- fetchpriority属性\n- blocking属性\n- inputmode属性\n- enterkeyhint属性\n- rel属性","relatedLinks":[]},{"category":"Article","title":"How Parcel bundles React Server Components","url":"https://devongovett.me/blog/parcel-rsc.html","tags":["parcel","React","article"],"content":"ParcelでReact Server Components（RSC）をバンドルする仕組みについて。  \nCode Spilttingによるbundleの分割とDynamic Importによるネットワークウォーターフォールの問題について。\nRSCでは、この問題をコードの構造を変えずに解決している点について","relatedLinks":[]},{"category":"Article","title":"Stop Re-Rendering — TanStack DB, the Embedded Client Database for TanStack Query | TanStack Blog","url":"https://tanstack.com/blog/tanstack-db-0.1-the-embedded-client-database-for-tanstack-query","tags":["JavaScript","database","HTTP","article"],"content":"TanStack DBというクライアント側のDBとバックエンドのDBを同期するクエリエンジンについて","relatedLinks":[]},{"category":"SlideVideo","title":"Why Is Everyone Talking About Lynx? The Architect’s Breakdown - YouTube","url":"https://www.youtube.com/watch?v=l2dByiwiQcM","tags":["React","Native","video"],"content":"Lynxについて。\nLynxのネイティブUI、起動速度を早くする仕組み、Main Thread JSとBackground Threadについて。\nTikTokのUIフレームワークを2025年後半にリリース予定。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Incremental Adoption – React","url":"https://react.dev/learn/react-compiler/incremental-adoption","tags":["React","document"],"content":"React Compilerの新しいドキュメントが公開された","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Vanilla JavaScript support for Tailwind Plus - Tailwind CSS","url":"https://tailwindcss.com/blog/vanilla-js-support-for-tailwind-plus","tags":["css","JavaScript","library"],"content":"`@tailwindplus/elements`が公開された。\nTailwind UI Componentsの動作を特定のフレームワークに依存しないで動かすためのランタイムライブラリ","relatedLinks":[]}]},{"meta":{"title":"2025-08-07のJS: Node.js v22.18.0 (LTS)、TypeScript 5.9、Panda CSS v1","author":"azu","layout":"post","date":"2025-08-07T14:55:45.648Z","category":"JSer","tags":["nodejs","npm","css","TypeScript","vlt"],"url":"https://jser.info/2025/08/07/node.js-v22.18.0-lts-typescript-5.9-panda-css-v1/"},"items":[{"category":"Headline","title":"Node.js — Node.js v22.18.0 (LTS)","url":"https://nodejs.org/en/blog/release/v22.18.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.18.0リリース。\n`--experimental-strip-types`のフラグなしに、TypeScriptの型を取り除いて実行できるように。\nフラグで無効化したい場合`--no--experimental-strip-types`を指定する","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node.js v24.5.0 (Current)","url":"https://nodejs.org/en/blog/release/v24.5.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v24.5.0リリース。\nOpenSSL 3.5 にアップグレード、`--experimental-wasm-modules`のフラグを外してWasmモジュールをデフォルトでサポート。\n`NODE_USE_ENV_PROXY=1`の指定で`node:http`/`node:https`がビルトインプロキシサポート、Web Locks APIの実装など","relatedLinks":[{"title":"src: add web locks api by IlyasShabi · Pull Request #58666 · nodejs/node","url":"https://github.com/nodejs/node/pull/58666"}]},{"category":"Headline","title":"Release v10.0.0 · kentcdodds/cross-env","url":"https://github.com/kentcdodds/cross-env/releases/tag/v10.0.0","tags":["nodejs","library","ReleaseNote"],"content":"cross-env 10.0.0リリース。\nNode.js 18のサポート終了、ESMで書き直しなどのメンテナンスリリース","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 10.14 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.14.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.14.0リリース。\n`devEngines.runtime`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release 0.15.0 | StyleX","url":"https://stylexjs.com/blog/v0.15.0","tags":["React","css","library"],"content":"StyleX v0.15.0リリース。\n`enableMediaQueryOrder`でMedia Queryのソート順を自動的に行う、Dynamic stylesの改善など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 5.9 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-5-9/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 5.9リリース。\n`tsc --init`で生成する設定を変更、`import defer`のサポート、`--module node20`のサポート、DOM APIの説明コメントを追加など","relatedLinks":[]},{"category":"Headline","title":"🐼 Panda v1 🎊 · chakra-ui/panda · Discussion #3321","url":"https://github.com/chakra-ui/panda/discussions/3321","tags":["css","TypeScript","library","ReleaseNote"],"content":"Panda CSS 1.0.0リリース。\nTypeScriptでスタイルを書くCSS in JSフレームワーク。ビルド時にスタイルを生成するため、Runtimeなしに動作する","relatedLinks":[]},{"category":"Headline","title":"Release oxlint v1.10.0 · oxc-project/oxc","url":"https://github.com/oxc-project/oxc/releases/tag/oxlint_v1.10.0","tags":["ReleaseNote","ESLint"],"content":"oxlint 1.10.0リリース。","relatedLinks":[]},{"category":"Headline","title":"Release @sveltejs/kit@2.27.0 · sveltejs/kit","url":"https://github.com/sveltejs/kit/releases/tag/%40sveltejs%2Fkit%402.27.0","tags":["Svelte","ReleaseNote"],"content":"svelte kit 2.27.0リリース。\nRemote Functionsの追加","relatedLinks":[{"title":"Remote Functions · sveltejs/kit · Discussion #13897","url":"https://github.com/sveltejs/kit/discussions/13897"},{"title":"Remote functions • Docs • Svelte","url":"https://svelte.dev/docs/kit/remote-functions"}]},{"category":"Article","title":"Centralized Dependency Management Made Simple","url":"https://blog.vlt.sh/blog/catalogs","tags":["vlt","npm","article"],"content":"vltがcatalogをサポート。\npnpm catalogのように`vlt.json`ファイルで依存関係を一箇所で管理できる。","relatedLinks":[]},{"category":"Article","title":"命令的な ARIA ライブリージョン：ARIA Notifyの紹介","url":"https://zenn.dev/mehm8128/articles/aria-notify-introduction","tags":["JavaScript","HTML","accessibility","article"],"content":"ARIA Notify API について","relatedLinks":[]},{"category":"Article","title":"npm trusted publishing with OIDC is generally available - GitHub Changelog","url":"https://github.blog/changelog/2025-07-31-npm-trusted-publishing-with-oidc-is-generally-available/","tags":["npm","security","article"],"content":"GitHub ActionsやGitLab CI/CDからOIDCでnpm publishができるように。\nCIにsecretsとしてnpm registryのtokenを入れなくても、npm側のTrusted Publisherの設定によりCIからpublishができるようになっている。\nnpm 11.5.1以降が必要","relatedLinks":[]},{"category":"Article","title":"How we made JSON.stringify more than twice as fast · V8","url":"https://v8.dev/blog/json-stringify","tags":["V8","article"],"content":"V8の`JSON.stringify`の高速化について。\n次の条件を満たすときに、stringifyの高速パスが通るようになる\n\n- `JSON.stringify`のオプションを使わない\n- `toJSON`を使わない\n- Array-likeなオブジェクトを含まない","relatedLinks":[]},{"category":"SoftwareLibrary","title":"shuding/bidc: Bidirectional Channels for JavaScript","url":"https://github.com/shuding/bidc","tags":["JavaScript","library"],"content":"ComlinkのようにWeb Workerやiframeなど異なるコンテキストとのやりとりを行うライブラリ。\n自動的に接続/再接続、devalueを使った様々なデータを送受信できるようにしている","relatedLinks":[]}]},{"meta":{"title":"2025-08-21のJS: Next.js 15.5、rslint/Oxlint、jsprimer v7.0.0(ES2025)","author":"azu","layout":"post","date":"2025-08-20T15:09:07.952Z","category":"JSer","tags":["TypeScript","ESLint","Bun","jQuery","chart"],"url":"https://jser.info/2025/08/21/next.js-15.5-rslintoxlint-jsprimer-v7.0.0es2025/"},"items":[{"category":"Headline","title":"Bun v1.2.20 | Bun Blog","url":"https://bun.sh/blog/bun-v1.2.20","tags":["Bun","ReleaseNote"],"content":"Bun v1.2.20リリース。\n`yarn.lock`のマイグレーションに対応、`expectTypeOf`を追加、`bun update --interactive --recursive`のサポート。Windows long pathのサポート、`WebAssembly.compileStreaming`と`WebAssembly.instantiateStreaming`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"jQuery 4.0.0 Release Candidate 1 | Official jQuery Blog","url":"https://blog.jquery.com/2025/08/11/jquery-4-0-0-release-candidate-1/","tags":["jQuery","ReleaseNote"],"content":"jQuery 4.0.0 Release Candidate 1リリース。\nIE11未満のサポートを終了し、古いIE向けのハックを削除。\n併せてPromiseサポートなどを前提にしたslim版をリリース。","relatedLinks":[]},{"category":"Headline","title":"ECharts 6 Features - What&#039;s New - Basics - Handbook - Apache ECharts","url":"https://echarts.apache.org/handbook/en/basics/release-note/v6-feature/","tags":["chart","JavaScript","library","ReleaseNote"],"content":"ECharts 6リリース。","relatedLinks":[{"title":"Release 6.0.0 · apache/echarts","url":"https://github.com/apache/echarts/releases/tag/6.0.0"}]},{"category":"Headline","title":"Release Biome CLI v2.2.0 · biomejs/biome","url":"https://github.com/biomejs/biome/releases/tag/%40biomejs%2Fbiome%402.2.0","tags":["biome","ReleaseNote"],"content":"Biome v2.2.0リリース。\n多数のlintルールのStableに変更とリネーム。\nQwik domainのサポート、.graphqlsファイル対応など。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node.js v24.6.0 (Current)","url":"https://nodejs.org/en/blog/release/v24.6.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v24.6.0リリース。\n`NODE_USE_SYSTEM_CA=1`の追加、` server.keepAliveTimeoutBuffer`オプションの追加、zstdCompress/zstdDecompressの辞書対応。\nNode.jsにpinoのような構造ログをサポートを入れるために、`Utf8Stream`の追加など。","relatedLinks":[]},{"category":"Headline","title":"Firefox 142.0, See All New Features, Updates and Fixes","url":"https://www.firefox.com/en-US/firefox/142.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 142リリース。\n`<object>`要素の非推奨な`codebase`属性を削除、Selection APIのshadow DOM境界を越えた範囲取得をサポート。\nURL Pattern APIのサポートPrioritized Task Scheduling APIの実装など","relatedLinks":[{"title":"Firefox 142 for developers","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/142"}]},{"category":"Headline","title":"Next.js 15.5 | Next.js","url":"https://nextjs.org/blog/next-15-5","tags":["Next.js","ReleaseNote"],"content":"Next.js 15.5リリース。\nTurbopackがベータに、Node.js MiddlewareとtypedRoutesがStableに変更。\n`LayoutProps`で型安全にルートを扱えるように、`next typegen`コマンドの追加。\n`next lint`コマンドを廃止、next/linkの`legacyBehavior`を非推奨に、AMPを非推奨にするなど","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 10.15 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.15.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.15.0リリース。\n未使用のcatalogを削除する`cleanupUnusedCatalogs`オプションを追加、`pnpm config get`の改善など","relatedLinks":[]},{"category":"Article","title":"Denoのフロントエンド開発の動向【2025年夏】","url":"https://zenn.dev/uki00a/articles/frontend-development-in-deno-2025-summer","tags":["deno","article"],"content":"Denoのフロントエンド周りのアップデートについて","relatedLinks":[]},{"category":"Article","title":"If I Wrote a Linter, Part 1: Architecture | Goldblog","url":"https://www.joshuakgoldberg.com/blog/if-i-wrote-a-linter-part-1-architecture/","tags":["TypeScript","ESLint","article"],"content":"Linterのアーキテクチャについて","relatedLinks":[]},{"category":"Article","title":"Oxlint Type-Aware Preview | The JavaScript Oxidation Compiler","url":"https://oxc.rs/blog/2025-08-17-oxlint-type-aware","tags":["TypeScript","ESLint","article"],"content":"`tsgolint`のforkをOxlintと統合して、Oxlintで型情報を使ったTypeScriptのLintをサポート。\n`typescript-go`にパッチを当てたものを利用するため、TypeScriptのバージョンに合わせたバージョンをインストールする必要がある。","relatedLinks":[{"title":"oxc-project/tsgolint: Type aware linting for oxlint","url":"https://github.com/oxc-project/tsgolint"},{"title":"web-infra-dev/rslint: 🚀 Go Faster. Go Typed","url":"https://github.com/web-infra-dev/rslint"}]},{"category":"SlideVideo","title":"State of CSS 2025","url":"https://2025.stateofcss.com/en-US","tags":["css","Survey"],"content":"State of CSS 2025についての開発者アンケートの結果が公開された。\nCSSの機能、フレームワーク、CSS in JS、Pre/Post Processor、ツール、リソースなどについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"web-infra-dev/rslint: 🚀 Go Faster. Go Typed","url":"https://github.com/web-infra-dev/rslint","tags":["TypeScript","ESLint","golang"],"content":"tsgoベースのTypeScript ESLint互換ルールを実装するツール。\nTypeScriptのコンパイル時にLint的なチェックを行う。tsgoのinternalの処理に乗ることで、TypeScriptのincremental buildのような複雑なキャッシュなどにも対応できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"redwoodjs/sdk: A React Framework for Cloudflare.","url":"https://github.com/redwoodjs/sdk","tags":["cloudflare","React","library"],"content":"Cloudflare Workers向けのReactフレームワーク。\nルーディングやReact Server Componnentをサポートしていて、コード生成や命名規則などに依存しない作りになっている","relatedLinks":[]},{"category":"Book","title":"JavaScript Primer v7.0.0リリース: ES2025対応とIterator Helpersの新章追加 | Web Scratch","url":"https://efcl.info/2025/08/18/jsprimer-v7/","tags":["JavaScript","book","ReleaseNote"],"content":"jsprimer v7リリース。\nES2025の対応として、イテレータとジェネレータ、`RegExp.escape`、Set Methods、Import Attributesなどの説明が追加されている。","relatedLinks":[]}]},{"meta":{"title":"2025-08-31のJS: Bun v1.2.21、Apollo Client v4、nxパッケージ侵害とサプライチェーン攻撃","author":"azu","layout":"post","date":"2025-08-31T09:33:32.067Z","category":"JSer","tags":["nodejs","ESLint","express","Bun","GraphQL"],"url":"https://jser.info/2025/08/31/bun-v1.2.21-apollo-client-v4-nx/"},"items":[{"category":"Headline","title":"ESLint v9.34.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2025/08/eslint-v9.34.0-released/","tags":["ESLint","ReleaseNote"],"content":"ESLint v9.34.0 リリース。\n`--concurrency=auto`で multithread linting のサポート","relatedLinks":[]},{"category":"Headline","title":"Bun v1.2.21 | Bun Blog","url":"https://bun.com/blog/bun-v1.2.21","tags":["Bun","ReleaseNote"],"content":"Bun v1.2.21 リリース。\n`Bun.SQL`が MySQL/MariaDB/SQLite/PostgreSQL を利用できるように、YAML のネイティブサポート、`Bun.secrets`の追加。\n\n`Bun.build` API で`--compile`をサポート、`bunx`が`--package`フラグをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release @apollo/client@4.0.0 · apollographql/apollo-client","url":"https://github.com/apollographql/apollo-client/releases/tag/%40apollo%2Fclient%404.0.0","tags":["JavaScript","library","ReleaseNote","GraphQL"],"content":"Apollo Client 4.0 リリース。\nReact 依存を`@apollo/client/react`に分離しコアをフレームワーク非依存化、`ApolloClient`で`link`必須化/`uri`等のショートカット削除など。\nエラーハンドリング刷新し`ApolloError`廃止しエラーごとに用意したクラスへ変更、Link は関数からクラス化、RxJS を標準 Observable 実装に採用。\n`dataState`プロパティでクエリ結果がわかるように、`@defer`のサポート、`localState`オプションの追加、React Compiler でコンパイル済みの Hooks の公開。\nTypeScript の名前空間型整理/厳格化とツリーシェイク改善、SSR API 刷新(`prerenderStatic`)。\n`useLazyQuery`の API の変更、`useQuery`から`onCompleted`と`onError`を削除。\nマイグレーションのための Codemod も提供している。","relatedLinks":[{"title":"Migrating to Apollo Client 4.0 - Apollo GraphQL Docs","url":"https://www.apollographql.com/docs/react/migrating/apollo-client-4-migration"}]},{"category":"Headline","title":"Malicious versions of Nx were published · Advisory · nrwl/nx","url":"https://github.com/nrwl/nx/security/advisories/GHSA-cxm3-wv7p-598c","tags":["nodejs","security","ReleaseNote"],"content":"`nx`パッケージのマルウェアを含むバージョンが公開された問題。\n次のバージョンには問題があるため、対応が必要になっている\n\n- 21.5.0\n- 20.9.0\n- 20.10.0\n- 21.6.0\n- 20.11.0\n- 21.7.0\n- 21.8.0\n- 20.12.0\n\n関連記事:","relatedLinks":[{"title":"Supply Chain Security Alert: Popular Nx Build System Package Compromised with Data-Stealing Malware - StepSecurity","url":"https://www.stepsecurity.io/blog/supply-chain-security-alert-popular-nx-build-system-package-compromised-with-data-stealing-malware"}]},{"category":"Headline","title":"Announcing Rspack 1.5 - Rspack","url":"https://rspack.rs/blog/announcing-1-5","tags":["rspack","ReleaseNote"],"content":"Rspack 1.5 リリース。\nNode.js 16 のサポート終了。\nBarrel file の最適化、`watchpack`の代わりにネイティブ実装を追加、`@rspack/browser`でブラウザでの bundle をサポート。\nRust で Rspack を拡張する binding をかけるように、定数のインライン化をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node.js v22.19.0 (LTS)","url":"https://nodejs.org/en/blog/release/v22.19.0","tags":["nodejs","rlee"],"content":"Node.js v22.19.0 リリース。\n`NODE_USE_SYSTEM_CA=1`を追加、`--experimental-wasm-modules`のフラグを外す変更、`zstdCompress`の辞書をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node.js v24.7.0 (Current)","url":"https://nodejs.org/en/blog/release/v24.7.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v24.7.0 リリース。\n`node:crypto`で Post-Quantum Cryptography として ML-KEM/ML-DSA をサポート、Web Cryptography API のサポートの改善。\nsingle executable applications で`execArgv`などフィールドのサポートなど","relatedLinks":[]},{"category":"Headline","title":"August 25, 2025 Release – React Spectrum Releases","url":"https://react-spectrum.adobe.com/releases/2025-08-25.html","tags":["React","library","ReleaseNote"],"content":"React Spectrum August 25, 2025 Release。\nPopover/Tooltip の origin-aware overlay アニメーション追加、Autocomplete を RC 化、`GridListSection`の追加など","relatedLinks":[]},{"category":"Article","title":"Run Express.js on Cloudflare Workers","url":"https://jross.me/run-express-js-on-cloudflare-workers/","tags":["nodejs","express","article"],"content":"Cloudflare Workers の`enable_nodejs_http_server_modules`フラグで express が動作するようになったという話","relatedLinks":[]},{"category":"Article","title":"The Power Of The Intl API: A Definitive Guide To Browser-Native Internationalization — Smashing Magazine","url":"https://www.smashingmagazine.com/2025/08/power-intl-api-guide-browser-native-internationalization/","tags":["i18n","JavaScript","article"],"content":"Intl API について","relatedLinks":[]},{"category":"Article","title":"The Complete Guide to Self-Hosting Next.js at Scale — @dlhck","url":"https://dlhck.com/thoughts/the-complete-guide-to-self-hosting-nextjs-at-scale","tags":["Next.js","article"],"content":"Next.js をセルフホスティングする時に気をつけるべき点についてや設定についてなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sidequestjs/sidequest: Sidequest is a modern, scalable background job processor for Node.js applications.","url":"https://github.com/sidequestjs/sidequest","tags":["nodejs","library"],"content":"Node.js でバックグラウンドジョブを処理するライブラリ。\n`node:worker_threads`を使った実装になっている","relatedLinks":[{"title":"Sidequest.js","url":"https://sidequestjs.com/posts/intro-to-sidequest/"}]},{"category":"SoftwareLibrary","title":"adamhl8/filterql: A tiny query language for filtering structured data","url":"https://github.com/adamhl8/filterql","tags":["JavaScript","library","search"],"content":"データのスキーマを定義して、検索を行う DSL を提供するライブラリ。\n一致検索、比較、ソートなどを行う検索演算子に対応している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"image-js/image-js: Image processing and manipulation in JavaScript","url":"https://github.com/image-js/image-js","tags":["JavaScript","Image","library"],"content":"JavaScript で画像処理を行うライブラリ。\nNode.js とブラウザで動作し、PNG/JPEG/TIFF などの画像の読み書きや、ピクセル単位の処理、フィルター、マスクなど画像処理を提供している","relatedLinks":[]}]},{"meta":{"title":"2025-09-09のJS: Zod 4.1.0、`debug`や`chalk`パッケージの侵害、monorepoなアプリを`node --experimental-strip-types`へ移行","author":"azu","layout":"post","date":"2025-09-09T09:02:57.249Z","category":"JSer","tags":["TypeScript","nodejs","browser","npm","security"],"url":"https://jser.info/2025/09/09/zod-4.1.0-debugchalk-monoreponode-experimental-strip-types/"},"items":[{"category":"Headline","title":"Release v4.1.0 · colinhacks/zod","url":"https://github.com/colinhacks/zod/releases/tag/v4.1.0","tags":["JavaScript","TypeScript","library","ReleaseNote"],"content":"zod 4.1.0リリース。\nencode/decodeを定義するCodecs APIを追加、`.safeExtend()`を追加、`z.has()`/`z.hex()`を追加など","relatedLinks":[{"title":"Introducing Zod Codecs","url":"https://colinhacks.com/essays/introducing-zod-codecs"}]},{"category":"Headline","title":"Fresh 2.0 Graduates to Beta, Adds Vite Support | Deno","url":"https://deno.com/blog/fresh-and-vite","tags":["deno","vite","ReleaseNote"],"content":"Fresh 2.0 Betaリリース。\nViteを使ったHMRの対応、`react`のaliasの対応、`<Head>`の追加など","relatedLinks":[]},{"category":"Headline","title":"Nuxt 4.1 · Nuxt Blog","url":"https://nuxt.com/blog/v4-1","tags":["Vue","library","ReleaseNote"],"content":"Nuxt v4.1リリース。\nImport Mapを使ったchunkのキャッシュの改善、実験的なRolldownのサポート、`getLayerDirectories`の追加など","relatedLinks":[]},{"category":"Article","title":"fetch() では Host ヘッダーを設定できないし話はそこまで単純じゃない - Object.create(null)","url":"https://susisu.hatenablog.com/entry/2025/08/31/190757","tags":["browser","Fetch","nodejs","article"],"content":"Fetch APIとHostヘッダーについて。\nサーバサイドの実行環境であるNode.js/Deno/Claudflare Workersなどの挙動について","relatedLinks":[]},{"category":"Article","title":"tsx と Node.js Type Stripping の違い - mizdra&#039;s blog","url":"https://www.mizdra.net/entry/2025/08/28/122040","tags":["TypeScript","article"],"content":"`tsx`パッケージとNode.jsのType Strippingの挙動の違いについて","relatedLinks":[]},{"category":"Article","title":"Why I Won’t Use JSDOM | Epic Web Dev","url":"https://www.epicweb.dev/why-i-won-t-use-jsdom","tags":["JavaScript","DOM","test","article"],"content":"JSDOMの制限とブラウザでのコンポーネントテストについて","relatedLinks":[]},{"category":"Article","title":"npm Trusted PublishingでOIDCを使ってトークンレスでCIからnpmパッケージを公開する | Web Scratch","url":"https://efcl.info/2025/09/07/npm-oidc/","tags":["npm","security","article"],"content":"npm Trusted PublishingとOIDCによるトークンレスなCI/CDからのnpmパッケージ公開について。\n設定手順、ブラウザで完結するリリースフロー、\n新規/既存/monorepoパッケージの運用方法、GitHubのProtectionの設定などについて","relatedLinks":[]},{"category":"Article","title":"npm debug and chalk packages compromised","url":"https://www.aikido.dev/blog/npm-debug-and-chalk-packages-compromised","tags":["npm","security","article"],"content":"`debug`や`chalk`など著名なnpmパッケージにブラウザで動作するマルウェアを含むバージョンが公開された問題について。\n\n現在はnpm registryから該当のバージョンは削除されている。\n次のパッケージのバージョン影響を受けていた。","relatedLinks":[]},{"category":"Article","title":"Bringing Node.js HTTP servers to Cloudflare Workers","url":"https://blog.cloudflare.com/bringing-node-js-http-servers-to-cloudflare-workers/","tags":["cloudflare","nodejs","article"],"content":"Cloudflare WorkersのNode.js `http` serverの対応について。","relatedLinks":[]},{"category":"Article","title":"How we migrated our Rush.js monorepo to Node type stripping — Calm Blog","url":"https://blog.calm.com/engineering/how-we-migrated-our-rushjs-monorepo-to-node-type-stripping","tags":["nodejs","TypeScript","article"],"content":"TypeScriptで書かれたNode.jsアプリケーションのコードベースをどのようにtype strippingに移行したかについて。\nmonorepoと`node_modules`にコードがあるため、`node --experimental-strip-types`が効かないが、`--conditions`で参照するパスを解決している。\nESMへの移行、stub、CJSの対応、`erasableSyntaxOnly`で未対応の構文の対応などを行い、`node --experimental-strip-types`で実行できるようにした話。","relatedLinks":[]},{"category":"SlideVideo","title":"1から理解するWeb Push - Speaker Deck","url":"https://speakerdeck.com/dora1998/1karali-jie-suruweb-push","tags":["browser","WebPlatformAPI","slide"],"content":"Web PushとPush Serviceについて。\nWeb Pushがどのように動いてるのか、ブラウザベンダーのPush Serverの実装についてなど","relatedLinks":[]},{"category":"Book","title":"JavaScript/TypeScript実力強化書 | 技術評論社","url":"https://gihyo.jp/book/2025/978-4-297-15194-2","tags":["JavaScript","TypeScript","book"],"content":"2025年9月29日発売\nJavaScript/TypeScriptについての書籍","relatedLinks":[]}]},{"meta":{"title":"2025-09-15のJS: pnpm 10.16(サプライチェーン攻撃対策)、Deno 2.5、bun installの裏側","author":"azu","layout":"post","date":"2025-09-15T12:37:04.705Z","category":"JSer","tags":["bun","React","pnpm","ReleaseNote","Electron"],"url":"https://jser.info/2025/09/15/pnpm-10.16-deno-2.5-bun-install/"},"items":[{"category":"Headline","title":"Group Note: CSS Snapshot 2025 | 2025 | News | W3C","url":"https://www.w3.org/news/2025/group-note-css-snapshot-2025/","tags":["css","spec","rlee"],"content":"CSS Snapshot 2025のリリース","relatedLinks":[]},{"category":"Headline","title":"Electron 38.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-38-0","tags":["Electron","ReleaseNote"],"content":"Electron 38.0.0リリース。\nChromium 140/Node.js 22.18/V8 14へアップグレード。\nmacOS 11(Big Sur)サポート終了/`ELECTRON_OZONE_PLATFORM_HINT`環境変数/`plugin-crashed`イベント削除。\n`webFrame.routingId`プロパティ/`webFrame.findFrameByRoutingId()`は非推奨。\nWindowsでaccentColorのカスタマイズの対応、macOSのメモリ情報/Tray APIの拡張など","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 10.16 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.16.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.16.0リリース。\nサプライチェーン攻撃対策として`minimumReleaseAge`オプションを追加、`pnpm why --find-by=<pkg>`オプションを追加、Node.js 24の対応改善など","relatedLinks":[{"title":"pnpm 10.16 | pnpm","url":"https://pnpm.io/blog/releases/10.16"}]},{"category":"Headline","title":"Release Version 27.0.0 · jsdom/jsdom","url":"https://github.com/jsdom/jsdom/releases/tag/27.0.0","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"jsdom 27.0.0リリース。\nNpde.js 18のサポート終了、イベントコンストラクタのサポートの追加、CSSセレクタエンジンを`@asamuzakjp/dom-selector`に変更など","relatedLinks":[]},{"category":"Headline","title":"Deno 2.5: Permissions in the config file | Deno","url":"https://deno.com/blog/v2.5","tags":["deno","ReleaseNote"],"content":"Deno v2.5リリース。\n`--permissin-set`フラグのサポート、` Deno.test.{before,after}{Each,All}`の追加、`DENO_AUDIT_PERMISSIONS`で監査ログの出力に対応など","relatedLinks":[]},{"category":"Headline","title":"ESLint v9.35.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2025/09/eslint-v9.35.0-released/","tags":["ESLint","reel"],"content":"ESLint v9.35.0リリース。\ntry...catchでError Causeを使ってre-throwしてるかをチェックする`preserve-caught-error`ルールの追加など","relatedLinks":[]},{"category":"Article","title":"How modern browsers work - by Addy Osmani - Elevate","url":"https://addyo.substack.com/p/how-modern-browsers-work","tags":["browser","article"],"content":"ブラウザのアーキテクチャの変遷について。\nChromium/Blink/V8について、ネットワーク/HTML・CSS・JSパース/レイアウト/ペイント/コンポジット/マルチプロセス/サイト分離/サンドボックス化などの変遷について。\nそれぞれのブラウザエンジンの実装の違いについてなど","relatedLinks":[]},{"category":"Article","title":"Behind The Scenes of Bun Install | Bun Blog","url":"https://bun.com/blog/behind-the-scenes-of-bun-install","tags":["Bun","article","performance"],"content":"パッケージインストールのボトルネックはI/OではなくSystem Call数にあるという話。\nuser modeとkernel modeの切り替えにはコストがかかりパッケージインストール時はオーバヘッドが多く発生する。\n`bun install`ではこのSystem Call数をメトリクスとして使ってパフォーマンスを改善していっているという話","relatedLinks":[]},{"category":"Article","title":"React Nativeの新アーキテクチャへの移行（2025年） - Shopify","url":"https://shopify.engineering/react-native-new-architecture","tags":["React","Native","article"],"content":"ShopifyのReact NativeのNew Architectureへの移行について。\n最小のコード変更で移行を優先し、デュアルアーキテクチャでRollback可能に、App StoreとPlay Storeでのロールアウト戦略について","relatedLinks":[]},{"category":"Article","title":"The Basics of Anchor Positioning","url":"https://ishadeed.com/article/anchor-positioning/","tags":["css","article"],"content":"CSS Anchor Positioningについて。\n`anchor-name`/`position-anchor`/`anchor()`/`position-area`/`position-try-fallbacks`などの動作について。","relatedLinks":[]},{"category":"Article","title":"styled-components maintenance mode: A 40% faster fork | Sanity","url":"https://www.sanity.io/blog/cut-styled-components-into-pieces-this-is-our-last-resort","tags":["React","css","article"],"content":"styled-componentsのメンテナンスが停止したので、パフォーマンスの改善とReact 19の対応したforkを作成しながら、別のCSSフレームワークに移行しているという話","relatedLinks":[]},{"category":"SoftwareLibrary","title":"krasimir/forket: Forket is a tool that splits your code to client and server so you have RSC (React Server Components) working without a framework.","url":"https://github.com/krasimir/forket","tags":["React","library"],"content":"コードをクライアントとサーバに分割して、React Server Componentを扱うツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"panphora/overtype: The markdown editor that&#039;s just a textarea https://overtype.dev","url":"https://github.com/panphora/overtype","tags":["Markdown","library","editor"],"content":"WYSIWYGなMarkdownエディタライブラリ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"embedpdf/embed-pdf-viewer: A PDF viewer that seamlessly integrates with any JavaScript project","url":"https://github.com/embedpdf/embed-pdf-viewer","tags":["JavaScript","PDF","library"],"content":"PDFビューアーを埋め込めるライブラリ","relatedLinks":[]}]},{"meta":{"title":"2025-09-23のJS: Safari 26.0、npm registryのサプライチェーン攻撃対策のロードマップ、Node.js v24.8.0(npm v11.6.0)","author":"azu","layout":"post","date":"2025-09-23T13:05:09.344Z","category":"JSer","tags":["npm","spec","Tools","pnpm","WebAssembly"],"url":"https://jser.info/2025/09/23/safari-26.0-npm-registry-node.js-v24.8.0npm-v11.6.0/"},"items":[{"category":"Headline","title":"Release pnpm 10.17 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.17.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.17.0リリース。\n`minimumReleaseAgeExclude`で`minimumReleaseAge`の対象外となるパッケージをパターンとして定義できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Wasm 3.0 Completed - WebAssembly","url":"https://webassembly.org/news/2025-09-17-wasm-3.0/","tags":["WebAssembly","spec","ReleaseNote"],"content":"WebAssembly Specification 3.0リリース。\n次の仕様が追加されている。\n\n- 64-bit address space (memory64)  \n- multiple memories  \n- GC  \n- typed references  \n- tail calls  \n- exception handling  \n- relaxed SIMD  \n- deterministic profile  \n- annotation syntax  \n- JS string builtins","relatedLinks":[]},{"category":"Headline","title":"berry/packages/plugin-catalog at master · yarnpkg/berry","url":"https://github.com/yarnpkg/berry/tree/master/packages/plugin-catalog","tags":["yarn","plugin"],"content":"pnpm catalogのようなカタログ管理を行うyarn プラグイン","relatedLinks":[]},{"category":"Headline","title":"Firefox 143.0, See All New Features, Updates and Fixes","url":"https://www.firefox.com/en-US/firefox/143.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 143リリース。\n`<input type=\"color\">`が Hex以外の値を受け入れるように。\n実験的な機能としてCSSの`text-autospace`プロパティのサポート","relatedLinks":[{"title":"Firefox 143 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/143"}]},{"category":"Headline","title":"Release v9.0.0 · lerna/lerna","url":"https://github.com/lerna/lerna/releases/tag/v9.0.0","tags":["npm","Tools","ReleaseNote"],"content":"lerna v9.0.0リリース。\nOIDCのサポート、Node.js 18のサポート終了、`@lerna/legacy-package-management`のサポート終了など","relatedLinks":[]},{"category":"Headline","title":"WebKit Features in Safari 26.0 | WebKit","url":"https://webkit.org/blog/17333/webkit-features-in-safari-26-0/","tags":["safari","ReleaseNote"],"content":"Safari 26.0の変更点について。\nCSS Anchor Positioning、Scroll-driven animations、`text-wrap: pretty`、`progress()`のサポート。\nDigital Credentials API、Trusted Types API、URLPattern APIのサポート。\nSVGアイコン、WebGPU、WebSockets over HTTP/2のサポート。\nUser AgentのOSバージョンを固定するように変更など","relatedLinks":[]},{"category":"Headline","title":"Node.js v24.8.0","url":"https://nodejs.org/en/blog/release/v24.8.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v24.8.0リリース。\nHTTP/2 Network Inspectionのサポート、OIDCに対応したnpm v11.6.0へアップデート。","relatedLinks":[]},{"category":"Article","title":"Browserslist now supports Baseline  |  Blog  |  web.dev","url":"https://web.dev/blog/browserslist-supports-baseline?hl=en","tags":["JavaScript","browser","article"],"content":"browserslistで\n`baseline widely available`のようにbaselineのクエリをサポート","relatedLinks":[]},{"category":"Article","title":"Our plan for a more secure npm supply chain - The GitHub Blog","url":"https://github.blog/security/supply-chain-security/our-plan-for-a-more-secure-npm-supply-chain/","tags":["npm","security","article"],"content":"npmのサプライチェーン攻撃に対するnpm registry/Githubのロードマップ。\nClassic Tokenの廃止、publishをMFA限定、TOTPのMFAを廃止、Granular tokensでのpublishの有効期限を短く設定するなどの対応をしていく。","relatedLinks":[]},{"category":"Article","title":"CSS大解剖 1日目: 「仕様書」","url":"https://zenn.dev/qnighy/articles/8091294fda603d","tags":["css","article","spec"],"content":"CSSの仕様についての連載記事","relatedLinks":[]},{"category":"SlideVideo","title":"フロントエンドカンファレンス東京2025登壇資料集","url":"https://zenn.dev/topi_log/articles/ac476d3fb6eff1","tags":["Conference","slide"],"content":"Frontend Conference Tokyo 2025のスライドまとめ","relatedLinks":[{"title":"Frontend Conference Tokyo","url":"https://fec-tokyo.github.io/2025/"}]},{"category":"WebsiteDocument","title":"antfu-collective/taze: 🥦 A modern cli tool that keeps your deps fresh","url":"https://github.com/antfu-collective/taze","tags":["npm","Tools"],"content":"npmパッケージをpatch/minor/majorとまとめてアップデートするツール。\nmonorepoのパッケージにも対応している","relatedLinks":[]},{"category":"WebsiteDocument","title":"Web Interface Guidelines","url":"https://vercel.com/design/guidelines","tags":["vercel","document"],"content":"VercelのWeb Interface Guideline","relatedLinks":[]}]},{"meta":{"title":"2025-09-30のJS: Node.js v24.9.0、Auth.jsはBetter Authに、npmのセキュリティ変更の予定","author":"azu","layout":"post","date":"2025-09-30T13:37:50.701Z","category":"JSer","tags":["React","nodejs","Chrome","debug","MCP"],"url":"https://jser.info/2025/09/30/node.js-v24.9.0-auth.jsbetter-auth-npm/"},"items":[{"category":"Headline","title":"Node.js","url":"https://nodejs.org/en/blog/release/v24.9.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v24.9.0リリース。\nHTTP upgradeをサーバー側で制御する`shouldUpgradeCallback`オプションを追加、SQLiteでtagged templateとSession classをサポート。  \nWorkerでheap profile APIを追加、crypto objects/assertメッセージのSource Map対応など。  \nOpenSSL 3.5.3へのアップデート、REPLでの大量の文字列貼り付けのパフォーマンス改善など","relatedLinks":[]},{"category":"Headline","title":"Auth.js is now part of Better Auth","url":"https://www.better-auth.com/blog/authjs-joins-better-auth","tags":["JavaScript","library","news"],"content":"Better AuthがAuth.js(NextAuth)のメンテナンスを引き継ぐことになった。\nAuth.jsは新規開発をしないが、セキュリティ修正などのアップデートをBetter Authチームが行う。","relatedLinks":[{"title":"Auth.js is now part of Better Auth · nextauthjs/next-auth · Discussion #13252","url":"https://github.com/nextauthjs/next-auth/discussions/13252"}]},{"category":"Headline","title":"Release oxlint v1.19.0 · oxc-project/oxc","url":"https://github.com/oxc-project/oxc/releases/tag/oxlint_v1.19.0","tags":["JavaScript","Rust","ReleaseNote"],"content":"oxlint v1.19.0リリース。  \n`import/no-named-export`、`unicorn/no-array-callback-reference`、`vue/max-props`、`react/jsx-pascal-case`ルール追加。\nJSプラグインシステムでのfixサポートなど","relatedLinks":[]},{"category":"Headline","title":"Bun v1.2.23 | Bun Blog","url":"https://bun.com/blog/bun-v1.2.23","tags":["Bun","ReleaseNote"],"content":"Bun v1.2.23リリース。\n`bun install`が`pnpm-lock.yaml`を取り込めるように、`bun install`が`--cpu`と`--os`をサポート。\n`bun test`が`async`のテストの同時実行をサポート、ランダムな順番でテストを実行する`--randomize`をサポート。","relatedLinks":[]},{"category":"Headline","title":"Release v5.102.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.102.0","tags":["webpack","ReleaseNote"],"content":"webpack v5.102.0リリース。\nDynamic ImportのTree Shakingに対応、\n`import with { type: \"bytes\" }`/`{ type: \"text\" }`サポート。\n実験機能だった`topLevelAwait`/`layers`をStableに変更など","relatedLinks":[]},{"category":"Headline","title":"TanStack Start v1 Release Candidate | TanStack Blog","url":"https://tanstack.com/blog/announcing-tanstack-start-v1","tags":["React","Solid","ReleaseNote"],"content":"TanStack Start v1 RCリリース。","relatedLinks":[]},{"category":"Headline","title":"Intl Playground","url":"https://intlin.site/","tags":["JavaScript","Tools"],"content":"`Intl.DateTimeFormat`のオプションを変更して、どのようなフォーマット結果になるかを確認できるサイト","relatedLinks":[]},{"category":"Article","title":"Chrome DevTools (MCP) for your AI agent  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/chrome-devtools-mcp?hl=en","tags":["Chrome","debug","MCP","article"],"content":"Chrome DevTools MCPについて","relatedLinks":[]},{"category":"Article","title":"A year of improving Node.js compatibility in Cloudflare Workers","url":"https://blog.cloudflare.com/nodejs-workers-2025/","tags":["nodejs","cloudflare","article"],"content":"Cloudflare WorkersでのNode.js互換性の取り組みについて。\n`nodejs_compat`フラグで`node:http`/`node:fs`/`node:crypto`/`node:process`などの主要モジュールをサポート。\nVirtual File Systemの実装やNode.jsのcryptoの処理を`ncrypto`パッケージに移行し、BoringSSLベースで`node:crypto`に対応など","relatedLinks":[{"title":"nodejs/ncrypto: Library supporting OpenSSL and crypto functions for node:crypto","url":"https://github.com/nodejs/ncrypto"}]},{"category":"Article","title":"Strengthening npm security: Important changes to authentication and token management - GitHub Changelog","url":"https://github.blog/changelog/2025-09-29-strengthening-npm-security-important-changes-to-authentication-and-token-management/","tags":["npm","article"],"content":"npmのセキュリティロードマップ。\ngranular access tokensの最大の有効期限が90日に変更、classic tokenを廃止、TOTPを廃止してフィッシング耐性があるMFAのみをサポート。\n2025年10月ごろから段階的に進めていく予定となっている","relatedLinks":[]},{"category":"Article","title":"State of JavaScript 2025","url":"https://survey.devographics.com/ja-JP/survey/state-of-js/2025","tags":["JavaScript","Survey"],"content":"State of JavaScript 2025のアンケートの受付が開始された","relatedLinks":[]},{"category":"Article","title":"Middleware in React Router | Remix","url":"https://remix.run/blog/middleware","tags":["React","article"],"content":"React Routerのmiddlewareの仕組みについて。\nルートのネストとLoaderの並列実行をするために、Context APIとSingle FetchをサポートしてHTTPリクエストのメモ化を行ったことについて。","relatedLinks":[]},{"category":"Article","title":"What You Need to Know about Modern CSS (2025 Edition) – Frontend Masters Blog","url":"https://frontendmasters.com/blog/what-you-need-to-know-about-modern-css-2025-edition/","tags":["css","article"],"content":"CSSの新しい機能について。  \n`interpolate-size`、`@function`/`if()`、`field-sizing`、`text-wrap: balance`、`shape()`などの新しい機能についての解説。\n各機能のブラウザサポート状況や使い方についてなど","relatedLinks":[]},{"category":"SoftwareLibrary","title":"NickvanDyke/eslint-plugin-react-you-might-not-need-an-effect: Catch unnecessary React useEffect hooks to make your code simpler, faster, and safer.","url":"https://github.com/NickvanDyke/eslint-plugin-react-you-might-not-need-an-effect","tags":["React","ESLint"],"content":"不要な`useEffect`の利用をチェックするESLintプラグイン","relatedLinks":[]}]},{"meta":{"title":"2025-10-10のJS: React 19.2、React Foundation、Birth of Prettier","author":"azu","layout":"post","date":"2025-10-10T00:22:20.032Z","category":"JSer","tags":["React","npm","Rust","security","Native"],"url":"https://jser.info/2025/10/10/react-19.2-react-foundation-birth-of-prettier/"},"items":[{"category":"Headline","title":"React 19.2 – React","url":"https://react.dev/blog/2025/10/01/react-19-2","tags":["React","ReleaseNote"],"content":"React 19.2リリース。\n`<Activity />`コンポーネントの追加、`useEffectEvent`の追加、`cacheSignal`の追加。\nSSRで`Suspense`のバッチ処理、SSRのWeb Streamsに対応したAPIの追加、eslint-plugin-react-hooks@6.1.0へのアップデートなど","relatedLinks":[]},{"category":"Headline","title":"Release Notes for Safari Technology Preview 229 | WebKit","url":"https://webkit.org/blog/17447/release-notes-for-safari-technology-preview-229/","tags":["safari","ReleaseNote"],"content":"Safari Technology Preview 229リリース。 \nCSSの`text-decoration-line`で`spelling-error`/`grammar-error`のサポート。\nSVGの`onbegin`イベント、`async`属性、`download`属性のサポート。\nWebGPUでの`GPUTexture`オブジェクトのサポートなど","relatedLinks":[]},{"category":"Headline","title":"October 2, 2025 Release – React Spectrum Releases","url":"https://react-spectrum.adobe.com/releases/2025-10-02.html","tags":["React","ReleaseNote","library"],"content":"React Aria October 2, 2025リリース。\nSelectのマルチセレクト対応、Disclosureのアニメーション対応、`<SelectionIndicator>`追加。\nComboBoxのonAction対応、iOS 26でのモーダル改善など","relatedLinks":[]},{"category":"Headline","title":"Introducing the React Foundation – React","url":"https://react.dev/blog/2025/10/07/introducing-the-react-foundation","tags":["React","Native","news"],"content":"ReactとReact Nativeの管理をReact Foundationに移管する予定。\nLinux Foundationの傘下プロジェクトとして設立し、Metaは5年間のパートナーシップを約束した状態で、複数の企業メンバーでReactのガバナンス管理を行なっていく予定","relatedLinks":[{"title":"Linux Foundation Announces Intent to Launch the React Foundation","url":"https://www.linuxfoundation.org/press/linux-foundation-announces-intent-to-launch-the-react-foundation"},{"title":"Introducing the React Foundation: The New Home for React ","url":"https://engineering.fb.com/2025/10/07/open-source/introducing-the-react-foundation-the-new-home-for-react-react-native/"}]},{"category":"Headline","title":"Release v1.56.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.56.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.56.0リリース。\nPlaywright Agentsの追加、`page.consoleMessages()`/`page.pageErrors()`の追加、`page.requests()`の追加。\n`--test-list`でテスト対象を手動で指定できるようになるなど","relatedLinks":[{"title":"Agents | Playwright","url":"https://playwright.dev/docs/test-agents"}]},{"category":"Headline","title":"React Native 0.82 - A New Era · React Native","url":"https://reactnative.dev/blog/2025/10/08/react-native-0.82","tags":["React","Native","ReleaseNote"],"content":"React Native 0.82リリース。\nNew Architectureのみのサポートに変更、Hermes V1をフラグ付きでサポート、React 19.1.1へアップデート。\nDOM Node subset APIsの追加など","relatedLinks":[]},{"category":"Article","title":"Introducing Socket Firewall: Free, Proactive Protection for ...","url":"https://socket.dev/blog/introducing-socket-firewall","tags":["npm","python","Rust","security","article"],"content":"npm/yarn/pnpm、pip/uv、cargoに対応したパッケージインストール時のネットワークリクエストをチェックして、マルウェア検知をするツール。\nそれぞれのコマンドの通信をProxyする形で動作し、GitHub ActionsなどのCIでも利用できる","relatedLinks":[]},{"category":"Article","title":"Vjeux » Birth of Prettier","url":"https://blog.vjeux.com/2025/javascript/birth-of-prettier.html","tags":["JavaScript","article","OpenSource"],"content":"prettierが作られた理由、formatterで難しい点、オープンソースと資金源についてなど","relatedLinks":[]},{"category":"Article","title":"What&#039;s coming in ESLint v10.0.0 - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2025/10/whats-coming-in-eslint-10.0.0/","tags":["ESLint","article"],"content":"ESLint 10の変更予定について。\nNode.js 18のサポート終了、eslintrcの削除。\n`Program` AST Nodeのrangeの変更、非推奨のRule Context APIの削除、設定ファイルの探索を対象のファイルからを起点に変更するなど","relatedLinks":[]},{"category":"Article","title":"cleaning house in nx monorepo, how i removed 120 unused deps safely","url":"https://johnjames.blog/posts/cleaning-house-in-nx-monorepo-how-i-removed-120-unused-deps-safely","tags":["npm","article"],"content":"Knipを使い未使用のパッケージを削除した話","relatedLinks":[{"title":"webpro-nl/knip: ✂️ Find unused files, dependencies and exports in your JavaScript and TypeScript projects. Knip it before you ship it!","url":"https://github.com/webpro-nl/knip"}]},{"category":"Article","title":"Oxlint JS Plugins Preview | The JavaScript Oxidation Compiler","url":"https://oxc.rs/blog/2025-10-09-oxlint-js-plugins.html","tags":["JavaScript","Rust","ESLint","article"],"content":"OxlintのESLint形式のJavaScriptプラグインのサポートについて。\nESLintプラグインと同様のAPIをサポートすることで、ESLintプラグインのルールを動かすことを目標にしている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"bodadotsh/npm-security-best-practices: How to stay safe from NPM supply chain attacks","url":"https://github.com/bodadotsh/npm-security-best-practices","tags":["npm","security","document"],"content":"npmのサプライチェーン攻撃に関するセキュリティプラクティス","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ayuhito/modern-tar: 🗄 Zero dependency streaming tar parser and writer for every JavaScript runtime.","url":"https://github.com/ayuhito/modern-tar","tags":["nodejs","library","JavaScript"],"content":"Web Streams APIを使ったtar/gzipの圧縮と解凍ライブラリ","relatedLinks":[]}]},{"meta":{"title":"2025-10-16のJS: Bun 1.3、Next.js 16(beta)、Node.js 25","author":"azu","layout":"post","date":"2025-10-16T14:21:35.260Z","category":"JSer","tags":["Bun","polyfill","Next.js","React","Tools"],"url":"https://jser.info/2025/10/16/bun-1.3-next.js-16beta-node.js-25/"},"items":[{"category":"Headline","title":"Bun 1.3 | Bun Blog","url":"https://bun.com/blog/bun-v1.3","tags":["Bun","ReleaseNote"],"content":"Bun v1.3リリース。\nローカルサーバのHot Realodの改善、HTMLファイルの実行をsingle-file executableへのコンパイルに対応。\nworkspacesではisolated installをデフォルト化、`minimumReleaseAge`オプションの追加、`bun why`/`bun info`/`bun audit`の追加。\nAsync Stack Tracesの対応、Node.jsとの互換性の改善など","relatedLinks":[]},{"category":"Headline","title":"Release 3.46.0 - 2025.10.09 · zloirock/core-js","url":"https://github.com/zloirock/core-js/releases/tag/v3.46.0","tags":["JavaScript","polyfill","library","ReleaseNote"],"content":"core-js v3.46.0リリース。\nIterator Chunkingのサポート","relatedLinks":[]},{"category":"Headline","title":"Next.js 16 (beta) | Next.js","url":"https://nextjs.org/blog/next-16-beta","tags":["Next.js","ReleaseNote"],"content":"Next.js 16 betaリリース。\nTurbopackがデフォルトバンドラーとしてstableに、Turbopackのファイルシステムキャッシュ(beta)、React Compiler統合がstableに。\nルーティングと`prefetch`の最適化、PPRがCache Componentsに統合。\n`updateTag()`/`refresh()`の追加、`revalidateTag()`の第二引数のオプションが必須に。\nReact 19.2対応(View Transitions、`useEffectEvent()`、`<Activity/>`コンポーネント)。\nNode.js 18のサポート終了、AMP/`next lint`コマンド削除、`middleware.ts`を`proxy.ts`にリネーム、パフォーマンスの改善など","relatedLinks":[]},{"category":"Headline","title":"React Compiler v1.0 – React","url":"https://react.dev/blog/2025/10/07/react-compiler-1","tags":["React","Tools","ReleaseNote"],"content":"React Compiler v1.0リリース。\n`eslint-plugin-react-hooks`にReact Compiler向けのルールが含まれるようになった。\n現在はBabelプラグインとして提供されているが、SWCサポートを実験的に実装中となっている","relatedLinks":[]},{"category":"Headline","title":"Node.js","url":"https://nodejs.org/en/blog/release/v24.10.0","tags":["nodfe","ReleaseNote"],"content":"Node.js v24.10.0リリース。\n`util.getCallSite()`を削除、`database.setAuthorizer(callback)`を追加など","relatedLinks":[]},{"category":"Headline","title":"Firefox 144.0, See All New Features, Updates and Fixes","url":"https://www.firefox.com/en-US/firefox/144.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 144リリース。\n`<button>`の`command`属性をサポート、 View Transition APIのサポート、`moveBefore`メソッドのサポート。\n実験的な機能として`<input type=\"datetime-local\">`をサポートなど","relatedLinks":[{"title":"Firefox 144 for developers - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/144"}]},{"category":"Headline","title":"Sovereign Tech Agency Invests in Lodash’s Next Chapter in Open Source | OpenJS Foundation","url":"https://openjsf.org/blog/sta-supports-lodash","tags":["JavaScript","library","news"],"content":"lodashのガバナンスとメンテナンスをOpenJSがサポートして行う","relatedLinks":[]},{"category":"Headline","title":"Release v0.25.11 · evanw/esbuild","url":"https://github.com/evanw/esbuild/releases/tag/v0.25.11","tags":["esbuild","ReleaseNote"],"content":"esbuild v0.25.11リリース。\n`import with { type: \"bytes\"}`のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Node.js","url":"https://nodejs.org/en/blog/release/v25.0.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v25.0.0リリース。\nV8 14.1へアップグレード、`--experimental-webstorage`のフラグなし有効化、`--allow-net`権限モデルの追加。\n非推奨の機能の削除(`SlowBuffer`/`assert.CallTracker`など)。\nCorepackを同梱しないように変更、JSPI for WebAssemblyの有効化など。","relatedLinks":[]},{"category":"Article","title":"Announcing Vite+ | VoidZero","url":"https://voidzero.dev/posts/announcing-vite-plus","tags":["vite","article"],"content":"Viteの商用利用版であるVite+について。\n`vite new`/`vite test`/`vite lint`/`vite fmt`/`vite lib`/`vite run`/`vite ui`のようなコマンドを提供する。\nVite、Vitest、Rolldown、Oxcなどをベースにしていて、2026年の初頭にPublic Previewの予定","relatedLinks":[]},{"category":"Article","title":"デジタル庁デザインシステムの活用例：よくあるアクセシビリティの課題とその解決策｜デジタル庁ニュース","url":"https://digital-agency-news.digital.go.jp/articles/2025-10-14","tags":["accessibility","article"],"content":"視野狭窄を意識したデザインや強制カラーモードの対応などについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"tryandromeda/andromeda: JS runtime lolz","url":"https://github.com/tryandromeda/andromeda?tab=readme-ov-file","tags":["Rust","JavaScript","library"],"content":"NovaとOxcを使ったJavaScript/TypeScript Runtime","relatedLinks":[]}]},{"meta":{"title":"2025-10-27のJS: Next.js 16、RedwoodJS GraphQL → CedarJS、Vitest 4.0","author":"azu","layout":"post","date":"2025-10-27T01:27:05.200Z","category":"JSer","tags":["nodejs","Conference","Bun","Next.js","HTTP"],"url":"https://jser.info/2025/10/27/next.js-16-redwoodjs-graphql-cedarjs-vitest-4.0/"},"items":[{"category":"Headline","title":"Node.js — Node.js v22.21.0 (LTS)","url":"https://nodejs.org/en/blog/release/v22.21.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v22.21.0リリース。\n`--use-env-proxy`フラグ/`NODE_USE_ENV_PROXY`のサポート、`--max-old-space-size`がpercentの指定をサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v8.9.0 · redwoodjs/graphql","url":"https://github.com/redwoodjs/graphql/releases/tag/v8.9.0","tags":["nodejs","JavaScript","library","ReleaseNote"],"content":"Redwood GraphQL(RedwoodJS) 8.9.0リリース。\nRedwoodJSは開発が終了したため、CedarJSへの移行が推奨されている","relatedLinks":[{"title":"CedarJS | The React + GraphQL Web App Framework","url":"https://cedarjs.com/"}]},{"category":"Headline","title":"Bun v1.3.1 | Bun Blog","url":"https://bun.com/blog/bun-v1.3.1","tags":["Bun","ReleaseNote"],"content":"Bun v1.3.1リリース。\n`bun test`実行時に`vi`をglobalにexpose、`bun test --pass-with-no-tests`と`bun test --only-failures`のサポート。\n`hoistPattern`と`publicHoistPattern`、オプションをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Next.js 16 | Next.js","url":"https://nextjs.org/blog/next-16","tags":["Next.js","ReleaseNote"],"content":"Next.js 16リリース。\nNode.js 18のサポート終了、AMP、`next lint`、`middleware.ts`の削除など。\nCache Componentsによる明示的なキャッシュ制御/PPR統合、Next.js Devtools MCPの追加、`middleware.ts`を`proxy.tsに変更。\nTurbopackがデフォルトバンドラに/React Compiler統合/ルーティング・プリフェッチ最適化/React 19.2のサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v14.6.0 · sindresorhus/got","url":"https://github.com/sindresorhus/got/releases/tag/v14.6.0","tags":["nodejs","HTTP","library","ReleaseNote"],"content":"Got v14.6.0リリース。\n`beforeCache`フックやNode.js diagnostic channelのサポート/zstd圧縮対応/typed arrayをrequest bodyでサポート。\nHTTP/2タイミング問題の修正、ストリーム関連のvalidationエラーやretryロジックのバグ修正。\n`strictContentLength`オプション追加など","relatedLinks":[]},{"category":"Headline","title":"Vitest 4.0 is out! | Vitest","url":"https://vitest.dev/blog/vitest-4","tags":["vite","ReleaseNote"],"content":"Vitest 4.0リリース。\nBrowser Modeがstableに、ビジュアルリグレッションテストをする`toMatchScreenshot`のサポート/Playwright Trace/frameLocatorの追加。\n`expect.assert`/`expect.schemaMatching`の追加。\n`basic`レポーター削除/Browser Provider設定の変更/`workspace`オプションを削除/`coverage.all`と`coverage.extensions`の削除など","relatedLinks":[]},{"category":"Headline","title":"Planned breaking changes for Rspack 2.0 · web-infra-dev/rspack · Discussion #9270","url":"https://github.com/web-infra-dev/rspack/discussions/9270","tags":["rspack","issue"],"content":"Rspack 2.0の変更予定について。\nNode.js 18サポート終了/`@module-federation/runtime-tools`のオプション化/`verbatimModuleSyntax`のデフォルト有効化。\n`target`設定の統一/`stats.profile`削除/webpack-bundle-analyzer削除/browserslist実装の簡素化などを予定している","relatedLinks":[]},{"category":"Headline","title":"Ember 6.8 Released","url":"https://blog.emberjs.com/ember-released-6-8/","tags":["Ember","ReleaseNote"],"content":"Ember.js 6.8リリース。\n`renderComponent` API追加/`@ember/reactive/collections`でtrackedコレクション導入/Trusted Publishing対応。\nEmber CLIはVite/Embroiderがデフォルト/テンプレートをstrictがデフォルトへ変更。","relatedLinks":[]},{"category":"Headline","title":"Release v4.2.0 · nuxt/nuxt","url":"https://github.com/nuxt/nuxt/releases/tag/v4.2.0","tags":["Vue","library","ReleaseNote"],"content":"Nuxt.js v4.2.0リリース。\n`useFetch`でAbortControllerサポート/dev時のエラー表示改善/Vite Environment API実験的サポート/AsyncDataハンドラー抽出によるパフォーマンス向上。\nTypeScriptプラグインの実験的サポート/`@nuxt/nitro-server`パッケージ分離など","relatedLinks":[]},{"category":"Headline","title":"Biome v2.3—Let&#039;s bring the ecosystem closer | Biome","url":"https://biomejs.dev/blog/biome-v2-3/","tags":["biome","ReleaseNote"],"content":"Biome v2.3リリース。\nVue/Svelte/Astroファイルのサポート/新しいignore構文の追加/Tailwind v4対応など","relatedLinks":[]},{"category":"Headline","title":"Release v4.10.0 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v4.10.0","tags":["Hono","ReleaseNote"],"content":"Hono v4.10.0リリース。\nMiddlewareの型を改善、`cloneRawRequest`の追加など","relatedLinks":[]},{"category":"Article","title":"Remix Jam 2025 Recap | Remix","url":"https://remix.run/blog/remix-jam-2025-recap","tags":["article","Remix","Conference"],"content":"Remix Jam 2025のまとめ","relatedLinks":[]},{"category":"Article","title":"React Conf 2025 Recap – React","url":"https://react.dev/blog/2025/10/16/react-conf-2025-recap","tags":["React","Conference","article"],"content":"React Conf 2025のまとめ","relatedLinks":[]},{"category":"SoftwareLibrary","title":"cedarjs/cedar: The React + GraphQL Web App Framework","url":"https://github.com/cedarjs/cedar","tags":["nodejs","library"],"content":"RedwoodJSをforkしたNode.jsフレームワーク","relatedLinks":[]}]},{"meta":{"title":"2025-11-05のJS: Storybook 10、Turborepo 2.6(Microfrontend)、 redux-toolkit v2.10.0とImmerのパフォーマンス改善","author":"azu","layout":"post","date":"2025-11-04T23:58:24.027Z","category":"JSer","tags":["Tools","rspack","performance","nodejs","storybook"],"url":"https://jser.info/2025/11/05/storybook-10-turborepo-2.6microfrontend-redux-toolkit-v2.10.0immer/"},"items":[{"category":"Headline","title":"Release v10.0.0 · storybookjs/storybook","url":"https://github.com/storybookjs/storybook/releases/tag/v10.0.0","tags":["storybook","ReleaseNote"],"content":"Storybook v10.0.0リリース。\nESM-onlyに変更してインストールサイズを29%削減、distコードをunminify化。\nModule automockingのサポート、TypesafeなCSF factories、タグフィルター機能の改善。\nNext 16/Vitest 4/Svelte非同期コンポーネント対応など","relatedLinks":[]},{"category":"Headline","title":"Turborepo 2.6 | Turborepo","url":"https://turborepo.com/blog/turbo-2-6","tags":["JavaScript","Tools","ReleaseNote"],"content":"Turborepo 2.6リリース。\nMicrofrontendサポートとして、ローカル開発用のパスレベルのルーティングを定義できる`microfrontends.json`を追加。\nBunのサポート、TUIの改善など","relatedLinks":[]},{"category":"Headline","title":"Electron 39.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-39-0","tags":["Electron","ReleaseNote"],"content":"Electron 39.0.0リリース。\nChromium 142/Node.js 22.20/V8 14.2へアップグレード。\nASAR integrityがStableに、`window.open`のポップアップは常にサイズが変更可能になるなど","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 142  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/new-in-chrome-142?hl=en","tags":["Chrome","ReleaseNote"],"content":"Chrome 142リリース。\n`:target-before`/`:target-after`疑似クラスの追加、Style Container Queriesと`if()`関数でのレンジ構文のサポート。\n`interestfor`属性の追加、`document.activeViewTransition`プロパティの追加。\nWebGPUの`primitive_index`機能とテクスチャ形式tier1/tier2のサポート。\nローカルネットワークへのリクエストに許可　プロンプトが表示されるようになるなど","relatedLinks":[{"title":"Chrome 142  |  Release notes  |  Chrome for Developers","url":"https://developer.chrome.com/release-notes/142"}]},{"category":"Headline","title":"Release v2.10.0 · reduxjs/redux-toolkit","url":"https://github.com/reduxjs/redux-toolkit/releases/tag/v2.10.0","tags":["redux","performance","library","ReleaseNote"],"content":"Redux Toolkit v2.10.0リリース。\nImmerのパフォーマンス改善を行いImmer 10.2.0にアップデートなど","relatedLinks":[{"title":"Immer perf appears to have gotten worse over time, based on updated benchmarks · Issue #1152 · immerjs/immer","url":"https://github.com/immerjs/immer/issues/1152"}]},{"category":"Headline","title":"Announcing Rspack 1.6 - Rspack","url":"https://rspack.rs/blog/announcing-1-6","tags":["rspack","ReleaseNote"],"content":"Rspack 1.6リリース。\nDynamic importのTree Shakingを改善、import deferのサポート。\nESM出力の改善する`EsmLibraryPlugin`を追加、Barrelファイルの最適化をデフォルト有効化、layer機能の安定化。\nビルド時にJSX構文を保持オプションを追加、Source Mapを抽出する`extractSourceMap`オプションを追加。\nRsbuild 1.6では、ブラウザのエラーログをターミナル転送できるように、Rslib 1.6ではtypescript-goベースの型宣言ファイルの生成をサポートなど","relatedLinks":[]},{"category":"Article","title":"Introducing TanStack Start Middleware – Frontend Masters Blog","url":"https://frontendmasters.com/blog/introducing-tanstack-start-middleware/","tags":["JavaScript","article"],"content":"TanStack Startのmiddlewareについて","relatedLinks":[]},{"category":"Article","title":"I Built the Same App 10 Times: Evaluating Frameworks for Mobile Performance | Loren Stewart","url":"https://www.lorenstew.art/blog/10-kanban-boards/","tags":["JavaScript","performance","article"],"content":"10個のフレームワークで同じカンバンアプリを作成してモバイルパフォーマンスを比較した記事。\nバンドルサイズ。モバイル環境でのパフォーマンス、MPAとSPA、React以外の選択肢についてなど","relatedLinks":[]},{"category":"Article","title":"Node.js — Node.js v22 to v24","url":"https://nodejs.org/en/blog/migrations/v22-to-v24","tags":["nodejs","article"],"content":"Node.js v22からv24の変更とマイグレーションツールについて","relatedLinks":[]},{"category":"Article","title":"The Inner Workings of JavaScript Source Maps","url":"https://www.polarsignals.com/blog/posts/2025/11/04/javascript-source-maps-internals","tags":["sourcemap","article"],"content":"Source Mapの仕組みについて。\nSource Mapの形式やVLQエンコーディングの仕組みにについて","relatedLinks":[]},{"category":"SoftwareLibrary","title":"TanCN - Form and Table Builder","url":"https://tancn.dev/","tags":["JavaScript","Tools","UI"],"content":"TanStackを使ったフォームビルダー","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Triplex Goes Open Source and Moves to Poimandres • Triplex","url":"https://triplex.dev/blog/triplex-moves-to-pmndrs","tags":["React","3D","library","Tools"],"content":"Reactで3Dコンポーネントを作成するツール","relatedLinks":[{"title":"pmndrs/triplex: The open source visual workspace for React / Three Fiber. Build the 2D and 3D web.","url":"https://github.com/pmndrs/triplex"}]}]},{"meta":{"title":"2025-11-13のJS: Node.js v24 LTS、Node.js v25.2.0(Strip typesがStable)、npmのセキュリティアップデート","author":"azu","layout":"post","date":"2025-11-13T02:39:08.381Z","category":"JSer","tags":["nodejs","React","css","npm","security"],"url":"https://jser.info/2025/11/13/node.js-v24-lts-node.js-v25.2.0strip-typesstable-npm/"},"items":[{"category":"Headline","title":"Node.js — Node.js v24.11.0 (LTS)","url":"https://nodejs.org/en/blog/release/v24.11.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v24.11.0リリース。\nNode.js 24のLTSとなるバージョンで、2028-04-30までサポートされる","relatedLinks":[]},{"category":"Headline","title":"module: mark type stripping as stable by marco-ippolito · Pull Request #60600 · nodejs/node","url":"https://github.com/nodejs/node/pull/60600","tags":["nodejs","TypeScript","issue"],"content":"Node.js v25.2.0でTypeScriptのtype strippingサポートがstableとなる","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node.js v25.2.0 (Current)","url":"https://nodejs.org/en/blog/release/v25.2.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v25.2.0リリース。\nType StrippingをStableに変更、`util.deprecate`に`modifyPrototype`オプションを追加","relatedLinks":[]},{"category":"Headline","title":"Release v6.5.0 · vadimdemedes/ink","url":"https://github.com/vadimdemedes/ink/releases/tag/v6.5.0","tags":["React","terminal","UI","library","ReleaseNote"],"content":"Ink v6.5.0リリース。\n`incrementalRendering`オプションを追加し、差分だけをレンダリングできるように","relatedLinks":[]},{"category":"Article","title":"Perfectly Pointed Tooltips: A Foundation – Frontend Masters Blog","url":"https://frontendmasters.com/blog/perfectly-pointed-tooltips-a-foundation/","tags":["css","article"],"content":"CSSのanchor positioningについての解説記事","relatedLinks":[]},{"category":"Article","title":"npm security update: Classic token creation disabled and granular token changes - GitHub Changelog","url":"https://github.blog/changelog/2025-11-05-npm-security-update-classic-token-creation-disabled-and-granular-token-changes/","tags":["npm","security","article"],"content":"npmセキュリティアップデートについて\nClassic tokenの作成を無効にし、既存Classic tokenは11月19日まで有効になっている。\nGranular tokenでwrite権限は2FA必須化、CI/CD用のBypass 2FAオプション追加、write権限を持つtokenは90日の有効期限となるように変更など","relatedLinks":[]},{"category":"Article","title":"How To Throttle Specific Requests In Chrome DevTools | DebugBear","url":"https://www.debugbear.com/blog/chrome-devtools-throttle-individual-request","tags":["Chrome","debug","article"],"content":"Chrome DevToolsで試験的に導入されているリクエスト単位でのスロットリングの設定について","relatedLinks":[]},{"category":"Article","title":"tinyglobby: a success story in modernization and performance | e18e","url":"https://e18e.dev/blog/tinyglobby-migration.html","tags":["nodejs","article"],"content":"tinyglobbyについて。\n他のglobライブラリとの違いやなぜ作ったのかについてなど","relatedLinks":[]},{"category":"Article","title":"Don&#039;t Blindly Use useTransition Everywhere | Nicolas Charpentier","url":"https://www.charpeni.com/blog/dont-blindly-use-usetransition-everywhere","tags":["React","article"],"content":"`useTransition`を緊急性が高いUIの更新に使ってしまうと遅延が発生するので、使いわけが必要という話。\nタブ切り替えと`<Activity>`についてなど","relatedLinks":[]},{"category":"Article","title":"Your URL Is Your State","url":"https://alfy.blog/2025/10/31/your-url-is-your-state.html","tags":["URL","browser","article"],"content":"URLに状態を持たせる方法について","relatedLinks":[]},{"category":"SlideVideo","title":"CascadiaJS 2025 - YouTube","url":"https://www.youtube.com/playlist?list=PLLiioAbFTbKP4JVMijrNRRrNccfauPko8#cascadiajs","tags":["video","Conference"],"content":"CascadiaJSの動画まとめ","relatedLinks":[{"title":"CascadiaJS 2025 | Sept 18 - 19 | Seattle, WA","url":"https://cascadiajs.com/2025/"}]},{"category":"WebsiteDocument","title":"stepwisehq/prosemirror-collab-commit: Commit-based collaborative editing plugin for ProseMirror","url":"https://github.com/stepwisehq/prosemirror-collab-commit","tags":["JavaScript","editor","library"],"content":"CRDTは人数が多くなるパフォーマンスに問題が起きるため、コミットベースのコラボレーションを実装するProseMirrorプラグイン","relatedLinks":[{"title":"ProseMirror Collab Performance | Blog","url":"https://stepwisehq.com/blog/2023-07-25-prosemirror-collab-performance/"}]}]},{"meta":{"title":"2025-11-25のJS: webpack v5.103.0、Prisma 7、Angular 21","author":"azu","layout":"post","date":"2025-11-25T12:20:17.712Z","category":"JSer","tags":["React","TypeScript","webpack","MicroFrontend","css"],"url":"https://jser.info/2025/11/25/webpack-v5.103.0-prisma-7-angular-21/"},"items":[{"category":"Headline","title":"Release v5.103.0 · webpack/webpack","url":"https://github.com/webpack/webpack/releases/tag/v5.103.0","tags":["webpack","ReleaseNote"],"content":"webpack v5.103.0リリース。\nDotenvPlugin/WebpackManifestPluginの追加、`import.meta.env`/`import.meta.dirname`/`import.meta.filename`サポート。\n`import.defer()`サポート/CSS向けの`exportType`オプション追加/CSS Modulesの`composes`プロパティサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v11.0.0 · immerjs/immer","url":"https://github.com/immerjs/immer/releases/tag/v11.0.0","tags":["JavaScript","library","ReleaseNote"],"content":"Immer v11.0.0リリース。\n内部実装を書き直してパフォーマンス改善","relatedLinks":[]},{"category":"Headline","title":"Bun v1.3.3 | Bun Blog","url":"https://bun.com/blog/bun-v1.3.3","tags":["Bun","ReleaseNote"],"content":"Bun v1.3.3リリース。\n`CompressionStream`/`DecompressionStream`のサポート、standalone executableの`.env`と`bunfig.toml`読み込み制御するオプションの追加。\n`bun test`の`retry`/`repeats`オプション追加、`--no-env-file`フラグ追加、SQLite 3.51.0へ更新など","relatedLinks":[]},{"category":"Headline","title":"Release 7.0.0 · prisma/prisma","url":"https://github.com/prisma/prisma/releases/tag/7.0.0","tags":["prisma","ReleaseNote"],"content":"Prisma 7.0.0リリース。\nRust-freeのPrismaクライアントがデフォルトへと変更、`prisma generate`のコード生成先の変更やpostinstall hookの削除。\n生成する型を改善して型チェックの速度の改善など","relatedLinks":[{"title":"Prisma 7 Release: Rust-Free, Faster, and More Compatible","url":"https://www.prisma.io/blog/announcing-prisma-orm-7-0-0?via=prisma7"}]},{"category":"Headline","title":"Release pnpm 11 Alpha 0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v11.0.0-alpha.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v11.0.0-alpha.0リリース。\nPure ESMに変更、設定の読み取りの変更、Node.js 18のサポート終了、キャッシュをv8.serializeしたバイナリファイルを使うように変更","relatedLinks":[]},{"category":"Headline","title":"Announcing Angular v21. Authors: Jens Kuehlers, Mark “Techson”… | by Angular | Nov, 2025 | Angular Blog","url":"https://blog.angular.dev/announcing-angular-v21-57946c34f14b","tags":["Angular","ReleaseNote"],"content":"Angular v21リリース。\n実験的なSignal Formsの追加、アクセシビリティを重視したヘッドレスコンポーネントライブラリAngular AriaがDeveloper Previewに。\nVitestがデフォルトのテストランナーとしてStableに、新しいアプリケーションではzone.jsがデフォルトで含まれなくなった。\nAngular MCPサーバーがStableに、テンプレートでの正規表現サポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.57.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.57.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.57.0リリース。\nHTMLレポータにテストの遅い順で表示するSpeedboardを追加、ChromiumでなくChrome for Testingを利用するように、`webServer`に`wait`オプションを追加。Page#accessibility APIを削除など","relatedLinks":[]},{"category":"Article","title":"Introducing Phased Package Installations","url":"https://blog.vlt.sh/blog/vlt-build","tags":["npm","vlt","article"],"content":"vltでは`vlt install`と`vlt build`にコマンドを分けることで、インストール時にスクリプトを実行をデフォルトで行わないようになっている話","relatedLinks":[]},{"category":"Article","title":"Moving Mountains: How We Migrated from Enzyme to React Testing Library","url":"https://product.hubspot.com/blog/migrated-from-enzyme-to-react-testing-library","tags":["JavaScript","React","refactoring","article"],"content":"EnzymeからTesting Libraryへの移行について","relatedLinks":[]},{"category":"WebsiteDocument","title":"Fumadocs","url":"https://fumadocs.dev/","tags":["React","document","library"],"content":"Reactを使ったドキュメントフレームワーク","relatedLinks":[]},{"category":"SoftwareLibrary","title":"arktype/ark/attest at main · arktypeio/arktype","url":"https://github.com/arktypeio/arktype/tree/main/ark/attest","tags":["TypeScript","testing","benchmark","library"],"content":"ArkTypeが利用しているTypeScriptのテスト、ベンチマークフレームワーク。\nTypeScriptの型パフォーマンスのメトリクスを表示できる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Web Fragments - A radically new way to do micro-frontends.","url":"https://web-fragments.dev/","tags":["MicroFrontend","library"],"content":"JavaScriptのコンテキストをiframeで分離し、CSSのスタイルのコンテキストをShadow DOMで分離するMicrofrontendフレームワーク。\nCloudflareで利用されている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Type-safe Composable CSS - styleframe","url":"https://www.styleframe.dev/","tags":["TypeScript","css","library"],"content":"TypeScriptで型安全に書くCSSフレームワーク。\nCSS VariableやThemeなどをComposablesとして合成できるAPIを持っている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tmikov/imgui-react-runtime: React + Dear ImGui + Static Hermes","url":"https://github.com/tmikov/imgui-react-runtime","tags":["React","Native","Tools"],"content":"HermesとDear ImGuiとReactを使ったGUIフレームワーク。\n数MB程度の単体で実行できるネイティブバイナリとへコンパイルができる","relatedLinks":[{"title":"ocornut/imgui: Dear ImGui: Bloat-free Graphical User interface for C++ with minimal dependencies","url":"https://github.com/ocornut/imgui"}]},{"category":"SoftwareLibrary","title":"3ru/eslint-plugin-baseline-js: ✅ ESLint plugin to enforce the JavaScript Baseline.","url":"https://github.com/3ru/eslint-plugin-baseline-js","tags":["ESLint","plugin","library"],"content":"BaselineをチェックするESLintプラグイン","relatedLinks":[]}]},{"meta":{"title":"2025-12-06のJS: AnthropicがBunを買収、React Server  Componentsの脆弱性、Vite 8 Betaリリース","author":"azu","layout":"post","date":"2025-12-06T06:35:24.158Z","category":"JSer","tags":["Tools","Next.js","TypeScript","React","Bun"],"url":"https://jser.info/2025/12/06/anthropicbun-react-server-components-vite-8-beta/"},"items":[{"category":"Headline","title":"Bun is joining Anthropic | Bun Blog","url":"https://bun.com/blog/bun-joins-anthropic","tags":["Bun","news"],"content":"AnthropicがBunを買収した。\n今後はClaude Codeチームと連携して開発をしていくが、Bun自体はBunとして開発を継続する予定","relatedLinks":[]},{"category":"Headline","title":"Oxfmt: Oxc Formatter Alpha | The JavaScript Oxidation Compiler","url":"https://oxc.rs/blog/2025-12-01-oxfmt-alpha.html","tags":["JavaScript","Tools","ReleaseNote"],"content":"JavaScript FormtterであるOxfmtのαリリース。\nPrettierの一部オプションのサポートや`printWidth: 100`のデフォルト値の変更などが含まれている。","relatedLinks":[]},{"category":"Headline","title":"Release v6.0.0 · tinylibs/tinybench","url":"https://github.com/tinylibs/tinybench/releases/tag/v6.0.0","tags":["JavaScript","benchmark","library","ReleaseNote"],"content":"tinybench v6.0.0リリース","relatedLinks":[]},{"category":"Headline","title":"Prettier 3.7: Improved formatting consistency and new plugin features! · Prettier","url":"https://prettier.io/blog/2025/11/27/3.7.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 3.7リリース。","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 10.24 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.24.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.24.0リリース。\nnetwork-concurrencyをCPUのコア数の3倍に設定することで、ネットワークの並列性を改善するなど","relatedLinks":[]},{"category":"Headline","title":"🎉 Ant Design 6.0 is Here! 🎉 · Issue #55804 · ant-design/ant-design","url":"https://github.com/ant-design/ant-design/issues/55804","tags":["JavaScript","React","UI","library","ReleaseNote"],"content":"Ant Design 6リリース。\nReact 18以上を最低要件に変更、React Compilerをサポート、IEサポートを終了。\nPure CSS Variables Style Architectureへの移行、v4で非推奨となったAPIを削除。\nMasonryコンポーネントの追加、Drawerのリサイズサポート、マスクのブラー背景などの追加など","relatedLinks":[]},{"category":"Headline","title":"Critical Security Vulnerability in React Server Components – React","url":"https://react.dev/blog/2025/12/03/critical-security-vulnerability-in-react-server-components","tags":["React","Next.js","security","ReleaseNote"],"content":"Reactのセキュリティアップデート。\nNext.jsなどのReact Server Componentsに対応したサーバとして起動している場合に、任意のコード実行ができるRCEの脆弱性が存在している。\nReactやNext.js(Next.jsはReactをBundleしているため個別にアップデートが必要)などのセキュリティ修正がリリースされている。","relatedLinks":[]},{"category":"Headline","title":"New in Chrome 143  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/new-in-chrome-143?hl=en","tags":["Chrome","ReleaseNote"],"content":"Chrome 143リリース。\nCSS Anchor Fallback Container Query/`background-position-x`/`y`の辺相対構文/`font-language-override`プロパティのサポート。\nICU 77へアップデート、EditContext APIの改善、WebTransportアプリケーションプロトコルネゴシエーションの追加。\nXSLTの非推奨化など","relatedLinks":[{"title":"Chrome 143  |  Release notes  |  Chrome for Developers","url":"https://developer.chrome.com/release-notes/143"}]},{"category":"Headline","title":"Vite 8 Beta: The Rolldown-powered Vite | VoidZero","url":"https://voidzero.dev/posts/announcing-vite-8-beta","tags":["vite","ReleaseNote"],"content":"Vite 8 Betaリリース。\nRollupの代わりにRolldownを利用するようになるバージョン","relatedLinks":[]},{"category":"Article","title":"Announcing Baseline in action  |  Blog  |  web.dev","url":"https://web.dev/blog/announcing-baseline-in-action?hl=en","tags":["article","browser"],"content":"Baselineについての連載","relatedLinks":[]},{"category":"Article","title":"Accelerate Next.js in Kubernetes","url":"https://blog.platformatic.dev/93-faster-nextjs-in-your-kubernetes","tags":["Next.js","kubernetes","performance","linux","article"],"content":"Node.jsアプリケーションをKubernetes環境でスケーリングする際の問題と、Wattを使った93%のレイテンシ改善について。\nPM2やclusterモジュールはIPCによる約30%のオーバーヘッドがあり、単一CPUポッドの水平スケーリングでは負荷分散の不均衡が発生する。\nWattはLinuxカーネルの`SO_REUSEPORT`を使い、マスタープロセスなしで各ワーカーが直接接続を受け付けることでオーバーヘッドを削減するアプローチを採用していることについて。","relatedLinks":[]},{"category":"Article","title":"Progress on TypeScript 7 - December 2025 - TypeScript","url":"https://devblogs.microsoft.com/typescript/progress-on-typescript-7-december-2025/","tags":["TypeScript","article"],"content":"Go言語実装のTypeScript 7の進捗について。\nTypeScript 7ではTypeScript 6でDeprecatedとなる予定の機能が削除される。\nまた、TypeScript 6がJavaScript実装の最後のバージョンとなる。\nまだ、APIやJSDocの互換性など既知の問題はあるが、型チェックに関しては安定してきているという話","relatedLinks":[]},{"category":"SoftwareLibrary","title":"TSDiagram - Diagrams as code with TypeScript","url":"https://tsdiagram.com/","tags":["TypeScript","diagram"],"content":"TypeScriptのインターフェースでdiagramを書くツール","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vercel/streamdown: A drop-in replacement for react-markdown, designed for AI-powered streaming.","url":"https://github.com/vercel/streamdown","tags":["Markdown","library"],"content":"Streaming出力などで壊れているMarkdownを修復してMarkdownとしてレンダリングするためのライブラリ","relatedLinks":[{"title":"New npm package for automatic recovery of broken streaming markdown - Vercel","url":"https://vercel.com/changelog/new-npm-package-for-automatic-recovery-of-broken-streaming-markdown"}]}]},{"meta":{"title":"2025-12-16のJS: Node.js v24.12.0、Deno 2.6、Firefox 146、pnpmのセキュリティ機能","author":"azu","layout":"post","date":"2025-12-16T13:00:13.905Z","category":"JSer","tags":["React","Tools","nodejs","TypeScript","security"],"url":"https://jser.info/2025/12/16/node.js-v24.12.0-deno-2.6-firefox-146-pnpm/"},"items":[{"category":"Headline","title":"Node.js — Node.js v24.12.0 (LTS)","url":"https://nodejs.org/en/blog/release/v24.12.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v24.12.0リリース。\nType stripping(TypeScript型削除機能)をStableに変更。\n`http`にbodyがないリクエストのStream処理をスキップする`optimizeEmptyRequests`オプションを追加。\n`util.deprecate()`に`modifyPrototype`などのオプション、`sqlite`に`defensive`フラグを追加。\ncompile cacheを相対パスで保存できるportableオプション、Permission Modelに`--allow-inspector`を追加など","relatedLinks":[]},{"category":"Headline","title":"Type-Aware Linting Alpha | The JavaScript Oxidation Compiler","url":"https://oxc.rs/blog/2025-12-08-type-aware-alpha","tags":["TypeScript","ESLint","ReleaseNote"],"content":"OxlintのType-Aware Lintingがαリリース","relatedLinks":[]},{"category":"Headline","title":"Release v1.0.0 · mui/base-ui","url":"https://github.com/mui/base-ui/releases/tag/v1.0.0","tags":["React","UI","library"],"content":"React向けのスタイルを持たないUIコンポーネントライブラリであるBase UI 1.0リリース","relatedLinks":[]},{"category":"Headline","title":"Deno 2.6: dx is the new npx | Deno","url":"https://deno.com/blog/v2.6","tags":["deno","ReleaseNote"],"content":"Deno v2.6リリース。\nダウンロードと実行を行う`dx`コマンドを追加、Source phase importsのサポート。\n`deno audit`コマンドの追加と`deno audit --socket`でのSocket.devとの連携の追加。\npnpmライクなpostinstallを行うパッケージを管理する`deno approve-scripts`コマンドを追加、`minimumDependencyAge`オプションのサポート。\nデフォルトで`@types/node`を含むように変更、\nunstableな機能として`tsgo`を使った型チェックのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Denial of Service and Source Code Exposure in React Server Components – React","url":"https://react.dev/blog/2025/12/11/denial-of-service-and-source-code-exposure-in-react-server-components","tags":["React","security","ReleaseNote"],"content":"Reactのセキュリティアップデート。\nDosとソースコードの露出の脆弱性が修正されていてる。\n19.0.0、19.0.1、19.0.2、19.1.0、19.1.1、19.1.2、19.1.2、19.2.0、19.2.1、19.2.2がそれぞれ公開されている","relatedLinks":[]},{"category":"Headline","title":"Release v1.5.0 (to-json-schema) · open-circle/valibot","url":"https://github.com/open-circle/valibot/releases/tag/v1.5.0-to-json-schema","tags":["JavaScript","library","ReleaseNote"],"content":"Valibot v1.5.0リリース。\nJSON Schema draft-2020-12とOpenAPI 3.0 Schema Object形式のサポート、recordスキーマに`propertyNames`を追加。\n`toStandardJsonSchema`関数でValibotスキーマをStandard JSON Schema形式へ変換できるように","relatedLinks":[]},{"category":"Headline","title":"Firefox 146.0, See All New Features, Updates and Fixes","url":"https://www.firefox.com/en-US/firefox/146.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 146リリース。\nCSSの`contrast-color()`関数、`@scope` at-rule、`text-decoration-inset`プロパティをサポート。\n`WeakMap`/`WeakSet`がSymbolをキーとして受け入れるように、`SubtleCrypto.importKey()`が圧縮楕円曲線点のインポートをサポート。\n実験的機能として、Navigation APIとCustom media queriesを追加","relatedLinks":[{"title":"Firefox 146 release notes for developers (Stable) - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/146"}]},{"category":"Headline","title":"Chrome 144 beta  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/chrome-144-beta?hl=en","tags":["Chrome","ReleaseNote"],"content":"Chrome 144 Betaリリース。\nCSSの擬似要素でページ内検索の擬似要素として`::search-text`をサポート、`@scroll-state`がscrolledをサポート。\nView Transitionsの`waitUntil()`メソッド、`<geolocation>`要素、Temporal API、`clipboardchange`イベントをサポートなど。\nPrivacy Sandboxで実装されていた機能を非推奨化など","relatedLinks":[]},{"category":"Headline","title":"poppinss/ts-exec: Execute TypeScript on Node using SWC","url":"https://github.com/poppinss/ts-exec","tags":["nodejs","TypeScript","Tools"],"content":"`ts-node`や`tsx`のようにTypeScriptをNode.jsで実行するためのツール。\nSWCをベースにしている","relatedLinks":[]},{"category":"Article","title":"Making complex web apps faster - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2025/12/09/making-complex-web-apps-faster/","tags":["performance","article","browser","proposal"],"content":"Long TaskなどによってpostMessageなどのメッセージの遅延をPerformanceObserverで検知するDelayed Message TimingのProposalについて","relatedLinks":[{"title":"delayed-message-timing/README.md at main · WICG/delayed-message-timing","url":"https://github.com/WICG/delayed-message-timing/blob/main/README.md"}]},{"category":"Article","title":"Useful patterns for building HTML tools","url":"https://simonwillison.net/2025/Dec/10/html-tools/","tags":["HTML","Tools","article","LanguageModel"],"content":"LLMを使ったHTMLツールを作るときのパターンについて\nReactやビルドステップなしでツールを作る方法、CDNからの依存関係のロード、URLやlocalStorageでの状態管理の方法。\nCORS対応のAPIの利用やファイル処理やホスティングについて","relatedLinks":[]},{"category":"Article","title":"Open Sourcing the Remix Store | Remix","url":"https://remix.run/blog/oss-remix-store","tags":["Remix","article"],"content":"Remix Storeのオープンソース化と実装について","relatedLinks":[]},{"category":"Article","title":"How We&#039;re Protecting Our Newsroom from npm Supply Chain Attacks | pnpm","url":"https://pnpm.io/blog/2025/12/05/newsroom-npm-supply-chain-security","tags":["pnpm","security","article"],"content":"pnpmのサプライチェーンセキュリティ対策の機能についての紹介。\nライフサイクルスクリプトの管理、minimumReleaseAge、trustPolicyについて","relatedLinks":[]},{"category":"WebsiteDocument","title":"gaearon/rscexplorer: A tool for people curious about the React Server Components protocol","url":"https://github.com/gaearon/rscexplorer","tags":["React","server","Tools","webservice"],"content":"React Server Componentがどのように動くのかをステップごとに確認できるツール。\nRSCのFlightプロトコルでのやり取りやReactのServerとClientがどのように連携しているのかを可視化している","relatedLinks":[]}]},{"meta":{"title":"2025-12-30のJS: Next.js 16.1、Vue 3.6.0 beta 1、CSS Wrapped 2025","author":"azu","layout":"post","date":"2025-12-30T03:24:03.272Z","category":"JSer","tags":["TypeScript","Tools","JSON","storybook","security"],"url":"https://jser.info/2025/12/30/next.js-16.1-vue-3.6.0-beta-1-css-wrapped-2025/"},"items":[{"category":"Headline","title":"Security advisory","url":"https://storybook.js.org/blog/security-advisory/","tags":["storybook","ReleaseNote","security"],"content":"Storybookに`.env`がbundleされてしまう問題があったため、7.x/8.x/9.x/10.xにそれぞれアップデートが公開されている。","relatedLinks":[]},{"category":"Headline","title":"Next.js 16.1 | Next.js","url":"https://nextjs.org/blog/next-16-1","tags":["Next.js","ReleaseNote"],"content":"Next.js 16.1リリース。\nTurbopackのFile System Cacheが`next dev`でも利用できるように、`next dev --inspect`を追加、`next upgrade`コマンドを追加。\n実験的機能としてBundle Analyzerを統合など","relatedLinks":[]},{"category":"Headline","title":"Release v3.6.0-beta.1 · vuejs/core","url":"https://github.com/vuejs/core/releases/tag/v3.6.0-beta.1","tags":["Vue","ReleaseNote"],"content":"Vue 3.6.0 Beta 1リリース。\nVapor モードの追加など","relatedLinks":[]},{"category":"Article","title":"Standard JSON Schema","url":"https://standardschema.dev/json-schema","tags":["JSON","article","JavaScript","TypeScript"],"content":"Standard SchemaのJSON Schemaの対応について","relatedLinks":[]},{"category":"Article","title":"Introducing RSC Explorer — overreacted","url":"https://overreacted.io/introducing-rsc-explorer/","tags":["article"],"content":"RSC Explorerについて","relatedLinks":[]},{"category":"Article","title":"CSS Wrapped 2025","url":"https://chrome.dev/css-wrapped-2025/","tags":["css","article"],"content":"2025年のCSSの機能の振り返り","relatedLinks":[]},{"category":"Article","title":"第三者のJavaScriptをセキュアに実行するには？― exaBase Studio のプラグイン機能","url":"https://zenn.dev/exwzd/articles/20251204_studio_plugin","tags":["JavaScript","article"],"content":"JavaScriptのコードをサンドボックスで実行するアプローチについて。\niframe/Secure ECMAScript/QuickJSについて","relatedLinks":[]},{"category":"Article","title":"Fixing the URL params performance penalty - Web Performance Calendar","url":"https://calendar.perfplanet.com/2025/fixing-the-url-params-performance-penalty/","tags":["URL","article","SEO","cdn"],"content":"URLパラメータをCDNがキャッシュしていいかを定義する`No-Vary-Search` HTTPヘッダについて。\nキーの順序の定義、取り除いてもいいパラメータなどを定義できる","relatedLinks":[]},{"category":"Article","title":"Third Parties and Single Points of Failure - Web Performance Calendar","url":"https://calendar.perfplanet.com/2025/third-parties-and-single-points-of-failure/","tags":["browser","performance","JavaScript","article"],"content":"サードパーティスクリプトが単一障害点となっているかをチェックする方法について","relatedLinks":[]},{"category":"Article","title":"The many, many, many JavaScript runtimes of the last decade • Buttondown","url":"https://buttondown.com/whatever_jamie/archive/the-many-many-many-javascript-runtimes-of-the-last-decade/","tags":["JavaScript","article","history"],"content":"この10年で登場したJavaScriptランタイムについてまとめた記事","relatedLinks":[]},{"category":"Article","title":"Node.jsのSingle Executable Applications (SEA) で作る、配布しやすいNode.js アプリ","url":"https://zenn.dev/yamachu/articles/abaad71eaa30fe","tags":["nodejs","article"],"content":"Node.jsのSEAで単一実行バイナリを作成する方法、Chrome拡張とNative Messaging Hostでメッセージングする方法について","relatedLinks":[]},{"category":"WebsiteDocument","title":"bellard/mquickjs: Public repository of the Micro QuickJS Javascript Engine","url":"https://github.com/bellard/mquickjs?tab=readme-ov-file","tags":["JavaScript","Tools","library"],"content":"組み込み向けのJavaScriptエンジン。\nES5レベルのサブセットの実装で、QuickJSと似たC APIなどを持つが、メモリ消費量を抑える実装になっている。","relatedLinks":[]}]},{"meta":{"title":"2026-01-08のJS: zod v4.3.0、Flint、pnpm in 2025","author":"azu","layout":"post","date":"2026-01-08T12:56:28.201Z","category":"JSer","tags":["pnpm","TypeScript","React","Tools","css"],"url":"https://jser.info/2026/01/08/zod-v4.3.0-flint-pnpm-in-2025/"},"items":[{"category":"Headline","title":"Release pnpm 10.27 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v10.27.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v10.27.0リリース。\n`trustPolicy: no-downgrade`の厳格性を緩和するために、公開から一定時間経ったものは対象外にする`trustPolicyIgnoreAfter`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Release v4.3.0 · colinhacks/zod","url":"https://github.com/colinhacks/zod/releases/tag/v4.3.0","tags":["TypeScript","JSON","library","ReleaseNote"],"content":"zod v4.3.0リリース。\nJSONスキーマからZodに変換する`z.fromJSONSchema()`の追加、`z.xor()`を追加。\n部分的なrecordバリデーションの`z.looseRecord()`、`undefined`値を許容しない`.exactOptional()`を追加。\n`.apply()`メソッドの追加、`check()`メソッドのaliasとして`.with()`メソッドを追加。\n`ZodMap`に`min`/`max`/`nonempty`/`size`メソッドを追加、`z.slugify()`変換を追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing Rspack 1.7 - Rspack","url":"https://rspack.rs/blog/announcing-1-7","tags":["rspack","ReleaseNote"],"content":"Rspack 1.7リリース。\nSWCプラグインの互換性改善、Import Bytes proposalのサポート、lazy compilationをデフォルトで有効化。\nConstant inlining/TypeScript Enum inlining/Type re-export checkの最適化を安定化。\nRsbuild 1.7では実行時エラーのオーバーレイ表示/ファイルサイズの差分表示を追加。\nRslib 0.19ではESM出力が安定化、JavaScript APIの追加など","relatedLinks":[]},{"category":"Headline","title":"feat: add llms.txt endpoint for LLM-optimized documentation by quantizor · Pull Request #2388 · tailwindlabs/tailwindcss.com","url":"https://github.com/tailwindlabs/tailwindcss.com/pull/2388#issuecomment-3717222957","tags":["company","css","news"],"content":"Tailwindの開発元であるTailwind Labの収入が大きく減少したため、エンジニアリングチームの75%にあたる3名をレイオフしたという話","relatedLinks":[{"title":"Adam","url":"https://adams-morning-walk.transistor.fm/episodes/we-had-six-months-left"}]},{"category":"Article","title":"Introducing Flint | Flint","url":"https://www.flint.fyi/blog/introducing-flint/","tags":["ESLint","Tools","article"],"content":"TypeScript-ESLintのメンテナー中心で書かれた実験的なハイブリッドリンター。\nTypeScriptで書かれたコアとnative speed(Go/Rust)のパーサーを組み合わせることで、パフォーマンスと開発者の親しみやすさの両立を目指している。\nアーキテクチャ面では、ハイブリッドコア/TypeScriptの型情報を常に利用/クロスファイルキャッシュ/JSON/Markdown/YAMLの組み込みサポート/Prettierとの統合などを採用。\nLintはエラーのみとし、インタラクティブなCLI、オプション名の標準化、プラグインレジストリなどを用意する予定","relatedLinks":[{"title":"What Flint Does Differently | Flint","url":"https://www.flint.fyi/blog/what-flint-does-differently/"}]},{"category":"Article","title":"Introducing CSS Grid Lanes | WebKit","url":"https://webkit.org/blog/17660/introducing-css-grid-lanes/","tags":["css","article"],"content":"`display: grid-lanes`のGrid Lanesについて","relatedLinks":[]},{"category":"Article","title":"🚀 pnpm in 2025 | pnpm","url":"https://pnpm.io/blog/2025/12/29/pnpm-in-2025","tags":["pnpm","security","article"],"content":"pnpmの2025年の振り返り記事。\nv10.0でライフサイクルスクリプトをデフォルトで無効化、`minimumReleaseAge`や`trustPolicy: no-downgrade`などのセキュリティ機能の追加。\nv10.12でGlobal Virtual Storeの追加、v10.9でJSRのネイティブサポート、Config Dependencies機能の追加。\nv10.14/v10.21で`devEngines.runtime`による自動ランタイム管理のサポートなど","relatedLinks":[]},{"category":"Article","title":"How to compile JavaScript to C with Static Hermes","url":"https://devongovett.me/blog/static-hermes.html","tags":["JavaScript","article","Tools"],"content":"Static Hermesを使ってJavaScriptをC言語コードにコンパイルし、CのコードとしてRustから呼び出すという実装について","relatedLinks":[]},{"category":"Article","title":"Fixing TypeScript Performance Problems: A Case Study | Viget","url":"https://www.viget.com/articles/fixing-typescript-performance-problems","tags":["TypeScript","article"],"content":"TypeScriptのコンパイルパフォーマンスのデバッグ方法について","relatedLinks":[]},{"category":"Article","title":"Data Fetching Patterns in React Server Components","url":"https://gauravthakur.com/blog/data-fetching-patterns-react-server-components","tags":["React","article"],"content":"クライアントサイドレンダリング、サーバサイドレンダリング、React Server Componentのレンダリングにおける転送されるデータの違いについて可視化した記事","relatedLinks":[]},{"category":"SlideVideo","title":"vjeux/webcodecs-nodejs-10k-challenge: Let&#039;s get WebCodec to the server","url":"https://github.com/vjeux/webcodecs-nodejs-10k-challenge/","tags":["nodejs","JavaScript","video","library"],"content":"Node.jsでWebCodecs APIを動かすWebCodecs Node.js 10k Challengeの結果が公開され、7つのプロジェクトが採用された。","relatedLinks":[]},{"category":"Book","title":"jotaiによるReact再入門","url":"https://zenn.dev/uhyo/books/learn-react-with-jotai","tags":["React","book"],"content":"Reactとjotaiについて","relatedLinks":[]}]},{"meta":{"title":"JSer.info 15周年: 15年間のJavaScriptを振り返る","author":"azu","layout":"post","date":"2026-01-16T00:00:00.000Z","category":"Article","tags":["JSer"],"url":"https://jser.info/2026/01/16/jser-info-15th/"},"items":[]},{"meta":{"title":"2026-01-17のJS: Node.js のセキュリティアップデート、Chrome 144、Firefox 147、Electron 40","author":"azu","layout":"post","date":"2026-01-17T12:26:47.957Z","category":"JSer","tags":["Tools","nodejs","AI","MCP","security"],"url":"https://jser.info/2026/01/17/node.js-chrome-144-firefox-147-electron-40/"},"items":[{"category":"Headline","title":"ESLint v10.0.0-rc.0 released - ESLint - Pluggable JavaScript Linter","url":"https://eslint.org/blog/2026/01/eslint-v10.0.0-rc.0-released/","tags":["ESLint","ReleaseNote"],"content":"ESLint v10.0.0 RC.0リリース。\n`RuleTester`の改善、`max-params`ルールに`countThis`オプションを追加","relatedLinks":[]},{"category":"Headline","title":"Release 3.0.0-rc1 · qunitjs/qunit","url":"https://github.com/qunitjs/qunit/releases/tag/3.0.0-rc1","tags":["JavaScript","library","ReleaseNote","test"],"content":"QUnit 3.0.0-rc1リリース。\nNode.js 16以下のサポートとPhantomJSのサポートを削除。\nネイティブESM対応の追加、デフォルトで3秒のテストタイムアウトを有効化、`assert.expect()`から`assert.step()`を除外する変更。\nHTML Reporterのデザイン刷新とパフォーマンス、各種警告をエラーへ変更など","relatedLinks":[]},{"category":"Headline","title":"Alpha release of moon v2 now available! | moonrepo","url":"https://moonrepo.dev/blog/moon-v2-alpha","tags":["JavaScript","Tools","ReleaseNote"],"content":"moon v2 αリリース。\nYAML以外の設定ファイルをサポート、ツールチェインをWasmプラグインで実行されるように変更など","relatedLinks":[]},{"category":"Headline","title":"Release @pandacss/dev@1.8.0 · chakra-ui/panda","url":"https://github.com/chakra-ui/panda/releases/tag/%40pandacss%2Fdev%401.8.0","tags":["css","library","ReleaseNote","MCP"],"content":"Panda CSS 1.8.0リリース。\n`panda init-mcp`でMCPサーバの設定ができるように","relatedLinks":[{"title":"MCP Server | Panda CSS - Panda CSS","url":"https://panda-css.com/docs/ai/mcp-server"}]},{"category":"Headline","title":"Bun v1.3.6 | Bun Blog","url":"https://bun.com/blog/bun-v1.3.6","tags":[],"content":"Bun v1.3.6リリース。\ntarファイルを扱う`Bun.Archive` API、コメント付きJSONを扱う`Bun.JSONC` APIの追加。\n`Bun.build()`にesbuild互換のmetafileオプションを追加。\nWebSocketがHTTP/HTTPSプロキシをサポート、S3 Requester Paysのサポート。\n各種パフォーマンスの改善、Node.js互換性の改善など。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Tuesday, January 13, 2026 Security Releases","url":"https://nodejs.org/en/blog/vulnerability/december-2025-security-releases","tags":["nodejs","security","ReleaseNote"],"content":"Node.js 20.20.0/22.22.0/24.13.0/25.3.0のセキュリティリリース。\n8件の脆弱性が修正されている。\n`Buffer.alloc`や`TypedArray`が初期化されていないメモリを含む可能性があるRace Conditionの修正（CVE-2025-55131）。\nシンボリックリンクを使ったPermission Modelのバイパスの修正（CVE-2025-55130）。\n不正なHTTP/2 HEADERSフレームでサーバがクラッシュする問題の修正（CVE-2025-59465）。\nまた、`async_hooks`有効時にスタックオーバーフローエラーがキャッチできない問題、TLSクライアント証明書処理のメモリリークなども修正されている。","relatedLinks":[{"title":"Node.js — Mitigating Denial-of-Service Vulnerability from Unrecoverable Stack Space Exhaustion for React, Next.js, and APM Users","url":"https://nodejs.org/en/blog/vulnerability/january-2026-dos-mitigation-async-hooks"}]},{"category":"Headline","title":"Chrome 144  |  Release notes  |  Chrome for Developers","url":"https://developer.chrome.com/release-notes/144","tags":["Chrome","ReleaseNote"],"content":"Chrome 144リリース。\nCSSの`::search-text`でページ内検索のスタイリングをサポート、`@scroll-state: scrolled`をサポート、View Transitionsの`waitUntil()`を追加。\n`<geolocation>`要素の追加、Temporal APIのサポート、`clipboardchange`イベントの追加。\nWebGPUのUniform buffer標準レイアウトで16バイトアライメント要件を削除、`subgroup_id`機能の追加。\nPrivacy Sandboxで実装されていた機能を非推奨化など","relatedLinks":[{"title":"New in Chrome 144  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/new-in-chrome-144"}]},{"category":"Headline","title":"Copilot SDK in technical preview - GitHub Changelog","url":"https://github.blog/changelog/2026-01-14-copilot-sdk-in-technical-preview/","tags":["AI","nodejs","python","golang",".net","library"],"content":"GitHub Copilot SDKがテクニカルプレビューとして公開された。\nNode.js/TypeScript、Python、Go、.NETの4つの言語で利用可能。\nGitHub Copilot CLIへプログラムからアクセスするためのSDKで、マルチターン会話やカスタムツールの定義、クライアント/セッションのライフサイクル管理ができる。","relatedLinks":[]},{"category":"Headline","title":"Firefox 147.0, See All New Features, Updates and Fixes","url":"https://www.firefox.com/en-US/firefox/147.0/releasenotes/","tags":["Firefox","ReleaseNote"],"content":"Firefox 147リリース。\nApple SiliconデバイスでのWebGPUの有効化。\nAccept-Languageヘッダーの`q`値を他のブラウザに合わせて調整。\nNavigation API、CSS anchor positioningのサポート、CSS Module Scriptsのサポート。\n`CompressionStream`/`DecompressionStream`がBrotliをサポート、Servie Workerで`type: module`をサポートなど","relatedLinks":[{"title":"Firefox 147 release notes for developers (Stable) - Mozilla | MDN","url":"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/147"}]},{"category":"Headline","title":"Prettier 3.8: Support for Angular v21.1 · Prettier","url":"https://prettier.io/blog/2026/01/14/3.8.0","tags":["JavaScript","Tools","ReleaseNote"],"content":"Prettier 3.8リリース。\nAngular v21.1の新構文である`@switch`ブロック内の連続した`@case`ステートメント、配列/オブジェクト/関数呼び出しでのSpread要素をサポート。\nMarkdownファイル内のAngularコードブロック（angular-ts、angular-html）のフォーマットに対応など","relatedLinks":[]},{"category":"Headline","title":"Electron 40.0.0 | Electron","url":"https://www.electronjs.org/blog/electron-40-0","tags":["Electron","ReleaseNote"],"content":"Electron 40.0.0リリース。\nChromium 144/Node.js 24.11/V8 14.4へアップグレード。\nレンダラープロセスからのクリップボードAPIの直接アクセスが非推奨に、macOSのdSYMファイルがzip形式からtar.xz形式に変更。\n`app.isHardwareAccelerationEnabled()`メソッドの追加、オフスクリーン描画でのHDRカラースペースの対応など。","relatedLinks":[]},{"category":"Headline","title":"Astro is joining Cloudflare","url":"https://blog.cloudflare.com/astro-joins-cloudflare/","tags":["astro","cloudflare","news"],"content":"Astro Technology CompanyがCloudflareに買収された。\nAstroはオープンソースでMITライセンスは維持される。\nまたAstro 6では、Vite Environmentsベースの開発サーバーによりローカル開発時にCloudflare Workersランタイム（workerd）で実行できるようになる予定。","relatedLinks":[]},{"category":"Article","title":"Node.js — Mitigating Denial-of-Service Vulnerability from Unrecoverable Stack Space Exhaustion for React, Next.js, and APM Users","url":"https://nodejs.org/en/blog/vulnerability/january-2026-dos-mitigation-async-hooks","tags":["nodejs","security","article"],"content":"Node.jsの`async_hooks`にスタックオーバーフローの問題があったことについて。\n`AsyncLocalStorage`はNext.jsやDatadogなど多くのフレームワークやツールで利用されているため、影響範囲が広くなっている。\nどのような仕組みでスタック領域の枯渇する問題が発生しているかについての解説","relatedLinks":[]},{"category":"Article","title":"Streaming JSON in just 200 lines of JavaScript","url":"https://krasimirtsonev.com/blog/article/streaming-json-in-just-200-lines-of-javascript","tags":["JavaScript","article","JSON"],"content":"JSONをストリーミングする方法についての記事。\nサーバー側で非同期データ（Promise）をプレースホルダーに変換し、NDJSON形式と`Transfer-Encoding: chunked`を使ってデータを段階的に送信する。\nクライアント側ではFetch APIでストリームを読み込み、プレースホルダーを実データに置き換える実装について。","relatedLinks":[]},{"category":"Article","title":"Introducing: React Best Practices - Vercel","url":"https://vercel.com/blog/introducing-react-best-practices","tags":["AI","article","React","JavaScript"],"content":"Vercelが10年以上のReact・Next.js最適化の知見をまとめた`react-best-practices`というリポジトリを公開した。\nAIエージェントやLLM向けに最適化されたルール集で、40以上のルールが8カテゴリに分類されている。\nウォーターフォールの排除、バンドルサイズ削減、再レンダリング最適化などのパターンを、CRITICALからLOWまでの優先度付きでまとめている。","relatedLinks":[{"title":"agent-skills/skills/react-best-practices at main · vercel-labs/agent-skills","url":"https://github.com/vercel-labs/agent-skills/tree/main/skills/react-best-practices"}]},{"category":"WebsiteDocument","title":"VibiumDev/vibium: Browser automation for AI agents and humans","url":"https://github.com/VibiumDev/vibium","tags":["Selenium","MCP","Tools"],"content":"Selenium BiDiベースのブラウザ操作をするMCPサーバ","relatedLinks":[]},{"category":"WebsiteDocument","title":"coder/ghostty-web: Ghostty for the web with xterm.js API compatibility","url":"https://github.com/coder/ghostty-web?tab=readme-ov-file","tags":["WebAssembly","library","terminal","JavaScript"],"content":"ブラウザ上で動作するターミナルエミュレータライブラリ。\n`libghostty`をWasmにコンパイルして利用し、xterm.js互換のAPIを提供する。\nxterm.jsと比較して複雑な文字体系の正しいグラフェム処理、XTPUSHSGR/XTPOPSGRのサポートなどがある。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"MotiaDev/motia: Multi-Language Backend Framework that unifies APIs, background jobs, queues, workflows, streams, and AI agents with a single core primitive with built-in observability and state management.","url":"https://github.com/MotiaDev/motia","tags":["nodejs","library"],"content":"Stepという単位で処理を書いていくバックエンドフレームワーク。\nStepは色々なJavaScriptやPythonなど色々な言語で書くことができる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vercel-labs/agent-browser: Browser automation CLI for AI agents","url":"https://github.com/vercel-labs/agent-browser","tags":["browser","console","Tools","AI"],"content":"AIエージェント向けのヘッドレスブラウザ自動化CLI。\nRustのCLIとNode.jsデーモン（Playwrightを利用）で構成され、クライアント・デーモン構造で動作する。\nアクセシビリティツリーからAI向けに最適化されたスナップショットを取得する機能や、ARIAロールやラベルでの要素検出、WebSocketでのブラウザビューポートのストリーミングなどを提供する。","relatedLinks":[]}]},{"meta":{"title":"2026-01-26のJS: jQuery 4.0.0、Rolldown 1.0 RC、Stylelint 17","author":"azu","layout":"post","date":"2026-01-26T09:51:49.217Z","category":"JSer","tags":["TypeScript","book","UI","WebAssembly","Vue"],"url":"https://jser.info/2026/01/26/jquery-4.0.0-rolldown-1.0-rc-styelelint-17/"},"items":[{"category":"Headline","title":"jasmine/release\\_notes/6.0.0.md at main · jasmine/jasmine","url":"https://github.com/jasmine/jasmine/blob/main/release_notes/6.0.0.md","tags":["JavaScript","testing","library","ReleaseNote","jasmine"],"content":"Jasmine 6.0.0リリース。\nNode.js 18のサポート終了、jasmine名前空間からprivate APIを削除など。\nHtmlReporterV2の追加。進捗バー、リアルタイム失敗表示、パフォーマンスタブなどを持つ新しいHTMLレポーター。\n`jasmine.pp()`としてpretty printer APIを公開、実験的な`safariYieldStrategy: \"time\"`オプションの追加など。","relatedLinks":[]},{"category":"Headline","title":"Experimental build mode for Hono and Express projects - Vercel","url":"https://vercel.com/changelog/experimental-build-mode-hono-express","tags":["vercel","Hono","express","TypeScript","news"],"content":"VercelがHonoとExpressプロジェクト向けの実験的なビルドモードを追加。\n`VERCEL_EXPERIMENTAL_BACKENDS=1`を環境変数に設定することで有効化でき、ログのルート別フィルターに対応。\nまた、相対インポート時のファイル拡張子が不要になり、TypeScriptのパスエイリアスに対応、ESMとCommonJSの相互運用性の向上などの改善が含まれる。","relatedLinks":[]},{"category":"Headline","title":"jQuery 4.0.0 | Official jQuery Blog","url":"https://blog.jquery.com/2026/01/17/jquery-4-0-0/","tags":["jQuery","ReleaseNote","library"],"content":"jQuery 4.0.0リリース。\njQueryの20周年の記念リリース。\nIE10以下のサポートを終了し、Edge Legacy/古いiOS/Android Browserなどのサポートを終了。\n`jQuery.isArray`/`jQuery.trim`/`jQuery.parseJSON`などの非推奨APIを削除。\n`jQuery.prototype`から`push`/`sort`/`splice`メソッドを削除。\nfocusイベントの順序をW3C仕様に合わせるように変更。\nソースコードをAMDからESモジュールに移行。\nTrusted TypesとCSPのサポートを改善。\nslim版からDeferredsとCallbacksを削除し、ファイルサイズを削減。\nIE11のサポートはjQuery 5.0で終了予定。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node.js 25.4.0 (Current)","url":"https://nodejs.org/en/blog/release/v25.4.0","tags":["nodejs","ReleaseNote"],"content":"Node v25.4.0リリース。\n`require(esm)`/モジュールコンパイルキャッシュ/`v8.queryObjects()`/`--heapsnapshot-near-heap-limit`がStableに変更。\n`http.setGlobalProxyFromEnv()`でグローバルプロキシを環境変数から設定する機能を追加。\n`util.convertProcessSignalToExitCode()`、subpath importsで`#/`から始まるパスの利用をサポート。\nnpm 11.7.0/SQLite 3.51.1などの依存関係のアップデートなど","relatedLinks":[]},{"category":"Headline","title":"Nuxt 4.3 · Nuxt Blog","url":"https://nuxt.com/blog/v4-3","tags":["Vue","library","ReleaseNote"],"content":"Nuxt v4.3リリース。\nNuxt v3のサポート期限を2026年7月31日まで延長。\n一箇所でアプリケーションのレイアウトを管理できる`appLayout`プロパティの追加、ISR/SWRでのPayload Extractionのサポート。\nページやMiddlewareからRoute Groupのメタ情報を利用できるようになるなど","relatedLinks":[]},{"category":"Headline","title":"Announcing Rolldown 1.0 RC | VoidZero","url":"https://voidzero.dev/posts/announcing-rolldown-rc","tags":["Rust","rollup","bundler","ReleaseNote"],"content":"Rolldown 1.0 RCリリース。\nRustで書かれたJavaScript/TypeScriptバンドラー。Rollupプラグインとの互換性を持つ。\nVite 8ではデフォルトのバンドラーとしてRolldownが利用される予定。","relatedLinks":[]},{"category":"Headline","title":"Release 17.0.0 · stylelint/stylelint","url":"https://github.com/stylelint/stylelint/releases/tag/17.0.0","tags":["CSS","Tools","ReleaseNote"],"content":"Stylelint 17.0.0リリース。\nNode.js 20.19.0未満のサポートを削除、CommonJSでのNode.js APIのサポートを削除、デフォルトの`fix`モードを`strict`に変更。\nCSS Nesting 対応の改善など","relatedLinks":[{"title":"stylelint/docs/migration-guide/to-17.md at main · stylelint/stylelint","url":"https://github.com/stylelint/stylelint/blob/main/docs/migration-guide/to-17.md"},{"title":"Stylelint v17 の主な変更点：ESM 移行と CSS Nesting 対応など","url":"https://zenn.dev/ryo_manba/articles/stylelint-v17-update"}]},{"category":"Article","title":"Roadmap 2026 | Biome","url":"https://biomejs.dev/blog/roadmap-2026/","tags":["biome","article"],"content":"Biome 2026年のロードマップ。\n2026年はHTML formatterのPrettier互換の安定化、SCSSサポート、JavaScript内の埋め込みCSS/GraphQLの改善を予定。\ncross-languageのlintルール、monorepo向けのworkspaces設定、LSPの拡張なども計画している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"DoneDeal0/superdiff: Superdiff provides a rich and readable diff for both arrays and objects. It supports stream and file inputs for handling large datasets efficiently, is battle-tested, has zero dependencies, and offer a top-tier performance.","url":"https://github.com/DoneDeal0/superdiff","tags":["JavaScript","library"],"content":"配列やオブジェクトの差分を検出するJavaScriptライブラリ。\nネストされたオブジェクトの比較、配列要素の追加・削除・移動の検出、ストリーミング処理による大規模データの比較にも対応している。\nデフォルトでWebWorker/worker_threadsを使い、メインスレッド外に処理を移せる仕組みなっている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"anomalyco/opentui: OpenTUI is a library for building terminal user interfaces (TUIs)","url":"https://github.com/anomalyco/opentui/tree/main","tags":["terminal","TypeScript","Zig","React","UI","library"],"content":"ReactやSolidJSを使ってターミナルUI（TUI）を構築するためのTypeScriptライブラリ。\nUIやイベントをTypeScriptのレイヤーで管理し、`Bun.FFI`でZigを使ったレンダリングを行う。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dy/jz: Minimal JS subset compiling to WASM","url":"https://github.com/dy/jz","tags":["JavaScript","WebAssembly","library"],"content":"JavaScriptのサブセット言語をWebAssemblyにコンパイルするコンパイラ。\nES2015+の構文のみをサポートし、パースしたサブセット言語からWATを出力し、WATをWasmへとコンパイルしている","relatedLinks":[{"title":"dy/subscript: Expression parser / evaluator.","url":"https://github.com/dy/subscript"},{"title":"dy/watr: wat to wasm compiler","url":"https://github.com/dy/watr"}]},{"category":"SoftwareLibrary","title":"DavidHDev/vue-bits: An open source collection of animated, interactive &amp; fully customizable Vue components for building stunning, memorable websites.","url":"https://github.com/DavidHDev/vue-bits","tags":["Vue","library","UI","animation"],"content":"Vueアプリケーション向けのアニメーション・インタラクティブなUIコンポーネントライブラリ。\nReact BitsをVueにポートしたライブラリ","relatedLinks":[{"title":"DavidHDev/react-bits: An open source collection of animated, interactive ","url":"https://github.com/DavidHDev/react-bits"}]},{"category":"Book","title":"gibbok/typescript-book: The Concise TypeScript Book: A Concise Guide to Effective Development in TypeScript. Free and Open Source.","url":"https://github.com/gibbok/typescript-book","tags":["TypeScript","book"],"content":"TypeScriptの入門書。\nTypeScriptのインストールから使い方、型システム、Generics、Box Typeなどについて。\nTypeScriptの機能を幅広くカバーしている。","relatedLinks":[]},{"category":"Book","title":"Server-Side WebAssembly - Danilo Chiarlone","url":"https://www.manning.com/books/server-side-webassembly","tags":["WebAssembly","book","server"],"content":"サーバサイドでのWebAssemblyについての書籍。\n著者は`wasi:http`とかのProposalを書いてる人","relatedLinks":[]},{"category":"Book","title":"Vanilla Web - Maximiliano Firtman","url":"https://www.manning.com/books/vanilla-web?a_aid=firtman&a_bid=14dcfdda&chan=mm_website","tags":["JavaScript","book","web"],"content":"フレームワークを使わずにバニラなWeb標準技術だけでWebアプリを構築する方法についての書籍。\n再利用可能なコンポーネント、ルーティングシステム、PWAなどをバニラJavaScript/HTML/CSSで行う方法を解説している書籍","relatedLinks":[{"title":"Vanilla Web Book 🆕 － firt.dev","url":"https://firt.dev/notes/vanilla-web-meap/"}]}]},{"meta":{"title":"2026-02-04のJS: Yarn 6 Preview、WebAssembly 10年、State of JavaScript 2025の結果公開","author":"azu","layout":"post","date":"2026-02-04T13:19:34.984Z","category":"JSer","tags":["Tools","Bun","security","playwright","WebAssembly"],"url":"https://jser.info/2026/02/04/yarn-6-preview-webassembly-10-state-of-javascript-2025/"},"items":[{"category":"Headline","title":"Release v8.0.0 · FullHuman/purgecss","url":"https://github.com/FullHuman/purgecss/releases/tag/v8.0.0","tags":["CSS","Tools","ReleaseNote"],"content":"PurgeCSS v8.0.0リリース。\nPostCSSプラグインのインポート方法がdefault importに変更。\nCLIに`--preserve-paths`オプションの追加、CSS変数で参照されるアニメーションの保持の改善など","relatedLinks":[]},{"category":"Headline","title":"Bun v1.3.7 | Bun Blog","url":"https://bun.com/blog/bun-v1.3.7","tags":["Bun","ReleaseNote"],"content":"Bun v1.3.7リリース。\nJSON5パーサーの`Bun.JSON5`、JSON Linesを扱う`Bun.JSONL`、ANSIテキストのラップを行う`Bun.wrapAnsi()`の追加。\nMarkdown形式でHeapやCPUのプロファイルを出力する`--heap-prof-md`/`--cpu-prof-md`フラグの追加。\n`Buffer.from(array)`/async-await/`array.flat()`などのパフォーマンス改善、HTTP/2の互換性の修正など。","relatedLinks":[]},{"category":"Headline","title":"Release v4.11.7 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v4.11.7","tags":["Hono","ReleaseNote","security"],"content":"Hono v4.11.7リリース。\n次の問題のセキュリティ修正を含むリリース\n\n- IP制限MiddlewareのIPv4アドレス検証バイパス\n- Cache Middlewareでprivateやno-storeなレスポンスがキャッシュされる問題\n- Serve Staticミドルウェア(Cloudflare Workers adapter)での内部アセットへのアクセス問題\n- hono/jsxのErrorBoundaryでのXSS","relatedLinks":[]},{"category":"Headline","title":"Release v0.0.58 · microsoft/playwright-mcp","url":"https://github.com/microsoft/playwright-mcp/releases/tag/v0.0.58","tags":["playwright","MCP","Tools","ReleaseNote"],"content":"playwright-mcp v0.0.58リリース。\n`playwright-cli`コマンドが追加され、コマンドでPlaywrightを操作できるように。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node.js 25.5.0 (Current)","url":"https://nodejs.org/en/blog/release/v25.5.0","tags":["nodejs","ReleaseNote"],"content":"Node v25.5.0リリース。\nSingle Executable Applications(SEA)の作成を簡略化する`--build-sea`フラグの追加。\n`fs.watch()`に`ignore`オプションを追加、SQLiteのdefensive modeをデフォルトで有効化。\n`node:test`に`expectedFailure`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Yarn 6 Preview | Yarn","url":"https://yarn6.netlify.app/blog/2026-01-28-yarn-6-preview/","tags":["yarn","Rust","ReleaseNote","JavaScript"],"content":"Yarn 6プレビュー版の公開。\nYarn 6はRustでの書き直しで行われ、パフォーマンスの改善。\nCorepackの代わりにYarnのバージョン管理をする`yarn switch`の追加、package.jsonの変更時に自動でインストールを行うLazy Installsがデフォルトに。\nJSの実装であるYarn 5は移行ステップとして数ヶ月内にリリース予定し、Rust実装のYarn 6は2026年Q3以降の予定。","relatedLinks":[]},{"category":"Headline","title":"Lodash Rolls Out Major Security Overhaul | OpenJS Foundation","url":"https://openjsf.org/blog/lodash-security-overhaul","tags":["lodash","JavaScript","library","security","ReleaseNote"],"content":"Lodash 4.17.23リリース。\n`_.unset`と`_.omit`関数のPrototype Pollutionの脆弱性を修正。\nプロジェクトのガバナンスとセキュリティ体制を刷新し、Technical Steering Committeeを設立。\nCodeQLによる静的解析、Renovateによる依存関係の自動更新、OpenSSF Scorecardの監視を導入。\nCIの再構築、Bunのサポート、Playwrightを使ったブラウザテストの再導入も行われている。","relatedLinks":[]},{"category":"Headline","title":"Release v1.58.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.58.0","tags":["playwright","testing","ReleaseNote"],"content":"playwright v1.58.0リリース。\n`_react`/`_vue`セレクタ、`:light`セレクタエンジン、`devtools`オプションの削除。\nmacOS 13でのWebKitサポートを終了。\nHTMLレポートのSpeedboardタブにTimelineを追加、UI ModeとTrace Viewerにシステムテーマオプションを追加や検索機能の追加など","relatedLinks":[]},{"category":"Headline","title":"Bun v1.3.8 | Bun Blog","url":"https://bun.com/blog/bun-v1.3.8","tags":["Bun","ReleaseNote"],"content":"Bun v1.3.8リリース。\nZigで書かれた組み込みのCommonMark準拠のMarkdownパーサー`Bun.markdown`を追加。\n`bun build --metafile-md`でLLMフレンドリーなモジュールグラフのメタデータを出力できるように。\nWindowsでの`npm install -g bun`のリグレッションを修正。","relatedLinks":[]},{"category":"Headline","title":"Release Version 28.0.0 · jsdom/jsdom","url":"https://github.com/jsdom/jsdom/releases/tag/28.0.0","tags":["JavaScript","DOM","library","ReleaseNote"],"content":"jsdom 28.0.0リリース。\nリソースローディングのカスタマイズAPIを刷新、`<iframe>`/`<frame>`要素でのMIMEタイプスニッフィングのサポート。\n`XMLHttpRequest`や`WebSocket`のリクエストが新しいリソースローディングのカスタマイズでインターセプト可能に。\nリダイレクト時の`document referrer`の修正、`XMLHttpRequest`のバグ修正など","relatedLinks":[]},{"category":"Article","title":"Bytecode Alliance — 10 Years of Wasm: A Retrospective","url":"https://bytecodealliance.org/articles/ten-years-of-webassembly-a-retrospective","tags":["WebAssembly","history","article"],"content":"WebAssemblyの誕生から10年を振り返る記事。\n2013年のasm.jsから始まり、MozillaのLuke WagnerとGoogleのBen Titzerの協力によってWebAssemblyが生まれた経緯を紹介している。\n2015年に主要ブラウザが同時に対応を発表し、2017年には全ブラウザが対応を完了した。\nその後、WASIやComponent Modelの開発によりブラウザ外での利用が広がった。\nWASIをPOSIXのコピーとしなかった点についてなど","relatedLinks":[]},{"category":"Article","title":"Custom DuckDB Wasm builds for Cloudflare Workers - tobilg.com","url":"https://tobilg.com/posts/custom-duckdb-wasm-builds-for-cloudflare-workers/","tags":["cloudflare","WebAssembly","duckdb","article"],"content":"Cloudflare Workers上でDuckDB WebAssemblyを動作させるためのカスタムビルドについて。\nDuckDBの既存のWasmビルドはブラウザ向けに設計されており、Workersの非同期環境では動作しないため、EmscriptenのAsyncifyを使った解決策を紹介している。\n@ducklings/workersパッケージを使うことで、Parquet/JSON/httpfs拡張機能を含むDuckDB Wasmをエッジで実行できる。","relatedLinks":[{"title":"tobilg/ducklings: A minimal DuckDB Wasm build for browsers and serverless environments like Cloudflare Workers","url":"https://github.com/tobilg/ducklings"}]},{"category":"Article","title":"State of JavaScript 2025","url":"https://2025.stateofjs.com/en-US","tags":["JavaScript","Survey"],"content":"State of JavaScript 2025のアンケート結果が公開された。\nJavaScriptの言語機能、フレームワーク、ライブラリ、ツール、テスト、AI活用などについてのアンケート結果がまとめられている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"LibPDF-js/core: A modern PDF library for TypeScript. Parse, modify, and generate PDFs with a clean, intuitive API.","url":"https://github.com/libpdf-js/core","tags":["PDF","TypeScript","library","JavaScript"],"content":"ブラウザやNode.jsなどで動くPDFの編集、作成ライブラリ。\nPDFの解析、修正、生成をサポートし、RC4/AES暗号化、デジタル署名、フォーム入力、ページのマージ/分割、テキスト抽出などに対応している。","relatedLinks":[]}]},{"meta":{"title":"2026-02-16のJS: TypeScript 6.0 Beta、State of React 2025の結果、Interop 2026","author":"azu","layout":"post","date":"2026-02-16T10:52:55.838Z","category":"JSer","tags":["browser","CSS","TypeScript","safari","Fetch"],"url":"https://jser.info/2026/02/16/typescript-6.0-beta-state-of-react-2025-interop-2026/"},"items":[{"category":"Headline","title":"Announcing TypeScript 6.0 Beta - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-6-0-beta/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 6.0 Betaリリース。\nTypeScript 7(Go言語ベース)への移行を見据えたリリースで、多くのデフォルト設定の変更や非推奨化が含まれる。\n`strict`がデフォルトで`true`に変更、`module`のデフォルトが`esnext`に変更、`target`のデフォルトが`es2025`に変更、`types`のデフォルトが`[]`に変更。\n`target: es5`/`--moduleResolution node10`/`--module amd|umd|system`/`--outFile`などを非推奨化。\nES2025の`RegExp.escape`やTemporalの型定義を追加、`lib.dom`に`dom.iterable`と`dom.asynciterable`を統合。\nTypeScript 7への移行を補助する`--stableTypeOrdering`フラグの追加など。","relatedLinks":[]},{"category":"Headline","title":"WebKit features for Safari 26.3 | WebKit","url":"https://webkit.org/blog/17798/webkit-features-for-safari-26-3/","tags":["safari","browser","ReleaseNote"],"content":"Safari 26.3リリース。\nzstdのサポート、Navigation APIの`NavigateEvent`に`AbortSignal`を公開し、ナビゲーション中断時に進行中の処理をキャンセルできるように。\nCSSの`position-try`や`text-decoration`、マルチカラムレイアウトに関するバグ修正など。","relatedLinks":[]},{"category":"Headline","title":"Biome v2.4—Embedded Snippets, HTML Accessibility, and Better Framework Support | Biome","url":"https://biomejs.dev/blog/biome-v2-4/","tags":["biome","ReleaseNote"],"content":"Biome v2.4リリース。\nJavaScript内に埋め込まれたCSSやGraphQLスニペットのFormatterとLintをサポート。\nHTMLアクセシビリティ向けの15個のLintルールの追加。\nVue/Svelte/Astroのサポート改善、CSSパーサーでVue SFCの`:slotted`や`:deep`に対応。\nSARIFレポーターの追加、`--skip`/`--only`フラグのサポートなど。","relatedLinks":[]},{"category":"Article","title":"Blog &gt; Writing Good Unit Tests","url":"https://eliocapella.com/blog/writing-good-unit-tests/","tags":["test","JavaScript","article"],"content":"ユニットテストの書き方についての記事。\n関数ではなく動作をテストすること、システム境界のみをモック化すること、インメモリデータベースの活用、HTTPのモックについてなど","relatedLinks":[]},{"category":"Article","title":"State of React 2025","url":"https://2025.stateofreact.com/en-US","tags":["React","Survey"],"content":"State of React 2025のアンケート結果が公開された。\nReactの機能、フレームワーク、状態管理、データフェッチング、メタフレームワーク、ツール、AI活用などについてのアンケート結果がまとめられている。","relatedLinks":[]},{"category":"Article","title":"The CSS Selection - 2026 Edition - Project Wallace","url":"https://www.projectwallace.com/the-css-selection/2026","tags":["CSS","article"],"content":"10万以上のウェブサイトを対象にした実際のCSS利用状況の調査レポート。\nWeb AlmanacのCSSの章の代替として、CSSファイルサイズ、プロパティの利用率、モダンCSS機能の採用率などをまとめている。\n`:where()` 91%、`:has()` 41%、`@container` 10%、`@layer` 2.7%などの採用率になっている。\nベンダープレフィックスやIE6時代のブラウザハックが依然として残っている点についても触れている。","relatedLinks":[]},{"category":"Article","title":"Interop 2026が始まりました！","url":"https://zenn.dev/yamanoku/articles/interop-2026-launched","tags":["browser","WebPlatformAPI","article"],"content":"ブラウザの相互運用性の向上を目指すプロジェクトであるInterop 2026について。\nApple、Google、Microsoft、Mozillaなどのブラウザベンダーが参加している。\nCSS Anchor Positioning、Container Style Queries、Navigation API、View Transitionsなどがフォーカスエリアに選ばれている。\nその他にもScroll-driven Animations、IndexedDB、WebRTC、WebTransportなど合計20の分野が対象となっている。\n調査対象としてアクセシビリティテスト、JPEG XL、モバイルテスト、WebVTTの4分野が含まれる。","relatedLinks":[{"title":"Launching Interop 2026 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2026/02/launching-interop-2026/"},{"title":"Announcing Interop 2026 | WebKit","url":"https://webkit.org/blog/17818/announcing-interop-2026/"},{"title":"Interop 2026 Focus Areas Announced | Igalia","url":"https://www.igalia.com/news/interop-2026.html"},{"title":"Interop 2026: Continuing to improve the web for developers | web.dev","url":"https://web.dev/blog/interop-2026"},{"title":"Microsoft Edge and Interop 2026 - Microsoft Edge Blog","url":"https://blogs.windows.com/msedgedev/2026/02/12/microsoft-edge-and-interop-2026/"}]},{"category":"Article","title":"Web フォントを使って contenteditable から脱出する","url":"https://techblog.lycorp.co.jp/ja/20260216c","tags":["CSS","fonts","article"],"content":"任意の大きさに変形できる空白の文字を持つウェブフォントとテキストのオーバレイを使ってテキストエリアに絵文字などの装飾を表示する方法について","relatedLinks":[]},{"category":"Article","title":"Roadmap 2026 (2026-02-04) | webpack","url":"https://webpack.js.org/blog/2026-04-02-roadmap-2026/","tags":["webpack","article"],"content":"webpack 2026年のロードマップ。\nCSS Modulesのネイティブサポート、TypeScriptのローダーなしでのビルド、HTMLエントリーポイントのプラグインなしでの利用をwebpack本体に組み込む予定。\nNode.js/Deno/Bunなどのクロスランタイム対応、Barrel Fileの遅延最適化、Minimizerプラグインの統合なども計画している。\nwebpack 6のリリースに向けた変更についても紹介されている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"npmx - Package Browser for the npm Registry","url":"https://npmx.dev/","tags":["npm","search","webservice"],"content":"npmレジストリのインクリメンタル検索サービス。\nAlgoliaによるパッケージ検索、パッケージの比較機能、npm/pnpm/yarn/bun/deno/vltなどのパッケージマネージャーに対応したインストールコマンドの表示などの機能がある。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"hamzaydia/verifyfetch: Resumable, verified downloads for large browser files. Fail at 3.8GB, resume from 3.8GB.","url":"https://github.com/hamzaydia/verifyfetch","tags":["JavaScript","library","Fetch","WebAssembly"],"content":"ブラウザでの大容量ファイルのダウンロードにおいて、レジューム対応と整合性の検証を行うライブラリ。\nWebAssemblyによるストリーミングハッシュ計算、HTTP Rangeリクエストによるレジュームダウンロード、IndexedDBへのChunk保存をサポートする。\n事前にファイルを一定のchunkで分けたハッシュを生成しておき、Chunk毎の検証ができる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"bikeshaving/shovel: Run Service Workers anywhere","url":"https://github.com/bikeshaving/shovel","tags":["ServiceWorker","server","library","nodejs","Bun","cloudflare"],"content":"Service Worker APIやWeb標準APIのインターフェースをベースにしたサーバアプリケーションを書けるメタフレームワーク。\nNode.js/Bun/Cloudflare Workersなどで動作する。\nService Workerの`install`/`activate`/`fetch`イベントをベースにしたサーバライフサイクルを持つ。\nFetch API、Cache API、FileSystem API、CookieStore API、URLPatternなどのWeb標準APIをベースとしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ubugeeei/vize: Unofficial High-Performance Vue.js Toolchain in Rust","url":"https://github.com/ubugeeei/vize","tags":["Vue","Rust","Tools","compiler"],"content":"Rustで書かれたVue.jsツールチェイン。\nVue SFCのコンパイラ、Linter、Formatter、型チェッカー、LSPなどを含む。\nCLI/Browser(WebAssembly)/Vite Pluginとして利用できる","relatedLinks":[]}]},{"meta":{"title":"2026-02-26のJS: Electrobun v1、Deno 2.7、Oxfmt Beta","author":"azu","layout":"post","date":"2026-02-26T14:48:54.395Z","category":"JSer","tags":["security","Tools","nodejs","React","AI"],"url":"https://jser.info/2026/02/26/electrobun-v1-deno-2.7-oxfmt-beta/"},"items":[{"category":"Headline","title":"Electrobun v1 - Blackboard Blog","url":"https://blackboard.sh/blog/electrobun-v1/","tags":["TypeScript","Bun","Zig","Electron","library","ReleaseNote"],"content":"TypeScriptでクロスプラットフォームのデスクトップアプリを作成できるフレームワーク。\nランタイムにBunを使い、ZigやC/C++で実装されている。\nウィンドウ管理/メニュー/グローバルショートカット/クリップボード/ダイアログなどのネイティブ機能をサポートしている。\n差分パッチによる自動アップデート機能、プロセス分離されたwebviewを`<electrobun-webview>`要素として扱える仕組みなどを持つ。\nmacOS/Windows/Ubuntuに対応している。","relatedLinks":[{"title":"blackboardsh/electrobun: Build ultra fast, tiny, and cross-platform desktop apps with Typescript.","url":"https://github.com/blackboardsh/electrobun"},{"title":"Electrobun Documentation - Build ultra fast, tiny, cross-platform desktop apps","url":"https://blackboard.sh/electrobun/docs/"}]},{"category":"Headline","title":"Release v4.12.0 · honojs/hono","url":"https://github.com/honojs/hono/releases/tag/v4.12.0","tags":["Hono","ReleaseNote"],"content":"Hono v4.12.0リリース。\nHono Clientに`$path()`メソッドの追加、SSG向けのredirect pluginの追加、Basic Authの`onAuthSuccess`コールバックの追加。\n`getConnInfo`がAWS Lambda/Cloudflare Pages/Netlifyに対応。\nTrieRouterのパフォーマンスの改善、`c.json()`のFast Pathの追加など","relatedLinks":[]},{"category":"Headline","title":"Oxfmt Beta | The JavaScript Oxidation Compiler","url":"https://oxc.rs/blog/2026-02-24-oxfmt-beta","tags":["JavaScript","Rust","Tools","ReleaseNote"],"content":"OxcのJavaScript FormatterであるOxfmtのβリリース。\nPrettierのJavaScript/TypeScriptの互換テストを100%パスするようになった。\nTailwind CSSのクラスソート、importのソート、`package.json`のフィールドソートの組み込みサポートなど","relatedLinks":[{"title":"Oxfmt | The JavaScript Oxidation Compiler","url":"https://oxc.rs/docs/guide/usage/formatter"}]},{"category":"Headline","title":"Node.js — Node.js 25.7.0 (Current)","url":"https://nodejs.org/en/blog/release/v25.7.0","tags":["nodejs","ReleaseNote"],"content":"Node v25.7.0リリース。\n`node:sqlite`モジュールがRelease Candidate(RC)に昇格。\nSingle Executable Applications(SEA)でESMエントリーポイントをサポート、\nHTTP/2でHTTP/1へのフォールバック設定として`http1Options`を追加。\n`Duplex.toWeb()`のtypeオプションを`readableType`にリネーム、`node:test`でSIGINT時に中断されたテストを表示するように。\n`fs.stat`に`throwIfNoEntry`オプションの追加、`zlib`でBrotli圧縮辞書のサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node.js 24.14.0 (LTS)","url":"https://nodejs.org/en/blog/release/v24.14.0","tags":["nodejs","ReleaseNote"],"content":"Node v24.14.0リリース。\n`async_hooks`の`createHook()`に`trackPromises`オプションの追加、`fs.watch()`に`ignore`オプションの追加。\n`http.setGlobalProxyFromEnv()`の追加、Subpath Importsで`#/`から始まるパスをサポート。\nSQLiteのdefensive modeをデフォルトで有効化、Embedder APIでESMの初期サポートを追加。\n`stream/consumers`に`bytes()`メソッドの追加、`node:test`の`run()`に`env`オプションの追加や`it.expectFailure`のサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Deno 2.7: Temporal API, Windows ARM, and npm overrides | Deno","url":"https://deno.com/blog/v2.7","tags":["deno","ReleaseNote"],"content":"Deno v2.7リリース。\nTemporal APIがstableに変更、Windows ARM(aarch64)のサポート。\n`package.json`の`overrides`フィールドのサポート、`deno install --compile`の追加。\n`CompressionStream`/`DecompressionStream`がBrotliをサポート、Web Crypto APIでSHA3アルゴリズムのサポート。\n`deno task`でglobstar(`**`)と`pipefail`のサポート、`deno compile --self-extracting`オプションの追加。\nWeb WorkerのDevToolsデバッグに対応、OpenTelemetryでDeno Cronの自動計装に対応。\nNode.js互換性の改善として`node:worker_threads`/`node:child_process`/`node:zlib`(Zstd)などの修正、V8 14.5へのアップデートなど。","relatedLinks":[]},{"category":"Headline","title":"npm bulk trusted publishing config and script security now generally available - GitHub Changelog","url":"https://github.blog/changelog/2026-02-18-npm-bulk-trusted-publishing-config-and-script-security-now-generally-available/","tags":["npm","security"],"content":"npm CLI v11.10.0リリース。\n`min-release-age`でパッケージの公開から一定日経過したものだけをインストールできるように。\n`npm trust`コマンドで複数パッケージのOIDC Trusted Publishingの設定を一括で行えるように。\n`--allow-git`フラグの追加により、git依存関係のインストール時のセキュリティ制御が可能に。`.npmrc`でgit実行パスを上書きすることで`--ignore-scripts`使用時でもコード実行が可能だった問題に対処している。\n`--allow-git=none`の利用が推奨されており、npm CLI v12でデフォルトになる予定。","relatedLinks":[{"title":"Release v11.11.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v11.11.0"}]},{"category":"Headline","title":"The React Foundation: A New Home for React Hosted by the Linux Foundation – React","url":"https://react.dev/blog/2026/02/24/the-react-foundation","tags":["React","OpenSource","community","organization","news"],"content":"React FoundationがLinux Foundation傘下に正式に設立された。\nReact、React Native、JSXなどのプロジェクトがMetaからReact Foundationへ移管される。\nプラチナメンバーとしてAmazon、Callstack、Expo、Huawei、Meta、Microsoft、Software Mansion、Vercelが参加。\n技術的なガバナンスはFoundation本体から独立して維持され、貢献者やメンテナーが技術的な方向性を決定する。\n今後数カ月でリポジトリやインフラの移管が進められる予定。","relatedLinks":[]},{"category":"Headline","title":"Release styled-components@6.3.7 · styled-components/styled-components","url":"https://github.com/styled-components/styled-components/releases/tag/styled-components%406.3.7","tags":["CSS","React","library","ReleaseNote"],"content":"styled-components v6.3.7リリース。\n`createGlobalStyle`がReact StrictModeやRSC(React Server Components)で正しく動作しない問題の修正。\npackage.jsonに`exports`フィールドを追加しESMの対応を改善など","relatedLinks":[]},{"category":"Article","title":"Clinejection — Compromising Cline&#039;s Production Releases just by Prompting an Issue Triager | Adnan Khan - Security Research","url":"https://adnanthekhan.com/posts/clinejection/","tags":["security","VSCode","AI","article"],"content":"ClineのGitHub Actionsワークフローに対する攻撃手法についての記事。\nAIを使ったIssueトリアージボットへのPrompt Injectionを起点に、GitHub Actionsのキャッシュポイズニングを組み合わせる攻撃手法について。\n攻撃が成功した場合、VSCode Marketplace/OpenVSX/npmの公開用トークンを取れる問題があり、実際にCline CLIのnpmパッケージが侵害されていた。","relatedLinks":[]},{"category":"Article","title":"Goodbye innerHTML, Hello setHTML: Stronger XSS Protection in Firefox 148 - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2026/02/goodbye-innerhtml-hello-sethtml-stronger-xss-protection-in-firefox-148/","tags":["Firefox","XSS","security","DOM","article"],"content":"Firefox 148で実装されたSanitizer APIについて。\n`innerHTML`はHTMLをフィルタリングせずに挿入するが、`setHTML()`は自動的にサニタイズしてXSSの原因となる危険な要素や属性を除去する。\nSanitizer APIのデフォルト設定やカスタム設定、Trusted Typesとの組み合わせについて。","relatedLinks":[]},{"category":"Article","title":"How we rebuilt Next.js with AI in one week","url":"https://blog.cloudflare.com/vinext/","tags":["Next.js","cloudflare","vite","article"],"content":"CloudflareによるNext.js互換フレームワークvinextについて。\nNext.jsのルーティング、React Server Components、Server Actionsなどの機能をViteベースで再実装している。","relatedLinks":[{"title":"cloudflare/vinext: Vite plugin that reimplements the Next.js API surface — deploy anywhere","url":"https://github.com/cloudflare/vinext"}]},{"category":"WebsiteDocument","title":"millionco/react-doctor: Let coding agents diagnose and fix your React code","url":"https://github.com/millionco/react-doctor","tags":["React","Tools","ESLint","performance","accessibility","AI"],"content":"Reactのコードベースを静的解析して、ヘルススコア(0〜100)を算出するツール。\n60以上のルールでstate/effects、パフォーマンス、アーキテクチャ、バンドルサイズ、セキュリティ、アクセシビリティなどをチェックできる。\n未使用のファイルやエクスポートの検出、Next.js/Vite/Remixなどのフレームワーク自動検出にも対応している。\nCLIやGitHub Actions、Node.js APIとして利用できる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"vercel-labs/portless: Replace port numbers with stable, named .localhost URLs. For humans and agents.","url":"https://github.com/vercel-labs/portless","tags":["Tools","server","nodejs","debug"],"content":"ポート番号の代わりに`myapp.localhost`のような名前付き`.localhost` URLを使えるようにする開発用プロキシツール。\n`portless proxy start`でデーモンを起動し、`portless myapp next dev`のように開発サーバーを起動する。\n`http://myapp.localhost:1355`のようなURLでアクセスできる。\nHTTP/2やHTTPSの証明書の自動生成に対応し、Next.js/Express/Nuxt/Vite/Astroなどのフレームワークで利用できる。","relatedLinks":[]}]},{"meta":{"title":"2026-03-12のJS: TypeScript 6.0 RC、Solid v2.0.0 Beta、Node.jsリリーススケジュールの変更","author":"azu","layout":"post","date":"2026-03-12T11:45:51.325Z","category":"JSer","tags":["npm","nodejs","TypeScript","React","Tools"],"url":"https://jser.info/2026/03/12/typescript-6.0-rc-solid-v2.0.0-beta-node.js/"},"items":[{"category":"Headline","title":"Release v6.3.0 · actions/setup-node","url":"https://github.com/actions/setup-node/releases/tag/v6.3.0","tags":["GitHub","nodejs","ReleaseNote"],"content":"setup-node v6.3.0リリース。\n`devEngines`フィールドのサポート","relatedLinks":[]},{"category":"Headline","title":"Release v2.0.0 Beta - The &lt;Suspense&gt; is Over · solidjs/solid","url":"https://github.com/solidjs/solid/releases/tag/v2.0.0-beta.0","tags":["Solid","JavaScript","ReleaseNote","library"],"content":"Solid v2.0.0 Betaリリース。\n非同期処理はファーストクラスとして、computationsがPromiseやasync iterablesを返せるようになった。\n`<Loading>`コンポーネントや`isPending`によるPending状態の追跡、`action()`と`createOptimistic`によるOptimistic Updateの仕組みを追加。\n`<Index>`を`<For keyed={false}>`へ変更、`createEffect`のcompute/applyフェーズの分離、`use:`ディレクティブの削除など。","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 6.0 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-6-0-rc/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 6.0 RCリリース。\nTypeScript 7(Go言語ベース)への移行を見据えたリリースで、多くのデフォルト設定の変更や非推奨化が含まれる。\nBetaからの変更として `import ... assert {...}`の廃止が延期された。\n`strict`がデフォルトで`true`に変更、`module`のデフォルトが`esnext`に変更、`target`のデフォルトが`es2025`に変更、`types`のデフォルトが`[]`に変更。\n`target: es5`/`--moduleResolution node10`/`--module amd|umd|system`/`--outFile`などを非推奨化。\nES2025の`RegExp.escape`やTemporalの型定義を追加、`lib.dom`に`dom.iterable`と`dom.asynciterable`を統合。\n`this`を使わない関数のcontext sensitivityの改善、`#/`で始まるsubpath importsのサポートを追加。\n`--moduleResolution bundler`と`--module commonjs`の組み合わせが可能に。\nTypeScript 7への移行を補助する`--stableTypeOrdering`フラグの追加など。","relatedLinks":[]},{"category":"Headline","title":"Astro 6.0 | Astro","url":"https://astro.build/blog/astro-6/","tags":["astro","ReleaseNote","cloudflare","Rust","Vite"],"content":"Astro 6.0リリース。\nViteのEnvironment APIを使った開発サーバーの刷新により、開発時にもCloudflare WorkersやBun/Denoなどの本番ランタイムで実行可能に。\nフォント管理を自動化するFonts APIの追加、リクエスト時にCMSやAPIのデータを取得できるLive Content Collectionsの追加。\nCSPのサポートが安定版に。\nNode.js 22以上が必須に変更、Vite 7/Shiki 4/Zod 4へのアップグレード。\nExperimentalとして、GoからRustベースに書き換えたコンパイラ、Queued Rendering、Route Caching APIの追加など。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Evolving the Node.js Release Schedule","url":"https://nodejs.org/en/blog/announcements/evolving-the-nodejs-release-schedule","tags":["nodejs","news"],"content":"Node.jsのリリースモデルを2026年10月から変更される。\n現在の年2回のメジャーリリースから年1回に変更し、すべてのリリースがLTSとなる。\n新しいリリースサイクルでは、Alpha Phase(10月〜3月)でBreaking Changesを許容し、Current Phase(4月〜10月)で安定化、その後30ヶ月のLTSフェーズとなる。\n奇数/偶数バージョンの区別がなくなり、バージョン番号がカレンダー年と対応する(Node.js 27は2027年など)。\nNode.js 26(2026年4月)が現行モデルの最後のリリースとなり、Node.js 27(2027年4月)から新しいスケジュールが適用される。","relatedLinks":[]},{"category":"Headline","title":"Chrome 146  |  Release notes  |  Chrome for Developers","url":"https://developer.chrome.com/release-notes/146","tags":["Chrome","ReleaseNote"],"content":"Chrome 146リリース。\nCSSのスクロール駆動アニメーション、`trigger-scope`プロパティのサポート。\n`meta name=\"text-scale\"`によるOS/ブラウザのテキストスケーリング設定の反映、Scoped Custom Element Registryのサポート。\n`Iterator.concat()`のサポート、Sanitizer APIの追加、WebAudioのPlayback Statistics APIの追加。\nWebGPUのCompatibility modeのサポート。","relatedLinks":[]},{"category":"Headline","title":"Get features faster with Chrome&#039;s two-week release cycle  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/chrome-two-week-release?hl=en","tags":["Chrome","browser","news"],"content":"Chromeのリリースサイクルを2026年9月(Chrome 153)から、4週間サイクルから2週間サイクルへ変更する。\nデスクトップ、Android、iOSが対象で、DevチャネルとCanaryチャネルは変更なし。\nExtended Stableチャネルは8週間サイクルのまま維持される。","relatedLinks":[]},{"category":"Headline","title":"RedwoodSDK 1.0: Getting Out of the Weeds | Blog | RedwoodSDK","url":"https://rwsdk.com/blog/redwood-v1-getting-out-of-the-weeds","tags":["cloudflare","React","library","ReleaseNote"],"content":"Cloudflare Workers向けのReactフレームワークであるRedwoodSDK 1.0リリース。\n旧RedwoodJSから方針を転換し、コード生成や暗黙的な規約に依存しない設計となっている。\nWeb標準API(fetch, Request, Response)をそのまま利用し、設定より合成(Composability)を重視するアーキテクチャを採用している。","relatedLinks":[{"title":"Release v1.0.0 · redwoodjs/sdk","url":"https://github.com/redwoodjs/sdk/releases/tag/v1.0.0"}]},{"category":"Article","title":"Temporal: The 9-Year Journey to Fix Time in JavaScript | Bloomberg JS Blog","url":"https://bloomberg.github.io/js-blog/post/temporal/","tags":["TC39","ECMAScript","JavaScript","article"],"content":"ECMAScript ProposalのTemporalがStage 4となりES2026に含まれることが決定するまでの経緯についての記事。\nJavaScriptの`Date`オブジェクトが抱えるミュータブルな設計、タイムゾーン対応の不足、曖昧なパースなどの問題と、それを解決するためにTemporalがどのように設計されたかを解説している。\nTemporalはイミュータブルな設計、タイムゾーンとカレンダーのネイティブサポート、ナノ秒精度などの特徴を持つ。\n`ZonedDateTime`/`Instant`/`PlainDate`/`PlainTime`などの型。`temporal_rs`やBloomberg/Google/Microsoft/Igaliaなど複数の組織による協力についても紹介されている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Announcing npmx: a fast, modern browser for the npm registry","url":"https://npmx.dev/blog/alpha-release","tags":["npm","webservice","search"],"content":"npmパッケージ検索サービスnpmx αリリース\nパッケージのダウンロード統計、依存関係の古さの警告、ESM/CJSのモジュール形式の検出、インストールサイズの分析などの機能を持つ。","relatedLinks":[]},{"category":"WebsiteDocument","title":"flatt-security/setup-takumi-guard-npm: GitHub Action to configure npm with Takumi Guard registry auth via OIDC","url":"https://github.com/flatt-security/setup-takumi-guard-npm","tags":["npm","security","Actions"],"content":"npmのパッケージインストールをセキュリティプロキシ経由にすることで、悪意あるパッケージをブロックするGitHub Action。\nnpm/pnpm/yarnに対応し、レジストリを`https://npm.flatt.tech/`に設定することでインストール時にパッケージをチェックする。\nGitHub OIDCを使った認証に対応し、Bot IDを設定することで監査ログやダッシュボードでの可視化が利用できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"aidenybai/react-grab: Select context for coding agents directly from your website","url":"https://github.com/aidenybai/react-grab/tree/main","tags":["React","Tools","AI","library"],"content":"Webサイト上のUI要素をInspectしてReactコンポーネント名やファイルパス、HTMLソースコードなどのコンテキスト情報をコピーできるツール。\nコピーした情報をCursorやClaude CodeなどのAIコーディングエージェントに渡して利用できる。\nNext.js/Vite/webpackに対応し、プラグインによるカスタマイズやPrimitives APIによる独自UIの構築にも対応している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"dupontcyborg/numpy-ts: Full NumPy, in TypeScript/JavaScript (94% coverage)","url":"https://github.com/dupontcyborg/numpy-ts","tags":["TypeScript","JavaScript","library","math"],"content":"PythonのNumPyをTypeScript/JavaScriptで再実装したライブラリ。\nNumPyの507関数のうち476関数をカバーしている。dtype指定、ブロードキャスト、線形代数演算、NumPyスタイルのスライス記法などをサポートする。\nTree-shakeableなモジュール構成で、Node.jsとブラウザの両方で動作する。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pbakaus/impeccable: The design language that makes your AI harness better at design.","url":"https://github.com/pbakaus/impeccable","tags":["AI","Design","CSS","Tools"],"content":"AIコーディングエージェント向けのフロントエンドデザインのスキルとコマンドのセット。\nタイポグラフィ、色彩、空間設計、モーション、インタラクション、レスポンシブデザイン、UXライティングなどのスキルを定義している。\nAIが生成するUI/UXデザインにおけるアンチパターンのガイダンスも含まれている。\nClaude Code、Cursor、Gemini CLIなどのAIツールに対応している。","relatedLinks":[]}]},{"meta":{"title":"2026-03-22のJS: Vite 8.0、Temporal Stage 4、Next.js 16.2","author":"azu","layout":"post","date":"2026-03-22T13:12:53.259Z","category":"JSer","tags":["Rust","vite","bundler","ECMAScript","Next.js"],"url":"https://jser.info/2026/03/22/vite-8.0-temporal-stage-4-next.js-16.2/"},"items":[{"category":"Headline","title":"Vite 8.0 is out! | Vite (main branch)","url":"https://main.vite.dev/blog/announcing-vite8","tags":["Vite","Rust","ReleaseNote","bundler"],"content":"Vite 8.0リリース。\nesbuild + Rollupの二重バンドラー構成をRustベースの統合バンドラーであるRolldownに置き換え。\nlightningcssがpeerDependencyから直接的な依存関係へ変更。\nビルトインのDevtools、TypeScriptのパスエイリアス解決(`resolve.tsconfigPaths`)のサポート。\nWebAssemblyのSSRサポート、ブラウザのコンソールログをdevサーバーのターミナルに転送する`server.forwardConsole`の追加など。","relatedLinks":[]},{"category":"Headline","title":"Vitest 4.1 is out! | Vitest","url":"https://vitest.dev/blog/vitest-4-1.html","tags":["vite","ReleaseNote","test"],"content":"Vitest 4.1リリース。\nVite 8のサポート、テストケースにタグを付けてフィルタリングできるTest Tags機能の追加。\n`test.extend`での型推論の改善、`aroundEach`/`aroundAll`フックの追加。\n`vi.defineHelper()`でスタックトレースからヘルパー関数の内部を除外できるように。\n`--detect-async-leaks`フラグで非同期リソースのリーク検出をサポート。\n`mockThrow()`/`mockThrowOnce()`の追加、Chai形式のmockアサーションのサポート。\nGitHub Actionsレポーターがジョブサマリーを自動生成するように、AIエージェント向けのAgentレポーターの追加など","relatedLinks":[]},{"category":"Headline","title":"Announcing Vite+ Alpha | VoidZero","url":"https://voidzero.dev/posts/announcing-vite-plus-alpha","tags":["vite","Rust","CLI","Tools","ReleaseNote"],"content":"Vite+ Alphaリリース。\nVite、Vitest、Rolldown、Oxlint、Oxfmtなどを統合したCLIツール。\n`vp dev`/`vp build`/`vp test`/`vp check`などのコマンドで、開発サーバ、ビルド、テスト、Lint、フォーマットを1つのツールで実行できる。\n`vp env`でのNode.jsバージョン管理、`vp run`でのmonorepoタスク実行とキャッシュ機能も提供する。\n当初は商用版として検討されていたが、MITライセンスでオープンソースとして公開された。","relatedLinks":[{"title":"voidzero-dev/vite-plus: Vite+ is the unified toolchain and entry point for web development. It manages your runtime, package manager, and frontend toolchain in one place.","url":"https://github.com/voidzero-dev/vite-plus/tree/main"}]},{"category":"Headline","title":"Nuxt 4.4 · Nuxt Blog","url":"https://nuxt.com/blog/v4-4","tags":["Vue","library","ReleaseNote"],"content":"Nuxt v4.4リリース。\nVue Router v5へのアップグレード、`createUseFetch`/`createUseAsyncData`を追加。\nレイアウトに型付きPropsを渡せるように、`useAnnouncer` composableと`<NuxtAnnouncer>`コンポーネントによるアクセシビリティの改善。\nルート生成にtrieデータ構造ベースの`unrouting`ライブラリを採用しパフォーマンスを改善。\n`useCookie`の`refresh`オプションの追加、`nuxt build --profile`でのビルドプロファイリングのサポートなど。","relatedLinks":[]},{"category":"Headline","title":"ECMAScript proposal updates @ 2026-03 | ECMAScript Daily","url":"https://ecmascript-daily.github.io/ecmascript/2026/03/16/ecmascript-proposal-update","tags":["ECMAScript","proposal","news","TC39"],"content":"TC39 113th meetingでのECMAScript Proposalのステージの変更まとめ。\nTemporalがStage 4となりES2026に含まれる。\nImport TextがStage 3へ、Error Stack AccessorがStage 2.7へ。\nCurtailing the Power of ThenablesがStage 2へ。","relatedLinks":[]},{"category":"Headline","title":"Nova 1.0 · Nova","url":"https://trynova.dev/blog/nova-1.0","tags":["Rust","JavaScript","ReleaseNote"],"content":"Nova 1.0リリース。\nRustで書かれた軽量な組み込み向けデータ指向アーキテクチャなJavaScriptエンジン。\nECMAScript仕様の完全な準拠にはまだ課題があり、RegExpのUnicodeサポートやPromiseのサブクラス化などに制限がある。\nセマンティックバージョニングを採用しアップデートを行なっていく予定。","relatedLinks":[]},{"category":"Headline","title":"Electron 41.0 | Electron","url":"https://www.electronjs.org/blog/electron-41-0","tags":["Electron","ReleaseNote"],"content":"Electron 41.0リリース。\nChromium 146、Node.js v24.14.0、V8 14.6へアップグレード。\nPDFの描画がout-of-process iframeを使った同一WebContents内での描画に変更。\nCookieの`changed`イベントに`inserted`などの変更理由を追加。\nASARの整合性チェックでダイジェストのサポート、Waylandでのフレームレスウィンドウのドロップシャドウとリサイズ境界の改善。\nMSIX auto updaterの互換性を追加、macOS向け`--disable-geolocation`フラグの追加。\nWebSocket認証を`login`イベントで処理できるように、`webPreferences.focusOnNavigation`オプションの追加など。","relatedLinks":[]},{"category":"Headline","title":"Bun v1.3.11 | Bun Blog","url":"https://bun.com/blog/bun-v1.3.11","tags":["Bun","ReleaseNote"],"content":"Bun v1.3.11リリース。\nOSのスケジューラを使ったcronジョブを登録する`Bun.cron` APIの追加、ANSIエスケープコードを考慮した文字列スライスを行う`Bun.sliceAnsi`の追加。\n`bun test`に`--path-ignore-patterns`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 11 Beta 0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v11.0.0-beta.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v11.0.0-beta.0リリース。\nPure ESMパッケージへの移行、Node.js 18-21のサポートを終了。\n`package.json`の`pnpm`フィールドの設定を`pnpm-workspace.yaml`へ移行、`pnpm server`コマンドの削除、`pnpm link`コマンドの変更など多くの破壊的変更を含む。\nパッケージメタデータの保存にSQLiteを使用するように変更、ストアバージョンの更新。\n`pnpm clean`コマンドで`node_modules`の削除、`pnpm audit --fix=update`でlockfileの更新による脆弱性の修正に対応。\n`config.yaml`のサポート、PnpmfileでESMフォーマット(`.pnpmfile.mjs`)をサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Next.js 16.2 | Next.js","url":"https://nextjs.org/blog/next-16-2","tags":["Next.js","React","ReleaseNote"],"content":"Next.js 16.2リリース。\n`next dev`の起動速度の改善、Server Componentsペイロードのデシリアライズの改善によるレンダリングの高速化。\n`next/link`に`transitionTypes`を追加、Server Functionの実行ログをターミナルに表示する機能の追加、ブラウザログをターミナルに表示する機能をデフォルトで有効化。\nHydrationエラーのデバッグ表示の改善、`next start`で`--inspect`フラグのサポート。\nAdapters APIがStableに変更。\n`create-next-app`がデフォルトで`AGENTS.md`を生成するように変更、`node_modules/next/dist/docs/`にドキュメントをバンドルするように変更など","relatedLinks":[{"title":"Next.js 16.2: AI Improvements | Next.js","url":"https://nextjs.org/blog/next-16-2-ai"},{"title":"Turbopack: What","url":"https://nextjs.org/blog/next-16-2-turbopack"}]},{"category":"Article","title":"TC39 Advances Temporal to Stage 4 Alongside Several ECMAScri...","url":"https://socket.dev/blog/tc39-advances-temporal-to-stage-4?utm_medium=feed","tags":["TC39","ECMAScript","proposal","article"],"content":"TC39 2026年3月ミーティングの結果について。\nTemporalがStage 4となりES2026に含まれることが決定した。","relatedLinks":[]},{"category":"Article","title":"External import maps, today! • Lea Verou","url":"https://lea.verou.me/blog/2026/external-import-maps-today/","tags":["JavaScript","module","article"],"content":"External Import Mapsをビルドツールなしで利用する方法について。\n`<script type=\"importmap\">`をDOMで動的に注入することで、外部ファイルとしてImport Mapを管理できる。`document.currentScript.after()`を使い`<script type=\"importmap\">`要素を挿入する。\nChrome 89+/Safari 16.4+/Firefox 108+で動作する。","relatedLinks":[{"title":"JSPM - JSPM 4.0 Release","url":"https://jspm.org/jspm-4.0-release"}]},{"category":"Article","title":"Edge.js: Running Node apps inside a WebAssembly Sandbox · Blog · Wasmer","url":"https://wasmer.io/posts/edgejs-safe-nodejs-using-wasm-sandbox","tags":["WebAssembly","nodejs","article"],"content":"WebAssemblyのSandboxでNode.js互換のアプリケーションを実行できるRuntime。\nNode.js v24互換で、Next.jsやAstroなどのフレームワークを動作させることができる。\nOSシステムコールとネイティブコードのみをWASIX経由でサンドボックス化し、JavaScriptエンジン自体はネイティブで実行するアーキテクチャとなっている。\nV8、JavaScriptCore、QuickJSなど複数のJSエンジンに対応している。","relatedLinks":[]},{"category":"WebsiteDocument","title":"unjs/impound: Builder-agnostic plugin to allow restricting import patterns in certain parts of your code-base.","url":"https://github.com/unjs/impound?tab=readme-ov-file","tags":["JavaScript","TypeScript","Tools","module","bundler","plugin"],"content":"特定のディレクトリからのimportを禁止するなどのパターンを定義できるunpluginプラグイン。\n正規表現、文字列、関数によるパターンマッチでimportの制限ルールを定義できる。\n`trace`オプションを有効にすると、ルールで禁止された結果をわかりやすく表示できる","relatedLinks":[]},{"category":"WebsiteDocument","title":"BrowserPod — Sandboxed Dev Environments in any Browser","url":"https://browserpod.io/","tags":["WebAssembly","nodejs","browser","webservice"],"content":"ブラウザ内でNode.jsなどのコードをサンドボックス実行できるプラットフォーム。\nWebAssemblyベースのランタイムエンジンを使い、WebWorkerによるマルチプロセス実行、仮想ファイルシステム、制御されたネットワークアクセスなどの機能を持つ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sam247/openredaction: Open Source PII detection and redaction for JavaScript/Typescript. Achieve enterprise compliance and unparalleled, lightning fast performance, all 100% local.","url":"https://github.com/sam247/openredaction","tags":["JavaScript","TypeScript","library","privacy","RegExp"],"content":"JavaScript/TypeScript向けのPII(個人識別情報)の検出とマスキングを行うライブラリ。\n正規表現パターンを使い、メールアドレス、電話番号、クレジットカード番号、政府発行IDなど50カ国以上のPIIパターンをサポートしている。","relatedLinks":[]}]},{"meta":{"title":"2026-04-06のJS: TypeScript 6.0、ES2026 RC、axiosサプライチェーン攻撃","author":"azu","layout":"post","date":"2026-04-06T01:32:51.276Z","category":"JSer","tags":["TypeScript","nodejs","security","Tools","React"],"url":"https://jser.info/2026/04/06/typescript-6.0-es2026-rc-axios/"},"items":[{"category":"Headline","title":"Announcing TypeScript 6.0 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-6-0/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 6.0リリース。\n現在のJavaScriptコードベースによる最後のリリースで、Goで書き直されたTypeScript 7.0への移行を準備するリリースとなる。\n`strict`がデフォルトで`true`に、`target`のデフォルトが`es2025`に、`module`のデフォルトが`esnext`に変更。\n`target: es5`、`--moduleResolution node`(node10)、`--outFile`、`--esModuleInterop false`などが非推奨となりエラーに変更。\n`es2025`ターゲットの追加、Temporal APIの型定義の追加、Map/WeakMapの`getOrInsert()`/`getOrInsertComputed()`メソッドの追加。\nNode.jsのSubpath Importsの`#/`のサポート、`--moduleResolution bundler`と`--module commonjs`の組み合わせをサポート。\nTypeScript 7.0の型順序に合わせる`--stableTypeOrdering`フラグの追加など","relatedLinks":[]},{"category":"Headline","title":"WebKit Features for Safari 26.4 | WebKit","url":"https://webkit.org/blog/17862/webkit-features-for-safari-26-4/","tags":["safari","browser","CSS","WebTransport","WebAuthentication","ReleaseNote"],"content":"Safari 26.4リリース。\nCSS Grid Lanesによるmasonry/ウォーターフォールスタイルのレイアウトのサポート、名前のみの`@container`クエリのサポート。\n`font-size: math`と`math-depth`プロパティのサポート。\nCSS Zoomの修正、Scroll-driven Animationsのパフォーマンス改善。\nWebTransportのサポート、Keyboard Lock APIのサポート、ReadableByteStreamのサポート。\nScoped Custom Element Registriesの改善、`Iterator.concat()`のサポート。\n`<img>`の`sizes`属性でのmath関数(`min()`/`max()`/`clamp()`)のサポート、SVGの`lighter`合成演算子のサポート。\nWebAuthnのPRF拡張のサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Release v20.0.0 · raineorshine/npm-check-updates","url":"https://github.com/raineorshine/npm-check-updates/releases/tag/v20.0.0","tags":["npm","Tools","ReleaseNote"],"content":"npm-check-updates v20.0.0リリース。\nnpm/yarn/pnpmの設定にあるminimum release ageの設定を自動的に読み取り、cooldownオプションとして適用するようになった。","relatedLinks":[]},{"category":"Headline","title":"Release ES2026 Candidate March 31st 2026 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2026-candidate-2026-03-31","tags":["ECMAScript","spec","ReleaseNote"],"content":"ECMAScript 2026のRelease Candidateが公開された。\nTC39によって2026年3月に承認され、2026年6月のEcma GAでの承認を経て正式リリースとなる予定。","relatedLinks":[]},{"category":"Headline","title":"Release v15.0.0 · sindresorhus/got","url":"https://github.com/sindresorhus/got/releases/tag/v15.0.0","tags":["nodejs","HTTP","library","ReleaseNote"],"content":"Got v15.0.0リリース。\nNode.js 22未満のサポートを削除、\n`promise.cancel()`を削除しAbortControllerの`signal`オプションに移行、`isStream`オプションの削除。\n`responseType: 'buffer'`が`Buffer`の代わりに`Uint8Array`を返すように変更。\nネイティブのFormData APIを利用するように変更、`strictContentLength`のデフォルトを`true`に変更。\nRFC 9110に準拠し300/304レスポンスの自動リダイレクトを廃止など","relatedLinks":[]},{"category":"Headline","title":"Release 4.18.0 · lodash/lodash","url":"https://github.com/lodash/lodash/releases/tag/4.18.0","tags":["lodash","JavaScript","library","security","ReleaseNote"],"content":"lodash 4.18.0リリース。\n`_.unset`と`_.omit`のPrototype Pollutionの脆弱性を修正、`_.template`のコードインジェクションの修正。\n`lodash.unset`や`lodash.template`などの個別パッケージが古いままだったのを修正して再公開。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node.js 25.9.0 (Current)","url":"https://nodejs.org/en/blog/release/v25.9.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v25.9.0リリース。\nテストランナーのモックモジュールAPIで`defaultExport`と`namedExports`オプションを`exports`オプションに統合。\n`--max-heap-size`フラグの追加、Web CryptoでTurboSHAKEとKangarooTwelveアルゴリズムのサポート。\nSEA(Single Executable Applications)でESMエントリポイントのコードキャッシュをサポート、実験的な`stream/iter`モジュールの追加。\n`AsyncLocalStorage`に`using`スコープの追加、REPLでのカスタムエラーハンドリングのサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Release v5.0.0 · lerna-lite/lerna-lite","url":"https://github.com/lerna-lite/lerna-lite/releases/tag/v5.0.0","tags":["monorepo","Tools","ReleaseNote"],"content":"lerna-lite v5.0.0リリース。\nNode.js 20のサポート終了、Conventional Changelogのレガシー設定ファイル読み込みの削除、`--remove-package-fields`オプションの削除。\n内部依存を自前の実装に置き換えることでインストールサイズを削減など","relatedLinks":[]},{"category":"Article","title":"Storybook MCP for React","url":"https://storybook.js.org/blog/storybook-mcp-for-react/","tags":["storybook","MCP","React","article"],"content":"Storybook MCPサーバについて。\nAIエージェントに既存のUIコンポーネントのメタデータ(ストーリー、API、ドキュメント)を提供するMCPサーバ。\n複数のStorybookを組み合わせて使うCompositionにも対応している。\nMCP Appsに対応して、チャットのレスポンスに直接Storyを埋め込めるようになっている。","relatedLinks":[]},{"category":"Article","title":"Node.js — Security Bug Bounty Program Paused Due to Loss of Funding","url":"https://nodejs.org/en/blog/announcements/discontinuing-security-bug-bounties","tags":["nodejs","security","article"],"content":"Node.jsのセキュリティバグバウンティプログラムの一時停止について。\n2016年からHackerOneのInternet Bug Bounty(IBB)プログラムを通じて運用されていたが、IBBプログラムの終了により資金が枯渇したため一時停止となった。\n資金の80%を発見、20%を修正へ割り当てているが、AIなどによる発見の拡大によりバランスが変わった。\n脆弱性の報告自体はHackerOneを通じて引き続き受け付けるが、報告者への金銭的な報酬はなくなる。専用の資金が確保できた場合にプログラムの再開を検討する予定","relatedLinks":[]},{"category":"Article","title":"Signals, the push-pull based algorithm — Willy Brauner","url":"https://willybrauner.com/journal/signal-the-push-pull-based-algorithm","tags":["JavaScript","article"],"content":"Signalにおけるpush-pullベースのリアクティブアルゴリズムについての解説記事。\nSignalの基本的な仕組みとして、値の変更時にサブスクライバーへ通知するPush型と、計算値を実際にアクセスされるまで遅延評価するPull型の組み合わせについて解説している。","relatedLinks":[]},{"category":"Article","title":"Core JavaScript and TypeScript Features Become Free in IntelliJ IDEA | The IntelliJ IDEA Blog","url":"https://blog.jetbrains.com/idea/2026/03/js-ts-free-support/","tags":["JetBrains","IDE","JavaScript","TypeScript"],"content":"IntelliJ IDEA v2026.1で、JavaScript/TypeScript/HTML/CSSのコア機能が無料で利用可能に。\nこれまでUltimate版のみで提供されていたWeb開発向けの機能が、Community Editionでも利用できるようになった。\nJS/TSのコード補完やリファクタリング、ESLint/Prettierの統合、Viteでのプロジェクト作成、npmスクリプトの実行、依存関係の脆弱性検出などが含まれる。","relatedLinks":[]},{"category":"Article","title":"axios Compromised on npm - Malicious Versions Drop Remote Access Trojan - StepSecurity","url":"https://www.stepsecurity.io/blog/axios-compromised-on-npm-malicious-versions-drop-remote-access-trojan","tags":["npm","security","article"],"content":"axiosのnpmパッケージに対するサプライチェーン攻撃について。\nソーシャルエンジニアリングによりメンテナーアカウントが乗っ取られ、悪意のある`axios@1.14.1`と`axios@0.30.4`が公開された。\nこれらのバージョンには`plain-crypto-js`というマルウェアが依存関係として追加されている。\npostinstallフックを通じてmacOS/Windows/Linux向けのRemote Access Trojan(RAT)をインストールする仕組みになっていた。","relatedLinks":[{"title":"Attackers Are Hunting High-Impact Node.js Maintainers in a C...","url":"https://socket.dev/blog/attackers-hunting-high-impact-nodejs-maintainers"},{"title":"The Hidden Blast Radius of the Axios Compromise - Socket","url":"https://socket.dev/blog/hidden-blast-radius-of-the-axios-compromise"}]},{"category":"WebsiteDocument","title":"Introducing EmDash — the spiritual successor to WordPress that solves plugin security","url":"https://blog.cloudflare.com/emdash-wordpress/","tags":["cloudflare","CMS","TypeScript","astro","security","OpenSource","wordpress"],"content":"CloudflareによるサーバーレスCMS。\nTypeScriptで書かれ、Astro 6.0をベースにしたオープンソース(MITライセンス)のCMS。\nプラグインを独立したサンドボックス環境(Dynamic Workers)で実行し、プラグイン起因のセキュリティ問題を解決するアーキテクチャを採用している。\nMCPやCLIによるAIエージェント連携、x402プロトコルによる決済統合などの機能も備えている。","relatedLinks":[]},{"category":"WebsiteDocument","title":"vercel-labs/emulate: Local API emulation for CI and no-network sandboxes","url":"https://github.com/vercel-labs/emulate","tags":["vercel","API","testing","CI","Tools","nodejs","server"],"content":"Vercel/GitHub/Google/Slack/AWS(S3/SQS)などのAPIをローカルでエミュレートするツール。\n外部APIのモックサーバとして利用できる。\n各サービスはステートフルにデータを保持し、OAuth 2.0フローやWebhookにも対応している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"ArrowJS — The first UI framework for the agentic era","url":"https://arrow-js.com/","tags":["JavaScript","TypeScript","WebAssembly","library"],"content":"ビルドステップなしで動作する軽量なUIフレームワーク。`reactive`、`html`、`component`の3つの関数で構成される。\nAI向けにWebAssemblyサンドボックス内でコンポーネントロジックを分離して実行する機能を持つ。","relatedLinks":[]},{"category":"Book","title":"React本格入門 | 技術評論社","url":"https://gihyo.jp/book/2026/978-4-297-15523-0","tags":["React","book"],"content":"2026年4月15日発売。\nReact 19をベースにした入門書。","relatedLinks":[]}]},{"meta":{"title":"2026-04-15のJS: pnpm 11 RC 0、webpack 5.106、Servo v0.1.0","author":"azu","layout":"post","date":"2026-04-15T11:20:00.406Z","category":"JSer","tags":["React","Rust","search","Next.js","security"],"url":"https://jser.info/2026/04/15/pnpm-11-rc-0-webpack-5.106-servo-v0.1.0/"},"items":[{"category":"Headline","title":"Release v1.5.0 · Pagefind/pagefind","url":"https://github.com/Pagefind/pagefind/releases/tag/v1.5.0","tags":["Rust","JavaScript","search","library","ReleaseNote"],"content":"Pagefind v1.5.0リリース。\nWeb Componentsベースの新しいUIシステムの追加、メタデータフィールドのデフォルトインデックス化による検索精度の向上、ダイアクリティカルマーク(発音区別符号)の対応を追加。\nCJK(中国語/日本語/韓国語)のクエリ自動セグメンテーション、Web Workerでの検索実行、インデックスチャンクのサイズ削減などパフォーマンスの改善。\nWindows ARM64のサポートを追加など","relatedLinks":[]},{"category":"Headline","title":"Webpack 5.106 | webpack","url":"https://webpack.js.org/blog/2026-04-08-webpack-5-106/","tags":["webpack","ReleaseNote"],"content":"webpack 5.106リリース。\nPlugin Validation Hook(`compiler.hooks.validate`)の追加。\nCSS Modulesのランタイムスタイル注入(`exportType: \"style\"`)のサポート。\n将来的にcss-loader/style-loader/mini-css-extract-pluginを廃止予定。\nCommonJSのTree Shaking改善、`create-webpack-app`ツールの追加。\n実験的な機能として、ES Stage 3のSource Phase Importsによる実験的なWebAssemblyサポート、oxc-parserのサポート。\nwebpack-cli 7.0.0ではNode.js 20.9.0+が必要となり、ネイティブTypeScriptサポートが追加されている。","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 11 RC 0 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v11.0.0-rc.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v11.0.0 rc.0リリース。\nPure ESMパッケージへの移行、Node.js 18-21のサポートを終了。\n`.npmrc`は認証/レジストリ設定のみに限定し、その他の設定は`pnpm-workspace.yaml`へ移行、`pnpm server`コマンドの削除など多くの破壊的変更を含む。\n`pnpm ci`コマンドの追加、`pnpm sbom`でのSBOM生成に対応。\n`minimumReleaseAge`のデフォルトを1日に設定、`blockExoticSubdeps`のデフォルトを`true`に変更などサプライチェーンセキュリティの強化。\nストアのインデックスにSQLiteを使用するように変更、`undici`の採用によるHTTPリクエストの改善など。","relatedLinks":[]},{"category":"Headline","title":"Bun v1.3.12 | Bun Blog","url":"https://bun.com/blog/bun-v1.3.12","tags":["Bun","ReleaseNote"],"content":"Bun v1.3.12リリース。\n`Bun.WebView`の追加、Markdownファイルをターミナルで直接実行できる`bun ./file.md`のサポート。\nインプロセスで動作するコールバックベースのcronスケジューラ`Bun.cron()`の追加。\nJavaScriptCoreのアップグレードにより、ES ProposalのStage 3のExplicit Resource Management(`using`/`await using`)のサポート。\ncgroupのCPU制限を考慮するように変更など","relatedLinks":[]},{"category":"Headline","title":"Servo is now available on crates.io - Servo aims to empower developers with a lightweight, high-performance alternative for embedding web technologies in applications.","url":"https://servo.org/blog/2026/04/13/servo-0.1.0-release/","tags":["servo","Rust","browser","ReleaseNote"],"content":"Servo v0.1.0リリース。\nRustで書かれた組み込み可能なWebレンダリングエンジンServoの`servo`クレートがcrates.ioで公開された。\nアプリケーションにWebレンダリング機能を組み込むためのEmbedding APIを提供する。\nLTSバージョンも導入され、半年ごとのメジャーアップグレードとセキュリティアップデートが提供される。","relatedLinks":[]},{"category":"Article","title":"Summary of CVE-2026-23869 - Vercel","url":"https://vercel.com/changelog/summary-of-cve-2026-23869","tags":["Next.js","React","security","vercel"],"content":"React Server Components(RSC)のDoS脆弱性の修正としてNext.js 15.5.15/16.2.3とReact 19.2.5がリリースされている。\nApp RouterのServer Functionエンドポイントに対して、細工されたHTTPリクエストを送ることで過剰なCPU消費を引き起こせる脆弱性。\nNext.js 13.x〜16.xが影響を受けている。","relatedLinks":[{"title":"Release 19.2.5 (April 8th, 2026) · facebook/react","url":"https://github.com/facebook/react/releases/tag/v19.2.5"}]},{"category":"Article","title":"The uphill climb of making diff lines performant - The GitHub Blog","url":"https://github.blog/engineering/architecture-optimization/the-uphill-climb-of-making-diff-lines-performant/","tags":["GitHub","React","performance","article"],"content":"GitHubのFiles changedタブのReactベースの実装におけるdiff行のパフォーマンス最適化について。\n1行あたり10〜15個のDOM要素と8〜13個のReactコンポーネントが必要だった構造を最適化している。\nコンポーネント数を2個に削減し、イベントハンドラをdata属性を活用した単一のハンドラに集約するなどの変更をした。\nTanStack Virtualによる仮想化の導入、重いCSSセレクタの削除、ドラッグ/リサイズ処理の再実装などでパフォーマンスを改善している。","relatedLinks":[]},{"category":"Article","title":"React Server Components Your Way | TanStack Blog","url":"https://tanstack.com/blog/react-server-components","tags":["React","RSC","TanStack","article"],"content":"TanStackにおけるReact Server Components(RSC)のアプローチについて。\nRSCをデータストリームとして扱い、一方向データフローとしてクライアント側でサーバーレンダリングされたUIの取得やキャッシュを制御できる設計になっている。\nサーバーがスロットを用意しクライアントが埋めるComposite Componentsという仕組みや、`createServerFn`による明示的なサーバー関数定義などの機能を提供する。","relatedLinks":[]},{"category":"Article","title":"The Intl API: The best browser API you&#039;re not using | Polypane","url":"https://polypane.app/blog/the-intl-api-the-best-browser-api-youre-not-using/","tags":["JavaScript","i18n","article"],"content":"Intl APIについての解説記事。\n`Intl.DateTimeFormat`/`Intl.RelativeTimeFormat`/`Intl.NumberFormat`などの日付や数値のフォーマットAPIを紹介している。\n`Intl.ListFormat`/`Intl.PluralRules`/`Intl.Segmenter`/`Intl.Collator`などの使い方について","relatedLinks":[]},{"category":"Article","title":"Under the hood of MDN&#039;s new frontend","url":"https://developer.mozilla.org/en-US/blog/mdn-front-end-deep-dive/","tags":["mdn","WebComponents","architecture","article"],"content":"MDNのフロントエンドアーキテクチャの刷新についての解説記事。\n旧フロントエンド(Yari)はCreate React Appベースで、eject後のwebpack設定の複雑化などの技術的負債を抱えていた。\nSassと最新CSSの混在や、`dangerouslySetInnerHTML`による静的コンテンツの埋め込みなどの課題もあった。\n新アーキテクチャではLitベースのWeb Componentsを採用し、独自のServer Components実装でSPAの課題を解決している。\nビルドツールをwebpackからRspackへ移行、Declarative Shadow DOMやBaselineプロジェクトを活用したブラウザ互換性の管理についても解説されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"yuku-toolchain/yuku: High-performance JavaScript/TypeScript compiler and toolchain in pure Zig 🦎","url":"https://github.com/yuku-toolchain/yuku","tags":["Zig","JavaScript","TypeScript","compiler","Tools"],"content":"Zigで書かれたJavaScript/TypeScriptコンパイラおよびツールチェーン。\nTest262でテストされていて、Pure Zigなのでクロスコンパイルが可能となっている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Diffs, from Pierre","url":"https://diffs.com/","tags":["JavaScript","CSS","library","diff"],"content":"diffレンダリングとコード表示のライブラリ。\nCSS GridとShadow DOMを活用してDOMノード数を削減しレンダリングの高速化やVirtualizationに対応している。\nStack型(統合表示)とSplit型(左右並列表示)の2つのレイアウトに対応し、Shikiベースの構文ハイライト/コメント/マージコンフリクト解決UIなどの機能を持つ。","relatedLinks":[]}]},{"meta":{"title":"2026-04-29のJS: Node.js 24.15.0(LTS)、Rspack 2.0、pnpm 11","author":"azu","layout":"post","date":"2026-04-29T01:03:52.597Z","category":"JSer","tags":["Tools","React","TypeScript","nodejs","AI"],"url":"https://jser.info/2026/04/29/node.js-24.15.0lts-rspack-2.0-pnpm-11/"},"items":[{"category":"Headline","title":"v1.17.0 | React Aria","url":"https://react-aria.adobe.com/releases/v1-17-0","tags":["React","library","ReleaseNote"],"content":"React Aria v1.17.0リリース。\nTableの展開可能な行のサポート、Virtualizerのウィンドウスクロール対応、水平方向のVirtualizeの対応。\n個別のhookパッケージを`react-aria`と`react-stately`に統合して、依存パッケージ数を削減。\nsub-path imports(`react-aria-components/Button`など)のサポート、マイグレーション用のcodemodも提供されている。\nComboBoxのジェネリック型パラメータサポート、NumberFieldに`commitBehavior` propの追加、Selectに`shouldCloseOnSelect`オプションの追加など。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node.js 24.15.0 (LTS)","url":"https://nodejs.org/en/blog/release/v24.15.0","tags":["nodejs","ReleaseNote"],"content":"Node.js 24.15.0リリース。\n`require(esm)`とモジュールコンパイルキャッシュが安定版に昇格、SQLiteがリリース候補段階へ進んだ。\n`--max-heap-size`オプションの追加、Socketの`setTOS`/`getTOS`メソッドの追加、`fs.stat`の`throwIfNoEntry`オプションの追加など。","relatedLinks":[]},{"category":"Headline","title":"Bun v1.3.13 | Bun Blog","url":"https://bun.com/blog/bun-v1.3.13","tags":["Bun","ReleaseNote"],"content":"Bun v1.3.13リリース。\n`bun test`に各テストファイルを独立したグローバル環境で実行する`--isolate`フラグを追加。\nテストをworkerプロセスで並列実行する`--parallel`、CIジョブ間でテストを分割する`--shard`、gitの変更に影響されたテストのみ実行する`--changed`フラグを追加。\n`bun install`でtarball展開をストリーミング化してメモリ使用量を削減、Isolated linkerによりmonorepoのインストール速度を改善。\nSHA3-224/256/384/512のWebCryptoと`node:crypto`対応、`SubtleCrypto`でのX25519鍵導出に対応。\nWebSocketクライアントが`ws+unix://`/`wss+unix://`のUnixドメインソケット接続をサポート。\n`Bun.serve()`でRangeリクエストのレポート、zlib-ngを使いgzip圧縮のパフォーマンス改善など","relatedLinks":[]},{"category":"Headline","title":"Announcing Rspack 2.0 - Rspack","url":"https://rspack.rs/blog/announcing-2-0","tags":["rspack","ReleaseNote"],"content":"Rspack 2.0リリース。\n`@rspack/core`などのコアパッケージをPure ESMパッケージへ移行、CommonJSビルドを削除。\n`@rspack/dev-server`の依存数の削減、トップレベルの`target`オプションがLoaderやMinimizer Pluginに自動継承されるように変更。\nビルドパフォーマンスの改善、CommonJSの`require`分割代入やプロパティアクセスのTree Shakingを改善。\n`/*#__NO_SIDE_EFFECTS__*/`アノテーション、Module Federationの共有依存のExportレベルでのTree Shakingに対応。\n`import.meta`/`import defer`などをそのまま出力できるように、`library.type`に`modern-module`を追加。\nReact Server Componentsの実験的サポート、`#/`サブパスエイリアスをサポート、`swc-loader`の`detectSyntax`オプションの追加など","relatedLinks":[]},{"category":"Headline","title":"Fresh 2.3: Zero JS by default, View Transitions, and Temporal support | Deno","url":"https://deno.com/blog/fresh-2.3","tags":["deno","vite","ReleaseNote"],"content":"Freshフレームワークのv2.3リリース。\n静的ページでデフォルトではJavaScriptを出力しないように変更、View Transitions APIのサポート、`app.ws()`によるWebSocketのサポート、Vite統合の改善。\nCSP nonceの自動生成、CIDR形式によるIPフィルタリング、Server to ClientのOpenTelemetryトレース伝播、Temporal APIをサポート。\n複数の静的ディレクトリのサポート、フォーム送信時のローディング表示、リバースプロキシ対応(`trustProxy`オプション)の追加など。","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 11 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v11.0.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v11.0.0リリース。\nPure ESMパッケージへの移行、Node.js 18-21のサポートを終了。\n`.npmrc`は認証/レジストリ設定のみに限定し、その他の設定は`pnpm-workspace.yaml`へ移行。\n`minimumReleaseAge`のデフォルトを1日に変更、`allowBuilds`に設定を統一、ストアのインデックスにSQLiteを使用するように変更。\nnpm CLIへの依存を排除して`pnpm publish`/`pnpm login`/`pnpm audit`をネイティブ実装に変更。\n`pnpm ci`/`pnpm sbom`/`pnpm clean`/`pnpm pack-app`コマンドの追加。","relatedLinks":[]},{"category":"Article","title":"Manage agent skills with GitHub CLI - GitHub Changelog","url":"https://github.blog/changelog/2026-04-16-manage-agent-skills-with-github-cli/","tags":["GitHub","CLI","AI","Tools"],"content":"GitHub CLIに`gh skill`コマンドが追加され、Agent Skillsの検索/インストール/管理/公開ができるようになった。\nGitHub CLI v2.90.0以降で利用可能。\nタグやcommit SHAでのバージョン固定、git tree SHAによる内容変更の検知、provenance情報の埋め込みなどをサポート。\nimmutable releasesを使ったpublishを行うことで、スキルを同じタグで書き換えられないようにして公開できる","relatedLinks":[]},{"category":"WebsiteDocument","title":"vercel-labs/wterm: A terminal emulator for the web","url":"https://github.com/vercel-labs/wterm","tags":["WebAssembly","library","terminal","browser"],"content":"Webブラウザ向けのターミナルエミュレータライブラリ。\nコアがZigで書かれていて、WebAssembly(約12KB)にコンパイルされている。\nDOM要素としてレンダリングすることで、ネイティブなテキスト選択/コピー&ペースト/検索/アクセシビリティをサポートする。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Introducing Claude Design by Anthropic Labs \\\\ Anthropic","url":"https://www.anthropic.com/news/claude-design-anthropic-labs","tags":["AI","Design","Tools"],"content":"Anthropic Labsが公開したデザインツール。\nテキストプロンプト、画像、ドキュメント（DOCX/PPTX/XLSX）、コードベース、WebキャプチャなどからWebサイトデザインやプロトタイプ、スライド資料を作成できる。\nチームのコードベースやデザインファイルからデザインシステムを元に作成できる。\nCanva、PDF、PPTX、スタンドアロンHTML形式のExportとClaude Codeに読ませてコードに変換できる。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Trees, from Pierre","url":"https://trees.software/","tags":["React","library","UI","accessibility"],"content":"ファイルツリーをレンダリングするReactライブラリ。\ngit statusの表示、ドラッグ&ドロップでのファイル移動、検索フィルター、コンテキストメニューなどに対応している。\nVirtualizaにより数千ファイル規模でもレンダリングできる。\nキーボードナビゲーションやWCAG 2.1に準拠したアクセシビリティ、CSS変数によるカスタマイズができる","relatedLinks":[]},{"category":"SoftwareLibrary","title":"PerryTS/perry: A native TypeScript compiler written in Rust. Compiles TypeScript directly to executables using SWC and LLVM.","url":"https://github.com/PerryTS/perry","tags":["TypeScript","Rust","compiler","Tools"],"content":"Rustで書かれたTypeScriptのネイティブコンパイラ。\nSWCでTypeScriptをパースし、LLVMで実行ファイルへとコンパイルする。\nmacOS/Windows/Linux/iOS/Android向けのクロスコンパイルに対応し、ネイティブUIを扱うパッケージを用意している。\n著名なnpmパッケージはRust実装のものへ差し替え、他のものはV8のRuntimeを使ったfallbackで対応している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"endevco/aube: A fast Node.js package manager","url":"https://github.com/endevco/aube","tags":["nodejs","package","Rust","Tools"],"content":"Rustで書かれたNode.js向けのパッケージマネージャー。\n`pnpm-lock.yaml`/`package-lock.json`/`npm-shrinkwrap.json`/`yarn.lock`/`bun.lock`などの既存のロックファイル形式の読み書きに対応している。\nグローバルなcontent-addressable storeによるパッケージファイルの共有、最小リリース期間やライフサイクルスクリプトの承認制御などのセキュリティ機能を持つ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"TSRX | TypeScript Language Extension for Declarative UI","url":"https://tsrx.dev/","tags":["TypeScript","UI","compiler","React","Solid"],"content":"宣言的UIのためのTSXの拡張言語。\n構造、制御フロー、スタイルを同じファイルに共存させながら、TypeScript互換性を持つ設計。\nReact/Ripple/Solidにコンパイルできる。\nVS Code/Zed/Neovim/IntelliJ/SublimeなどのIDEサポート、LSP/Prettier/ESLintプラグインも提供する。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"rstackjs/connect-next: An actively maintained fork of Connect.","url":"https://github.com/rstackjs/connect-next","tags":["nodejs","library","TypeScript"],"content":"Node.jsのHTTP middleware framework `connect` をメンテナンスするfork。\nTypeScriptで書き直され、ESモジュールとして名前付きexportで提供される。依存関係の更新や削除などが行われている","relatedLinks":[]}]},{"meta":{"title":"2026-05-11のJS: Node.js 26.0.0、Rolldown 1.0、Jest v30.4.0","author":"azu","layout":"post","date":"2026-05-11T11:36:52.506Z","category":"JSer","tags":["nodejs","TypeScript","React","Chrome","browser"],"url":"https://jser.info/2026/05/11/node.js-26.0.0-rolldown-1.0-jest-v30.4.0/"},"items":[{"category":"Headline","title":"Release v8.0.0 · avajs/ava","url":"https://github.com/avajs/ava/releases/tag/v8.0.0","tags":["JavaScript","testing","nodejs","library","ReleaseNote"],"content":"AVA v8.0.0リリース。\nNode.js v22.20/v24.12以降が必須となり、内部実装をESM化。\nCommonJSから利用する場合は`const {default: test} = require('ava')`への変更が必要。\nデフォルトのテストファイル拡張子が`js`/`mjs`に変更され、テストファイルは`import()`経由で読み込まれるように変更。\n実行時条件でテストをスキップ/実行する`test.skipIf()`/`test.runIf()`を追加。\n`*.tsbuildinfo`ファイルの変更をWatchモードで無視、TAPレポーターのエラー名復元処理の改善など。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node.js 26.0.0 (Current)","url":"https://nodejs.org/en/blog/release/v26.0.0","tags":["nodejs","ReleaseNote"],"content":"Node.js 26.0.0(Current)リリース。\nTemporal APIがデフォルトで有効化。\nV8 14.6への更新により、Weak/Mapの`getOrInsert()`/`getOrInsertComputed()`やIteratorの`concat()`メソッドが追加。\nUndici 8.0.2へ更新。\n`http.Server.prototype.writeHeader()`の削除、レガシーストリームモジュール(`_stream_wrap`など)の削除。\n`--experimental-transform-types`フラグの削除、`module.register()`をruntime-deprecateなど","relatedLinks":[]},{"category":"Headline","title":"Release 0.18 | StyleX","url":"https://stylexjs.com/blog/v0.18","tags":["React","css","library","ReleaseNote"],"content":"StyleX v0.18リリース。\nコンパイル時に値を設定できる`stylex.env` APIの追加、プロジェクトの雛形を作成する`create-stylex-app` CLIの追加。\n`stylex.attrs` APIの復活、Chrome DevTools拡張の提供。\nJSXで`sx={}`構文のサポート、`defineVars`の自己参照変数のサポート、`stylex.when`が属性セレクタもサポート、CSS Layersの制御の改善、ESLintプラグインの修正など。","relatedLinks":[]},{"category":"Headline","title":"Node.js — End-Of-Life","url":"https://nodejs.org/en/about/eol","tags":["nodejs","news"],"content":"Node.js 20.xがEOLとなりセキュリティパッチを含めたアップデートが提供されなくなった。","relatedLinks":[]},{"category":"Headline","title":"Chrome 148  |  Release notes  |  Chrome for Developers","url":"https://developer.chrome.com/release-notes/148","tags":["Chrome","browser","ReleaseNote"],"content":"Chrome 148リリース。\nCSSの`container-name`単独でのコンテナクエリ、`@supports`の`at-rule()`サポート、`revert-rule`キーワードを追加。\n`text-decoration-skip-ink: all`、`<video>`/`<audio>`要素の`loading=\"lazy\"`属性をサポート。\nPrompt API、Web AuthenticationのImmediate UIモードのサポート。\nAndroid向けにSharedWorkerの再有効化、Web Serial APIのサポート、Resource Timingに`contentType`を追加。\nOrigin TrialとしてDeclarative CSS module scripts、HTML-in-canvas、Connection Allowlists、OpaqueRangeの追加など","relatedLinks":[{"title":"New in Chrome 148  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/new-in-chrome-148?hl=en"}]},{"category":"Headline","title":"Node.js — Node.js 26.1.0 (Current)","url":"https://nodejs.org/en/blog/release/v26.1.0","tags":["nodejs","ReleaseNote"],"content":"Node.js 26.1.0リリース。\n実験的な`node:ffi`モジュールを追加し、`--experimental-ffi`フラグで動的ライブラリの読み込みとネイティブシンボルの呼び出しに対応。\n`crypto.randomUUIDv7()`の追加、`crypto.diffieHellman()`がキーデータを受け入れるように変更。\n`fs.stat()`に`signal`オプションを追加、`statfs`が`frsize`フィールドを公開。\nHTTPの`IncomingMessage`に`req.signal`を追加、`Buffer`の`indexOf()`/`lastIndexOf()`に`end`パラメータを追加。\nテストランナーにテスト順序のランダム化や`AbortSignal.timeout`のモックタイマー対応を追加、`util.styleText()`が16進数カラーをサポートなど","relatedLinks":[]},{"category":"Headline","title":"Release v30.4.0 · jestjs/jest","url":"https://github.com/jestjs/jest/releases/tag/v30.4.0","tags":["jest","test","ReleaseNote"],"content":"Jest v30.4.0リリース。\nNode v24.9+でES Modulesに対する`require()`をサポート、Node v26のTemporal APIに対応するfake timersの追加。\n`jest.config.mts`のサポート、`--collect-tests`フラグの追加、`workerGracefulExitTimeout`オプションの追加など。\nプロジェクト単位の`verbose`/`silent`設定の追加、React 19の`pretty-format`サポートなど。\n`projects`設定でのカバレッジレポートの修正、`structuredClone`での`toStrictEqual`の修正、ESMとWebAssemblyのimport時のデッドロックの修正など。","relatedLinks":[]},{"category":"Headline","title":"Electron 42 | Electron","url":"https://www.electronjs.org/blog/electron-42-0","tags":["Electron","ReleaseNote"],"content":"Electron 42リリース。\nChromium 148/Node.js 24.15.0/V8 14.8へアップデート。\nmacOSの通知APIが`UNNotification` APIに変更されコード署名が必須に、`postinstall`でElectronバイナリをダウンロードする挙動を削除。`Session.clearStorageData()`から`quotas`オブジェクトを削除。\n`view.setBounds()`のアニメーション対応、`view.setBackgroundBlur()`によるネイティブ背景ぼかしのサポート。\nmacOSでの`Notification.getHistory()`、`globalShortcut.setSuspended()`、ヒーププロファイリングのサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Release v1.16.0 · axios/axios","url":"https://github.com/axios/axios/releases/tag/v1.16.0","tags":["HTTP","library","JavaScript","ReleaseNote"],"content":"axios v1.16.0リリース。\nfetch adapterでの`maxBodyLength`/`maxContentLength`の制限を強制、proxyリクエスト時のユーザー指定`Host`ヘッダの保持などの破壊的変更を含む。\nまた、Basic認証でpercent-encodedされた認証情報のデコード、`parseProtocol`がコロン区切りを厳密に要求するよう変更されている。\nQUERY HTTPメソッドのサポート、`AxiosError.ECONNREFUSED`の追加、`encode`ヘルパーのexportなど。","relatedLinks":[]},{"category":"Headline","title":"Announcing Rolldown 1.0 | VoidZero","url":"https://voidzero.dev/posts/announcing-rolldown-1-0","tags":["Rust","rollup","bundler","ReleaseNote","vite"],"content":"Rolldown 1.0リリース。\nRustで書かれたRollup互換プラグインとの互換性を持ったJavaScript/TypeScriptバンドラー。\nVite 8でデフォルトのバンドラーとして利用される。","relatedLinks":[]},{"category":"Headline","title":"Chrome 149 beta  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/chrome-149-beta?hl=en","tags":["Chrome","browser","ReleaseNote"],"content":"Chrome 149 betaリリース。\nCSSの`shape-outside`プロパティで`path()`/`shape()`/`rect()`/`xywh()`関数のサポート。\nSVGの`pathLength`属性のCSSプロパティ化、`image-rendering: crisp-edges`のサポート。\n`Intl.Locale.prototype.variants`の追加、プログラムによるスクロールメソッドがPromiseを返すように変更。\nService Workerの`Request`に`isReloadNavigation`属性を追加、WebSocket接続中でもbfcacheを利用可能に。\nOrigin TrialとしてPermissions Policyの`focus-without-user-activation`、`rawgamepadinputchange`イベントを追加。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"sqlfu","url":"https://sqlfu.dev/","tags":["SQL","TypeScript","tool","database","library","cloudflare"],"content":"SQLファイルを中心としたTypeScript用のSQLiteデータベース開発ツールキット。\n`definitions.sql`でスキーマを定義し`sqlfu draft`でマイグレーションを生成、SQLクエリから型安全なTypeScriptラッパーを生成する。\nCloudflare Durable Object/D1/Node.js/Bun/better-sqlite3/libsqlに対応している。\nESLintプラグイン、SQLフォーマッター、Admin UI、OpenTelemetryのトレーシングに対応している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"fabon-f/temporal-polyfill-lite: Lightweight Temporal polyfill","url":"https://github.com/fabon-f/temporal-polyfill-lite","tags":["JavaScript","library","polyfill","ECMAScript","TypeScript"],"content":"Temporal APIのpolyfillライブラリ。\n最新のTemporal仕様に対応し、ponyfillとしてもglobalを書き換えるshimとしても利用できる。\nTypeScriptで書かれていて、内部的にBigIntに依存しない実装となっている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"open-circle/formisch: The lightweight, schema-first, and fully type-safe form library for React, Solid, Vue, Svelte and more.","url":"https://github.com/open-circle/formisch","tags":["library","React","Vue","Svelte","Solid","TypeScript"],"content":"React/Solid/Vue/Svelte/Preact/Qwikに対応したスキーマファーストのフォームライブラリ。\nValibotを利用したスキーマベースのバリデーションをサポートし、`createForm`や`<Form />`/`<Field />`などのAPIでフォームの状態を管理する。","relatedLinks":[]}]},{"meta":{"title":"2026-05-24のJS: pnpm 11.1〜11.3、npm CLI v11.15.0、Deno 2.8","author":"azu","layout":"post","date":"2026-05-25T01:03:40.989Z","category":"JSer","tags":["pnpm","npm","nodejs","security","CLI"],"url":"https://jser.info/2026/05/25/pnpm-11.111.3-npm-cli-v11.15.0-deno-2.8/"},"items":[{"category":"Headline","title":"Release v1.60.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.60.0","tags":["playwright","ReleaseNote"],"content":"playwright v1.60.0リリース。\n破壊的な変更として、`Locator.ariaRef()`、bindingsの`handle`オプション、`videosPath`/`videoSize`などのdeprecatedなAPIを削除。\n`tracing.startHar()`/`tracing.stopHar()`でHAR記録をサポート、外部からのドラッグ&ドロップをシミュレートする`locator.drop()`の追加。\n`expect(page).toMatchAriaSnapshot()`をPageに対して利用できるように、`boxes`オプションで境界ボックス情報を含められるように。\nテストを中断する`test.abort()`、`browser.on('context')`イベントとBrowserContextのライフサイクルイベントの追加など","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 11.1 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v11.1.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v11.1.0リリース。\nレジストリ署名を検証する`pnpm audit signatures`コマンド、`namedRegistries`によるレジストリのプレフィックス指定(`gh:@acme/private`など)のサポート。\n`pnpm bugs`/`pnpm owner`コマンドの追加。\nSBOMの仕様バージョンを指定する`--sbom-spec-version`、ランタイムのインストールをスキップする`--no-runtime`フラグの追加など。","relatedLinks":[]},{"category":"Headline","title":"Release vite-plus v0.1.21 — Create, Migrate &amp; Local CLI Power-Up · voidzero-dev/vite-plus","url":"https://github.com/voidzero-dev/vite-plus/releases/tag/v0.1.21","tags":["vite","CLI","Tools","ReleaseNote"],"content":"vite-plus v0.1.21リリース。\n`vp pm`コマンドがローカルCLIで動作するようになり、`vp migrate`はnamed catalogsの書き換えや`tsdown/client`のインポートと型設定の移行に対応。\n`vp create`は`@org`形式のスコープ付きテンプレートをサポート。\nNushellへの対応、`vp pm plugin`のyarnサポート、`--provenance`フラグ、Windowsの`.cmd`シム経由のPowerShell実行などを追加。\npnpm v11+での`--ignore-scripts`自動付与、`vite-plus/pack/client`の追加など","relatedLinks":[]},{"category":"Headline","title":"Bun v1.3.14 | Bun Blog","url":"https://bun.com/blog/bun-v1.3.14","tags":["Bun","ReleaseNote"],"content":"Bun v1.3.14リリース。\n画像のリサイズ/回転/フォーマット変換に対応した画像処理API `Bun.Image`を追加。\n`Bun.serve()`がHTTP/3 over QUICに対応、`fetch()`が実験的にHTTP/2とHTTP/3プロトコルをサポート。\nisolated linkerのglobalStoreオプションを追加、親プロセス終了時にBunプロセスツリーを終了する`--no-orphans`フラグの追加。\nNode.js v24互換の`process.execve()`、Windowsでの`Bun.Terminal`(ConPTY)、FreeBSD/Androidの公式ビルド提供など","relatedLinks":[]},{"category":"Headline","title":"Release pnpm 11.1.3 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v11.1.3","tags":["pnpm","ReleaseNote"],"content":"pnpm v11.1.3リリース。\nインストール時に`pnpm-lock.yaml`のエントリを`minimumReleaseAge`と`trustPolicy`で再検証するように変更と`minimumReleaseAgeStrict`モードの追加。\n`pnpm self-update`が`minimumReleaseAge`を尊重するように変更、`NODE_AUTH_TOKEN`未設定時のOIDC認証失敗などを修正。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node.js 26.2.0 (Current)","url":"https://nodejs.org/en/blog/release/v26.2.0","tags":["nodejs","ReleaseNote"],"content":"Node.js 26.2.0リリース。\n`fs.Stats`と`BigIntStats`が`Temporal.Instant`をサポート、HTTPの`writeInformation`メソッドで任意の1xxステータスコードを送信できるよう。\n`stream.compose`がStableへ変更、Web Cryptography APIにML-DSA/ML-KEM/ChaCha20-Poly1305などのアルゴリズムを追加など","relatedLinks":[]},{"category":"Headline","title":"Release v11.15.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v11.15.0","tags":["npm","CLI","ReleaseNote"],"content":"npm CLI v11.15.0リリース。\nStaged Publishingのための`npm stage`コマンドを追加、`trust`コマンドにpermissionsサポートを追加。\nインストール時の挙動を制御する`allow-git`/`allow-file`/`allow-directory`/`allow-remote`の設定を追加。","relatedLinks":[{"title":"Staged publishing for npm packages","url":"https://docs.npmjs.com/staged-publishing"}]},{"category":"Headline","title":"Release @apollo/client@4.2.0 · apollographql/apollo-client","url":"https://github.com/apollographql/apollo-client/releases/tag/%40apollo%2Fclient%404.2.0","tags":["JavaScript","library","ReleaseNote","GraphQL"],"content":"Apollo Client 4.2.0リリース。\nhookやメソッドのシグネチャに、`defaultOptions`を反映する\"modern\"スタイルを追加。\n`RefetchEventManager`クラスを追加し、windowのfocusやネットワーク再接続などのイベントに応じたクエリの自動再取得をサポート。\n`client.query`/`client.mutate`/`useMutation`/`preloadQuery`の戻り値の型に`defaultOptions`を反映するように改善。","relatedLinks":[]},{"category":"Headline","title":"pnpm 11.3 | pnpm","url":"https://pnpm.io/blog/releases/11.3","tags":["pnpm","ReleaseNote"],"content":"pnpm 11.3リリース。\nStaged Publishing用の`pnpm stage`コマンド、信頼済みのlockfileの検証をスキップする`trustLockfile`設定の追加。\n`pnpm pkg`/`pnpm repo`/`pnpm set-script`をネイティブ実装に置き換え、`pnpm publish`に`--skip-manifest-obfuscation`フラグを追加など","relatedLinks":[]},{"category":"Headline","title":"Deno 2.8 | Deno","url":"https://deno.com/blog/v2.8","tags":["deno","ReleaseNote"],"content":"Deno 2.8リリース。\n`deno audit fix`/`deno bump-version`/`deno ci`/`deno pack`/`deno transpile`/`deno why`などの新しいサブコマンドを追加。\nNode.js互換性のテストスイート合格率が42%から76.4%に改善、Stage 3の`import defer`を実装。\nCLIで`npm:`プレフィックスが不要に、`catalog:`のサポート、`--os`/`--arch`フラグでクロスプラットフォームインストールに対応。\n`OffscreenCanvas`や`DOMPoint`などのWeb APIを追加、Chrome DevToolsでのネットワークデバッグやCPUプロファイリングをサポート。","relatedLinks":[]},{"category":"Article","title":"Postmortem: TanStack npm supply-chain compromise | TanStack Blog","url":"https://tanstack.com/blog/npm-supply-chain-compromise-postmortem","tags":["TanStack","npm","security","Actions","article"],"content":"2026年5月11日に発生したTanStackのnpmパッケージに対するサプライチェーン攻撃のポストモーテム。\n`pull_request_target`ワークフローの設定不備、GitHub Actionsのキャッシュポイズニングを組み合わせた攻撃手法について。\nフォークからのPRで実行されたコードがpnpmのキャッシュを汚染し、後のリリースワークフローで悪意のあるバイナリが復元された。\n`/proc/`経由でランナープロセスのメモリからOIDCトークンを抽出してnpm publishに利用された。\n対策として`pull_request_target`を使うワークフローの監査、サードパーティActionのコミットハッシュ固定などを挙げている。","relatedLinks":[]},{"category":"Article","title":"9 Times the Web Platform Was Influenced by Libraries | Jad Joubran","url":"https://jadjoubran.io/blog/web-platform-influenced-by-libraries","tags":["WebPlatformAPI","JavaScript","library","history","article"],"content":"WebプラットフォームのネイティブAPIがライブラリから受けた影響を9つの事例で紹介する記事。\njQuery/SizzleのCSSセレクタが`querySelector`に、Bootstrapの`data-toggle`が`popovertarget`/`command`属性に。\njQueryの`.addClass()`が`classList`へ、Lodash/Underscoreのメソッドが`String`/`Array`のメソッドに。\nさらに`structuredClone`、Promises/A+の標準化、ES Modulesの設計。\nMoment.jsの課題から`Temporal API`、jQueryの`.closest()`から`Element.closest()`の流れなどについて。","relatedLinks":[]},{"category":"Article","title":"Node.js — Axios to WHATWG Fetch","url":"https://nodejs.org/en/blog/migrations/axios-to-fetch","tags":["nodejs","Fetch","HTTP","article"],"content":"AxiosからNode.js Fetch APIへの移行ガイド。\nNode.js v18.0.0以降を前提に、`axios.get()`/`axios.post()`/`axios.put()`/`axios.delete()`やフォーム送信などのコード変換例を解説している。\nインターセプターやキャンセルトークンなどの一部機能は未対応である点についても解説されている","relatedLinks":[]},{"category":"Article","title":"Introducing Secure Registry: install-time defense for the npm supply chain - StepSecurity","url":"https://www.stepsecurity.io/blog/introducing-secure-registry-install-time-defense-for-the-npm-supply-chain","tags":["npm","security","article"],"content":"StepSecurityによるnpmサプライチェーン攻撃に対するインストール時の防御を行うProxy型のレジストリサービス。\nレジストリへのパッケージ取得要求をプロキシで評価し、新規公開からの一定期間ブロックするクールダウン期間、危険なパッケージのブロック、タイポスクワッティング対策などの機能を提供する。\nローカルの開発環境、CI/CDパイプラインなどでの利用を想定している。","relatedLinks":[]},{"category":"Article","title":"nkzw-tech/fate: fate is a modern data client for React.","url":"https://github.com/nkzw-tech/fate","tags":["React","library","TypeScript","GraphQL"],"content":"Reactのデータクライアントライブラリ。\nRelay/GraphQLの設計から影響を受けて、コンポーネントごとに`view`でデータを宣言し、正規化キャッシュとデータマスキングを提供する。\nAsync React(Actions/Suspense/`use`)に対応し、ページネーション、Optimistic Updates、Server-Sent Eventsでの更新のサポート。\nバックエンドとしてGraphQL/tRPC/Prisma/Drizzleに対応している。","relatedLinks":[]},{"category":"Article","title":"Announcing Web Serial Support in Firefox - Mozilla Hacks - the Web developer blog","url":"https://hacks.mozilla.org/2026/05/web-serial-support-in-firefox/","tags":["Firefox","browser","WebAPI","Mozilla"],"content":"Firefox 151でWeb Serial APIをサポート。\nWeb Serial APIはJavaScriptからシリアルデバイスを読み書きするAPIで、USBやBluetoothで接続したマイコン、3Dプリンター、スマートメーターなどに直接アクセスできる。\nユーザーが明示的に許可したポートのみアクセス可能で、サイトandポートごとに権限を管理できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"tmikov/hermes-node: Node.js built-in module compatibility layer for the Hermes JS engine","url":"https://github.com/tmikov/hermes-node","tags":["nodejs","JavaScript","TypeScript","library"],"content":"HermesをベースにしたNode.js互換のJavaScript/TypeScriptランタイム。\nTypeScriptファイルを直接実行でき、Chrome DevToolsプロトコルに対応したデバッガを内蔵している。\n`fs`/`http`/`net`/`path`/`stream`などのNode.jsコアモジュールは、Node.js内部のJS実装をそのまま利用する。","relatedLinks":[]}]},{"meta":{"title":"2026-06-09のJS: pnpm 11.5、Node.js 26.3.0、CloudflareがVoidZeroを買収","author":"azu","layout":"post","date":"2026-06-09T03:06:21.608Z","category":"JSer","tags":["pnpm","nodejs","cloudflare","vite","news"],"url":"https://jser.info/2026/06/09/pnpm11.5-node.js26.3.0-cloudflare-void0/"},"items":[{"category":"Headline","title":"Release pnpm 11.5 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v11.5.0","tags":["pnpm","ReleaseNote"],"content":"pnpm 11.5リリース。\n`nodeLinker: hoisted`向けにhoistの範囲を制限する`hoistingLimits`設定を追加。\n対話的なプロンプトの改善、Staged publishingの対応改善。\nエイリアスインストール時のpeer解決のハング、`pnpm dist-tag`での2FA対応を修正。\n`minimumReleaseAgeExclude`の扱い、リモートのHTTPS tarball依存の`integrity`フィールドの保持などを修正。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node.js 26.3.0 (Current)","url":"https://nodejs.org/en/blog/release/v26.3.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v26.3.0 (Current)リリース。\n`Buffer.poolSize`のデフォルトを64 KiBに変更。\nHTTPヘッダの値の検証をカスタマイズする`httpValidation`オプション、パーミッションを破棄する`permission.drop`を追加。\nStaged Publishingをサポートしたnpm 11.16.0へアップデートなど","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node.js 24.16.0 (LTS)","url":"https://nodejs.org/en/blog/release/v24.16.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v24.16.0 (LTS)リリース。\n`crypto.randomUUIDv7()`によるUUID v7の生成、`fs.stat()`への`signal`オプション、`util.styleText()`の16進数カラー対応を追加。\nTest Runnerにテスト実行順序のランダム化や`AbortSignal.timeout`向けのモックタイマーを追加、`IncomingMessage`に`req.signal`を追加など","relatedLinks":[]},{"category":"Headline","title":"Chrome 150 beta  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/chrome-150-beta?hl=en","tags":["Chrome","browser","ReleaseNote","css"],"content":"Chrome 150 betaリリース。\nCSSの`text-fit`プロパティ、`background-clip: border-area`によるグラデーションボーダー、`polygon()`の角丸サポート、`focusgroup`属性のサポート。\nIndexedDBの実装がLevelDBからSQLiteへと変更、`data:` URLのWorkerに一意のopaque originを割り当てるよう変更。\n`SpeechRecognition`に`quality`オプションを追加など","relatedLinks":[]},{"category":"Headline","title":"VoidZero is joining Cloudflare","url":"https://blog.cloudflare.com/voidzero-joins-cloudflare/","tags":["cloudflare","vite","news"],"content":"CloudflareがViteやOxcなどを開発するVoidZeroを買収。","relatedLinks":[{"title":"VoidZero is Joining Cloudflare | VoidZero","url":"https://voidzero.dev/posts/voidzero-cloudflare"}]},{"category":"Article","title":"Declarative partial updates  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/declarative-partial-updates","tags":["Chrome","HTML","WebAPI","DOM","stream","article"],"content":"HTMLを宣言的に部分更新するためのAPIとして提案中の`<template for>`について。\n`<template>`要素と`<?marker>`などの処理命令プレースホルダーを使い、ドキュメント内の順序に依存せずコンテンツを配信するOut-of-order streamingについて。\n合わせて利用する`setHTML()`/`replaceWithHTML()`/`streamHTML()`などのJavaScript APIについても解説している。\nChrome 148以降のフラグで利用でき、polyfillも実装されている。","relatedLinks":[]},{"category":"Article","title":"On Rendering Diffs :: Pierre Computer Company","url":"https://pierre.computer/writing/on-rendering-diffs","tags":["JavaScript","performance","diff","library","article"],"content":"Pierreが開発したdiffレンダリングライブラリ`@pierre/diffs`の実装解説。\n巨大なコード差分をブラウザで効率的に描画するための、仮想化やメモリ最適化の手法について書かれている。\nsticky positioningを反転させてスクロール中の空白表示を防ぐ手法、行範囲レンダリングでのバイナリサーチ、DOM要素を再利用することでGCを避ける作りについて。\nまた、Shikiによる構文ハイライトのWorkerスレッド化とLRUキャッシュについても扱っている。","relatedLinks":[]},{"category":"SlideVideo","title":"TSKaigi 2026 発表資料まとめ","url":"https://zenn.dev/yasse/articles/a7240304af804c","tags":["TypeScript","Conference","slide"],"content":"TSKaigi 2026のスライド資料のまとめ。","relatedLinks":[{"title":"TSKaigi 2026","url":"https://2026.tskaigi.org/"}]},{"category":"SlideVideo","title":"Oxlintのカスタムルールの現況 - Speaker Deck","url":"https://speakerdeck.com/syumai/oxlint-custom-rule","tags":["ESLint","Rust","slide","JavaScript"],"content":"Oxlintのカスタムルールについてのスライド。\nRust製のLinterであるOxlintで、ESLint互換のカスタムルールを追加できるJS Plugin（アルファ版）の機能やパフォーマンスについて紹介している。\n既存のESLintプラグインの動作やtsgolint、corsa-bindについてなど","relatedLinks":[]},{"category":"WebsiteDocument","title":"SoraKumo001/satoru","url":"https://github.com/SoraKumo001/satoru","tags":["WebAssembly","HTML","css","SVG","PDF","Image","library"],"content":"WebAssemblyで動作するHTMLをSVG/PNG/WebP/PDFへ変換するレンダリングエンジン。\n描画にSkia、レイアウトにlitehtmlを利用し、CSSを含んだHTMLを画像へと変換する。\nTTF/OTF/WOFF2のフォントやGoogle Fontsの解決、PNG/JPEG/WebP/AVIFの画像をサポートする。\nNode.js/ブラウザ/Cloudflare Workersで実行できる。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"microsoft/Webwright: A simple SWE style browser agent framework that achieves SOTA results on long horizon web tasks.","url":"https://github.com/microsoft/Webwright","tags":["AI","browser","automation","playwright","library"],"content":"Microsoftによるブラウザエージェントフレームワーク。\nエージェントが個別のブラウザ操作を予測するのではなくPlaywrightを使ったPythonコードを生成して実行する。\n反復的なエージェントループとディレクトリをworkspaceとして扱って毎回使い捨てのセッションで進める方式になっている","relatedLinks":[]},{"category":"SoftwareLibrary","title":"pionxzh/wakaru: 🔪📦 Javascript decompiler for modern frontend","url":"https://github.com/pionxzh/wakaru","tags":["JavaScript","Tools","webpack","bundler","esbuild"],"content":"minifyやbundleされたJavaScriptを読みやすいコードへと復元するデコンパイラ。\nwebpack/esbuild/Bun/Browserifyなどのbundleをモジュール単位に分割するunpackerを提供する。\nTerser/Babel/SWCなどでトランスパイル/圧縮されたコードを復元するunminifyや、ソースマップをサポートしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Shakya47/pip-it-up: Pop any UI component into a floating Picture-in-Picture window. Zero config. Auto-sizing. Framework-agnostic core.","url":"https://github.com/Shakya47/pip-it-up","tags":["JavaScript","React","library"],"content":"Document Picture-in-Picture APIを扱うReactコンポーネントライブラリ。\nリサイズやスタイルの同期などに対応している。","relatedLinks":[]},{"category":"Book","title":"基本からしっかり学ぶフロントエンドテスト入門 | 技術評論社","url":"https://gihyo.jp/book/2026/978-4-297-15704-3","tags":["JavaScript","test","book"],"content":"2026年6月26日発売。\nフロントエンドのテストについての書籍","relatedLinks":[]}]},{"meta":{"title":"2026-06-22のJS: TypeScript 7.0 RC、Babel 8.0.0、React Router v8","author":"azu","layout":"post","date":"2026-06-22T13:14:54.573Z","category":"JSer","tags":["TypeScript","babel","React","ECMAScript","nodejs"],"url":"https://jser.info/2026/06/22/typescript-7.0-rc-babel-8.0.0-react-router-v8/"},"items":[{"category":"Headline","title":"Dependabot version updates now support the Deno ecosystem - GitHub Changelog","url":"https://github.blog/changelog/2026-06-09-dependabot-version-updates-now-support-the-deno-ecosystem/","tags":["GitHub","deno","npm","package","Actions","news"],"content":"Dependabotのversion updatesがDenoエコシステムに対応した。","relatedLinks":[]},{"category":"Headline","title":"Bytecode Alliance — WASI 0.3 Launched","url":"https://bytecodealliance.org/articles/WASI-0.3","tags":["WebAssembly","ReleaseNote"],"content":"WASI 0.3リリース。\nWebAssembly Component Modelのネイティブ機能として非同期処理が組み込まれ、`stream<T>`/`future<T>`/`async`がCanonical ABIに追加された。\nWASI 0.2では各コンポーネントが独自のイベントループを持つ必要があったが、ホストが共有イベントループを管理する設計へと変更された。\n従来の`start-foo`/`finish-foo`/`subscribe`パターンが`async func`に置き換わり、ストリームのエラーハンドリングも独立した`future`で扱えるようになった。","relatedLinks":[]},{"category":"Headline","title":"Biome v2.5—500 Lint Rules, Plugin Code Fix, and Cross-File Linting | Biome","url":"https://biomejs.dev/blog/biome-v2-5/","tags":["biome","ReleaseNote","ESLint","css"],"content":"Biome v2.5リリース。\nCSSのクラスをファイル横断で解析するLintルール`noUndeclaredClasses`/`noUnusedClasses`を追加。\nGritQLプラグインがファイルパスごとの適用と`=>`によるコードフィックスをサポート。\nFormatterに`delimiterSpacing`オプションの追加、`lint`/`format`/`check`での`--watch`サポート。\nLanguage Serverのgo-to-definition対応、AI Agent向けの`concise`レポーターの追加など。","relatedLinks":[]},{"category":"Headline","title":"Releasing Babel 8 today: ESM-only, drop ES5 default, and a smooth migration path · Babel","url":"https://babeljs.io/blog/2026/06/16/8.0.0/","tags":["babel","ReleaseNote","ECMAScript","nodejs","polyfill"],"content":"Babel 8.0.0リリース。\nESMのみで配布されるようになり、Node.js 24以降が必須となる破壊的変更を含む。\n`@babel/preset-env`がデフォルトでES5へコンパイルしなくなり、Browserslistのデフォルト設定（ES2023相当）をターゲットとするように変更。\n`loose`/`spec`オプションを削除し、`assumptions`への移行を推奨。\n`corejs`/`useBuiltIns`オプションを削除し、`babel-plugin-polyfill-corejs3`プラグインの利用を推奨。\nすべてのパッケージにTypeScriptの型定義を追加。多くのASTの変更を含む。\nBabel 7は2027年6月までセキュリティサポートを継続する。","relatedLinks":[{"title":"Upgrade to Babel 8 (API) · Babel","url":"https://babeljs.io/docs/v8-migration-api/"}]},{"category":"Headline","title":"pnpm 11.7 | pnpm","url":"https://pnpm.io/blog/releases/11.7","tags":["pnpm","ReleaseNote"],"content":"pnpm 11.7リリース。\n読み取り専用ファイルシステム上のストアに対応する`frozenStore`設定、同一レジストリURL配下でのスコープ別認証トークンの指定に対応。\n依存関係の解決をRust実装のPacquetを使うようになるなど","relatedLinks":[]},{"category":"Headline","title":"Release v1.61.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.61.0","tags":["playwright","testing","ReleaseNote"],"content":"playwright v1.61.0リリース。\n`browserContext.credentials`でWebAuthnのpasskeyを扱えるように。\n`page.localStorage`/`page.sessionStorage`でWeb Storageを読み書きするAPIを追加。\n`apiResponse.securityDetails()`/`apiResponse.serverAddr()`、`artifactsDir`オプション、`-G`オプションを追加。","relatedLinks":[]},{"category":"Headline","title":"React Router v8 | Remix","url":"https://remix.run/blog/react-router-v8","tags":["React","ReleaseNote"],"content":"React Router v8リリース。\nNode.js 22.22.0+/React 19.2.7+/Vite 7+が最小サポートバージョンとなり、ESMのみの配布へ変更。\n`future.v8_middleware`/`future.v8_viteEnvironmentApi`などのFuture Flagをデフォルト化。\n`react-router-dom`、meta APIの`data`引数、`@react-router/dev/vite/cloudflare`を削除。\nReact Router v6とRemix v2はEOLとなり、今後はReact Router v7にセキュリティ更新を提供する。","relatedLinks":[]},{"category":"Headline","title":"News from WWDC26: WebKit in Safari 27 beta | WebKit","url":"https://webkit.org/blog/17967/news-from-wwdc26-webkit-in-safari-27-beta/","tags":["safari","browser","ReleaseNote","css","JavaScript"],"content":"Safari 27 betaリリース。\nCSSの`appearance: base-select`による`<select>`のカスタマイズ、Scroll Anchoring、`position-anchor: normal`などを追加。\nJavaScriptはTop-Level Awaitの問題を修正、WebAssembly JSPIをサポート。\nWeb APIはService Worker Static Routing API、`ReadableStream.from()`、Streamの`postMessage()`転送をサポートなど。","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 7.0 RC - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-7-0-rc/","tags":["TypeScript","ReleaseNote","go"],"content":"TypeScript 7.0 RCリリース。\nGoへ移植されたコンパイラを`typescript@rc`で公開、`@typescript/typescript6`との併用に対応。\n`--checkers`/`--builders`/`--singleThreaded`、`--watch`の改善を追加。\n`strict`/`module`/`target`などのデフォルト値の変更、`target: es5`/`baseUrl`などの削除などを含む","relatedLinks":[]},{"category":"Article","title":"Upcoming breaking changes for npm v12 - GitHub Changelog","url":"https://github.blog/changelog/2026-06-09-upcoming-breaking-changes-for-npm-v12/","tags":["npm","security","CLI","article"],"content":"npm v12で予定されている破壊的変更の解説。2026年7月リリース予定のnpm v12では、サプライチェーン攻撃対策として、ライフサイクルスクリプトの実行が変更される。\npreinstall/install/postinstallなどのスクリプトがデフォルトで実行されなくなり、`npm approve-scripts`で承認したパッケージのみ実行される。\n`--allow-git`/`--allow-remote`のデフォルトが`none`となり、Git依存やリモートURLからの依存解決が明示的な許可なしでは行われなくなる。","relatedLinks":[]},{"category":"Article","title":"Why pnpm no longer expands environment variables in a repository&#039;s .npmrc | pnpm","url":"https://pnpm.io/blog/2026/06/11/env-variables-in-repository-npmrc","tags":["pnpm","security","npm","article"],"content":"悪意あるリポジトリで`.npmrc`を使って環境変数が盗まれる問題への対策として、pnpmがリポジトリ管理の`.npmrc`で環境変数を展開しなくなった経緯の解説。\nv10.34.2/v11.5.3以降、リポジトリ内の`.npmrc`や`pnpm-workspace.yaml`の認証情報やレジストリURLに含まれる`${...}`は展開されなくなった。\nユーザーレベルの`~/.npmrc`や `PNPM_CONFIG_NPMRC_AUTH_FILE` で指定されている`.npmrc`では引き続き展開される。","relatedLinks":[{"title":"CAND-PNPM-122: Repository config can expand victim environment secrets into registry requests before scripts run · Advisory · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/security/advisories/GHSA-3qhv-2rgh-x77r"}]},{"category":"Article","title":"Introducing the MDN MCP server","url":"https://developer.mozilla.org/en-US/blog/introducing-mdn-mcp-server/","tags":["mdn","MCP","document","browser","AI","article"],"content":"MDN MCP serverについて\nMCP経由でMDNの検索、ドキュメント、ブラウザ互換性データをLLMやエディタから参照できる。\n実験的なサーバで、利用時のクエリデータを保存することについても説明している。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Introducing eve - Vercel","url":"https://vercel.com/blog/introducing-eve","tags":["AI","TypeScript","library"],"content":"VercelによるAIエージェントフレームワークのEveについて。\n`instructions.md`/`agent.ts`/`tools/`などのディレクトリ構成でエージェントを定義するフレームワーク。\nDurable execution、Sandbox、Human-in-the-loop approvals、Subagents、Evalsなどを扱う","relatedLinks":[{"title":"vercel/eve: The Framework for Building Agents","url":"https://github.com/vercel/eve"}]},{"category":"WebsiteDocument","title":"Rust Roadmap · Issue #11633 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/issues/11633","tags":["pnpm","Rust","issue"],"content":"pnpmのRust実装であるPacquetのロードマップIssue。\nresolveを必要としない`pacquet install --frozen-lockfile`から対応をしてから、resolveの対応を進める。\nまた`pnpm`とは`install-backend=pacquet`の設定で統合していく予定。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"nubjs/nub: The all-in-one Node.js toolkit","url":"https://github.com/nubjs/nub","tags":["nodejs","Rust","Tools"],"content":"Node.js向けのRust製ツールキット。\nTypeScriptファイルや`package.json`のスクリプト実行、`nub install`で依存関係のインストールやパッケージ管理、`nub node`でNode.jsのバージョン管理ができる。\nRuntimeとしてPolyfillなどを含めたNode.jsを利用し、内部的にはRustで書かれたパッケージマネージャであるaubeとOXCを利用している。","relatedLinks":[{"title":"Nub — an all-in-one toolkit for Node.js","url":"https://nubjs.com/"}]}]},{"meta":{"title":"2026-07-05のJS: Deno 2.9、Vite 8.1、ES2026","author":"azu","layout":"post","date":"2026-07-05T03:58:38.215Z","category":"JSer","tags":["Tools","pnpm","Rust","React","TypeScript"],"url":"https://jser.info/2026/07/05/deno-2.9-vite-8.1-es2026/"},"items":[{"category":"Headline","title":"Node.js — Node.js 24.18.0 (LTS)","url":"https://nodejs.org/en/blog/release/v24.18.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v24.18.0 (LTS)リリース。\n`Buffer.poolSize`のデフォルト値を64 KiBに変更、Web CryptoにTurboSHAKE/KangarooTwelveを追加。\n`http.writeInformation()`の追加、`crypto.diffieHellman()`で鍵データを受け取れるように変更など","relatedLinks":[]},{"category":"Headline","title":"pnpm 11.9 | pnpm","url":"https://pnpm.io/blog/releases/11.9","tags":["pnpm","ReleaseNote"],"content":"pnpm 11.9リリース。\nregistryがchecksumを提供しないtarballの`integrity`を計算してlockfileに記録するように変更。\n`pnpm sbom --exclude-peers`の追加、`pnpm audit --fix`の`minimumReleaseAgeExclude`の出力形式を修正など","relatedLinks":[]},{"category":"Headline","title":"Announcing Rspack 2.1 - Rspack","url":"https://rspack.rs/blog/announcing-2-1","tags":["rspack","ReleaseNote"],"content":"Rspack 2.1リリース。\n`builtin:swc-loader`でのReact Compilerサポート、`import.meta.glob`のサポートを追加。\n`CircularCheckRspackPlugin`の追加、TypeScript 7を使った型チェックのサポート。\n`module.parser.javascript.createRequire`、`css/global`、`experiments.sourceImport`を追加。\n`cache.maxAge`/`cache.maxVersions`による永続キャッシュの自動削除を追加。\n`experiments.pureFunctions`をproduction modeでデフォルト有効化、依存関係のTree Shakingを改善など","relatedLinks":[]},{"category":"Headline","title":"Deno 2.9 | Deno","url":"https://deno.com/blog/v2.9","tags":["deno","ReleaseNote"],"content":"Deno v2.9リリース。\n実験的な機能として`deno desktop`の追加、`deno install`のnpm/pnpm/yarn/Bun lockfileの読み込み対応。\n`deno list`/`deno link`/`deno unlink`の追加。\n`min-release-age=24h`をデフォルトで有効化、`trust-policy=no-downgrade`の追加。\n`deno test`に`--changed`/`--retry`/`--shard`フラグを追加。\n`deno compile`に`--include-as-is`/`--bundle`/`--watch`を追加。\n`deno fmt`に`sortNamedImports`/`json.trailingCommas`/`.editorconfig`対応を追加。","relatedLinks":[]},{"category":"Headline","title":"Prettier 3.9: Major parser upgrades and Formatting improvements · Prettier","url":"https://prettier.io/blog/2026/06/27/3.9.0","tags":["JavaScript","Tools","ReleaseNote","TypeScript","css"],"content":"Prettier 3.9リリース。\nMarkdownパーサを`micromark` v4、YAMLパーサを`yaml` v2へ更新。\nGraphQL.js v17の構文とRustベースのFlowパーサをサポート。\n`import ... assert`構文のサポートを削除、`--no-semi`でのコメント処理を改善など","relatedLinks":[]},{"category":"Headline","title":"Vite 8.1 is out! | Vite","url":"https://vite.dev/blog/announcing-vite8-1","tags":["vite","ReleaseNote"],"content":"Vite 8.1リリース。\n実験的な機能として`--experimental-bundle`を追加し、開発時にもバンドルして配信に対応、Chunk Import Mapの追加。\nWasm ESM integration、`import.meta.glob`の`caseSensitive`オプションを追加。\n`html.additionalAssetSources`でHTML内の独自要素や属性からのアセット検出を設定できるように。","relatedLinks":[]},{"category":"Headline","title":"Release 1.0.0 🎉 · hunvreus/basecoat","url":"https://github.com/hunvreus/basecoat/releases/tag/1.0.0","tags":["JavaScript","css","HTML","library","ReleaseNote"],"content":"Basecoat 1.0.0リリース。\nTailwind CSSとHTML/CSS/JavaScriptで実装したshadcn/ui互換のコンポーネントライブラリ。\nReactやRadixなどの実行時依存なしで、CDN/npm/テンプレートから利用できる。","relatedLinks":[]},{"category":"Headline","title":"Next.js 16.3: Instant Navigations | Next.js","url":"https://nextjs.org/blog/next-16-3-instant-navigations","tags":["Next.js","React","ReleaseNote"],"content":"Next.js 16.3 Previewリリース。\nNext.js 16.3で試験的な機能として追加されるInstant Navigationsについて。\n`cacheComponents`と`partialPrefetching`オプションによって、Instant routeごとに一度キャッシュが作られ、ページナビゲーションが即時的に表示できる仕組みについて","relatedLinks":[]},{"category":"Headline","title":"Release ES2026 · tc39/ecma262","url":"https://github.com/tc39/ecma262/releases/tag/es2026","tags":["ECMAScript","JavaScript","ReleaseNote"],"content":"ECMAScript 2026リリース。\n2026年6月30日にEcmaで承認された正式リリース。\n`Array.fromAsync`、`Uint8Array.prototype.toBase64()`/`Uint8Array.fromBase64()`を追加。\n`Iterator.concat()`、`Math.sumPrecise()`、`Error.isError()`、`Map.prototype.getOrInsert()`の追加など。","relatedLinks":[]},{"category":"Headline","title":"Announcing Vite+ Beta | VoidZero","url":"https://voidzero.dev/posts/announcing-vite-plus-beta","tags":["vite","CLI","Tools","ReleaseNote"],"content":"Vite+ Betaリリース。\n`vp run`のキャッシュ改善、`vp migrate`の対応範囲の改善、proxyとカスタムCAに対応したHTTP処理の追加など。","relatedLinks":[]},{"category":"Article","title":"Flow has been ported to Rust | Flow","url":"https://medium.com/flow-type/flows-ocaml-to-rust-port-78b95bcf49e9","tags":["JavaScript","flowtype","Rust","article"],"content":"FlowをOCamlからRustへ移植した話。\nAIを使った行ごとの移植、OCamlとRustの違い、移植後のビルドやテストの扱いについて書かれている。コードフリーズなしでの移植を行なっている。","relatedLinks":[]},{"category":"Article","title":"Introducing the Safari MCP server for web developers | WebKit","url":"https://webkit.org/blog/18136/introducing-the-safari-mcp-server-for-web-developers/","tags":["safari","browser","MCP","Tools","article"],"content":"Safari Technology Preview 247で追加されたSafari MCP serverについて。\nAI AgentからSafariのタブを操作し、DOM/ネットワーク/コンソール/スクリーンショットを参照できる。\n`safaridriver --mcp`で起動し、`navigate_to_url`/`evaluate_javascript`/`screenshot`などのツールを提供する。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Introduction | pnpm","url":"https://pnpm.io/pnpr/","tags":["pnpm","Rust","npm","server","document"],"content":"npm registry serverであるpnprについて。\nRustで書かれており、npm registry protocolに対応するためpnpm/npm/yarnから利用できる。\nlockfileのresolveをサーバ側で行いラウンドトリップを減らしている。\nPolyForm Shield Licenseで公開されている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"facebook/astryx: An open source design system that&#039;s fully customizable and agent ready","url":"https://github.com/facebook/astryx","tags":["React","Design","Tools","library"],"content":"ReactとStyleXで実装されたMetaのデザインシステム。\n`@astryxdesign/core`でコンポーネントとテーマを提供し、`@astryxdesign/cli`でテンプレート/scaffolding/テーマ/codemodなどを扱える。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"jayu/rev-dep: Dependency analysis and optimization toolkit for modern JavaScript and TypeScript codebases. Enforce dependency graph hygiene and remove unused code with a very fast CLI.","url":"https://github.com/jayu/rev-dep","tags":["JavaScript","TypeScript","CLI","Tools"],"content":"JavaScript/TypeScript向けの依存関係解析CLIツール。\n`rev-dep config run`でモジュールの依存関係の循環参照やデッドコードなどのチェックができる。","relatedLinks":[]}]},{"meta":{"title":"2026-07-17のJS: TypeScript 7.0、npm 12、Next.jsのセキュリティリリース方針","author":"azu","layout":"post","date":"2026-07-16T15:07:18.836Z","category":"JSer","tags":["TypeScript","nodejs","npm","Next.js","security"],"url":"https://jser.info/2026/07/17/typescript-7.0-npm-12-next.js/"},"items":[{"category":"Headline","title":"Release pnpm 11.10 · pnpm/pnpm","url":"https://github.com/pnpm/pnpm/releases/tag/v11.10.0","tags":["pnpm","ReleaseNote"],"content":"pnpm v11.10.0リリース。\n`pnpm issues`/`pnpm prefix`コマンドの追加、`pnpm_config__auth`環境変数での`_auth`設定をサポート。\n`pnpm self-update`のpnpm v12対応。\n`pnpm up -r <pkg>`が関係しないパッケージを更新する問題、`pnpm pack-app`のパス検証の修正など。","relatedLinks":[]},{"category":"Headline","title":"Chrome 150  |  Release notes  |  Chrome for Developers","url":"https://developer.chrome.com/release-notes/150","tags":["Chrome","browser","css","DOM","WebGPU","ReleaseNote"],"content":"Chrome 150リリース。\nCSSの`AccentColor`/`AccentColorText`、`polygon()`の丸め指定、`text-fit`をサポート。\nCSS `url()`の`cross-origin()`/`integrity()`/`referrer-policy()`修飾子をサポート。\nDOMでは`focusgroup`属性、`popover=hint`の挙動を変更。\n`Element`/`Window`のスクロールメソッドがPromiseを返す変更など。\nWebGPUの`setImmediateData()`、PWAのorigin migration。\nOrigin Trialとして`performance.getSpeculations()`の追加","relatedLinks":[{"title":"New in Chrome 150  |  Blog  |  Chrome for Developers","url":"https://developer.chrome.com/blog/new-in-chrome-150?hl=en"}]},{"category":"Headline","title":"Electron 43 | Electron","url":"https://www.electronjs.org/blog/electron-43-0","tags":["Electron","ReleaseNote"],"content":"Electron 43リリース。\nChromium 150.0.7871.46、Node.js v24.17.0、V8 15.0へアップデート。\nファイルダウンロード時のファイルダイアログが、既定でDownloadsフォルダを開くように変更。\n`WebContents`インスタンスの`clone()`、macOSの`Notification.remove()`/`Notification.removeAll()`を追加。\n`globalShortcut.setSuspended()`の追加、startup snapshotやV8 bytecode cacheによる起動パフォーマンスの改善など","relatedLinks":[]},{"category":"Headline","title":"Announcing TypeScript 7.0 - TypeScript","url":"https://devblogs.microsoft.com/typescript/announcing-typescript-7-0/","tags":["TypeScript","ReleaseNote"],"content":"TypeScript 7.0リリース。\nGoへ移植したネイティブ版の`tsc`をnpmの`typescript`パッケージとして公開。\nTypeScript 6.0で非推奨となった`target: es5`/`baseUrl`などはエラーとなる。\n`--checkers`/`--builders`/`--singleThreaded`による並列処理の制御を追加。\n`--watch`をParcelのfile watcherを元に作り直し、LSPの対応などが含まれる。\n一方でまだプログラム向けのAPIは公開していないため、VueなどのTypeScript APIを使うツールはまだ動作しない場合がある。","relatedLinks":[]},{"category":"Headline","title":"Better Auth is joining Vercel","url":"https://better-auth.com/blog/better-auth-joins-vercel","tags":["TypeScript","vercel","news","nodejs"],"content":"VercelがBetter Authの買収を発表した。\nBetter AuthはTypeScript製の認証ライブラリで、MITライセンスのまま開発体制を維持する予定。\nAgent Auth Protocolの開発を継続し、Vercel ConnectやEveへエージェントのID管理を組み込む予定。","relatedLinks":[{"title":"Vercel acquires Better Auth to accelerate open source auth - Vercel","url":"https://vercel.com/blog/vercel-acquires-better-auth"}]},{"category":"Headline","title":"npm install-time security and GAT bypass2fa deprecation - GitHub Changelog","url":"https://github.blog/changelog/2026-07-08-npm-install-time-security-and-gat-bypass2fa-deprecation/","tags":["npm","security","ReleaseNote"],"content":"npm v12リリース。\n`allowScripts`がデフォルトで無効化され、`--allow-git`/`--allow-remote`はデフォルトで`none`になる。\n2FAを回避するGranular Access Tokenは、2026年8月からアカウントやパッケージ管理操作で2FAを省略できなくなる。\n2027年1月ごろから2FAを回避するGranular Access Tokenを使った直接publishもできなくなる予定。\n自動公開にはTrusted Publishing、または人間の2FA承認を伴うStaged Publishingへの移行を推奨している","relatedLinks":[{"title":"Release v12.0.0 · npm/cli","url":"https://github.com/npm/cli/releases/tag/v12.0.0"}]},{"category":"Headline","title":"Node.js — Node.js 26.5.0 (Current)","url":"https://nodejs.org/en/blog/release/v26.5.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v26.5.0リリース。\n`Blob.prototype.textStream()`、`--experimental-import-text`、`ReadableStreamTee`を追加。\n`perf_hooks.monitorEventLoopDelay`に`samplePerIteration`オプションを追加など","relatedLinks":[]},{"category":"Article","title":"Your Worker can now have its own cache in front of it","url":"https://blog.cloudflare.com/workers-cache/","tags":["cloudflare","JavaScript","article"],"content":"Cloudflare Workers Cacheについて。\nWorkerの前段にキャッシュを置き、`wrangler.jsonc`の`cache.enabled`で有効化できる。\n`Cache-Control`/`Vary`に対応し、`ctx.cache.purge()`でタグやパスによる削除ができる。","relatedLinks":[]},{"category":"Article","title":"Next.js Security Release and Our Next Patch Release | Next.js","url":"https://nextjs.org/blog/next-security-release-program","tags":["Next.js","security","article"],"content":"Next.jsのセキュリティリリースの方針について。\n今後は月1回程度の事前告知付きリリースを公開し、緊急時は従来通りアドホックなパッチを公開する方針。\n2026年7月20日の公開を目標とし、Next.js 16.2と15.5向けのパッチを予定している。","relatedLinks":[]},{"category":"WebsiteDocument","title":"Blume — fast, AI-ready, markdown-first docs","url":"https://useblume.dev/","tags":["Tools","Markdown","document","AI"],"content":"Markdown/MDXからドキュメントサイトを生成するツール。\n`blume init`/`blume dev`/`blume build`などのCLIを提供し、AstroとViteを使って静的HTMLを生成する。\n検索、OpenAPI/AsyncAPIから生成できるAPIリファレンス、`llms.txt`、MCPサーバ、Ask AIなどの機能を持つ。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"samchon/ttsc: A \\`typescript-go\\` toolchain for compiler-powered plugins and type-safe execution + 500x faster lint integrated into compiler","url":"https://github.com/samchon/ttsc","tags":["TypeScript","Tools","nodejs","lint"],"content":"`typescript-go`を使ったTypeScript向けのツールチェイン。\nビルド、型チェック付きの実行、Lint、Formatなどのツールを提供している。\nVite/Rollup/esbuild/webpack/Rspack/Next.js向けのプラグインも提供している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"theMackabu/ant: javascript for 🐜&#039;s, a tiny runtime with big ambitions","url":"https://github.com/theMackabu/ant","tags":["JavaScript","C","TypeScript","Tools"],"content":"Cで実装された小さなJavaScript Runtime。\nWinterTC Minimum Common API互換の実装にすることを目的にしている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"Wordgard","url":"https://wordgard.net/","tags":["JavaScript","TypeScript","editor","library"],"content":"リッチテキストエディタ向けのJavaScriptライブラリ。\nProseMirror/CodeMirrorの作者が開発しており、スキーマベースの文書構造と、CodeMirrorライクな拡張機構を持つ。","relatedLinks":[{"title":"Wordgard Release 0.1","url":"https://marijnhaverbeke.nl/blog/wordgard-0.1.html"}]},{"category":"SoftwareLibrary","title":"inokawa/virtua: A zero-config, fast and small (~3kB) virtual list (and grid) component for React, Vue, Solid and Svelte.","url":"https://github.com/inokawa/virtua/","tags":["React","Vue","Solid","Svelte","library"],"content":"React/Vue/Solid/Svelte向けのVirtual Scrollコンポーネントライブラリ。\n`VList`/`Virtualizer`/`WindowVirtualizer`/`experimental_VGrid`を提供し、可変サイズ、横スクロール、Windowスクロール、グリッド表示に対応している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"unjs/httpxy: 🔀 A Full-Featured HTTP and WebSocket Proxy for Node.js","url":"https://github.com/unjs/httpxy","tags":["nodejs","HTTP","WebSocket","library"],"content":"Node.js向けのHTTP/WebSocketプロキシライブラリ。\nFetch API互換の`proxyFetch`、WebSocket Upgrade向けの`proxyUpgrade`、`createProxyServer`を提供する。\nUnix Socket、`changeOrigin`、`xfwd`、リダイレクトやCookieの書き換えに対応している。","relatedLinks":[]}]},{"meta":{"title":"2026-08-05のJS: Next.js 16.3、npmのpublish時マルウェアスキャン、vlt 1.0","author":"azu","layout":"post","date":"2026-08-05T00:23:21.550Z","category":"JSer","tags":["Next.js","React","npm","security","vlt"],"url":"https://jser.info/2026/08/05/next16.3-npm-scan-vlt1.0/"},"items":[{"category":"Headline","title":"pnpm 11.11-11.14 | pnpm","url":"https://pnpm.io/blog/releases/11.11-11.14","tags":["pnpm","ReleaseNote"],"content":"pnpm 11.11-11.14の変更点について。\n`pnpm change`/`pnpm lane`/`pnpm version -r`によるworkspaceのリリース管理を追加。\n`pnpm doctor`、`pnpm access`、`pnpm team`コマンドを追加。\n`overrides`の`\"pkg@\"`形式をサポート、`pnpm run --sequential`の追加。\n`pnpm install`のpath traversal脆弱性、peer dependency解決のdeadlock、cold-cache解決時のメモリ使用量を修正。","relatedLinks":[]},{"category":"Headline","title":"Nuxt 4.5 · Nuxt Blog","url":"https://nuxt.com/blog/v4-5","tags":["Vue","vite","rspack","ReleaseNote"],"content":"Nuxt v4.5.0リリース。\nVite 8/Rspack 2/Rsbuildへの更新、実験的なSSR Streaming、Stable Error Codesの追加。\n`useLayout`、Named Views、`useFetch`/`useAsyncData`に`enabled`オプションを追加。\n`import.meta.envName`、`tracingChannel`の追加など。\nあわせて2026年7月31日にサポートが終了したNuxt 3の、最後の数リリースの一つとなるv3.21.9も公開されている。","relatedLinks":[]},{"category":"Headline","title":"Type-Aware Linting Stable | The JavaScript Oxidation Compiler","url":"https://oxc.rs/blog/2026-07-22-type-aware-linting-stable","tags":["TypeScript","ESLint","ReleaseNote"],"content":"OxlintのType-Aware Linting Stableリリース。\ntsgolint v7.0.2000はTypeScript v7.0.2に対応する形でバージョンをTypeScriptと合わせる。\n`options.typeAware`/`options.typeCheck`、`--type-check`、`--debug timings`に対応など","relatedLinks":[]},{"category":"Headline","title":"Webpack 5.109 | webpack","url":"https://webpack.js.org/blog/2026-07-24-webpack-5-109/","tags":["webpack","ReleaseNote"],"content":"webpack 5.109リリース。\nCSS、HTML、TypeScript、非同期WebAssemblyの組み込みサポートは、対応するloaderが設定されていない場合に有効となる`auto`がデフォルトに。\n実験的な`output.html`で`title`/`meta`/`base`、`output.resourceHints`をサポート。\n`import.meta.glob`/`import.meta.resolve`、CommonJSのModule Concatenationをサポート。\n`infrastructureLogging.progress`、Workletのbundle、CSSの`@custom-media`などのサポートも追加。\nwebpack-dev-server 6.0.0も同時に公開し、Express 5への更新、Node.js 22.15.0以上が必要になるなど。","relatedLinks":[]},{"category":"Headline","title":"Nuxt Security Patch Releases · Nuxt Blog","url":"https://nuxt.com/blog/v4-5-security","tags":["Vue","security","ReleaseNote"],"content":"Nuxt v4.5.1とv3.21.10リリース。\n`vue.runtimeCompiler`を有効にしたServer IslandsでのRCE、`routeRules`の認可バイパス、Server ComponentsのDoSを修正。\n`cache`/`swr`/`isr`を使うNuxt 4での`_payload.json`のキャッシュによるデータ漏えい、開発時のみ影響するNuxt DevToolsのRCEなども修正。","relatedLinks":[]},{"category":"Headline","title":"Release v1.62.0 · microsoft/playwright","url":"https://github.com/microsoft/playwright/releases/tag/v1.62.0","tags":["playwright","testing","ReleaseNote"],"content":"Playwright v1.62.0リリース。\nComponent TestingがStory/Galleryモデルへ変更。\n`AbortSignal`による操作のキャンセル、`.webp`のスクリーンショットをサポート、`Reporter.preprocess()`を追加。\n`retryStrategy: \"isolated\"`、`apiResponse.timing()`、Playwright MCPをCLIに含めるように変更など","relatedLinks":[]},{"category":"Headline","title":"Ember 7.1 Released","url":"https://blog.emberjs.com/ember-released-7-1/","tags":["Ember","ReleaseNote"],"content":"Ember.js 7.1リリース。\n`{{element}}`/`{{and}}`/`{{or}}`/`{{eq}}`などのビルトインヘルパーを追加。\nstrict templateで`{{on}}`/`{{fn}}`/`{{hash}}`/`{{array}}`などの自動importに対応など","relatedLinks":[]},{"category":"Headline","title":"pnpm 11.15-11.19 | pnpm","url":"https://pnpm.io/blog/releases/11.15-11.19","tags":["pnpm","ReleaseNote"],"content":"pnpm 11.15から11.19までの変更点について。\n`pnpm update`/`pnpm outdated`のGitHub Actions更新対応、`pnpm update --changeset`の追加。\n`update`/`audit`設定、`publishConfig.name`、`save-prefix`の`=`サポートを追加。\n`pnpm self-update`がプロジェクト設定を参照しないように変更、TTYなしの`pnpm login`に対応など","relatedLinks":[]},{"category":"Headline","title":"v1.20.0 | React Aria","url":"https://react-aria.adobe.com/releases/v1-20-0","tags":["React","JavaScript","library","ReleaseNote"],"content":"React Aria Components v1.20.0リリース。\nPopoverをhover/focus/long pressで表示する`PreviewTrigger`、テキスト入力中に補完を扱う`TokenField` alphaを追加。\n`MenuTrigger`に`trigger=\"contextMenu\"`を追加、`useKeyboard`のショートカットAPIを改善。\nTable内でTextFieldなどの対話的なコンポーネントのサポートなど","relatedLinks":[]},{"category":"Headline","title":"Next.js 16.3 | Next.js","url":"https://nextjs.org/blog/next-16-3","tags":["Next.js","React","ReleaseNote"],"content":"Next.js 16.3リリース。\nオプトインのInstant Navigationsとして、`cacheComponents`と`partialPrefetching`によるナビゲーションの改善を追加。\n`import.meta.glob`のサポート、App RouterのSSR内部をWeb StreamsからNode.js Streamsへ移行することによるパフォーマンス改善など。\n実験的な機能としてTurbopackのファイルシステムキャッシュとメモリ解放の設定、RustベースのReact Compiler、`useOffline`を追加。","relatedLinks":[{"title":"Release v16.3.0 · vercel/next.js","url":"https://github.com/vercel/next.js/releases/tag/v16.3.0"}]},{"category":"Headline","title":"Node.js — Node.js 26.6.0 (Current)","url":"https://nodejs.org/en/blog/release/v26.6.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v26.6.0リリース。\n`ffi.getCurrentEventLoop()`の追加、`node:test`に`context.log()`と`test:log`イベントを追加。\n`TestStream`イベントに`entryFile`を追加、npm 11.18.0へのアップデートなど。","relatedLinks":[]},{"category":"Headline","title":"Node.js — Node.js 24.19.0 (LTS)","url":"https://nodejs.org/en/blog/release/v24.19.0","tags":["nodejs","ReleaseNote"],"content":"Node.js v24.19.0(LTS)リリース。\n`Blob.prototype.textStream()`、`--experimental-import-text`、`fs.readFile()`での`buffer`オプションをサポート。\n`stream.compose`のStable化、TLSの`certificateCompression`オプションの追加など。","relatedLinks":[]},{"category":"Headline","title":"vlt 1.0 &amp; Hosted Package Registries | vlt /vōlt/","url":"https://www.vlt.io/blog/1-0","tags":["vlt","npm","package","security","ReleaseNote"],"content":"vlt 1.0リリース。\nHosted Package Registriesとecosystem mirrorsも一般提供となった。\nGraph ModifiersとCatalogsを備える。\n依存パッケージのライフサイクルスクリプトを`vlt install`と`vlt build`に分けて扱うPhased Installations、npmの公開レジストリへのOIDC Trusted Publishingに対応。\nHosted Package Registriesはnpm Registry APIと互換性があり、npm、pnpm、Yarn、Bun、Denoから利用でき、既知のマルウェアをブロックする仕組みを持っている。","relatedLinks":[]},{"category":"Article","title":"Errors worth reading - nostics","url":"https://nostics.dev/","tags":["TypeScript","library"],"content":"ライブラリのエラーコードを管理するTypeScriptライブラリ。\nエラーコードに対応する理由/修正方法の定義、ソース位置、ドキュメントURLを持つ`Diagnostic`オブジェクトを定義できる。\nNuxtで利用されている","relatedLinks":[]},{"category":"Article","title":"npm publish-time malware scanning and dual-use metadata - GitHub Changelog","url":"https://github.blog/changelog/2026-07-28-npm-publish-time-malware-scanning-and-dual-use-metadata/","tags":["npm","security","article"],"content":"npmのpublish時のマルウェアスキャンとdual-use content向けメタデータについて。\n新しくpublishされたパッケージは、インストール可能となる前にスキャンされる。\n結果に応じて通常どおり公開、手動レビュー、ブロックのいずれかとなる。\nマルウェアと誤認される可能性があるパッケージは`package.json`の`contentPolicy`と`DISCLOSURE`ファイルでdual-use contentを宣言する仕組みを追加。\n宣言したパッケージは2FAを強制するtrusted publishing、対話的なpublish、staged publishingで公開する必要がある。","relatedLinks":[]},{"category":"Article","title":"Cloudflare Workers and Containers now support inbound TCP connections and gRPC | The Cloudflare Blog","url":"https://blog.cloudflare.com/grpc-workers/","tags":["cloudflare","JavaScript","server","article"],"content":"Cloudflare WorkersとContainersのInbound TCP/gRPC対応について。\nWorkers Runtimeに`connect(socket)`ハンドラを追加し、Spectrum経由のTCPソケットをWorkerで受け取れる。\nDurable ObjectsからContainersのTCPポートへ転送し、Container上のgRPCサーバで双方向ストリーミングを扱える。\n`@connectrpc/connect`とgRPC-web変換により、WorkerだけでUnary/Server StreamingのgRPC APIを扱える。","relatedLinks":[]},{"category":"Article","title":"Web Streams API 入門 ― 基本概念から実践まで","url":"https://zenn.dev/cybozu_frontend/articles/web-streams-api-guide","tags":["JavaScript","article","nodejs","stream"],"content":"Web Streams APIの基本概念から使い方について。\n`ReadableStream`/`TransformStream`/`WritableStream`の役割について解説している。teeやBackpressure、Node.js Streamとの違いも扱っている。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"octanejs/octane: Octane is an incredibly efficient React replacement UI library with improved developer ergonomics","url":"https://github.com/octanejs/octane","tags":["React","JavaScript","library"],"content":"Infernoの後継となるReactのHooksやSuspenseに近いモデルをコンパイルして動かすUIライブラリ。\nVirtual DOMを使わず、TSX/TSRXをサポートし、Vite/Rspack/Rsbuild向けプラグインを提供する。\n条件付きHooksや依存配列なしの`useEffect`、SSR/Streaming SSRなどに対応している。","relatedLinks":[]},{"category":"SoftwareLibrary","title":"vercel-labs/scriptc: TypeScript-to-Native Compiler","url":"https://github.com/vercel-labs/scriptc","tags":["TypeScript","compiler","Tools"],"content":"TypeScriptをネイティブ実行ファイルへコンパイルするコンパイラ。\nTypeScript Compiler APIで型チェックし、Typed IRをLLVM/Cバックエンドでネイティブコードへコンパイルする。\nquickjs-ngを使った動的なJSのライブラリを扱う仕組みも持っている。","relatedLinks":[{"title":"Limitations | scriptc","url":"https://scriptc.dev/limitations"}]},{"category":"SoftwareLibrary","title":"TanStack/charts: A tiny TypeScript visualization grammar for responsive, accessible, server-rendered charts—powered by granular D3 primitives.","url":"https://github.com/TanStack/charts","tags":["JavaScript","SVG","graphic","library"],"content":"D3ベースチャートライブラリ。\n`defineChart`でフレームワーク非依存のチャート定義を書き、React/Vue/Solid/Svelteなどのアダプタで描画できる。\nSVG SSR、Canvasレンダラー、アクセシビリティ、レスポンシブレイアウトを扱うランタイムを含む。","relatedLinks":[{"title":"TanStack Charts","url":"https://tanstack.com/charts/latest"}]}]},{"meta":{"layout":"page","title":"JSer.infoについて","category":"meta","author":"azu","permalink":"/about/","date":"2015-06-10T00:00:00.000Z","url":"https://jser.info/2015/06/10/about/"},"items":[]},{"meta":{"layout":"page","title":"JSer.info Sponsors","category":"meta","author":"azu","permalink":"/sponsor/","date":"2023-02-20T04:00:00.000Z","url":"https://jser.info/2023/02/20/sponsor/"},"items":[]},{"meta":{"layout":"page","title":"Support","category":"meta","author":"azu","permalink":"/support/","date":"2016-01-08T00:00:00.000Z","url":"https://jser.info/2016/01/08/support/"},"items":[]}]