Pertanyaan Apa saja kasus penggunaan jsdom


Setelah membaca ini Template mikro sudah mati artikel. Saya menjadi penasaran:

  1. Apakah Menggunakan DOM pada server menghasilkan kode yang lebih bersih yang lebih mudah dipelihara kemudian templating.
  2. Apakah itu lebih efisien untuk menggunakan jsdom daripada mesin templating.
  3. Bagaimana cara memasukkan jsdom ke dalam View dari pengaturan MVC standar.

Dan umumnya dalam situasi apa akan lebih baik menggunakan abstraksi DOM sisi server, seperti jsdom ketimbang mesin templating, seperti EJS atau giok.

Pertanyaannya khusus untuk node.js dan SSJS lainnya


32
2018-05-23 19:02


asal


Jawaban:


  1. Ini abstraksi yang bagus yang cocok dengan insinyur sisi klien mengambil tentang bagaimana dom dibangun dan dimodifikasi. Dalam hal itu adalah 'bersih' karena ada satu model mental. Ini juga bagus karena kita tidak perlu mencampur tambalan sintaksis yang berbeda dari bahasa templat di atas markup deklaratif bersih seperti halnya dengan sistem template 'terbodoh', seperti kumis.

  2. Saya TIDAK akan mengatakan lebih efisien untuk menggunakan jsdom untuk templating. Pergi mengambil gander di google wrt ke 'memori bocor dengan jsdom' misalnya. jsdom adalah rad, dan sangat berguna untuk tugas-tugas seperti proyek akhir pekan untuk merangkak situs, melakukan tugas-tugas yang tidak terkait dengan server, tapi saya pikir itu lambat sebagai kotoran dari perspektif server web kinerja tinggi.

  3. Ada satu miliar cara untuk memperhitungkan hal ini. Tidak ada metode yang muncul sebagai cara 'standar'. Salah satu cara yang pernah saya lihat adalah mengirimkan 'template' kosong, yaitu blok html yang mewakili model dalam beberapa cara, dan kemudian menggunakannya untuk bootstrap membangun tampilan akhir Anda dari model. Dari artikel itu, misalnya:


<li class="contact" id="contact-template">
    <span class="name"></span>
    <p class="title"></p>
</li>

Ini adalah 'pandangan' dalam hal klasik. Dalam aplikasi web biasa, mungkin terlihat lebih seperti:

<li class="contact">
    <span class="name"><?= $name ?></span>
    <p class="title"><?= $title ?></p>
</li>

Untuk menggunakan MVC, satu set up controller yang samar-samar menyadari semantik dari tampilan di atas dan model yang diwakilinya. Tampilan ini diuraikan ke dalam / a DOM dan diakses melalui mesin pemilih favorit Anda. Setiap kali model ini menunjukkan perubahan, Anda mungkin menggunakan acara perubahan atau callback untuk memperbarui tampilan. Contohnya:

Mari kita bayangkan bahwa 'model' memicu peristiwa 'perubahan' setiap kali suatu properti berubah.

controller = new Controller({ 
    view: $('#contact-template').clone(), // Assume jquery or whatever
    model: aContact 
});

// Assume some initialization that sets the view up for the first time
// and appends it to the appropriate place. A la:
// this.view.find('.name').text(model.name);
// this.view.find('.title').text(model.title);
// this.view.appendTo('#contacts')

controller.on('model.name.change', function(name){
    this.view.find('.name').text(name);
});

Ini adalah sistem apa yang dilakukan oleh Weld dan Backbone.js untuk Anda. Mereka semua memiliki berbagai macam asumsi tentang di mana pekerjaan ini berlangsung (sisi-server, sisi-klien), kerangka apa yang Anda gunakan (jquery, mootools, dll), dan bagaimana perubahan Anda didistribusikan (REST, socket. io, dll).

Edit

Beberapa hal berguna yang dapat Anda lakukan dengan jsdom berkisar pada pengujian dan spidering integrasi:

Secara pribadi, saya ingin melihat proyek yang mengambil pendekatan tobi, tetapi memetakannya di atas sesuatu seperti https://github.com/LearnBoost/soda sehingga kita dapat melakukan pengujian selenium berbasis cloud tanpa selenese (sejak imo, itu menyebalkan).


12
2018-05-23 22:12



Yah, saya benar-benar membutuhkan JSDom untuk proyek kecil yang saya bangun selama akhir pekan di node.js. Jadi, di server saya, saya harus menerima URL untuk mengambil, mengambil semua HTML dari URL yang diberikan, menguraikannya, dan menampilkan gambar ke pengguna sehingga pengguna dapat memilih thumbnail dari URL tersebut. (Jenis seperti ketika Anda menjatuhkan tautan ke kotak masukan Facebook) Jadi, saya menggunakan modul yang disebut Permintaan yang memungkinkan saya untuk mengambil HTML di sisi server. Namun, ketika HTML itu mencapai program saya, saya tidak punya cara untuk melewatinya seperti yang Anda lakukan dengan javascript sisi klien. Karena tidak ada DOM yang sebenarnya, saya tidak bisa mengatakannya document.getElementById('someId'). Oleh karena itu, JSDom berguna dengan memberi saya DOM "sementara" yang memungkinkan saya untuk melintasi HTML yang dikembalikan. Sekarang, meskipun saya masih berada di sisi server, JSDOM menciptakan sebuah window objek sangat mirip dengan objek jendela di browser, dan membuat DOM keluar dari HTML yang dikembalikan. Sekarang, bahkan di server, saya bisa mendapatkan semua gambar dengan menelepon window.$('img'). Saya bisa menargetkan dan menguraikan unsur-unsur seperti biasa. Jadi, ini hanya satu masalah di mana JSDom menjadi solusi, tetapi bekerja dengan sangat baik. Semoga ini bisa membantu!


12
2018-05-23 20:03



Beberapa muncul dalam pikiran:

  1. Berbagi tampilan / pengontrol antara server dan browser
  2. Penggalian data / perayapan / pemrosesan
  3. Transformasi untuk fragmen HTML yang digunakan dalam hal AJAX / realtime
  4. Pemisahan mutlak logika dan konten dengan menghindari tag template

Dan untuk menjawab pertanyaan Anda:

  1. mungkin. Banyak hal memengaruhi kualitas kode, tetapi ini adalah langkah ke arah yang benar
  2. tidak, mesin templating akan selalu lebih cepat, karena mereka dapat melakukan pra-kompilasi template
  3. ini mungkin menjamin pertanyaan baru?

1
2018-05-28 04:05



poin 2 dari pertanyaan Anda dapat dijawab oleh testcase templating ini:

pergi http://jsperf.com/dom-vs-innerhtml-based-templating/300

  • klik tombol "Jalankan tes".

  • bersabar, membandingkan las vs banyak mesin template lain dan memberi Anda tolok ukur saat ini ...


1
2018-04-01 20:02