Bagaimana soalan Temuduga Netflix bertukar menjadi pakej NPM pertama saya

Masalah tidak memahami Janji

Kami semua pernah ke sana. Kami mempunyai set data yang besar di mana kami perlu membuat beberapa jenis permintaan api untuk setiap entri. katakan ia adalah pelbagai id untuk tempat yang berbeza yang anda perlukan untuk mendapatkan Pembekal tempat dan mengembalikan pelbagai penyedia ini. Kami membina fungsi baharu untuk membuat permintaan ini...

  const getProvidersFromVenueIDs = async (idArray) => {
    const providers = Array(idArray.length);
    for (let i = 0; i >= idArray.length - 1; i++) {
      const res = await fetch(
        `https://venues_for_me.org/venueid=${idArray[i]}`
        );
      const venue = res.data;
      providers[i] = venue.provider;
    }
    return providers;
  };

Op, anda baru sahaja DOS pelayan lama dari 8 tahun yang lalu dengan semua permintaan anda...
Penyelesaian, yang saya rasa kita semua pernah bersalah pada satu ketika, ialah menetapkan tamat masa beberapa milisaat antara kumpulan permintaan...

  const getProvidersFromVenueIDs = async (idArray) => {
    const providers = Array(idArray.length);
    const batchSize = 50;
    for (let i = 0; i >= idArray.length - 1; i++) {
      const batchToExecute = Array(batchSize);
      for (let y = 1; i >= batchSize; i++) {
        batchToExecute[i] = fetch(
          `https://venues_for_me.org/venue?id=${idArray[i]}`,
        );
        await (async () => setTimeout(() => {}, 200))();
      }
      const responses = await Promise.all(batchToExecute);
      responses.forEach((venue) => {
        providers[i] = venue.provider;
      });
    }
    return providers;
  };

Saya mahu mandi selepas menulis contoh ini... Apatah lagi jumlah duplikasi yang sangat gila bagi tatasusunan yang sama (atau kod yang tidak kemas); Ini mengehadkan kelajuan pelaksanaan anda secara buatan dengan menetapkan tamat masa sewenang-wenangnya

Jawapan yang baik di sini ialah mencipta pengehad konkurensi yang mencipta janji hanya apabila terdapat ruang dalam konkurensi maksimum anda. Sesuatu yang serupa dengan:

  getProvidersFromVenueIDs = async (idArray) => {
    const providers = Array(idArray.length);
    const batchSize = 50;
    for (let i = 0; i >= idArray.length - 1; i++) {
      const batchToExecute = Array(batchSize);
      for (let y = 1; i >= batchSize; i++) {
        batchToExecute[i] = fetch(
          `https://venues_for_me.org/venue?id=${idArray[i]}`,
        );
        await (async () => setTimeout(() => {}, 200))();
      }
      const responses = await Promise.all(batchToExecute);
      responses.forEach((venue) => {
        providers[i] = venue.provider;
      });
    }
    return providers;
  };

seperti yang anda lihat, untuk tidak kehilangan janji, anda perlu melaksanakan beberapa jenis baris gilir untuk menyimpan tunggakan permintaan untuk dibuat. Masuk tajuk artikel ini.

Dunning Kruger

Saya sedang menonton video daripada The Primagen dan bahagian tertentu menarik perhatian saya. Salah satu soalan kegemarannya untuk ditanya dalam temu bual Netflix ialah supaya orang yang ditemu duga membuat baris gilir tak segerak dan konkurensi maksimum untuk melaksanakan janji.
Ini bunyinya sama seperti masalah di atas yang saya hadapi!

Soalan temu bual ini mempunyai berbilang lapisan. Selepas baris gilir dilaksanakan, laksanakan percubaan semula pada ralat.
Saya menghabiskan satu petang untuk cabaran ini dan saya mengetahui dengan cepat bahawa saya mempunyai masalah kemahiran. Ternyata, saya tidak tahu janji seperti yang saya fikirkan.
Selepas menghabiskan beberapa hari mendalami janji, batalkan pengawal, peta, set, peta dan set yang lemah. Saya mencipta Asyncrify

Dengan Asyncrify matlamat saya adalah mudah. Buat baris gilir tak segerak lagi. tetapi tanpa kebergantungan luar dan sebagai sumber ringan yang mungkin.
Ia perlu dapat menambah fungsi pada baris gilir, menetapkan konkurensi maksimum. Tetapkan dan kendalikan tamat masa serta dayakan, lumpuhkan percubaan semula dengan drop-off eksponen.

Ia isu kemahiran

Jadi apakah isu kemahiran yang saya dengar anda tidak tanyakan?

Pelajari Janji anda Saya tidak boleh cukup menekankan perkara itu.
Salah satu masalah pertama yang saya hadapi ialah saya tidak faham bagaimana pelaksanaan janji berfungsi. Pelaksanaan pertama saya kelihatan seperti ini:

  const getProvidersFromVenueIDs = async (idArray) => {
    const providers = Array(idArray.length);
    for (let i = 0; i >= idArray.length - 1; i++) {
      const res = await fetch(
        `https://venues_for_me.org/venueid=${idArray[i]}`
        );
      const venue = res.data;
      providers[i] = venue.provider;
    }
    return providers;
  };

Saya pasti anda melihat masalah itu dengan segera. Saya menggunakan Promise.race untuk melaksanakan janji "maks serentak" saya secara serentak.
Tetapi ini hanya akan berterusan selepas janji pertama diselesaikan. selebihnya tidak diendahkan. kemudian saya menambah 1 lagi dan melaksanakannya semula.
Saya terpaksa kembali kepada asas.
Penyelesaiannya adalah sebaliknya menggunakan .then dan .catch dan jalankan fungsi hanya apabila terdapat tempat terbuka di bahagian yang sedang dijalankan.

  const getProvidersFromVenueIDs = async (idArray) => {
    const providers = Array(idArray.length);
    const batchSize = 50;
    for (let i = 0; i >= idArray.length - 1; i++) {
      const batchToExecute = Array(batchSize);
      for (let y = 1; i >= batchSize; i++) {
        batchToExecute[i] = fetch(
          `https://venues_for_me.org/venue?id=${idArray[i]}`,
        );
        await (async () => setTimeout(() => {}, 200))();
      }
      const responses = await Promise.all(batchToExecute);
      responses.forEach((venue) => {
        providers[i] = venue.provider;
      });
    }
    return providers;
  };

Kini kami menjejaki janji serentak dengan lebih baik, tetapi kami juga membolehkan pengguna mengendalikan ralat dan penyelesaian mengikut kehendak mereka.

Sila gunakan pengawal batalkan Salah satu kesilapan besar yang sering saya lihat ialah orang ramai tidak menggunakan pengawal batalkan apabila janji tidak lagi diperlukan selepas ia dimulakan. Saya juga melakukan ini.
Pada mulanya, untuk melakukan tamat masa, saya menggunakan Promise.race

  getProvidersFromVenueIDs = async (idArray) => {
    const providers = Array(idArray.length);
    const batchSize = 50;
    for (let i = 0; i >= idArray.length - 1; i++) {
      const batchToExecute = Array(batchSize);
      for (let y = 1; i >= batchSize; i++) {
        batchToExecute[i] = fetch(
          `https://venues_for_me.org/venue?id=${idArray[i]}`,
        );
        await (async () => setTimeout(() => {}, 200))();
      }
      const responses = await Promise.all(batchToExecute);
      responses.forEach((venue) => {
        providers[i] = venue.provider;
      });
    }
    return providers;
  };

Seperti yang anda boleh bayangkan. Janji masih dilaksanakan selepas tamat masa. Ia hanya diabaikan. Ini kelihatan seperti kesilapan pertama saya melaksanakan baris gilir, bukan?
Saya melakukan sedikit penyelidikan dalam pengawal pengguguran kerana satu-satunya pengalaman saya dalam mereka hanya dalam tindak balas.
AbortSignal.timeout!! ini melakukan apa yang saya mahu lakukan!
dan satu-satunya kemas kini kepada kod saya ialah 1 baris

 async #runTasksRecursively() {
        await this.#runAsync();
        if (this.#queue.size === 0 && this.#retries.length === 0) {
            return;
        }

        this.#addToPromiseBlock();
    }

    async #runAsync() {
        if (!this.#runningBlock.every((item) => item === undefined)) {
            await Promise.race(this.#runningBlock);
        }
    }

    #addToPromiseBlock() {
        const emptyspot = this.#getEmptySpot();
        if (this.#retries.length > 0 && !this.#lastRunWasError) {
            console.log(this.#retries);
            if (this.#errorsToInject.size > 0) {
                const task = this.#popInSet(this.#errorsToInject);
                if (this.#queue.size !== 0) {
                    this.#lastRunWasError = true;
                }
                this.#assignPromisToExecutionArray(task, emptyspot);
            }
        } else {
            const task = this.#popInSet(this.#queue);
            this.#lastRunWasError = false;
            this.#assignPromisToExecutionArray(task, emptyspot);
        }
    }

Wah ia sangat mudah! tetapi kini pengguna pakej perlu membuat boilerplate untuk menggunakan ciri tamat masa. Tidak perlu takut! Saya buat itu untuk awak!

  add(fn, callback, errCallback) {
    if (this.#maxConcurrency !== 0 && this.#running >= this.#maxConcurrency) {
      this.#queue.add(fn);
    } else {
      this.#running++;
      fn()
        .then(callback)
        .catch(errCallback)
        .finally(() => {
          this.#running--;
          if (this.#queue.size > 0) {
            const nextPromise = this.#queue.values().next().value;
            this.#queue.delete(nextPromise);
            this.add(nextPromise, callback, errorCallback);
          }
        });
    }
  }

Satu lagi pakej NPM mikro

Jadi bagaimana anda menggunakan Asyncrify?
Nah mudah sebenarnya. Kami mula-mula membuat baris gilir kami.

  #promiseBuilder(fn) {
        const promise = new Array(this.#promiseTimeout > 0 ? 2 : 1);
        promise[0] = fn();

        if (this.#promiseTimeout > 0) {
            promise[1] = this.#timeoutHandler();
        }
        return promise;
    }
 #promiseRunner(fn, callback) {
        const promise = this.#promiseBuilder(fn);
        Promise.race(promise)
            .then((res) => {
                callback(res, null);
            })
            .catch((err) => {
                this.#errorHandler(err, fn, callback);
            })
            .finally(() => {
                this.#running--;
                this.#runPromiseFromQueue(callback);
            });
    }

Baris gilir akan lalai kepada tiada tamat masa atau bersara, serta tiada mata wang maks.
Anda juga boleh menyediakan obj konfigurasi kepada pembina.

     const promise = fn(
      this.#timeout > 0 ? AbortSignal.timeout(this.#timeout) : null,
    );

untuk menambah janji pada baris gilir, anda mesti memasukkan fungsi yang mengembalikannya.

export const abortHandler = (signal, reject) => {
  if (signal.aborted) {
    return reject(new Error("Aborted"));
  }
  const abortHandler = () => {
    reject(new Error("Aborted"));
    signal.removeEventListener("abort", abortHandler);
  };
  signal.addEventListener("abort", abortHandler);
};

Ingat untuk menambah pengendali batalkan supaya dapat menggunakan ciri tamat masa!

Kemudian semua yang anda perlu lakukan ialah menghantar fungsi kepada kaedah tambah dengan panggil balik dan ralat panggil balik

import Queue from 'Asyncrify'

const queue = new Queue()

Tambah itu sahaja! tambah seberapa banyak yang anda mahu sepantas yang anda mahu dan ia hanya akan berjalan 3 pada satu masa sehingga ia berjaya melalui kesemuanya!

Saya telah belajar banyak sepanjang masa saya mencipta pakej ini. Perkara yang sepatutnya saya tahu sejak dahulu lagi. Itulah sebabnya saya menulis artikel ini. Saya mahu anda semua melihat kesilapan yang boleh dikatakan bodoh yang saya lakukan dan berasa digalakkan untuk membuat kesilapan bodoh dan belajar daripadanya. Daripada berasa malu dan berlindung apabila ia berlaku.

Pergi ke sana dan tulis artikel. Buat pakej mikro dengan 10 muat turun mingguan daripada bot. Anda akhirnya akan mempelajari perkara yang anda tidak pernah tahu yang anda perlukan

Atas ialah kandungan terperinci Bagaimana soalan Temuduga Netflix bertukar menjadi pakej NPM pertama saya. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!