jsdom有哪些用例 [英] What are the use cases of jsdom
问题描述
阅读这篇微模板已死文章后.我开始好奇了:
After reading this Micro templates are dead article. I've become curious:
- 与模板相比，在服务器上使用 DOM 是否会产生更清晰、更易于维护的代码.
- 使用 jsdom 是否比模板引擎更高效.
- 如何将 jsdom 纳入标准 MVC 设置的视图中.
一般在什么情况下最好使用服务器端 DOM 抽象，比如 jsdom而不是模板引擎，例如 EJS 或 玉.
And generally in what situations would it be better to use a server-side DOM abstraction, like jsdom rather then a templating engine, like EJS or jade.
该问题特定于 node.js 和其他 SSJS
The question is specific to node.js and other SSJS
推荐答案
这是一个很好的抽象，与客户端工程师对 dom 的构建和修改方式相匹配.在这方面它更干净"，因为有一个心智模型.这也很好，因为我们不必在其他干净的声明性标记之上混合来自模板语言的一大堆不同的语法，即使是最愚蠢"的模板系统，例如 mustache.
Its a nice abstraction that matches a client side engineers take on how the dom is built and modified. In that respect it is 'cleaner' because there is one mental model. Its also nice because we don't have to mix a kluge of disparate syntaxes from a templating language on top of otherwise clean declarative markup as is the case with even the 'stupidest' templating system, such as mustache.
我不会说使用 jsdom 进行模板更有效.例如，去看看 google wrt 的内存泄漏与 jsdom".jsdom 是 rad，对于像周末项目抓取网站、执行与服务器无关的任务等任务非常有用，但我认为从高性能 Web 服务器的角度来看它很慢.
I would NOT say its more efficient to use jsdom for templating. Go take a gander at google wrt to 'memory leaks with jsdom' for instance. jsdom is rad, and is super useful for tasks like weekend projects for crawling sites, doing non-server related tasks, but I think its slow as shit from a high performance web server perspective.
有十亿种方法可以解决这个问题.没有任何方法成为标准"方式.我见过的一种方法是发送一个空的模板"，即以某种方式表示模型的 html 块，然后使用它来引导从模型构建最终视图.从那篇文章中，例如:
There are a billion ways to factor this. No method has emerged as a 'standard' way. One way that I've seen is to send down an empty 'template', i.e. a block of html that represents a model in some way, and then use that to bootstrap building your end view from a model. From that article, for example:
<小时>
<li class="contact" id="contact-template">
<span class="name"></span>
<p class="title"></p>
</li>
这是经典方面的视图".在典型的 Web 应用程序中，它可能看起来更像:
This is the 'view' in the classic respect. In the typical web application, it might look something more like:
<li class="contact">
<span class="name"><?= $name ?></span>
<p class="title"><?= $title ?></p>
</li>
要使用 mvc，需要设置一个控制器，该控制器模糊地了解上述视图的语义及其代表的模型.此视图被解析为/a DOM 并通过您最喜欢的选择器引擎访问.每次代表的模型发生变化时，您可能会使用更改事件或回调来更新视图.例如:
To use mvc, one sets up a controller that is vaguely aware of the semantics of the above view and the model it represents. This view is parsed into the/a DOM and accessed via your favorite selector engine. Each time the model this represents changes, you might use change events or callbacks to update the view. For instance:
让我们想象一下，每次属性更改时，'model' 都会触发一个 'change' 事件.
Lets imagine that 'model' fires a 'change' event every time a property changes.
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);
});
这些是 Weld 和 Backbone.js 之类的系统为您做的.他们对这项工作的发生位置(服务器端、客户端)、您使用的框架(jquery、mootools 等)以及您的更改的分发方式(REST、socket.js)都有不同程度的假设.io等).
These are what systems like Weld and Backbone.js do for you. They all have varying degrees of assumptions about where this work is taking place (server-side, client-side), what framework you're using (jquery, mootools, etc), and how your changes are being distributed (REST, socket.io, etc).
编辑
你可以用 jsdom 做的一些非常有用的事情围绕着集成测试和爬虫:
Some really useful things you can do with jsdom revolve around integration testing and spidering:
- https://github.com/mikeal/spider - 利用节点基于事件的处理和为您提供 jsdom/jquery 以帮助您以编程方式轻松访问 DOM
- https://github.com/assaf/zombie - 使用 jsdom/jquery 进行集成测试的无头浏览器测试
- https://github.com/LearnBoost/tobi - 类似的无头浏览器测试
- https://github.com/mikeal/spider - general purpose web spider that makes use of node's event based processing and gives you jsdom/jquery to help you easily access the DOM in a programatic way
- https://github.com/assaf/zombie - headless browser testing using jsdom/jquery for integration tests
- https://github.com/LearnBoost/tobi - similar headless browser testing
就我个人而言，我希望看到一个采用 tobi 方法的项目，但将其映射到诸如 https://github 之类的东西之上.com/LearnBoost/soda 这样我们就可以在没有 selenese 的情况下进行基于云的 selenium 测试(因为 imo，它很糟糕).
Personally, I'd like to see a project that took tobi's approach, but mapped it on top of something like https://github.com/LearnBoost/soda such that we can do cloud based selenium testing without selenese (since imo, it sucks).
这篇关于jsdom有哪些用例的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
