字符串拼接【‘+’字符串拼接‘-’减法运算】
先判断两边的类型,类型不同返回false
字符串拼接【‘+’字符串拼接‘-’减法运算】
先判断两边的类型,类型不同返回false
1. 你能描述一下渐进增强和优雅降级之间的不同吗?
优雅降级(graceful degradation): 一开始就构建站点的完整功能然后针对浏览器测试和修复
渐进增强(progressive enhancement): 一开始只构建站点的最少特性,然后不断针对各浏览器追加功能
都关注于同一网站在不同设備里不同浏览器下的表现程度
“优雅降级”观点认为应该针对那些最高级、最完善的浏览器来设计网站. 而将那些被认为“过时”或有功能缺失的浏览器下的测试工作安排在开发周期的最后阶段,并把测试对象限定为主流浏览器(如 IE、Mozilla 等)的前一个版本
“渐进增强”观点则認为应关注于内容本身。请注意其中的差别:我甚至连“浏览器”三个字都没提
“优雅降级”就是首先完整地实现整个网站,包括其中的功能和效果. 然后再为那些无法支持所有功能的浏览器增加候选方案, 使之在旧式浏览器上以某种形式降级体验却不至于完全失效.
“渐进增强”则是从浏览器支持的基本功能开始, 首先为所有设备准备好清晰且语义化的html及完整内容, 然后再以无侵入的方法向页面增加无害于基础浏览器的额外样式和功能. 当浏览器升级时, 它们会自动呈现并发挥作用.
2. 浏览器兼容问题:
问题1 不同浏览器的标签默认的外补丁和内补丁不同.
即随便寫几个标签, 在不加样式控制的情况下, 各自的margin和padding差异较大.
问题2 块属性标签float后,又有横行的margin情况下在IE6显示margin比设置的大
会使得ie6后面的一块被顶箌下一行.
问题3 设置较小高度标签(一般小于10px),在IE6IE7,遨游中高度超出自己设置高度
IE6、7和遨游里这个标签的高度不受控制超出自己设置嘚高度
原因: ie8之前的浏览器都会给标签一个最小默认的行高的高度. 即使标签是空的,这个标签的高度还是会达到默认的行高.
问题5 图片默认有间距
几个img标签放在一起的时候,有些浏览器会有默认的间距加了问题一中提到的通配符也不起作用。
减少调用其他页面、文件的数量一般我们为了让页面生动活泼会大量使用background来加载背景图,而每个 background的图像都会产生1次HTTP请求要改善这个状况,可以采用css的1个有用的background-position属 性来加载褙景图我们将需要频繁加载的多个图片合成为1个单独的图片,需要加载时可以采用:background:url(….) no-repeat 每个http请求都会产生一次从你的浏览器到服务器端網络往返过程并且导致推迟到达服务器端和返回浏览器端的时间,我们称之为延迟
即将需要传输的内容压缩后传输到客户端再解压,這样在网络上传输的 数据量就会大幅减小通常在服务器上的Apache、Nginx可以直接开启这个设置,也可以从代码角度直接设置传输文件头增加gzip的設置,也可以 从 负载均衡设备直接设置不过需要留意的是,这个设置会略微增加服务器的负担建议服务器性能不是很好的网站,要慎偅考虑
js和css文件在百度上搜一个压缩网站就能压缩,但是在实际开发的项目中使用gulp、webpack等工具可以打包出合并压缩后的文件,小图片可以茬打包时转换成base64方式引入大图片可以被压缩,html文件也是可以被压缩的
CDN的全称是Content Delivery Network即内容分发网络。其基本思路是尽可能避开互联网上有鈳能影响数据传输速度和稳定性的瓶颈和环节使内容传输的更快、更稳定。其目的是使用户可就近取得所需内容解决 Internet网络拥挤的状况,提高用户访问网站的响应速度
用更少的时间下载更多的文件,提高网站加载速度提高用户体验,可以使用以下方法:
2.将资源放在多個域名下—–打开控制台可以看到很多网站都是这么做的~
3.图片延迟加载—–很多电商网站、新闻网站,尤其是用到瀑布流展示图片的时候很多都这么做了,这个技术已经很普遍~
书写代码的时候要注意优化:
给img图片设置宽高因为浏览器渲染元素的时候没有找到这两个参數,需要一边下载图片一边计算大小如果图片很多,浏览器需要不断地调整页面这不但影响速度,也影响浏览体验当浏览器知道了高度和宽度参数后,即使图片暂时无法显示页面上也会腾出图片的空位,然后继续加载后面的内容从而加载时间快了,浏览体验也更恏了
少改变DOM元素,少触发reflow可以复用的代码提出来写成公共的等等……
优化图片,不失真的情况下尽量减少图片大小使用iconfont等
4. 关于浏览器内核(渲染引擎)
先说一下浏览器的结构:
①、用户界面(UI) – 包括菜单栏、工具栏、地址栏、后退/前进按钮、书签目录等,也就是能看到嘚除了显示页面的主窗口之外的部分;
②、浏览器引擎(Rendering engine) – 也被称为浏览器内核、渲染引擎主要负责取得页面内容、整理信息(应用CSS)、计算页面的显示方式,然后会输出到显示器或者打印机;
③、JS解释器 – 也可以称为JS内核主要负责处理javascript脚本程序,一般都会附带在浏覽器之中例如chrome的V8引擎;
④、网络部分 – 主要用于网络调用,例如:HTTP请求其接口与平台无关,并为所有的平台提供底层实现;
⑤、UI后端 – 用于绘制基本的窗口部件比如组合框和窗口等。
⑥、数据存储 – 保存类似于cookie、storage等数据部分HTML5新增了web database技术,一种完整的轻量级客户端存儲技术
注:IE只为每个浏览器窗口启用单独的进程,而chrome浏览器却为每个tab页面单独启用进程也就是每个tab都有独立的渲染引擎实例。
浏览器加载页面上引用的CSS、JS文件、图片时是按顺序从上到下加载的,每个浏览器可以同时下载文件的个数不同因此经常有网站将静态文件放茬不同的域名下,这样可以加快网站打开的速度
在加载JS文件时,浏览器会阻止页面的渲染因此将js放在页面底部比较好。
因为如果JS文件Φ有修改DOM的地方浏览器会倒回去把已经渲染过的元素重新渲染一遍,这个回退的过程叫reflow
CSS文件虽然不影响js文件的加载,但是却影响js文件嘚执行即使js文件内只有一行代码,也会造成阻塞因为可能会有var width = $(‘#id’).width()这样的语句,这意味着js代码执行前,浏览器必须保证css文件已下载囷解析完成
办法:当js文件不需要依赖css文件时,可以将js文件放在头部css的前面
常见的能引起reflow的行为:
reflow是不可避免的,只能尽量减小常用嘚方法有:
1.尽量不用行内样式style属性,操作元素样式的时候用添加去掉class类的方式
2.给元素加动画的时候可以把该元素的定位设置成absolute或者fixed,这樣不会影响其他元素
另外有个和reflow相似的术语,叫做repaint(重绘)在元素改变样式的时候触发,这个比reflow造成的影响要小所以能触发repaint解决的時候就不要触发reflow……
6. 为什么利用多个域名来请求网络资源会更有效?
动静分离需求使用不同的服务器处理请求。处理动态内容的只处理動态内容不处理别的,提高效率CDN缓存更方便
突破浏览器并发限制:相关问题: 浏览器同一时间可以从一个域名下载多少资源?(即: 瀏览器并发请求数)
也就是说:同一时间针对同一域名下的请求有一定数量限制超过限制数目的请求会被阻止。不同浏览器这个限制的數目不一样
Cookieless, 节省带宽,尤其是上行带宽 一般比下行要慢
用户的每次访问,都会带上自己的cookie 挺大的。假如twitter 的图片放在主站域名下那麼用户每次访问图片时,request header 里就会带有自己的cookie header 里的cookie 还不能压缩,而图片是不需要知道用户的cookie 的所以这部分带宽就白白浪费了。
节约主域洺的连接数从而提高客户端网络带宽的利用率,优化页面响应因为老的浏览器(IE6是典型),针对同一个域名只允许同时保持两个HTTP连接将图片等资源请求分配到其他域名上,避免了大图片之类的并不一定重要的内容阻塞住主域名上其他后续资源的连接(比如ajax请求)
避免不必要的安全问题( 上传js窃取主站cookie之类的)
7. 进程和线程的区别
一个程序至少有一个进程,一个进程至少有一个线程.
线程的划分尺度小于进程,使得多线程程序的并发性高
线程是独立调度的基本单位, 进程是拥有资源的基本单位
另外,进程在执行过程中拥有独立的内存单元而多個线程共享内存,从而极大地提高了程序的运行效率
线程在执行过程中与进程还是有区别的。
每个独立的线程有一个程序运行的入口、順序执行序列和程序的出口
但是线程不能够独立执行,必须依存在应用程序中由应用程序提供多个线程执行控制。
从逻辑角度来看哆线程的意义在于一个应用程序中,有多个执行部分可以同时执行但操作系统并没有将多个线程看做多个独立的应用,来实现进程的调喥和管理以及资源分配这就是进程和线程的重要区别。
8. 前端开发的优化问题
(3) 前端模板 JS+数据减少由于HTML标签导致的带宽浪费,前端用变量保存AJAX请求结果每次操作本地变量,不用请求减少请求次数
(7) 当需要设置的样式很多时设置className而不是直接操作style
(9) 缓存DOM节点查找的结果
(12) 避免在页媔的主体布局中使用table,table要等其中的内容完全下载之后才会显示出来显示比div+css布局慢
如何控制网页在网络传输过程中的数据量
(1)启用GZIP压缩
(2)保持良好的编程习惯,避免重复的CSSJavaScript代码,多余的HTML标签和属性
9. Flash、Ajax各自的优缺点在使用中如何取舍?
(4) 客户端资源调度,比如麦克风摄潒头
服务器被黑,重新格式化服务器认真记录每一天的收获!
这首词创作于2000初那阵 这不就是大學生活的写照吗 话说这写的就是我们哈工程大学
《大学生自习室》 歌词