1、HTTP2で多重の簡略説明
HTTP1では、各要求は、要求時に長い時間を要する握手を3回または4回で、手を振ってTCP接続を確立してもキープアライブを開いて、複数の接続の問題を解決し、それでもます効率上の問題があります。
- シリアル出力ファイル。
- あまりにも多くの接続。
HTTP2置換されたバイナリ形式、テキスト形式HTTP1と高効率を使用して送信。代わりに、多重化シーケンスおよびブロックするメカニズムHTTP1の同じTCP接続で同時にすべて同じドメイン名のリクエストが完了しています。もたらし遅延やメモリ消費による複数のTCP接続を排除。単一のインターリーブされた並列接続要求および応答、互いに独立。
2、あなたは、TCP 3ウェイハンドシェイクと4人の理解を振っに話します。
3ウェイハンドシェイク: クライアントは、SYNフラグとサーバーにデータパケットを送信します。サーバは、SYN / ACKフラグとデータパケットが受信確認情報を伝達示し返します。クライアント・リターンは、ACKフラグとパケットを渡すハンドシェークの終了を表します。
4 揺れ: クライアント・プロセスは、連続的な解放メッセージを発してデータの送信を停止します。サーバーは、連続放出メッセージ、確認メッセージを受け取ります。データが送信された最後のサーバは、顧客へのメッセージの連続放出を送信します。クライアントは、連続放出メッセージサーバを受信確認を送信します。サーバーは、閉じた状態にし、クライアントの確認を受けます。
3及び利点の差、次の三つ決意アレイ方法は、導入されました
Object.prototype.toString.call()、instanceofは、Array.isArray
Object.prototype.toString.callタイプは、現在のパラメータの一種である[オブジェクトの種類]を返します。このメソッドは、すべてのタイプのために測定することができます。
対応するプロトタイプ現在のオブジェクトがプロトタイプチェーンによって決定されているかどうかのinstanceof。真で発見、私はリターンがfalseを見つけることができません。したがって、唯一のinstanceof型決意オブジェクト、およびオブジェクトのすべての種類は、真のinstanceofオブジェクトであります
Array.isArrayオブジェクトが配列であるかどうかを決定するために使用されます。
図4に示すように、再描画と戻り、ならびに方法を最適化するために導入されました
1、ブラウザのレンダリングメカニズム
-
- ブラウザは、フローレイアウトモデルを使用しています
- HTMLブラウザは、DOMに解決され、CSSを解析するとCSSOMで、DOMとCSSOM合併は、ツリーをレンダリングになりました
- rendertreeで、我々はすべてのノードのスタイルを知っているし、ページ上でのサイズと位置を計算し、最後のページには、上の描画します。
- ブラウザは、レイアウトを流れているため、通常計算ツリーが通じ唯一のパスを必要とレンダリング。テーブルとその内部の要素を除いて、彼らは理由がテーブルレイアウトを避けるために理由である、複数回、時間を取るように可能性が通常3回カウントすることができます。
2、再描画
幾何学的特性ノード変化するため、またはスタイルがレイアウトに影響を与えることなく変更されているので、再描画と呼びます。たとえば、アウトライン、可視性、色と背景色の場合。
3、逆流
ページレイアウト、または幾何学的特性を還流と呼ばれている変更する必要があります。逆流は、レイアウト更新部またはページ全体への変更を伴うため、戻り値の要素が後に逆流すべてのノードを引き起こす可能性があり、ブラウザのパフォーマンスに影響を与える重要な要因です。
逆流が起こる再描画するためにバインドされているが、必ずしも逆流を再描画するためにはつながりません。
4、リターンを再描画減らすために
-
-
- 要素のクラス名を変更することにより、可能な限り、スタイル要素を設定します。
- 複数のインラインスタイルを設定しないでください
- アプリケーションのアニメーション要素は、位置固定された属性または絶対値を使用する必要があります
- テーブルレイアウトを使用することは避けてください
-
平坦化機能を実現するために、反復方法を用いて、5、
せARR = [1、2、[3、4、5、[6]、[7]、[8]、9、10、[11、[12、13 ]]]。 関数平坦(ARR){ 一方(arr.some(項目=> Array.isArray(アイテム))){ ARR = [] .concat(... ARR)。 } 戻りARR。 }
関数は、(ARR){平ら 戻り arr.reduce((前、次)=> { 返す?)次の(Array.isArrayを[...プリ、...)は、次の(平坦化]:[...プリ、次】 ; }、[]) }