Menguasai Corak Pembina: Cipta CLI Penjana Gesaan AI Dinamik

Pernahkah anda menghadapi kes dalam perjalanan pembangunan anda di mana anda terpaksa berurusan dengan objek yang kompleks? Mungkin kerana parameter tersebut sama ada mempunyai terlalu banyak parameter, malah boleh disarangkan, atau memerlukan banyak langkah pembinaan dan logik kompleks untuk dibina.

Mungkin anda ingin mereka bentuk modul dengan antara muka yang bersih dan mudah tanpa perlu berselerak atau memikirkan tentang kod penciptaan objek kompleks anda setiap kali!

Di situlah corak reka bentuk pembina masuk!

Sepanjang tutorial ini, kami akan menerangkan segala-galanya tentang corak reka bentuk pembina, kemudian kami akan membina aplikasi CLI Node.js untuk menjana gesaan penjanaan imej yang dioptimumkan DALL-E 3 menggunakan corak reka bentuk pembina .

Kod akhir tersedia dalam Repositori Github ini.

Gambaran keseluruhan

Masalah

Pembina ialah corak reka bentuk ciptaan , iaitu kategori corak reka bentuk yang menangani masalah berbeza yang datang dengan cara asli mencipta objek dengan baharu kata kunci atau operator.

Corak Reka Bentuk Pembina menumpukan pada menyelesaikan masalah berikut:

1. Menyediakan antara muka yang mudah untuk mencipta objek yang kompleks : Bayangkan objek bersarang dalam dengan banyak langkah permulaan yang diperlukan.

2. Memisahkan kod pembinaan daripada objek itu sendiri , membenarkan penciptaan berbilang perwakilan atau konfigurasi daripada objek yang sama.

Penyelesaian

Corak Reka Bentuk Pembina menyelesaikan dua masalah ini dengan menyerahkan tanggungjawab penciptaan objek kepada objek khas yang dipanggil pembina.

Objek pembina menyusun objek asal dan memecahkan proses penciptaan kepada beberapa peringkat atau langkah.

Setiap langkah ditakrifkan oleh kaedah dalam objek pembina yang memulakan subset atribut objek berdasarkan beberapa logik perniagaan.

class PromptBuilder {
  private prompt: Prompt

  constructor() {
    this.reset()
  }

  reset() {
    this.prompt = new Prompt()
  }

  buildStep1() {
    this.prompt.subject = "A cheese eating a burger"
    //initialization code...
    return this
  }

  buildStep2() {
    //initialization code...
    return this
  }

  buildStep3() {
    //initialization code...
    return this
  }

  build() {
    const result = structuredClone(this.prompt) // deep clone
    this.reset()
    return result
  }
}

Kod pelanggan: kita hanya perlu menggunakan pembina dan memanggil langkah individu

const promptBuilder = new PromptBuilder()
const prompt1 = promptBuilder
  .buildStep1() // optional
  .buildStep2() // optional
  .buildStep3() // optional
  .build() // we've got a prompt

const prompt2 = promptBuilder
  .buildStep1() // optional
  .buildStep3() // optional
  .build() // we've got a prompt

Corak reka bentuk pembina biasa

Corak reka bentuk pembina biasa terdiri daripada 4 kelas utama:

1. Pembina : Antara muka pembina hendaklah hanya mentakrifkan kaedah pembinaan tanpa kaedah build(), yang bertanggungjawab untuk mengembalikan entiti yang dicipta.

2. Kelas Pembina Konkrit : Setiap Pembina konkrit menyediakan pelaksanaan sendiri kaedah Antara Muka Pembina supaya ia boleh menghasilkan varian objeknya sendiri (contoh Produk1 atau Produk2 ).

3. Pelanggan : Anda boleh menganggap pelanggan sebagai pengguna peringkat tertinggi objek kami, pengguna yang mengimport modul perpustakaan atau titik masuk aplikasi kami.

4. Pengarah : Malah objek pembina yang sama boleh menghasilkan banyak varian objek.
   

class PromptBuilder {
  private prompt: Prompt

  constructor() {
    this.reset()
  }

  reset() {
    this.prompt = new Prompt()
  }

  buildStep1() {
    this.prompt.subject = "A cheese eating a burger"
    //initialization code...
    return this
  }

  buildStep2() {
    //initialization code...
    return this
  }

  buildStep3() {
    //initialization code...
    return this
  }

  build() {
    const result = structuredClone(this.prompt) // deep clone
    this.reset()
    return result
  }
}

Seperti yang anda lihat daripada kod di atas, terdapat keperluan besar bagi sesetengah entiti untuk mengambil tanggungjawab mengarah atau mengatur urutan gabungan panggilan yang berbeza yang mungkin kepada kaedah pembina, kerana setiap jujukan mungkin menghasilkan objek terhasil yang berbeza.

Jadi, bolehkah kami merumuskan proses dan menyediakan antara muka yang lebih mudah untuk kod pelanggan?

Di situlah Kelas Pengarah masuk. Pengarah mengambil lebih banyak tanggungjawab daripada pelanggan dan membolehkan kami mengambil kira semua panggilan jujukan pembina tersebut dan menggunakannya semula mengikut keperluan.

const promptBuilder = new PromptBuilder()
const prompt1 = promptBuilder
  .buildStep1() // optional
  .buildStep2() // optional
  .buildStep3() // optional
  .build() // we've got a prompt

const prompt2 = promptBuilder
  .buildStep1() // optional
  .buildStep3() // optional
  .build() // we've got a prompt

Kod pelanggan

const promptBuilder = new PromptBuilder()
const prompt1 = promptBuilder.buildStep1().buildStep2().build()

const prompt2 = promptBuilder.buildStep1().buildStep3().build()

Seperti yang anda lihat daripada kod di atas, kod pelanggan tidak perlu tahu tentang butiran untuk membuat prompt1 atau prompt2. Ia hanya memanggil pengarah, menetapkan objek pembina yang betul, dan kemudian memanggil kaedah makePrompt.

Senario Praktikal

Untuk menunjukkan lebih lanjut kegunaan corak reka bentuk pembina, mari kita bina alat AI CLI penjanaan imej kejuruteraan segera dari awal.

Kod sumber untuk apl CLI ini tersedia di sini.

Alat CLI akan berfungsi seperti berikut:

1. CLI akan menggesa pengguna untuk memilih satu gaya gesaan: Realistik atau Seni Digital.
2. Kemudian ia akan meminta pengguna memasukkan subjek untuk gesaan mereka, contohnya: keju makan burger.
3. Bergantung pada pilihan anda (Seni Digital atau Realistik), alat CLI akan mencipta objek gesaan yang kompleks dengan banyak butiran konfigurasi.

Gesaan realistik memerlukan semua atribut konfigurasi berikut untuk dibina.

fail: prompts.ts

class Director {
  private builder: PromptBuilder
  constructor() {}

  setBuilder(builder: PromptBuilder) {
    this.builder = builder
  }

  makePrompt1() {
    return this.builder.buildStep1().buildStep2().build()
  }

  makePrompt2() {
    return this.builder.buildStep1().buildStep3().build()
  }
}

fail: prompts.ts

const director = new Director()
const builder = new PromptBuilder()
director.setBuilder(builder)
const prompt1 = director.makePrompt1()
const prompt2 = director.makePrompt2()

Seperti yang anda lihat di sini, setiap jenis gesaan memerlukan banyak atribut kompleks untuk dibina, seperti artStyle , colorPalette , lightingEffect , perspektif , Jenis kamera , dsb.

Jangan ragu untuk meneroka semua butiran atribut, yang ditakrifkan dalam fail enums.ts projek kami.

enums.ts

class PromptBuilder {
  private prompt: Prompt

  constructor() {
    this.reset()
  }

  reset() {
    this.prompt = new Prompt()
  }

  buildStep1() {
    this.prompt.subject = "A cheese eating a burger"
    //initialization code...
    return this
  }

  buildStep2() {
    //initialization code...
    return this
  }

  buildStep3() {
    //initialization code...
    return this
  }

  build() {
    const result = structuredClone(this.prompt) // deep clone
    this.reset()
    return result
  }
}

Pengguna apl CLI kami mungkin tidak mengetahui semua konfigurasi ini; mereka mungkin hanya mahu menjana imej berdasarkan subjek tertentu seperti burger makan keju dan gaya (Realistik atau Seni Digital).

Selepas mengklonkan repositori Github, pasang kebergantungan menggunakan arahan berikut:

const promptBuilder = new PromptBuilder()
const prompt1 = promptBuilder
  .buildStep1() // optional
  .buildStep2() // optional
  .buildStep3() // optional
  .build() // we've got a prompt

const prompt2 = promptBuilder
  .buildStep1() // optional
  .buildStep3() // optional
  .build() // we've got a prompt

Selepas memasang kebergantungan, jalankan arahan berikut:

const promptBuilder = new PromptBuilder()
const prompt1 = promptBuilder.buildStep1().buildStep2().build()

const prompt2 = promptBuilder.buildStep1().buildStep3().build()

Anda akan digesa untuk memilih jenis gesaan: Realistik atau Seni Digital.

Kemudian anda perlu memasukkan subjek gesaan anda. Jom kekal dengan burger makan keju.

Bergantung pada pilihan anda, anda akan mendapat gesaan teks berikut sebagai hasilnya:

Gesaan Gaya Realistik :

class Director {
  private builder: PromptBuilder
  constructor() {}

  setBuilder(builder: PromptBuilder) {
    this.builder = builder
  }

  makePrompt1() {
    return this.builder.buildStep1().buildStep2().build()
  }

  makePrompt2() {
    return this.builder.buildStep1().buildStep3().build()
  }
}

Gesaan Gaya Seni Digital :

const director = new Director()
const builder = new PromptBuilder()
director.setBuilder(builder)
const prompt1 = director.makePrompt1()
const prompt2 = director.makePrompt2()

Salin arahan sebelumnya dan kemudian tampalkannya ke dalam ChatGPT. ChatGPT akan menggunakan model DALL-E 3 untuk menjana imej.

Keputusan Gesaan Imej Realistik

Keputusan Gesaan Imej Seni Digital

Ingat kerumitan parameter gesaan dan kepakaran yang diperlukan untuk membina setiap jenis gesaan, apatah lagi panggilan pembina hodoh yang diperlukan.

class RealisticPhotoPrompt {
  constructor(
    public subject: string,
    public location: string,
    public timeOfDay: string,
    public weather: string,
    public camera: CameraType,
    public lens: LensType,
    public focalLength: number,
    public aperture: string,
    public iso: number,
    public shutterSpeed: string,
    public lighting: LightingCondition,
    public composition: CompositionRule,
    public perspective: string,
    public foregroundElements: string[],
    public backgroundElements: string[],
    public colorScheme: ColorScheme,
    public resolution: ImageResolution,
    public postProcessing: string[]
  ) {}
}

Penafian: Panggilan pembina hodoh ini bukan isu besar dalam JavaScript kerana kami boleh menghantar objek konfigurasi dengan semua sifat boleh dibatalkan.

Untuk abstrak proses membina gesaan dan menjadikan kod kami terbuka untuk sambungan dan ditutup untuk pengubahsuaian (O dalam SOLID), dan untuk menjadikan penggunaan perpustakaan generasi segera kami lancar atau lebih mudah untuk pelanggan perpustakaan kami, kami akan memilih untuk melaksanakan corak reka bentuk pembina.

Mari kita mulakan dengan mengisytiharkan antara muka pembina gesaan generik.

Antara muka mengisytiharkan sekumpulan kaedah:

1. buildBaseProperties , buildTechnicalDetails , dan buildArtisticElements ialah langkah-langkah untuk membina sama ada Realistic atau Seni Digital segera. 🎜>
2. setSubject ialah kaedah dikongsi antara semua pembina segera kami; ia cukup jelas dan akan digunakan untuk menetapkan subjek gesaan.

pembina.ts

class PromptBuilder {
  private prompt: Prompt

  constructor() {
    this.reset()
  }

  reset() {
    this.prompt = new Prompt()
  }

  buildStep1() {
    this.prompt.subject = "A cheese eating a burger"
    //initialization code...
    return this
  }

  buildStep2() {
    //initialization code...
    return this
  }

  buildStep3() {
    //initialization code...
    return this
  }

  build() {
    const result = structuredClone(this.prompt) // deep clone
    this.reset()
    return result
  }
}

pembina.ts

const promptBuilder = new PromptBuilder()
const prompt1 = promptBuilder
  .buildStep1() // optional
  .buildStep2() // optional
  .buildStep3() // optional
  .build() // we've got a prompt

const prompt2 = promptBuilder
  .buildStep1() // optional
  .buildStep3() // optional
  .build() // we've got a prompt

Seperti yang anda boleh lihat daripada pelaksanaan di atas, setiap pembina memilih untuk membina jenis gesaannya sendiri (bentuk gesaan akhir adalah berbeza) sambil berpegang pada langkah bangunan yang sama yang ditakrifkan oleh kontrak PromptBuilder!

Sekarang, mari beralih kepada definisi kelas Pengarah kami.

pengarah.ts

const promptBuilder = new PromptBuilder()
const prompt1 = promptBuilder.buildStep1().buildStep2().build()

const prompt2 = promptBuilder.buildStep1().buildStep3().build()

Kelas Pengarah membungkus PromptBuilder dan membolehkan kami membuat konfigurasi segera yang terdiri daripada memanggil semua kaedah pembina bermula daripada setSubject hingga buildArtisticElements.

Ini akan memudahkan kod pelanggan kami dalam fail index.ts, yang akan kami lihat dalam bahagian seterusnya.

serializers.ts

class Director {
  private builder: PromptBuilder
  constructor() {}

  setBuilder(builder: PromptBuilder) {
    this.builder = builder
  }

  makePrompt1() {
    return this.builder.buildStep1().buildStep2().build()
  }

  makePrompt2() {
    return this.builder.buildStep1().buildStep3().build()
  }
}

Untuk mencetak teks gesaan terakhir ke konsol terminal, saya telah melaksanakan beberapa fungsi pesirilan utiliti.

Kini kod penjanaan perpustakaan segera kami sedia. Mari kita gunakannya dalam fail index.ts.

index.ts

const director = new Director()
const builder = new PromptBuilder()
director.setBuilder(builder)
const prompt1 = director.makePrompt1()
const prompt2 = director.makePrompt2()

Kod di atas melakukan tindakan berikut:

1. Gesa pengguna untuk memilih gaya gesaan dan kemudian subjek menggunakan pakej penanya: getUserInput.
2. Selepas mendapat subjek dan gaya seni daripada pengguna, kod klien hanya menggunakan dua komponen daripada pustaka kami: PromptBuilder dan Pengarah.
3. Kita mulakan dengan membuat seketika Pengarah.
4. Kemudian, bergantung pada gaya gesaan yang dipilih, kami membuat seketika pembina yang sepadan dan menetapkannya kepada kelas Pengarah.
5. Akhir sekali, kami memanggil kaedah director.makePrompt dengan subjek yang dipilih sebagai hujah, dapatkan gesaan daripada builder , dan cetak gesaan bersiri ke konsol terminal.

Ingat: tidak mungkin untuk mendapatkan gesaan daripada pengarah kerana bentuk gesaan yang dihasilkan oleh setiap jenis pembina adalah berbeza.

Kesimpulan

Corak reka bentuk Builder terbukti menjadi penyelesaian yang sangat baik untuk mencipta objek kompleks dengan berbilang konfigurasi, seperti yang ditunjukkan dalam aplikasi CLI penjanaan imej AI kami. Inilah sebab mengapa corak Pembina bermanfaat dalam senario ini:

1. Penciptaan Objek Ringkas : Corak ini membenarkan kami mencipta objek RealisticPhotoPrompt dan DigitalArtPrompt yang rumit tanpa mendedahkan proses pembinaan kompleksnya kepada kod pelanggan.

2. Fleksibiliti : Dengan menggunakan kelas pembina yang berasingan untuk setiap jenis gesaan, kami boleh dengan mudah menambah jenis gesaan baharu atau mengubah suai yang sedia ada tanpa menukar kod pelanggan.

3. Organisasi Kod : Corak membantu memisahkan logik pembinaan daripada perwakilan, menjadikan kod lebih modular dan lebih mudah diselenggara.

4. Kebolehgunaan Semula : Kelas PromptDirector membenarkan kami menggunakan semula proses pembinaan yang sama untuk jenis gesaan yang berbeza, meningkatkan kebolehgunaan semula kod.

5. Abstraksi : Kod pelanggan dalam index.ts kekal mudah dan tertumpu pada logik peringkat tinggi, manakala kerumitan pembinaan segera diabsahkan dalam kelas pembina.

Kenalan

Jika anda mempunyai sebarang soalan atau ingin membincangkan sesuatu dengan lebih lanjut, sila hubungi saya di sini.

Selamat pengekodan!

Atas ialah kandungan terperinci Menguasai Corak Pembina: Cipta CLI Penjana Gesaan AI Dinamik. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!