Browsing the archives for the 设计重构 category

解决IE6从Nginx服务器下载图片不Cache的Bug

in 设计重构

其实这个Bug是由分两种情况的: 1.和Nginx无关,是针对CSS背景图片的。 一般用户不会碰到,更多的时候是开发者将自己的IE的缓存策略从默认的”自动”改为“每次访问都查询”才发生 的。特点是鼠标一旦浮动到有背景图片的地方,IE会不顾已经缓存的图片,自行去服务器再次获取图片,造成图片短暂消失。这个问题比较简单,可以通过以下脚 本解决。 1 <script type=”text/javascript”>// <![CDATA[ 2 try { 3 document.execCommand('BackgroundImageCache', false, true); 4 } catch(e) {} 5 // ]]></script> 2. 但是实际上更常见的原因是Nginx上打开了Gzip压缩功能。 这个是IE6 的著名Bug,早在2002年就被人详细讨论过了,在IE7中有所改进,但微软永远也不会去修复IE6了。

0 Comments

float margin-left 浮动对象双倍距离

in 设计重构

出现问题是:使用 float: left; 后,在IE显示margin-left:1px;就变成2px的距离。 IE Bug 的解决方法: 加一个 display: inline; 就OK了 #box1{ float: left; background: #F2F2F2; width: 300px; height: 200px; margin-left: 50px; } #box1{ float: left; background: #F2F2F2; width: 300px; height: 200px; margin-left: 50px; display: inline; } margin在IE6下被解释为双倍距离,出现了Margin与float一起用时,在IE6下,其Margin属性会被解释会双倍的距离,margin产生双倍距离其解决兼容问题的两种方法:

0 Comments

IE浏览器下同一网页多图片显示的瓶颈与优化[原创]

in 设计重构

Internet Explorer 浏览器在同一时刻只能从同一域名下载两个文件。 至于原因请见 MSDN Blogs:《Internet Explorer and Connection Limits》,如何解除限制请见微软客户帮助与支持主页:《如何将 Internet Explorer 配置为可以同时进行两个以上的下载会话》。 不管 Firefox 有多火,无可否认,IE 仍然是浏览器市场的老大。所以,在做系统架构时,不得不去考虑 IE 同时只能从同一域名下载两个文件的限制。如果超过两个文件,IE 将会以队列形式等待两个文件下载完毕,再去下载接下来的两个文件。这样,当在一个页面显示多张图片时,IE 用户的图片下载速度就会受到影响。 百度、新浪、雅虎等网站采用了同一组图片服务器,使用多个二级域名的方式来解决这个问题。 通过 HttpWatch Professional 5.2.17 分析可以看出,百度的图片搜索采用了 t1.baidu.com ~ t8.baidu.com 八个域名来显示图片,消耗在 IE 浏览器端的 Blocked 时间小于0.001秒,非常快。

0 Comments

Facebook背后的软件

in 设计重构

Facebook的数据规模使得很多传统的解决方案根本不适用,或者无法分解来处理。保持一个拥有5亿用户的系统一直稳定可靠的运行,并不是一件很容易的事情。这篇文章介绍了一下Facebook使用的软件。 Facebook的扩展性挑战 在我们讨论细节之前,这里有一些Facebook已经做的软件规模: Facebook有570000000000每月页面浏览量 (据Google Ad Planner)。 Facebook的照片量比其他所有图片网站加起来还多(包括Flickr等网站)。 每个月超过30亿张照片被上传。 Facebook的系统服务每秒处理120万张照片 。 这不包括CDN服务中处理的照片。 每月超过25亿条的内容 (状态更新,评论等)被共享。 Facebook有超过30,000服务器 (这个数字是去年一年!) Facebook扩展所依赖的软件 Facebook是在某些程度上说仍然是LAMP的站点,但它比普通的LAMP大得多,以纳入其他元素和很多服务,并修改现行的做法。

0 Comments

Javascript跨域和Ajax跨域解决方案

in 设计重构

jax跨域和JS的跨域通信(Cross The Site)的几种解决方案 最近做的一个项目中需要ajax跨域取得数据,如果是在本域中确实没有问题,但是放到二级域和其他域下浏览器直接就弹出提示框:“该页正在访问其控制范围之外的数据,这有些危险,是否继续” 1.什么引起了ajax跨域不能的问题 ajax本身实际上是通过XMLHttpRequest对象来进行数据的交互,而浏览器出于安全考虑,不允许js代码进行跨域操作,所以会警告。 2.有什么完美的解决方案么? 没有。解决方案有不少,但是只能是根据自己的实际情况来选择。 具体情况有: 一、本域和子域的相互访问: www.aa.com和book.aa.com 二、本域和其他域的相互访问: www.aa.com和www.bb.com 用 iframe 三、本域和其他域的相互访问: www.aa.com和www.bb.com 用 XMLHttpRequest访问代理 四、本域和其他域的相互访问: www.aa.com和www.bb.com 用 JS创建动态脚本

0 Comments

HTTP 1.1 中Transfer-Encoding chunked编码

in 设计重构

大多数的站点相应用户请求时发送的HTTP Headers中包含Content-Length头.此头信息定义在HTTP1.0协议RFC 1945 10.4章节中.该信息是用来告知用户代理,通常意义上就是浏览器,服务端发送的文档内容长度.浏览器接受到此信息后,接收完Content-Length中定义的长度字节后开始解析页面.如果服务端有部分数据延迟发送,那么浏览器就会白屏.这样导致比较糟糕的用户体验. 解决方法在HTTP1.1协议.RFC2616中14.41章节中定义的Transfer-Encoding:chunked的头信息.chunked编码定义在3.6.1中.根据此定义浏览器不需要等到内容字节全部下载完成,只要接收到一个chunked块就可解析页面.并且可以下载html中定义的页面内容,包括js,css,image等.采用chunked编码有两种选择,一种是设定Server的IO buffer长度让Server自动flush buffer中的内容,另一种是手动调用IO中的flush函数。

0 Comments

用户行为分析系统建立所需步骤和所需软件

in 设计重构

1.分析 软件需求分析就是回答做什么的问题。它是一个对用户的需求进行去粗取精、去伪存真、正确理解,然后把它用软件工程开发语言(形式功能规约,即需求规格说明书)表达出来的过程。本阶段的基本任务是和用户一起确定要解决的问题,建立软件的逻辑模型,编写需求规格说明书文档并最终得到用户的认可。需求分析的主要方法有结构化分析方法、数据流程图和数据字典等方法。本阶段的工作是根据需求说明书的要求,设计建立相应的软件系统的体系结构,并将整个系统分解成若干个子系统或模块,定义子系统或模块间的接口关系,对各子系统进行具体设计定义,编写软件概要设计和详细设计说明书,数据库或数据结构设计说明书,组装测试计划。 2.设计 软件设计可以分为概要设计和详细设计两个阶段。实际上软件设计的主要任务就是将软件分解成模块是指能实现某个功能的数据和程序说明、可执行程序的程序单元。可以是一个函数、过程、子程序、一段带有程序说明的独立的程序和数据,也可以是可组合、可分解和可更换的功能单元。模块,然后进行模块设计。概要设计就是结构设计,其主要目标就是给出软件的模块结构,用软件结构图表示。详细设计的首要任务就是设计模块的程序流程、算法和数据结构,次要任务就是设计数据库,常用方法还是结构化程序设计方法。

0 Comments

虚拟机ubuntu9.04下mysql集群的配置方法

in 服务器类, 设计重构

介绍网络环境: 一、测试环境: Server1: ndbd 192.168.245.11 Server2: ndbd 192.168.245.12 Server3: mysqld –ndb-cluster 192.168.245.13 ndbd: 数据库节点。 mysqld –ndb-cluster: MySQL服务器节点,程序直接访问的是这台机器的IP。默认端口仍是3306。 ndbd_mgm ndbd_mgmd:管理节点。管理/查看各库节点和服务器节点的状态。 二、集群方案 1.管理节点:server3(192.168.245.13) 2.存储节点:server1(192.168.245.11),server2(192.168.245.12) 3.SQL节点:server1(192.168.245.11),server2(192.168.245.12),server3(192.168.245.13)

0 Comments

豆瓣的 Web 服务器

in 设计重构

豆瓣最近发布新功能有些”疯狂”,所以服务器也有新的部署。看到阿北同学在豆瓣广播里说: 豆瓣的第二台应用服务器终于投入了使用。Hongqn 忙了一晚上就完成了部署。第一台服务器支撑到 500 万动态PV/天,服务 On Demand 即时分布式部署…… 500 万 PV , 还是动态 PV, 是个很惊人的数字。因为,如果都能达到一台机器支撑 500 万,那么国内稍有点规模的网站(就说动态 PV 上亿的吧),只需要 20 台 Web 服务器就够了。事实上,即使比较强调技术的网站怕也要上百台 Web 服务器的规模。

0 Comments

完美的配色方案全方位解析

in 设计重构

无论是平面设计,还是网页设计,色彩永远是最重要的一环。当我们距离显示屏较远的时候,我们看到的不是优美的版式或者是美丽的图片,而是网页的色彩。       关于色彩的原理有许多,在此我们不可能一一阐述,大家可以看看相关设计书籍,有利于系统地理解。在此我们仅仅想告诉大家一些网页配色时的小技巧。       1.用一种色彩。这里是指先选定一种色彩,然后调整透明度或者饱和度,产生新的色彩,用于网页。这样的页面看起来色彩统一,有层次感。       2.用两种色彩。先选定一种色彩,然后选择它的对比色。       3.用一个色系。简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。       在网页配色中,还要切记一些误区:       1.不要将所有颜色都用到,尽量控制在三种色彩以内。       2.背景和前文的对比尽量要大,(绝对不要用花纹繁复的图案作背景),以便突出主要文字内容。 一. 基本配色——奔放 ———————————————————————————–    藉由使用象朱红色这种一般最令人熟知的色彩,或是它众多的明色和暗色中的一个,都能在一般设计和平面设计上展现活力与热忱。中央为红橙色的色彩组合最能轻易创造出有活力、充满温暖的感觉。

0 Comments