Redux, Fluxメモ
reduxを使わないと、props, stateのバケツリレーが発生する
reduxでは、親コンポーネントに渡していたstateをストアする。
state変更時も直接storeを見に行く。
Fluxフロー
・データの一方向に流れること。
・イベントが発生したデータが変化する。
ReduxはReactにこの思想を追加したもの
登場人物
・Container:Storeと接続されたコンポーネント
・Action:要求を受けて変更を依頼
・Dispatch:Reducerに投げること
・Reducer:バックオフィスに相当。Actionを受け付け、その要求に合わせて何をすべきかの判断を下す。
・Store:状態を保存する場所(倉庫)
Reducerの指示で、状態をこういうふうに変更してくださいという指示が下る。それを保存する場所のこと。
・mapStateToProps, mapDispatchToProps:Storeで変更された情報を伝える役割。
---
・Containerで例えばあるコンポーネントをクリックしたときに、それに応じてActionが発火。
・Actionの変更司令をReducerに伝える。
・Reducerの指示を受けて、Storeの中のある状態を、AからBに変える指示がなされる。
・その状態がmapStateToProps, mapDispatchToPropsを経てContainer内に伝わる。Containerの中ではAからBに変わった状態の表示がなされる。
show-us-the-data コンペ解法(76th)
解法
タスクは論文内で使用されているデータセット名を抽出するというものでした。行った内容としては
- 文字列マッチのDistant SupervisionでNERデータセットを作成
- 一部同義語や類義語 (data ⇔ dataset, study ⇔ survey 等)を用いたNERデータセットのData Augmentation
- データを直接見て、データセット名+略語のパターンが頻出していたので、その抽出
- NERモデル+略語抽出で得られた候補をフィルタリング
を行いました。
コード
反省点
初参加のコンペでした。主に以下の2つが重要だと実感したコンペだと感じました。
- データをよく見ること
- 与えられたデータから、テストデータの入力を想像すること
今回のコンペで事前に与えられた訓練用データは、アノテーションされたデータセット名のラベル偏りがありました。それゆえ、訓練データとPrivateデータが同じ分布のデータだとは限らない、もしそれを仮定した予測モデルを作成したならば、Privateデータ全体の評価で大幅な精度ダウンが起こりうることが予測されていました。
https://www.kaggle.com/c/coleridgeinitiative-show-us-the-data/discussion/238005
ふたを開けてみると、結果はその通りでした。実際、与えられたデータでNERモデルを訓練しても、結局そのNERモデルで取得できるデータ名は、訓練データ内に出現したデータ名のみに限られてしまいます。
今回は実際にデータを見て、略語によるデータ名抽出が有効だと考えたのでその抽出を織り込んだことで、なんとか銀圏に繋がったようでした。
自然言語処理屋だと、初手BERTをついつい選択しがちではありますが、
- データの傾向をつかむこと
- 訓練データ外の入力を想像すること
- Deep以外のアプローチの選択肢
これらの重要性を痛感したコンペでした。次のコンペは、これらの反省点を生かして取り組みたいと思います。
React メモ
主要ライフサイクルメソッド
Mount
・constructor()
初期化(stateなど)
変数などを最初に定義しておきたいときに使う
・render()
virtuald DOMを描画、この時JSXをリターンする
・componentDidMount()
render()の後に一度だけ呼ばれる。
リスナーの設定やAPI通信など、描画の準備に使われる。
初期化(constructor())-> render() -> 一度だけcomponentDidMount()が呼ばれる
ここまでがMounting
Update
・render() VDOM を再描画する
・componentDidUpdate()
再render()後に呼ばれる。
スクロールイベントや条件イベント
Updating: render() -> componentDidUpdate() がrender()のたびに走る。
Unmount
・componentWillUnmount()
コンポーネントが破棄される直前に呼ばれる。
ライフサイクルメソッドを使う理由:
・関数の外に影響を与える関数を記述するため
DOM変更、API通信、ログ出力、setState
副作用=適切な場所に配置すべき処理
名前付きexport
・1モジュールから複数の関数をexport
・クラスはexportできない
名前無し(default)export
・1ファイル 1export
・ES6 で推奨
・アロー関数は宣言語にexport
・クラスもexport可能
モジュール全体のimport
・名前無しexportしたモジュールをimportする
・モジュール全体のimport
関数ごとのimport
・名前付きexportされたモジュールをimportする時に使用
hookとは
・クラスの機能をFunctional Componentでも使える
・後方互換
useState()を使う
・ステートフックと呼ばれる
useEffect()のメリット
・ライフサイクルメソッドを代替できる