高效的面向对象HTML模板(纯python)
tempy是什么?
没有写一个标签就能创建HTML。tempy动态生成HTML,并且能用python或jQuery风格访问。对DOM定位或操作可以使用python或jQuery风格操作
为什么使用tempy?
HTML代码中的使用Python语法,这样的模板系统是不错,但还不够酷(你还得用某种方法编写HTML)。Tempy就是为此而生的。
特性
没不用解析、简单的结构使得Tempy运行飞快。Tempy只是将HTML标签加在您的数据旁,实际上HTML字符串只存在在渲染时。
公众号:大邓带你玩python
用例
基本模板
from tempy.tags import Html, Head, Body, Meta, Link, Div, P, A
my_text_list = ['This is foo', 'This is Bar', 'Have you met my friend Baz?']
another_list = ['Lorem ipsum ', 'dolor sit amet, ', 'consectetur adipiscing elit']
#生成标签对象
page = Html()( # 在父标签html内插入head
Head()( # 在父标签head内插入meta和link
Meta(charset='utf-8'), # add tag attributes using kwargs in tag initialization
Link(href="my.css", typ="text/css", rel="stylesheet")
),
body=Body()( # 给标签名字和属性,以便于DOM操作
Div(klass='linkBox')(
A(href='www.foo.com')
),
(P()(text) for text in my_text_list) # 标签内插入可迭代对象
)
)
print(page.render())
运行
<html>
<head>
<meta charset="utf-8"></meta>
<link href="my.css" type="text/css" rel="stylesheet"/>
</head>
<body>
<div class="linkBox">
<a href="www.foo.com"></a>
</div>
<p>This is foo</p>
<p>This is Bar</p>
<p>Have you met my friend Baz?</p>
</body>
</html>
元素的创建和移除
通过实例标签来创建DOM元素
page = Html()
run
<html></html>
调用函数来增加元素或内容
page(Head())
run
<html><head></head></html>
使用 jQuery风格操作DOM
body = Body()
page.append(body)
run
<html><head></head><body></body></html>
div = Div().append_to(body)
run
<html><head></head><body><div></div></body></html>
div.append('This is some content', Br(), 'And some Other')
run
<html><head></head><body><div>This is some content<br>And some Other</div></body></html>
同理,移除元素如下
head.remove()
run
<html><body><div></div></body></html>
body.empty()
run
<html><body></body></html>
page.pop()
run
<html></html>
标签属性
定义标签时或创建标签后,对每个标签添加属性
div = Div(id='my_html_id', klass='someHtmlClass')
run
<div id="my_dom_id" class="someHtmlClass"></div>
a = A(klass='someHtmlClass')('text of this link')
a.attr(id='another_dom_id')
a.attr({'href': 'www.thisisalink.com'})
run
<a id="another_dom_id" class="someHtmlClass" href="www.thisisalink.com">text of this link</a>
也可使用jQuery风格编辑标签属性
div2.css(width='100px', float='left')
div2.css({'height': '100em'})
div2.css('background-color', 'blue')
run
<div id="another_dom_id" class="someHtmlClass comeOtherClass" style="width: 100px; float: left; height: 100em; background-color: blue"></div>
DOM定位
每个tempy标签内容都是可迭代对象,性质就像python的列表
divs = [Div(id=div, klass='inner') for div in range(10)]
ps = (P() for _ in range(10))
container_div = Div()(divs)
for i, div in enumerate(container_div):
div.attr(id='divId'+str(i))
container_div[0].append(ps)
container_div[0][4].attr(id='pId')
run
<div>
<div id="divId0">
<p></p>
<p></p>
<p></p>
<p></p>
<p id="pId"></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
</div>
<div id="divId1"></div>
<div id="divId2"></div>
<div id="divId3"></div>
<div id="divId4"></div>
<div id="divId5"></div>
<div id="divId6"></div>
<div id="divId7"></div>
<div id="divId8"></div>
<div id="divId9"></div>
</div>
在容器中访问元素,就像它们是属性一样。
container_div = Div()
container_div(content_div=Div())
container_div.content_div('Some content')
run
<div><div>Some content</div></div>
如果你觉得你会用jQuery风格:
container_div.children()
container_div.first()
container_div.last()
container_div.next()
container_div.prev()
container_div.prev_all()
container_div.parent()
container_div.slice()
Tempy的性能
根据呈现内容的复杂性、页面上动态内容的数量、生成的输出的大小以及许多其他因素,性能有很大的不同。
Tempy没有解析字符串,不使用正则表达式和不加载html文件,相比传统的如jinja2和Mako框架,运行速度更快。
Used HW: 2010 IMac, CPU:2,8 GHz Intel Core i7 RAM:16 GB 1067 MHz DDR3 Osx: 10.12.6. Benchmark made using WRK
Running 20s test @ http://127.0.0.1:8888/tempy + http://127.0.0.1:8888/j2 10 threads and 200 connections
Tempy | Avg | Stdev | Max | +/- Stdev |
---|---|---|---|---|
Latency | 109.55ms | 52.04ms | 515.33ms | 93.09% |
Req/Sec | 118.27 | 37.36 | 240.00 | 73.77% |
Jinja2 | Avg | Stdev | Max | +/- Stdev |
---|---|---|---|---|
Latency | 216.04ms | 16.05ms | 267.06ms | 91.16% |
Req/Sec | 59.29 | 20.53 | 151.00 | 71.23% |
网友评论