レンガの移動 -- タイムアウト状態のリスニングと組み合わせたデータハイジャック

HTMLで非同期ステート・リスナーを実装し、ステート・ループ・リスナーのエッジを取り除きます。

フロントエンドは、サーバーにポイントインタイムデータをブロードキャストし、他のWebサービスやC / Sシステムに同期し、ポイントインタイムに従って、同期表示を行う：最近設計があるすべての。

サービス終了後のデータ放送は可能な限り保証する必要があります：

1. 一貫性：なぜ一貫性を確保しようとするのですか？よくあるシナリオの例：ビデオシーン 同期していないビデオ字幕の制作

2. フォールト・トレランス：他のサービスでは通信障害などが発生する可能性があるため、サービスが利用できるように最大待機時間を設定する必要があります。

   例えば、ポップアップの読み込みに失敗したからといって、ビデオの視聴を中断することはできません。

   

中段

• 同時にブロードキャストされたデータも、各サービスによって計算されたデータが同じ時点であることを確認しようとすると、一貫性を確保するために、フロントエンドは、実際にはすべてのサービスが正常に応答するのを待っている状態の変化です：

  • 閉塞

    実現：可能

    問題点：シングルスレッドブラウザの遅延ブロードキャストイベントをリアルタイムで一時停止することはできません。

    while(true){
    	if(state){}
     	//同期スリープ
    }
    

  • ノンブロッキング

    実現：なし

    サービス内の呼び出しは実行を一時停止できず、サービスの実行を正しくブロックできません。

    function sleep(ms) {
     return new Promise(resolve =>
     setTimeout(resolve, ms)
     )
     }
    

  • ノンブロッキングES 6（プロキシ）

    実現：可能

    ブロードキャストが待機した後、すべてのサービスがSUCCESSを返します。

    実際の原理は、キーが設定されたときに値の状態変化をリッスンすることで、サービスが準備できているかどうかをプロキシで判断します。

    let proxy = new Proxy({}, {
     get: function (target, key, receiver) {
     return Reflect.get(target, key, receiver);
     },
     set: function (target, key, value, receiver) {
     return Reflect.set(target, key, value, receiver);
     }
    });
    

  • ノンブロッキング ES 5(Object.defineProperty)

    実現：可能

    ES6との互換性

    let timeOutFun = window.setTimeout(function(){
     timeOutConfig(proxy)
    },500)
    

• 補償メカニズム

  ステータスを待てないなら、待つ必要はありません。

  合理的な待ち時間の後、リリース状態は、利用可能なサービスが実行を継続することを保証します。

ミディアム

要約はありません。