用NW.js开发下一代桌面应用程序

最新推荐文章于 2024-08-09 07:55:26 发布

原创

最新推荐文章于 2024-08-09 07:55:26 发布 · 6.8k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#桌面应用 #网页 #NW-js #Node-js

本文探讨使用网页技术如HTML5和CSS3开发桌面应用的优缺点，并以NW.js为例，详细介绍如何从获取二进制文件、创建工程目录、编写package.json、实现无边框窗口拖动到打包发布一个简单的桌面应用。尽管网页技术存在一些限制，但NW.js提供了一种便捷的开发方式。

前言

就在最近，GitHub发布了其代码编辑器Atom的1.0正式版。使用过它的童鞋一定会知道它利用网页技术开发。只不过它的框架是Atom Shell，非常类似NW.js。这时你可能问，放着好端端的native级界面框架不用，为什么要使用网页技术编写界面呢？下面我们就来探讨一下这个问题。

网页技术的优缺点

优点

HTML技术发展到今天的HTML5版本可谓已经十分强大，同时有CSS3的加持，网页也可以华丽夺目。Canvas标签、Audio标签以及Video标签的引入使得网页真正支持了多媒体，使用已经比原生界面框架简便。更重要的是WebGL标准，它把3D世界带到了浏览器，你可能不会相信GTA、极品飞车可以跑在浏览器中，可这已经可以实现。如此说来，网页完全可以满足桌面应用UI的需求，并且可以使界面更加灵活绚丽，也极大地方便了跨平台的开发。大家不妨搜索HTML5相关的案例或网站（这里推荐Codrops，里面有非常多用CSS3实现的界面效果）

缺点

凡事都不是十全十美的，网页开发当然也有许多坑。例如当我们需要做一个无边框窗口时（如下图）这里写图片描述
我们需要它有阴影，这时可以用-webkit-box-shadow样式属性，但发现拖拽缩放却在NW.js中无法实现，这就比用native级的wndProc函数的效果差了，当然界面效果还是非常不错的。另外，缺乏界面元素，ListBox等控件我们就必须自己实现了，是时候打开我们的脑洞了。用网页的另一个显著的缺点还有其不稳定性和性能，我们知道NW.js的前端其实就是Chromium，我在开发中经常遇到闪烁、卡顿等问题。