モデルにImmutable.JSを使用する利点 - Qiita
Immutable.JS使ってますか？ よくある記事では不変的なオブジェクトを扱えるばかり注目されてますが、それ以外にも便利な機能があります. Immutable.Recordは特にオススメです. Recordを使えばモデルの設計が捗ります. 自分はImmutable.JSをReact & Flux等のStoreの管理に利用してます. 当初は愚直にupdateを書きまくって管理してたのですが複雑になりすぎて、これは良くないと再設計し直しました. その再設計の中心にRecordでモデルを作成して#mergeDeepWithを使ってStoreを更新する方法です. CodePenにサンプルを用意したので参考にしてください. See the Pen Use model layer with Immutable.JS by satoruk (@satoruk) on CodePen. サンプルコード
ReduxにImmutable.JSを適用してみた - Qiita
はじめに この記事はDMM.com #1 Advent Calendar 2017 の12/13の記事です。 Immutable.JSを使って、React+Redux製WebアプリのReducerをすっきりさせた方法と結果、及び注意点についてまとめました。 目的 Immutable.JSとは、Facebookが開発した、不変であるデータ構造を扱うためのJavaScriptライブラリです。 開発中だったReact+Reduxアプリでは、開発を進めれば進めるほど、ActionとReducerが肥大化し、改修がしづらくなっていました。 (Reducer内にロジックが含まれていたり、冗長な...stateを書く必要があったり…etc。) 今回は、Immutable.JSを使って、Reducerの肥大化を防ぎ、保守性・改修性を上げることを目的とします。 方法 今回は一般的なReact+Reduxアプ
Redux + immutable.js- Record - - DeNA Design
immutable.js Advent Calendar 2017 2 日目の投稿です。「Redux に immutable.js を導入すると良いらしいが、まだ利用したことがない」という方向けの内容になります。「Reducer の Object.assign が手短に書ける便利ライブラリ」と認識されている方もいるかもしれません。immutable.Record は、immutable な collection を保持する Object に関数を付与することができ、モデルとして利用することが可能です。 React 状態管理の定番感が強い Redux は、その他にも多くの View ライブラリでバインディングがあります。View フレームワーク非使用のページでも、Redux を導入する価値は大きいです。しかし通常の ReduxStore の中身は巨大な json に過ぎず、MVVM アーキテ
immutableのメリットとImmutable.jsでのModel定義 - コネヒト開発者ブログ
こんにちは。フロントエンジニアの安達 (@ry0_adachi) です。 気付いたら前回の私の記事から2ヶ月が経ちました。時間の流れは早いですね...。 さて、今回はimmutableとそれをJSで実現するためのImmutable.jsについてです。 この記事を通して沢山の方にimmutableについて知ってもらえると嬉しいです。 immutableとは immutableは元となっているオブジェクトに変更を加えない、加えられない状態です。 また、変更を加える、加えられることをmutableと呼びます。 immutableの例 JSで配列に値を追加する際に let list = [1, 2] list.push(3) とやるとlistに3が追加されます。 これは元となっているlistに対して3を追加するという変更を加えているのでmutableです。 しかし、これをImmutable.jsの
JavaScript で クラスベースの設計より関数指向の実装を薦める理由 + GraphQL について - mizchi's blog
最初に: 「Functional Programming 最高！」という話ではないです JSは通信やストレージに保存するデータの扱いの関係で、JSONにシリアライズできることが至上命題になるケースが多いので、クラスベースの設計で自身に副作用を起こすメソッドより、イミュータブルな T => T なstatic methodとして切り離しておくと扱いやすいケースが多い— 現場の声 (@mizchi) 2016年9月6日 複雑なオブジェクトのシリアライズは簡単だけど、逆にシリアライズされたオブジェクトからビルダを構築するのが難しいので、JSONの構造体自身とは別に独立して独立したメソッドとしてビルダが切り離されている方が扱いやすい— 現場の声 (@mizchi) 2016年9月6日 一応コンストラクタ名を保存してシリアライズ/復元する方法はあって、RPGツクールMVのコードを読むとそういう感じに
React使い必見！ Immutable.jsでReactはもっと良くなる | Wantedly Engineer Blog
Reactを導入して半年近くが経ちましたWantedlyでは、今年の初めからReact(+Redux)の導入に取り組み始めたので、気付けば半年近く立っていることになります。今自分がこの記事を書いているエディタから、Wantedly Adminのチケット画面まで、ある程度大きなアプリケーションを開発してきました。 そこで今回は、チームで継続的に開発していく過程で遭遇した問題と、それを解決するために導入したImmutable.jsについて紹介します。 増え続けるCallbackとAction、肥大化するStoreReactとセットで語られることが多いFluxアーキテクチャ。ここでは詳しい説明は省略しますが、とてもシンプルな考え方なので、チュートリアルなどで簡単に学ぶことができます。しかし、実際にチームで開発していくと、たしかに動いてはいるけど、綺麗とは言い難いコードが増えてしまいました。 Ac
Immutable App ArchitectureについてのTalkを観た
Render 2016 - Lee Byron from White October on Vimeo. https://vimeo.com/166790294 http://2016.render-conf.com/talks.php#immutable-user-interfaces Dan AbramovもReact EuropeのQ&AでおすすめしていたTalkで、改めて見て面白い内容だったので紹介します。 FacebookがReactやGraphQL、Immutable.jsを使ってどのようなアーキテクチャでアプリケーションを作成しているのかということを解説したTalkです。 特にFluxのような新しい概念が提唱されているわけではありませんが、最近のフロントエンドの流れやFacebookが目指しているものがわかりやすく解説されています。 Architectureの話が中心で各ライ
Immutable.jsを色々触ってみました - Qiita
immutable.jsは、facebook社が作っているJavaScriptのライブラリでimmutableなコレクションを提供してくれます。List, Stack, Map, OrderedMap, Set, OrderedSet and Recordがあるとのこと。 関数型言語にインスパイアされて作っているらしいので、関数型に馴染みのある関数が出てきて嬉しいです。 他にも、正格でなく遅延評価してくれるという点も嬉しいですね。 インストール
Immutable.jsでJSでも不変データ構造を扱う - Qiita
ClojureやHaskellのような不変データ構造体のJS実装です。facebook製。 不変データ構造の特徴として、元のデータ構造は不変です。 Immutable = require 'immutable' map1 = Immutable.Map a: 1, b: 2 # => Map {a: 1, b: 2} map2 = map1.set a: 3 #=> Map {a: 3, b: 2} map3 = map1.update (val) -> {foo: val.a} #=> Map {foo: 1} Mapの他に、List, OrderedMap, Set, OrederedSet, Seq, Range, Record, Stack等があります。内部的にはトライ木になっています。 面白いのはSeqやRangeで、filter関数やmap関数を与えても、getで呼ばれるまで遅
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Record#merge() converts argument to Immutable structure · Issue #1293 · facebook/immutable-js · GitHub
Immutable.jsでreact+redux環境が楽になりそうな話 – 不動産屋のエンジニア
Should I use ImmutableJS with Redux?
フロントエンド・バリデーション