发表于: 2017-05-21 23:04:27

1 944


一、今天完成的事情:

1,把自己任务5-10的代码进行重构,以及重新请求服务器数据,并渲染页面。

2,了解一个页面从输入 URL 到页面加载显示完成,这个过程中都发生了什么?

3,以及如何管理自己的项目。


二、明天完成的事情:

1,重构页面的新增以及编辑功能。


三、遇到的问题:

1,在编写不带样式的页面的时候由于没有考虑全面在后期添加CSS样式的时候,又增加了很多标签。样式可以后期写,但是标签一定要在编写页面的时候就考虑周全。不过还是建议先写完页面再去实现JS功能。

最重要的一点就是:写的页面,可修改性太差,一旦修改,就要长篇大论的进行删除,增添。


2,css命名:建议采用继承的方式进行命名,或者采用继承的方式属性CSS样式类。

如果只是根据标签内进行定义命名,在后期修改的时候是很麻烦的。


3,多加注释:以前虽然也有加注释,但是加的不多,经过这次重构页面,以及修改样式,发现加了注释之后,可以很快的找到自己要修改的地方。

建议:把页面进行分割,并进行注释。


四、收获:

1,了解了自己之前写的代码的不足之处可修改性差,CSS命名烂,注释不清晰,总之感觉之前的代码写的非常烂,自己修改起来都很困难,更何况别人进行维护修改呢?


2,一个页面从输入 URL 到页面加载显示完成,这个过程中都发生了什么?

分为4个步骤:    

(1),当发送一个URL请求时,不管这个URL是Web页面的URL还是Web页面上每个资源的URL,浏览器都会开启一个线程来处理这个请求,同时在远程DNS服务器上启动一个DNS查询。这能使浏览器获得请求对应的IP地址。    

(2), 浏览器与远程Web服务器通过TCP三次握手协商来建立一个TCP/IP连接。该握手包括一个同步报文,一个同步-应答报文和一个应答报文,这三个报文在 浏览器和服务器之间传递。该握手首先由客户端尝试建立起通信,而后服务器应答并接受客户端的请求,最后由客户端发出该请求已经被接受的报文。    

(3),一旦TCP/IP连接建立,浏览器会通过该连接向远程服务器发送HTTP的GET请求。远程服务器找到资源并使用HTTP响应返回该资源,值为200的HTTP响应状态表示一个正确的响应。    

4),此时,Web服务器提供资源服务,客户端开始下载资源。请求返回后,便进入了我们关注的前端模块 简单来说,浏览器会解析HTML生成DOM Tree,其次会根据CSS生成CSS Rule Tree,而javascript又可以根据DOM API操作DOM


3,如何管理自己的项目:

首先必须确定好团队的全局样式(globe.css),编码模式(utf-8) 等;

编写习惯必须一致(例如都是采用继承式的写法,单样式都写成一行);        

标注样式编写人,各模块都及时标注(标注关键样式调用的地方);        

页面进行标注(例如 页面 模块 开始和结束);        

CSS跟HTML 分文件夹并行存放,命名都得统一(例如style.css);        

JS 分文件夹存放 命名以该JS功能为准的英文翻译。        

图片采用整合的 images.png png8 格式文件使用 尽量整合在一起使用方便将来的管理 



返回列表 返回列表
评论

    分享到