前端里移动端到底比pc端多哪些知识?
端里移动端到底比pc端多哪些知识,为啥面试时好多公司都问h5水平如何?
我做过几年的web前端开发,就简单谈谈自己的感受吧。
首先来看看PC端和移动端在前端开发上的一些区别:
(1)PC考虑的是浏览器兼容性,移动端开发考虑的更多的是手机兼容性,因为目前不管是android手机还是ios手机,一般浏览器用的都是webkit内核,所以做移动端开发,更多考虑的应该是手机分辨率的适配,和不同操作系统的略微差异化;
(2)在部分事件的处理上,移动端自然是偏向于触屏的,所以触屏事件的一些规律要多摸索一下,另外包括移动端弹出的手机键盘该如何处理,这样的问题在PC上肯定不会遇到,但在移动端,如果你没有经验,处理起来是相当麻烦的;
(3)在布局上,移动端开发一般是要做到布局自适应的,在这里我推荐用rem的解决方案,具体实现可以百度一下,相对比较简单,处理起来也比较灵活;
(4)在动画处理上,PC端由于要考虑到IE的兼容性,通常用JS做动画的通用性会好一些,但相比CSS3却牺牲了较大的性能,而在手机端,如果要做一些动画、特效等,第一选择肯定是CSS3,既简单,效率又高。
区别就说到这里,也许还不完全,我也是想到哪就说到哪,下面来谈谈如果要做移动端的web开发,也就是题主说的h5开发,在已有PC端的web开发基础上,还需要再研究哪些技术:
(1)微信的一些接口最好都能去实现一遍,熟悉一下肯定有好处的,比如领导让你通过微信分享的文章,title、description、以及icon图标怎么配置,你说你不清楚,那就太水了;
(2)百度地图的一些API接口,有时间也去熟悉一下吧,对于移动端来讲,LBS还是一个非常重要的特性,所以地图这块肯定也是需要了解的,再加上百度地图已经是一个比较成熟的平台了,学起来也不费事儿的;
(3)CSS3的动画去熟悉一下,至少最基本的一些动画实现和算法要了解,在移动端应该也算用得比较多的;
(4)一般pc用jquery,移动端用zepto,这没什么好说的,在这里主要是想提醒大家,移动端的流量相对还是比较重要的,所以引入的资源或插件,能小则小,一个30k的资源和80k的资源,在移动端还是相差挺大的;
(5)最好能掌握一套完整的前端开发架构,比如模块化、打包、压缩、缓存、发布,有条件的还能做一下自动化测试等等,我用过的有fis,还不错,牛逼的朋友可以自己写一套,另外再多说一句,如果想快速提升自己的前端开发技术,钻研前端架构这块是一个非常好的方向。
这几个月,还抽空写了一个APP,android和ios版本的都有,有兴趣的朋友可以加群 250777811,一起交流,一起进步!
前端里移动端到底比pc端多哪些知识?的更多相关文章
- PC端和移动端在前端开发上的一些区别,前端里移动端到底比pc端多哪些知识
(1)———————— 前端里移动端到底比pc端多哪些知识,为啥面试时好多公司都问h5水平如何?我做过几年的web前端开发,就简单谈谈自己的感受吧.首先来看看PC端和移动端在前端开发上的一些区别: ( ...
- EasyNVR无插件IPC摄像机直播方案前端构建之:如何区分PC端和移动端
EasyNVR前端为了更好的用户体验,不仅仅设有PC客户端,还适应移动客户端: EasyNVR的客户端中PC端和移动端差异有很多.例如: 由于PC端.移动端自身硬件的差异,所需要展示的样式也会存在一定 ...
- EasyNVR摄像机网页无插件直播方案H5前端构建之:如何区分PC端和移动端
背景分析 随着互联网基础设施建设的不断完善和发展,带宽的不断提速,尤其是光纤入户,4G/5G/NB-IoT各种网络技术的大规模商用,视频随时随地可看.可控的诉求越来越多,尤其是移动应用技术和前端技术的 ...
- asp.net Core 使用过滤器判断请求客户端是否为移动端,并实现PC端和移动端请求映射和自动跳转
很多时候我们做网站时单纯的用bootstrap等前端框架实现的前端自适应带给用户的体验并不太好,所以为了提高用户体验会专门针对PC端网页重新设计一套移动端网页,但是怎么才能做到在移动端访问PC页面的时 ...
- htm5移动端开发 和 pc端开发
htm5移动端开发: 移动端开发需要注意的一些事情:http://www.duanliang920.com/learn/web/html5/321.html HTML5移动端手机网站开发流程:http ...
- 移动端穿插着PC端自动化-Python基础(干货)
1.前面已经把所有前期工作完成了 下面进行一些简单的小脚本来更好的了解Python.对Python有一些基础的童鞋理解起来会比较容易,我刚接触的时候也会有点懵的,现在简单的也是没问题了. 大牛请不要喷 ...
- 山西大同大学教务处教师端——可在PC端,手机端操作
解决问题:大同大学教务处官网教师端口一进去就卡住了,点上面一行的菜单无响应 下载方法(学生端 / 教师端 / 验证脚本): 链接:https://pan.baidu.com/s/1MWrJXoPzE ...
- 1、移动端 2、后台 3、 移动端,Web 端 4、 PC端
移动端: 1.公众号:停开心 住总物业 2.app: iso Android 停开心,住总停开心 后台:停开心智慧停车管理平台(所有的停车场) 移动端,Web端: 海投OA,公司OA PC端:收费软 ...
- js判断是在移动端还是在pc端
function chatQQ3(){ if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) { //移动端打开 ...
随机推荐
- JAVAWEB项目如何实现验证码 (转)
JAVAWEB项目如何实现验证码 2012-12-21 21:19 56026人阅读 评论(36) 收藏 举报 .embody { padding: 10px 10px 10px; margin: 0 ...
- 【LCT】一步步地解释Link-cut Tree
简介 Link-cut Tree,简称LCT. 干什么的?它是树链剖分的升级版,可以看做是动态的树剖. 树剖专攻静态树问题:LCT专攻动态树问题,因为此时的树剖面对动态树问题已经无能为力了(动态树问题 ...
- Navicat for MySQL11--使用经验
Navicat for MySQL11--使用经验.. --------- /-------------------导出SQL:右键表--转储SQL文件--结构和数据---(Finished - Su ...
- 常见的Linux操作系统推荐
常见的Linux操作系统推荐.. ---------------------- Ubuntu系统 这个系统又名乌班图系统,也是一个以桌面应用为主的Linux操作系统,系统分为云平台,服务器版和桌面版. ...
- Android笔记: 日期格式化
下面的转换符来自Java,但是在android中同样可用.(以下表格内容来自互联网.) 常见日期格式化转换符 转换符 说 明 示 例 %te 一个月中的某一天(1-31) 2 %tb 指定语言环 ...
- PyQt QFontDialog显示中文
QApplication 加载Translator app = QtWidgets.QApplication(sys.argv) translator = QtCore.QTranslator() i ...
- C语言运算符运算顺序判断实例2
#include <stdio.h> int main(void) { , j = , k = ; printf("%d\n", ++i || ++j &&am ...
- import和require
es6 的 import 语法跟 require 不同,而且 import 必须放在文件的最开始,且前面不允许有其他逻辑代码,这和其他所有编程语言风格一致. import不同与require,它是编译 ...
- spring整合mybatis错误:Caused by: org.xml.sax.SAXParseException; lineNumber: 5; columnNumber: 62; 文档根元素 "mapper" 必须匹配 DOCTYPE 根 "configuration"。
运行环境:jdk1.7.0_17+tomcat 7 + spring:3.2.0 +mybatis:3.2.7+ eclipse 错误:Caused by: org.xml.sax.SAXParseE ...
- mysql 批量插入优化之rewriteBatchedStatements
详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcyt397 介绍MySQL Jdbc驱动的rewriteBatchedStatem ...