kurosame’s diary

フロントエンド中心です

React の Context API について

ContextAPI

  • v16.3 から追加された機能
  • React のみでいい感じの State 管理ができる
  • Redux とは別の選択肢ができただけと思って良い認識

従来の State 受け渡し

class Parent extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      count: 1
    }
  }

  render() {
    return (
      <div>
        親:
        {this.state.count}
        <Child count={this.state.count} />
      </div>
    )
  }
}

const Child = props => (
  <div>
    子:
    {props.count}
    <Grandchild count={props.count} />
  </div>
)

const Grandchild = props => (
  <div>
    孫:
    {props.count}
  </div>
)

ReactDOM.render(<Parent />, document.querySelector('#app'))

結果

f:id:kurosame-th:20181105172314p:plain

ContextAPI を使った State 受け渡し

const { Provider, Consumer } = React.createContext()

class Parent extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      count: 2
    }
  }

  render() {
    return (
      <Provider value={{ state: this.state }}>
        <div>
          親:
          {this.state.count}
          <Child />
        </div>
      </Provider>
    )
  }
}

const Child = () => (
  <div>
    <Grandchild />
  </div>
)

const Grandchild = () => (
  <Consumer>
    {({ state }) => (
      <div>
        孫:
        {state.count}
      </div>
    )}
  </Consumer>
)

ReactDOM.render(<Parent />, document.querySelector('#app'))

結果

f:id:kurosame-th:20181105173941p:plain

今回は State のみだったが、Action も同じように渡せる

考察

  • Redux でやってたことは普通に実現できそう
  • よく言われているが、小規模であれば Context API はありだが、大規模であれば Redux 等を使った方が良さそう
    • Provider が肥大化すると、メンテナンス性が低そう。ネストもするので、可読性も悪い

Spark チューニングメモ

チューニングした所

EMR クラスターを作ってる所

aws emr create-clusterしてる所で、渡すオプションを変えてみる

maximizeResourceAllocation を変えたりは、あまり効果なし

maximizeResourceAllocation は
maximizeResourceAllocation オプションを true にすることで、クラスター内の各ノードでリソース最大限に使用できるようにエグゼキュターを設定することができます。
らしい

Spark の実行オプションを変えてみる

spark-submit のオプションを変えてみる

この辺中心に色々変えたけど、あまり効果なし
--num-executors 2 \
--executor-cores 3 \
--executor-memory 12G \

num-executors は Executor の個数
executor-cores は 1Executor の CPU コア数
executor-memory は 1Executor のメモリ

一応 Driver のも少し変えたりしたけど、効果なし
--driver-cores 1 \
--driver-memory 5G \

Spark を Scala で書いているが、Scala コード自体のチューニングを見直す必要があるのだろうか