Reactには、パフォーマンス最適化のためのAPIがいくつかあります。具体的にはReact.memo、useMemo、そしてuseCallbackです。 React.memoで囲まれた関数コンポーネントは、propsが以前と変わっていない場合に再レンダリングが抑制されます。 また、useMemoやuseCallbackは、関数コンポーネント内での値の再計算を抑制する効果を持ちます。 これらは最適化のためのツールなので、「過度な最適化」を避けるように啓蒙する言説がよく見られます。 すなわち、ちゃんと本当に最適化のために必要なところにだけこれらを使おうということです。 特に、React.memoはpropsが以前と変わっているかどうかを判定するためのオーバーヘッドがあるし、useMemoやuseCallbackもフック呼び出しのオーバーヘッドがあります。 意味がないところでReact.memo
Reactでのシングルページアプリケーションを作成していると、必ず意識しなくてはいけないのが状態管理です。Hooks APIの登場により、アプリケーションの状態管理方法にも選択肢が増えてきました。2023年のReactアプリケーションの状態管理方法はどのような選択肢が考えられるでしょうか? 状態管理の選択肢 Reactの状態管理として本記事でには紹介している手法は下記の4通りになります。 ローカルステート(useState、useReducer)での管理 Hooks APIのuseReducer、useContextを使った管理 Reduxによる管理 Recoilによる管理 状態管理フレームワークは他にも選択肢がありますが、Reduxを紹介します。理由は、候補として挙がるライブラリの中でもっともシェア数が多く、知名度が高いためです。 下図は、主要なReact状態管理フレームワークのダウンロ
Reactのチュートリアルをhooks + TypeScriptでモダンな仕様にリファクタしてみた 2019.12.14 2019.12.14 プログラミング 7518回 0件 この記事はCyberAgent20新卒エンジニアAdvent Calendar 2019の14日目の記事です。 reactの入門と言えば本家の丸ばつゲームを作るReactチュートリアルが有名ですが、少なくとも僕が勉強を始めた3年ぐらい前からサンプルのコード自体は変更されていません。(知らぬまに公式が日本語に対応していましたがw) hooksが登場したあたりからFacebookがこれからはクラスベースじゃなくて関数ベースのコンポーネントを使っていくようにしようね、とアナウンスしてるにも関わらず公式はクラスベースのままですし、時代はTypeScriptなのにJavaScript(しかもコードが読みにくく結構危険なコード
【progateの次はこれ!】reactの勉強手順まとめ 2018.05.26 2019.12.03 プログラミング 16058回 0件 モダンなサイトではフロントエンド(ブラウザ上でのUI)はreactやvueなどのjavascript(以下js)のライブラリを使って実装されることが多くなってきました。 その中でも今回は特に僕が普段からよく書いているreactの勉強法について紹介していきたいと思います。 まずはjsの勉強 jsを元に書かれたフレームワークなので、まずはjsについて勉強しましょう。 おすすめはドットインストールかprogateです。僕が勉強したときはドットインストールが主流だったので、progateのjsはやったことが無いのですが、swiftをprogateで触ったことがあり、そのときにこのサービスめっちゃいいなと思いました。(現在はprogateでもreactのコースが作
こんにちは! Air メイトのフロントエンドエンジニアの @sadness_ojisanです。今月から「React 人材をどう育むか」という連載を行います、この記事はその第一弾です。 みなさーん!React 人材の採用はうまくいっていますか???私たちはまだまだ足りていません! そこで最近では、React 人材を登用するために、採用だけでなく育成も試みています。 この連載では実際に行なった育成プランとその効果を紹介できればと思います。 私は社内で 2-30 人規模の React 勉強会の講師をしたり、社外でもプログラミング講座の先生などをやっています。 また、大学院では教育学を専攻していたこともあり、育成はかなり関心がある分野です。 この記事では、React 勉強会を開催しているなか、「この教え方や工夫が効いたよ」といった指導方略や、「受講生はここでつまづいたよ」という経験を紹介します。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く