![git tag怎么打tag](https://img-blog.csdnimg.cn/img_convert/daf374e0f4633e8890f2b9c75958cbbf.png)
git tag怎么打tag
![inine](https://img-blog.csdnimg.cn/img_convert/3dee73184d16d6fd1cac96446f62136e.png)
As you may have noticed, I claim that CSS is bad for performance because:
您可能已经注意到,我声称CSS对性能不利,因为:
Most browsers block the very first paint until all screen CSS arrives
大多数浏览器会阻止第一个绘制,直到所有屏幕CSS都到达为止
Additionally many browsers block rendering until all non-screen (e.g.print) CSS arrives
另外,许多浏览器会阻止渲染,直到所有非屏幕(例如打印)CSS都到达为止
- Sometimes CSS blocks downloads有时CSS会阻止下载
See "The evil that CSS do" in CSS and the critical path for details.
有关详细信息,请参见CSS中的“ CSS的弊端”和关键路径。
CSS is the critical path to delivering any UI in the browser. Images arrive whenever, JS can be async.
CSS是在浏览器中交付任何UI的关键路径。 只要有JS异步,图片就可以到达。
So any page needs to get CSS out of the way ASAP.
因此,任何页面都需要尽快解决CSS问题。
Simple, highly optimized pages (e.g., e.g.) reduce CSS to the bare minimum and then shove it inline in a <style> tag.
简单,高度优化的网页(例如,例如)降低CSS到最低限度,并随即开始推它在<风格>标记。
过量 (ExCeSS)
It's a fact of life that there will always be unused CSS, no matter how hard you try to reduce it. (Run PageSpeed for a proof)
生活的事实是,无论您多么努力地减少CSS,总是会有未使用CSS。 (运行PageSpeed进行验证)
Take the simplest CSS: your reset.css
使用最简单CSS:您的reset.css
It has stuff like
它有像
h1, h2 , h3, ..., abbr, blockquote{ margin:0; ....}
All the HTML tags are in there. But do you have all the tags in the page? Unlikely. So there's excess CSS even at the very base. It usually gets much worse from here. Whole features may or may not be in the page or combined in different ways, but the CSS to handle all combinations is always there, omnipresent.
所有HTML标记都在其中。 但是,页面中是否包含所有标签? 不太可能。 因此,即使在最底层也有多余CSS。 从这里开始,情况通常会变得更糟。 整个功能可能存在或可能不存在于页面中,或者可能以不同的方式组合在一起,但是处理所有组合CSS始终存在,无所不在。
要样式=“”属性 (To style="" attrib)
I saw today that Mailchimp has this CSS inliner tool. (Because mail clients often strip <style>
). It takes the <style>
tags in the markup, strips them and adds style=""
attributes where applicable.
今天我看到Mailchimp具有此CSS内联工具。 (因为邮件客户端经常剥离<style>
)。 它在标记中使用<style>
标签,将其剥离并在适用时添加style=""
属性。
I decided to give it for a spin with Facebook like and Google search's HTML. Remember: these are two already highly optimized pages.
我决定试一下Facebook和Google搜索HTML。 请记住:这是两个已经高度优化的页面。
Assuming the tool works correctly, the results were pretty impressive.
假设该工具正常运行,结果将非常可观。
Like: 8,133 bytes from 10,115 (20% reduction, 23% after
`gzip -9`
)像:10,115个字节中的8,133个字节(减少20%,
`gzip -9`
之后为23% )Search: 63,508 from 90,846 (30% reduction, 27% post gzip)
搜索:90,846中的63508(减少30%,gzip后减少27% )
I know, I know what you'll say: inline style=""
is an abomination. Should we bring <font> back? What about the cascade? Is this transformation needed on every page view with dynamic content, how's that scalable? What if there's a lot of content with the same class, lot of duplicates?
我知道,我知道您会说:inline style=""
是可憎的。 我们应该带回<font>吗? 那级联呢? 具有动态内容的每个页面视图是否都需要这种转换,可伸缩性如何? 如果同一课上有很多内容,很多重复课怎么办?
I know, I know.
我知道我知道。
But, but... look at the results. 25% reduction of the HTML payload!
但是,但是...看结果。 HTML有效负载减少了25%!
With web development moving more and more toward transformations and compilation (css preprocessors, coffee script, monification, etc) it may not be unthinkable.
随着Web开发越来越多地转向转换和编译(css预处理器,coffee脚本,监控等),这可能不是不可想象的。
回到地球 (Back to Earth)
On more realistic note, just reduce the CSS to under 2K or thereabouts, inline it in the head, send it with the the first server flush (even before any data fetching) and you'll be in a good place already!
更现实的说来,只需将CSS减小到2K左右或更低,将其内联在头上,并在第一次服务器刷新时发送它(甚至在获取任何数据之前),您已经处于一个不错的位置!
Tell your friends about this post on Facebook and Twitter
在Facebook和Twitter上告诉您的朋友有关此帖子的信息
翻译自: https://www.phpied.com/style-tag-to-inline-style-attrrib/
git tag怎么打tag