全栈工程师如何快速构建一个Web应用

正式上线之前，你还应该对网站做一些性能调优，以保证网站能够有比较好的响应速度。使用YSlow等工具是一个不错的选择，它能告诉你网站加载缓慢的原因，并给出优化的建议。

下面是一些常见的优化方法：

合并压缩静态文件： 将JavaScript，CSS文件进行压缩（去掉不必要的空格、换行和注释）与合并（将多个CSS或JavaScript文件合并成一个文件），并且使用GZIP进行压缩，可以提高网站的加载速度。

使用前端镜像库： 对于网站中用到的第三方字体和前端代码库，我通过360和百度的前端镜像站点来获取，这样可以降低网站本身流量的开销，也可以提高网站的整体加载速度。

利用云存储和CDN进行加速： 技匠社的资源分享有图片上传功能，而图片是最占带宽的，3M的带宽根本支持不了几个用户的同时访问。因此，我选择使用了七牛云，我将用户上传的图片通过七牛云的API传到七云存储空间内，并直接利用它的CDN对这些静态资源进行加速，这样一来网站的图片以及那些静态文件（我们将那些不会频繁修改的JavaScript、CSS等都放到了CDN上）就不会占用阿里云的带宽了。另外，不得不说七牛云的价格对于个人用户或初创企业来说还是比较优惠的，比如10G空间以内的存储都是免费的。

下图为网站的CDN流量统计：

网站数据统计

网站上线后，你仍然需要对网站的访问量，用户情况进行持续的统计和分析，大家可能发现在网站的功能里我们并没有加入相应的用户访问跟踪模块，是的，我们可以借助第三方的统计平台来帮我们做这件事。由于国内无法使用Google Analytics，因此我选择了百度统计，你只需要在百度统计中注册一个账号并加入你的站点，然后在你的网站头部加入一小段JavaScript代码就能实现最基础的网站统计功能了。当你需要更多用户个性化分析时，可以在应用的内部去增加相应的模块，进行数据的抓取和分析。

开发与设计工具

最后来分享一下我在整个开发过程中所使用到的4个主要的开发和设计工具，我用到的其他一些工具，也可以在我的《一名全栈设计师的Mac工具箱（设计,开发,效率）》中找到。

Eclipse

Eclipse是我一直在使用的后端JAVA开发IDE，我也使用它来开发基于SpringBoot的后端服务应用。其实比起商用过的Intellij它仍然逊色不少，推荐它是因为一方面我一直在使用它，另一方面它是免费的。

Sublime Text 3

我使用Sublime Text来开发前端基于AngularJS的静态网站。它是我开发前端代码时最喜欢使用的IDE。我非常喜欢它的那些使代码异常清晰的主题，以及功能丰富的插件。有了它开发HTML、CSS、JavaScript变成了一件非常愉悦的事情。

Code Kit

CodeKit 可自动编译自动编译Less, Sass, Stylus, CoffeeScript, Jade & Haml等文件。为 JavaScript 提供合并、压缩以及错误检查。还可以优化 jpeg 和 png 图片，并为我提供一个本地的测试环境。当然，你也可以不使用任何工具，直接通过Grunt或Gulp的插件去实现所有这些功能。

Sketch 3

Sketch是我目前最常使用的设计工具。它只有几十M，相较于Photoshop,它小巧得多，更重要的是它是专为UI设计而生的，我不必关注那些与我做UI设计毫无关系的图片处理功能，从而降低了工作环境中的噪音。另外，通过强大的插件功能，我能根据需要进行安装使用，这大大提高了我的工作效率。所以，现在大到做一个完整的UI设计，小到设计一个图标或修一张图片我都会首先选择Sketch这个工具。

能够快速构建出一个Web应用或APP是全栈工程师的核心竞争力，这也是为什么那么多初创公司都在寻找全栈工程师的原因。如果你也希望成为全栈工程师，跟着我一起全栈修炼吧^_^

在我的下一篇文章中，将与你分享《基于Spring Boot构建REST服务》。另外，我们也欢迎你加入技匠社这个开源项目成为Contributor或Core成员，它是一个完全开源的实验项目，我们希望能在这里汇聚年轻的设计师与开发人员，一起实践优秀的设计和技术，并通过微创新来做出更多有意思的东西来，期待你的加入！

（编辑：云计算网_泰州站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!