整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
PP封装是形成APP最省钱的方式。你只需要有一个网址，通过一些技术处理，打包成跨iOS和安卓的APP，往往只需要几分钟。在移动互联网时代，拥有一款移动APP至关重要。
封装APP多指Web APP的封装，是一种基于架构的APP开发模式。通过使用框架(HTML5 APP框架开发模式)，无论是iOS还是安卓，都可以跨平台运行。通过这个框架，你可以把网站打包成一个APP，安装在手机设备上。
简单来说，网站是由网页(html5)组成，打包成APP后类似于浏览器访问网页(html5)，因此网页(html5)在访问手机硬件、手机权限等方面会受到限制。
优点:
1.可以低成本直接打包成APP。
2.只要有网站(网址)，就可以打包成APP。
3.一包生成跨端APP。
4.代码维护方便，版本更新灵活，不受原生限制。
缺点:
1.用户手机体验差，可能会长期降低用户的信任度。
2.原生函数的使用有限，性能远不如原生函数。
这就导致了混合开发APP，在保持webapp开发便捷的基础上，利用原生性能提升用户体验。混合开发app使用一个框架(html 5+原生框架)跨终端生成iOS和安卓APP。相比混合app，可以使用原生能力，体验更好。
优点:
1.开发APP需要使用html 5+原生框架，开发后封装到APP中，成本低。
2.一次封装生成跨端APP
3.轻松的代码维护和快速的版本更新
4.用户体验好，留存率高。
5.它支持使用原生函数，性能优于web app。
缺点:
1.版本更新，如果是原生问题，需要重新投放应用市场。
2.原生函数的使用有限，性能不如原生函数。
喽小伙伴们，咱们又见面了，我是咕噜铁蛋，随着移动设备的普及，移动应用程序（APP）已经成为人们日常生活中不可或缺的一部分，而原生APP和h5就是现代移动应用程序开发中的两种主要技术方式。今天铁蛋就给大家介绍介绍它们的原理以及二者之间的区别。
源自www.gulufenfa.com
原生app是指使用特定的编程语言和开发工具，直接针对特定的移动设备平台（比如iOS或Android）进行开发的应用程序。这种应用程序在硬件上有更好的适应性、更高的性能和更丰富的功能。开发原生app需要掌握平台特定的编程语言和API，并且需要为不同的平台分别进行开发和发布。Android平台通常使用Java或Kotlin编程语言，而iOS平台主要使用Objective-C和Swift。原生APP开发充分利用了操作系统的功能，为本机应用程序带来了高性能和良好的用户体验。此外，原生应用程序具有很强的设备兼容性，可以直接应用于设备硬件和一些系统功能，如摄像头、GPS、蓝牙等。
H5封装（也称为Hybrid App）是指基于web技术（HTML、CSS和JavaScript）开发的应用程序，通过封装在原生app的webview中运行。H5封装的应用程序实际上是一个嵌入在原生壳中的网页，通过JavaScript与原生壳进行交互，以实现访问设备功能和提供更好的用户体验。相比于原生app，H5封装更加快速开发、跨平台兼容，也更易于更新和发布。但是在性能和用户体验上没有原生APP好。
两者的主要区别如下：
1. 开发语言：原生app使用特定平台的编程语言，如Objective-C/Swift（iOS）或Java/Kotlin（Android），H5封装使用HTML、CSS和JavaScript。
2. 性能：原生app通过直接调用设备功能和API，具有更好的性能和响应速度；而H5封装则受限于webview性能，相对较慢。
3. 功能和交互：原生app可以直接调用设备功能和接口，有更丰富的功能和交互效果；H5封装需要基于JavaScript和webview提供的接口。
4. 平台适配性：原生app需要为不同平台分别开发，而H5封装可以进行跨平台开发。
5. 更新和发布：原生app需要通过应用商店进行发布和更新，用户需要主动下载安装；而H5封装可以通过服务器端的更新实现快速发布和更新。
在一些对性能和设备功能要求较高的场景（如游戏、工具类应用等）中，原生App可能是更好的选择。而对于对性能要求相对较低、更新迭代快、预算有限的项目来说，H5应用程序可能更实用。综上所述，原生app和H5封装在开发语言、性能、功能和交互、平台适配性、更新和发布等方面都存在明显的差异。选择合适的开发方式应根据具体需求和项目情况来决定。
Ok！同学们，今天的小课堂就到这里啦，如果我有哪疏忽或者讲的不对的地方可以提出来哦，咱们明天见！
前一直用jquery，项目中遇到ajax也是用jq自带的$.ajax来实现，最近公司要求项目去jquery化，新项目都用vue，感觉脱离了操作dom的苦海，不过相比jquery的大而全，很多东西需要自己写，比如ajax，下面自己用原生的封装了一个，支持json和jsonp，直接上代码：
function Ajax(options) {
options = options || {};
options.type = (options.type || "GET").toUpperCase();
options.url = options.url || location.href;
options.dataType = options.dataType || 'json';
options.async = options.async || true;
options.timeout = options.timeout || 30000;//超时处理，默认30s
options.contentType = options.contentType || "application/x-www-form-urlencoded;charset=UTF-8"; //可选：application/json application/x-www-form-urlencoded
options.heads = options.heads || {};
options.data = options.data || {};
var timeoutFlag = null;
var params =options.data;
var xhr;
var that = this;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
} else {
xhr = new ActiveXObject('Microsoft.XMLHTTP')
}
xhr.onreadystatechange = function () {
if (options.dataType === 'json') {
// 如果需要像 html 表单那样 POST 数据，请使用 setRequestHeader() 来添加 http 头。
if (xhr.readyState == 4) {
window.clearTimeout(options.timeoutFlag);
var status = xhr.status;
if (status >= 200 && status < 300) {
options.success && options.success(xhr.responseText, xhr.responseXML);
} else {
options.fail && options.fail(status);
}
}
} else {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
window.clearTimeout(options.timeoutFlag);
var oScript = document.createElement('script');
document.body.appendChild(oScript);
var callbackname = 'ajaxCallBack'
oScript.src = options.url + "?" + params + '&callback=' + callbackname;
window['ajaxCallBack'] = function (data) {
options.success(data);
document.body.removeChild(oScript);
};
}
}
};
if (options.type == 'GET')
{
params = getParams(params);
xhr.open("GET", options.url + '?' + params, options.async);
setHeader();
xhr.send(null)
} else if (options.type == 'POST') {
xhr.open('POST', options.url, options.async);
setHeader();
xhr.send(getParams(params));
}
var timeoutFlag = options.timeoutFlag;
timeoutFlag=window.setTimeout(function ()
{
window.clearTimeout(timeoutFlag);
xhr.abort();
alert("ajax请求超时");
},options.timeout);
function setHeader() {
xhr.setRequestHeader("Content-Type", options.contentType);
for (var head in options.heads) {
xhr.setRequestHeader(head, options.heads[head]);
}
xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
}
//json转为键值对，支持多级。
function getParams(data,parentKey) {
var arr = [];
for (var param in data)
{
var paramName = param;
if (parentKey != undefined)
{
paramName = parentKey + "[" + param+"]";
}
if (typeof (data[param])=="object")
{
arr.push(getParams(data[param], paramName));
}
else
{
arr.push(encodeURIComponent(paramName) + '=' + encodeURIComponent(data[param]));
}
}
return arr.join('&');
}
}
最近工作忙，很少写文章了，欢迎大家转发和关注，
*请认真填写需求信息，我们会在24小时内与您取得联系。
