归功于近几年CPU速度的提升,web打包成的app流畅度已经和原生app没有多大区别。对于个人而言,用web写UI界面是最好的选择,一方面只需一套代码就可以跑遍所有平台,另一方面web端有各种各样的库,写出好看的界面比原生app容易太多了。
如果有大量数据需要处理,担心web app的性能,可以用其他语言另开一个进程,数据处理完之后再通过websocket交给web显示就好了。
对于桌面端可以使用electron打包,对于移动端可以使用flutter进行打包。他们其实就是一个nodejs的package,对于web开发者来说用起来很方便。
下面以electron举例,将我的博客打包成一个app。
首先创建一个index.js文件:
const { app, BrowserWindow } = require('electron')
app.whenReady().then(() => {
const win = new BrowserWindow({
width: 1200,
height: 800
})
win.loadURL('https://fivecakes.com')
})
app.on('window-all-closed', function () {
if (process.platform !== 'darwin') app.quit()
})
然后创建package.json:
{
"name": "my-electron-app",
"version": "1.0.0",
"description": "Hello World!",
"main": "index.js",
"license": "MIT",
"scripts": {
"start": "electron .",
"pack": "electron-builder --dir",
"dist": "cross-env CSC_IDENTITY_AUTO_DISCOVERY=false electron-builder"
},
"devDependencies": {
"cross-env": "^7.0.3",
"electron": "^13.1.1",
"electron-builder": "^22.10.5"
}
}
安装依赖,并打包称app:
yarn
yarn dist
运行效果