表达它

优化图片

优化只是意味着保持保持图像质量的图像到所需的水平，小规模的。 有负载的程序，一旦可以进行优化之前，他们装上服务器交付的图像。 通常，我们使用这些图像创作（Photoshop中，烟花等）的工具，工具，使用户能够优化网络使用的图像。
•GIF的检查，看看他们使用的调色板的大小对应于图像中的颜色数量。 当图像使用4色和256色调色板，然后图像可以进一步优化

•转换GIF的PNG的在可能的情况下，看看是否有节能。 往往不是，是。 不要犹豫，使用PNG的，因为它们是最常用的浏览器完全支持。 动画功能的PNG可以做一个GIF，包括透明度的期望。

•对于使用CSS sprites的图像，安排在水平垂直通常在一个较小的文件大小的结果，而不是精灵的图像。 此外，结合精灵类似颜色的图像。 这有助于你理想下保持低色数256色，所以适合在1 PNG8。

•如果您正在使用的favicon.ico，最好在1K，保持它的小。

正确使用缩放/调整大小的图像。

总是尝试使用调整大小的图像，即不使用一个更大的图像比你需要的，只是因为你可以在HTML中的宽度和高度设置。 如果你需要在页面上显示的是100px X 100px的图像，然后不下来200x200px图像使用一个规模。

使用逐行图像

网页浏览器已经逐步呈现图像。 做得更好“隔行扫描”选项，或您的JPEG图像与“进步”的选项，只需保存你的GIF或PNG图像。

使用渐进式图像是否是一个祝福或一个障碍是网络用户之间进行的辩论。 也是一个渐进的形象，重约20％，比非渐进对口。 所以，如果你认为你的布局使用的图像，不会妨碍用户体验，它是渐进的，觉得自由地这样做。

包括JavaScript在HTML文档的底部

如果没有文件撰写（或任何页面内容使用的JavaScript动态生成）插入页的内容的一部分，在你的脚本，将脚本包括BODY标记年底前，语句在页面底部。
HTTP/1.1规范建议浏览器不超过两部分组成，每个主机的并行下载。 如果您的图片，从多个主机服务，你可以得到两个以上的下载发生在平行。 然而，当一个脚本下载，浏览器不会启动任何其他下载，甚至在不同的主机名。
也有动态创建脚本节点和远程脚本加载后使用AJAX页面加载的方式。

外化你JavaScript的

使用外部JavaScript文件会导致更快的页面加载JavaScript文件，因为是由浏览器的缓存。 内嵌JavaScript的HTML文档中的“获得下载HTML文件的要求。 这实际上可能降低的HTTP请求的数量，但后来增加了HTML文档的大小。 外部JavaScript的浏览器缓存的HTML文档的大小没有增加HTTP请求的数量减少。
请注意，如果您的网站上的用户，每个会话有多个页面访问量和您的网页重新使用相同的脚本和样式很多，有更大的缓存外部文件的潜在利益。

包JavaScript文件

不同的CSS，JavaScript的情况下，这些文件可能嘎吱嘎吱使用一些标准的算法，将减少文件的大小，比简单地去除空格或制表符。 例如JavaScript的包装可以在这里找到http://dean.edwards.name/packer/

摆脱任何重复的脚本

这是极不寻常，整个脚本可能会重复，但美国十大网站的评论表明，其中两个含有重复的脚本。 重复的脚本，但明显降低，造成不必要的HTTP请求和浪费JavaScript执行性能。
此外，在许多情况下，尽管脚本的名称是不同的，是由于团队的规模和数量的脚本在同一页面重复的脚本的可能性。

最小化在可能的情况下访问DOM元素

使用JavaScript访问DOM元素是缓慢的，因此，为了有更敏感的页面，你应该：
•缓存参考访问元素
•更新节点“离线”，然后将它们添加到树
•避免固定用JavaScript布局

从内容和表现的分离行为

正如我们单独介绍（CSS / XSLT），内容（XHTML / XML的），我们也应该分开行为（JavaScript）的。 这就是所谓的不显眼的Javascript。 正如我们链接到外部CSS文件，我们应该链接到外部JavaScript文件。

行为，而不是硬编码的内容（如onmouseover的onclick等）的行为，应被动态添加元素，类和独特的元素（IDS）使用DOM。 的基础性文件的内容，应包含唯一有效的XHTML / XML和没有JavaScript。
添加行为的Javascript应该增加的内容。 内容应保持有用和可用，没有JavaScript（或不完整的JavaScript支持）。

我已经保存了这篇文章的年龄，所以很抱歉！ 我不记得源......但我们必须知道观众对他们来说，我们开发的网站，它似乎是有益的......所以我在这里是

页的重量可以用来确定一个给定页面的下载时间，各种各样的互联网连接速度。 例如，下表显示了在一些流行的连接速度三个不同的网页的下载时间。

减少页重量的好处？

减少页面重效益的网站所有者和消费者产生积极的影响。 潜在的好处包括：

1. 网页加载更快。 页重量减少最明显的影响，是您网站的网页加载速度更快的游客，无论其连接速度。
2. 页面加载时间降低，创造更舒适的游客。 游客不太可能变得沮丧和其他地方去，如果您的网页加载迅速。 另一方面，缓慢加载页面失去访问者和潜在客户的最可靠的方法之一。
3. 更快的加载时间，将有助于提高转换。 更多的游客将不再停留在您的网站。 他们将最终使采购，签署您的简报，或书，标志着您的网站。
4. 你的品牌认知度将得到加强。 回头客和第一时间的游客，都将是更倾向于“专业”来形容你的网站（业务）如果您的网页加载迅速。
5. 干净，坚实的代码的网页，往往会更有效地利用天然的搜索引擎被索引。
6. 重量优化的页面，实际上可以节省带宽费用高流量的网站上。 100,000页，每个重达150 KB将需要从你的ISP的带宽超过10万页，每个重量75 KB的两倍多。 对于收取的ISP所使用的带宽或超支，这种减少可以极大地节省带宽费用。

考虑下面的数据，在一份报告中公布的

如果XML / XSL转换是你的结构域，然后还有时候，我们需要一个动态代码peice要使用库项目（可重复使用的要作出）。 我的意思，可能与这个示例场景中更明确。

想象你正在创建一个网站（使用的XML，XSL transfroms当然）和大多数的网页将有一个评论模块 。 好吧！ 然后，复制或粘贴此代码到每一页的模板（我不说，但维修和返工一场噩梦），甚至更好，你创建包含文件可以在任何你想它在您的网页拉（ S）...
那么，如何创造一个XSL INCLUDE文件，它包括在另一个XSL文件 ？ 这里是如何...

只是把事情说清楚......这里是快速的文件列表，您将创建......在这里，我们将纳入食品父页左右的水果和蔬菜的信息。

1。 food.xml - XML数据文件的转换将应用于
2。 food.xsl - 主要XSL文件，这将改变我们的food.xml
3。 inc_fruits.xsl - 的XSL包括会使水果的数据文件
4。 inc_vegtables.xsl - XSL的文件，将呈现vetetables数据

我不认为我有解释太多，以上元素的代码，将自明...

FOOD.XML


<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" href="food.xsl"?>
<food>
<date>July 2008</date>
<description>All about things we eat everyday</description>
<fruits type="tropical">
<item name="mango" moreinfo="http://www.mango.com">Mango is the king of fruits</item>
<item name="banana" moreinfo="http://www.banana.com">Banana once a day , keeps the doctor away</item>
<item name="orange" moreinfo="http://www.orange.com">Orange is the color and rich in vitamin C</item>
<item name="Papaya" moreinfo="http://www.papaya.com">Papaya - Hot when raw, cold when ripe</item>
</fruits>

<vegetables>
<item name="spinach" moreinfo="http://www.spinach.com">Spinach is full of iron</item>
<item name="asparagus" moreinfo="http://www.asparagus.com">Asparagus contains loads of vitamin D </item>
<item name="fenugreek" moreinfo="http://www.fenugreek.com">Fenugreek is rich in vitamin C</item>
</vegetables>
</food>


<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:include href="inc_fruits.xsl" />
<xsl:include href="inc_vegetables.xsl" />
<xsl:template match="/">
<html>
<head>
<title>Title</title>
</head>
<body>
<h3><xsl:value-of select="/food/description" /></h3>
Modification Date : <xsl:value-of select="/food/date" />
<hr/>
<h5> About Fruits</h5>
<xsl:call-template name="about_fruits"/>

<hr/>
<h5> About Vegetables</h5>
<xsl:call-template name="about_vegetables"/>

<hr/>
</ BODY>
</ HTML>
</ XSL模板>
</ XSL样式表>

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" encoding="iso-8859-1" />
<xsl:template name="about_fruits">
<xsl:for-each select="/food/fruits/item/@*">
attribute name : <xsl:value-of select="name()"/>
attribute value : <xsl:value-of select="."/> <br />
</xsl:for-each>
</xsl:template>
</xsl:stylesheet>

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" encoding="iso-8859-1" />
<xsl:template name="about_vegetables">
<xsl:for-each select="/food/vegetables/item/@*">
attribute name : <xsl:value-of select="name()"/>
attribute value : <xsl:value-of select="."/> <br/>
</xsl:for-each>
</xsl:template>
</xsl:stylesheet>

下载上述所有文件（252下载）