• 周二. 9月 27th, 2022

5G编程聚合网

5G时代下一个聚合的编程学习网

热门标签

前端是个很大的概念

admin

11月 28, 2021
https://www.zhihu.com/question/20269059 
 

移动前端开发:iOS,Android等客户端本地SDK开发;以及hybird APP开发;

web前端开发:HTML+CSS+JS开发;以及hybird APP 开发;

你会发现,实际上二者是有交集的;

hybird APP开发:会把一些页面通过用webview实现;

iOS,安卓会有相应的语言:OC,swift,等针对不同的手机客户端而言的;

PC端:HTML,CSS,JS基础的,更可能有一些框架:Vue react等使用

发展到大前端,实际上这些都包括在内了,但是基本学习一个小方向就需要下功夫很长时间了。

移动前端开发可分为:

1、手机网页开发。这部分跟web前端开发差别不大,使用的技术都是html+css+js。区别为手机浏览器是webkit的天下,pc端是IE的天下。手机网页可以理解成pc网页的缩小版加一些触摸特性。因为是在浏览器中进行的网页开发,所有最终代码具有跨系统平台的特性。

2、app前端开发。使用的技术也是html+css+js,但它需要基于PhoneGap等开发平台调用手机核心功能接口(包括地理定位,加速器,联系人,声音和振动等)模拟native app,这部分跟web前端开发完全不同。最终代码发布要分别编译成各系统平台的app。

———19年的分割线———

以上是12年的回答,现在19年了还不断有人点赞。为避免误导,补充说下:

上述答案是根据当时市场和技术环境以及提问者语境来区分的。

现在的语境「移动前端开发」更多指的是「移动端开发」,是native语言(c,java等)开发的,跟Web没太多关系。

浏览器原生缓存,PC时代我们怎么做的

对于浏览器的缓存机制,我们传统用expire时间控制。当页面缓存没有到期时,浏览器会读取本地文件的js/css/图片;如果我们强制刷新,浏览器会发起304协议请求。

对于js构建,对于小型页面,有原始的全局变量模式,中型以上的模块化有AMD模式,React,Vue使用的Webpack模式。

这些模式在加载的时候一般有两种:

  • 1、并行加载多个模块,利用RequireJS, Webpack的回调函数进行模块依赖处理;

优点:按需加载,每个模块文件浏览器都会根据文件名进行缓存

缺点:http请求过多,耗费在延迟的性能大,对服务器的并发高

  • 2、相对常用的,线下把所有依赖打包成一个大文件,一次请求全部。

优点:http少,一次握手全部加载完成

缺点:大文件间可能模块有重复加载,浪费时间和流量

移动端的新坑

移动浏览器环境,相对于PC环境又有如下新问题:

  • 非Wi-Fi情况下网络延迟很大,达到200-400ms,直接结果就是304或者200情况下css,js加载很慢,加大白屏时间
  • IOS webview 大坑:IOS webview资源缓存存储在内存,如果IOS退出程序后台,所有图片/css/js全部缓存消失,再访问页面全部200请求。
  • 各种客户端的webview,第三方浏览器行为不一致,经常expire没有失效却触发了304协议

前端开发工程师,稍微细分,分成三类:

Native App(原生APP):也就是完全使用移动设备系统语言写的客户端。iOS系统就是使用Objective-C语言来编写本地应用;Android平台就是使用Java语言来开发。原生APP就是从界面到交互都是使用官方标准语言来编写,但欠缺灵活性。

Web App:这个就是在移动浏览器里打开的,使用Web前端开发语言HTML CSS JavaScript来开发的,基本上就是个网页,

Hybrid App:主要使用HTML5实现。一般使用Native语言实现一个容器,然后使用HTML CSS JS来实现用户界面和交互。这样方式既克服了Web App容器暴露偏底层的接口这样的问题,同时比起原生的开发灵活性要高。这样就更新可以更方便快捷,也不依赖于市场。

最显著的区别就是,web app是不依赖于具体的设备的,通用性较强,只要手机或PC有相应内核的浏览器就基本OK。而mobile的app则依赖于具体的设备,一旦更换设备,需要重新下载才能继续使用。

WEB前端开发:电脑打开的网页就是

移动前端开发:有多个称呼,移动前端开发,H5前端开发,native前端开发,Hybird前端开发……

可以简化分为两类,app前端开发(基于phonegap等平台)与手机网页开发(简化版的电脑网页)。

一、两种前端开发的区别:
1.兼容问题:普通PC端开发,兼容问题较为普遍,例如需要兼容ie6~11,firefox,chrome等多种不同内核的浏览器,因此需要避免由于使用新样式完成目标任务,而造成部分浏览器不兼容。手机网页开发,兼容问题较少,因为多数手机均使用webkit内核的浏览器,另外再兼容chrome,uc,qq等浏览器即可。

2.手机网页尺寸较小,容量少,需要写的css和html也较少,交互简单。与此同时伴随而来的问题就是手机屏幕尺寸大小不一,在切图,像素等方面会遇到问题。还有一个小的点就是,各手机选择的js库不尽相同。

二、两种前端开发的共同点:均是基于html+css+javascript的技术

  • 大前端方向:移动前端、Web前端、Native客户端
  • 大前端框架:Node.js、Vue.js、React、
  • 跨终端技术:HTML5、CSS3、JavaScript
  • 跨平台框架:React Native、Cordova
  • 前端工程化:CommonJS、npm、gulp、Webpack

https://www.bilibili.com/video/BV1v741147Gm/    尚学堂】Web前端零基础第一阶段Html5/CSS3/JavaScript全套入门教程

https://www.zhihu.com/column/c_1246841994339028992    Web前端开发是互联网时代软件产品研发中不可缺角色
iOS平台上有三类APP:Web APP通过浏览器访问;Native APP通过APPstore下载安装;Hybrid APP 看上去是一个Native APP,只是一个webview控件,内部访问的是web APP。web 开发成本低,轻松跨平台,便于维护等。

1,操作兼容性和各移动版浏览器的兼容性
2.各种不同的尺寸,包括宽高比(横屏竖屏)
3.触摸或手机键盘的操作
—————-
app是应用,每个操作系统有专门的开发工具和语言
web是网页,使用html+css+js,有工具可以生成转化为app,不过效果一般

作者:张铮铮
链接:https://www.zhihu.com/question/20269059/answer/14555380
来源:知乎
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

前端是个很大的概念,我的理解是用户能够看到,直接接触到的层面都算是前端,比如IOS客户端界面,安卓客户端界面,网页界面,甚至PC/MAC 桌面端软件界面;现在最常见的说法一般是指Web前端,也就是针对于网页端开发的工作。

也有个说法就是前端就是大前端嘛,如果你的工作真的那么赞的话,那就包括了web啦安卓啦ios啦甚至pc mac客户端的界面啦。但我觉得现在一般大家都还是有专攻的。

Web App指的是【Web application】,也就是以浏览器作为客户端的软件。比如你要写文档,一般会打开Office 2012之类的本地软件;但是你也可以选择在浏览器里输入一个网址,比如我很喜欢StackEdit — *smart* markdown editor ,然后直接在里面写东西直接发布到gist上; 再比如用桌面客户端来收发邮件,但你也可以直接用浏览器登陆gmail亦或者QQ邮箱,直接把这个当客户端用。总之就是使用网页版代替本地软件。

Mobile Web App 当然就是指在手机端打开的Web App啦。我推荐看看Gmail的移动版。


感觉楼主问的问题还挺模糊的,所以我大概照我的理解依次解释下:
移动客户端的开发类型(因为我是个前端所以我是站在前端立场上来说的哈),主要是三种:

Native App(原生APP),也就是完全使用移动设备系统语言写的客户端,iPhone iPad就是纯Object-C,安卓就是纯JAVA, 就是用户看到的界面啦体验到的交互啦都是原生的。这是性能最棒的开发方式,但灵活性就没下面的好。

Web App, 这个就是在移动浏览器里打开的,纯HTML+CSS+JS,说白了就是个网页,只不过非常的富应用,比如手机浏览器访问的GMAIL啥啥的。但说白了就是在浏览器里打开的页面。。IOS支持可以在桌面创建访问的快捷方式,但是说到底还是打开Safari跑。。而且对设备硬件的接口什么的挺薄弱。

Hybrid App.[HTML5 in mobile devices] 我觉得这个更为合适一些。实际上是使用原生写了一个容器,然后使用HTML+CSS+JS来实现用户界面和交互。Web App的短处便可以克服(因为自己写的容器可以辅助暴露偏底层的接口,比如本地存储或者麦克风控制之类),同时比起纯原生的java或者object-c开发灵活性要高(更新可以更快更迅速,也不依赖于市场,因为说白了,就是自己下载更新网页资源。。)实际上这种方式已经不限于移动端。。豌豆荚其实是个pc端的hybrid app 哇~~~ 而且说实在的,桌面开发的性能就现在来说要比移动好很多。。

以上三种开发方式的比较和分析谷歌里面一搜一大堆我就不废话啦哈。我记得2011年的Google io上就有一场talk是android native和web app等开发方式的大PK。。看俩工程师吵还是很有意思的。我顺手找着了 [ ]

题主似乎是想学移动方向的前端开发?那是针对哪个方向的捏?个人觉得其实如果还是html+CSS+js的话核心都是一样的,只不过移动端可能在页面建构时有些关于尺寸方面(物理像素css像素设备独立像素这一堆)的细节需要注意下,包括图片处理之类的,这些可以参见苹果和安卓的官方文档,虽然是针对原生开发者的,但很多地方前端是完全该知道的;此外js方面可能就是注意性能方面的问题,我觉得就眼下的情形来说国内要做依赖于html css js又要非常富应用和高性能的移动端可能不太现实。。。而且我觉得移动端开发就目前现状而言。。拼的完全是痛苦的设备测试和调试。。


然后我跑题感慨下。。。这种遍地都是坑的节奏。。。在我刚开始高兴哈哈不用兼容IE了的时候,我发现webkit和安卓碎片化的坑才是最大头的。。。

———
知乎说我的内容不符合社区规范?!why?

 

发表回复

您的电子邮箱地址不会被公开。