前端知识点
2016-11-07 18:47:13 0 举报AI智能生成
前端知识点涵盖了网页设计和开发的各个方面，包括HTML、CSS和JavaScript等核心技术。HTML用于创建网页的结构，定义了各种标签来表示文本、图像、链接等内容；CSS则负责网页的样式和布局，通过选择器和应用属性值来控制元素的外观；而JavaScript是一种脚本语言，可以实现网页的交互功能，如表单验证、动画效果等。此外，前端开发还涉及到响应式设计、浏览器兼容性、性能优化等方面的知识。掌握这些知识点可以帮助开发者构建出美观、易用且高效的网页应用。
作者其他创作
大纲/内容
优化问题
网站文件和资源进行优化
文件合并
文件最小化、文件压缩
使用CDN托管
缓存的使用
文件最小化、文件压缩
使用CDN托管
缓存的使用
减少页面加载时间的方法
优化图片
图像格式的选择
优化CSS
标明高度和宽度
减少http请求，合并文件，合并图片
FOUC 无样式内容闪烁
<style type="text/css" media="all">@import "../fouc.css";</style>
而引用CSS文件的@import就是造成这个问题的罪魁祸首。IE会先加载整个HTML文档的DOM，然后再去导入外部的CSS文件，因此，在页面DOM加载完成到CSS导入完成中间会有一段时间页面上的内容是没有样式的，这段时间的长短跟网速，电脑速度都有关系。
解决方法简单的出奇，只要在<head>之间加入一个<link>或者<script>元素就可以了。
性能优化问题
1. 减少http请求次数：CSS Sprites, JS、CSS 源码压缩、图片大小控制合适；网页 Gzip，CDN 托管，data 缓存 ，图片服务器
2. 前端模板 JS + 数据，减少由于HTML标签导致的带宽浪费，前端用变量保存 AJAX 请求结果，每次操作本地变量，不用请求，减少请求次数
3. 用 innerHTML 代替 DOM 操作，减少 DOM 操作次数，优化 javascript 性能
4. 当需要设置的样式很多时设置 className 而不是直接操作 style
5. 少用全局变量、缓存DOM节点查找的结果。减少 IO 读取操作
6. 避免使用 CSS Expression（css表达式)又称 Dynamic properties(动态属性)
7. 图片预加载，将样式表放在顶部，将脚本放在底部，加上时间戳
页面重构
编写css，让页面结构更合理，提升用户体验，实现良好的页面效果和提升性能
前端概念
前端是最贴近用户的程序员，比后端、数据库、产品经理、运营、安全都近。
1. 实现界面交互
2. 提升用户体验
3. 有了Node.js，前端可以实现服务端的一些事情
前景：
1. 前端是最贴近用户的程序员，前端的能力就是能让产品从 90分进化到 100 分，甚至更好
2. 参与项目，快速高质量完成实现效果图，精确到1px；
3. 与团队成员，UI设计，产品经理的沟通；
4. 做好的页面结构，页面重构和用户体验；
5. 处理hack，兼容、写出优美的代码格式；
6. 针对服务器的优化、拥抱最新前端技术。
新的技术
1. Node.js
2. Mongodb
3. npm
4. MVVM
5. MEAN
6. three.js
7. React
框架
jquery
yui
prototype
dojo
ext.js
Mootools
轻量级
modernizr
underscore.js
backbone.js
raphael.js
组件
城市选择插件
幻灯片
弹出层
子主题
0 条评论
下一页
