親コンポーネントに2つの子コンポーネント、CompAおよびCompBがあります。 2番目のコンポーネントは、多くのデータ処理を行います（それ以外の多くのコンポーネントも呼び出します）。これにより、ページの読み込み時間が全体的に遅くなります。これにより、しばらくして私のSpinnerが立ち往生することになります。ページがすでにCompAでロードされている間に、CompBがレンダリングされる準備ができているかどうかを確認してレンダリングする方法はありますか？任意のヘルプリアクションコンポーネントがページの読み込みを遅らせる
ため
return(
<div>
<CompA
info = {info}
/>
<CompB
data = {data}
/>
</div>
おかげであなたがJavaScriptでメインスレッド上に重い計算を行う場合は、いつでも応答性のいくつかの不足が発生します。これにより、レンダリングの遅延が発生する可能性があります。ボタンや他のユーザー入力の応答性が最適ではありません。
これを解決するには、コンポーネントをメインスレッドから外してレンダリング作業のために解放します。 最初にCompBを空白/保留中/ロード中の状態にレンダリングし、表示したいデータの準備ができたら後で更新することができます。
メインスレッドの外に計算を移動するには、クライアント側のバックグラウンドで計算を実行するために
あなたのコンポーネントBのようなサウンドは、いくつかの同期的なものをたくさんしていますか？おそらくもっと少しのコードを表示するかもしれません。 – Hardy
真、それはD3を使ってSVGをレンダリングする複数のコンポーネントにデータを渡しています。また、Axesを描画しながら多くの計算がすべて遅くなります。特に10000以上のアイテムを持つ複数の配列を渡す場合。余分なコードを追加できないというお詫びには複数のコンポーネントがありますが、親コンポーネントでCompBの読み込みを遅らせるという考えがあれば、非常に役に立ちます。 –
重い部分を 'setTimeout'でラップしてみてください。 – Hardy