Rumah >hujung hadapan web >tutorial js >Penyelesaian kepada ketinggalan yang disebabkan oleh enjin javascript yang memonopoli benang untuk masa yang lama_kemahiran javascript

Penyelesaian kepada ketinggalan yang disebabkan oleh enjin javascript yang memonopoli benang untuk masa yang lama_kemahiran javascript

WBOY
WBOYasal
2016-05-16 16:29:092228semak imbas

Sifat satu-benang enjin Javascript akan menyebabkan benang dimonopoli untuk masa yang lama apabila memproses lintasan gelung besar, mengakibatkan ketidakupayaan untuk bertindak balas kepada peristiwa lain (seperti operasi pengguna) tepat pada masanya, dan dalam kes yang teruk, membekukan atau animasi yang digantung. Untuk menyelesaikan masalah di atas, mekanisme yang boleh dilaksanakan adalah untuk membahagikan gelung besar kepada beberapa segmen gelung kecil dan melaksanakannya dalam kepingan, supaya enjin Javascript mempunyai peluang untuk memasukkan dan melaksanakan perkara lain di antara setiap segmen, dengan itu meningkatkan dengan berkesan pengalaman persembahan

Ansync.js

Salin kod Kod adalah seperti berikut:

fungsi Ansync (totalCount, segmentCount, workCallback, returnCallback)
{
    var num_of_item_for_each_segment = segmentCount;
    var num_of_segment = Math.ceil(totalCount / num_of_item_for_each_segment);
    var count_of_segment = 0;
    pemasa var;
    var mula, tamat;
    this.process = fungsi(skop, tamat masa)
    {
        jika (skop != tidak ditentukan)
        {
            workCallback = workCallback.bind(skop);
            returnCallback = returnCallback ? returnCallback.bind(skop) : tidak ditentukan;
        }
        jika (bilangan_segmen == bilangan_segmen)
        {
            clearTimeout(pemasa);
            jika (returnCallback != undefined)
                returnCallback();
        }
        lain
        {
            mula = kiraan_segmen * bilangan_item_bagi_setiap_segmen;
            tamat = Math.min(totalCount, (count_of_segmen 1) * num_of_item_for_each_segmen);
            jika (bilangan_segmen == 1)//tidak perlu mencipta pemasa
            {
                workCallback(mula, tamat);
                kiraan_segmen = 1;
                this.process();
            }
            lain
            {
                pemasa = setTimeout(fungsi ansyncTimeout(){
                    if (workCallback(mula, tamat)) //selesaikan proses jika fungsi kembali benar
                    {
                        bilangan_segmen = bilangan_segmen;
                    }
                    lain
                    {
                        kiraan_segmen ;
                    }
                    this.scope.process();
                }.bind({scope: this}),masa tamat == undefined ? Ansync.TimeOut : tamat masa);
            }
        }
    }
}
Ansync.TimeOut = 5;

方法很简单,但是很实用,有相同项目需求的小伙伴参考下吧

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn