IT博客汇
  • 首页
  • 精华
  • 技术
  • 设计
  • 资讯
  • 扯淡
  • 权利声明
  • 登录 注册

    [转]Meteor:让实时Web App成为主流

    zhoubl668发表于 2016-03-30 16:29:15
    love 0
    Meteor在2012年4月首次发布,该消息一经发布,便迅速占据了Haceker News头条宝座,并且成为Hacker News上最热门的文章之一。本文是作者Sacha Greif使用Meteor开发的心得体会,他认为Meteor会让实时Web App在未来成为主流。

    Meteor是一个新鲜出炉的现代网站开发平台,目前发布的是开发预览版0.5.8,代码以GPL协议开源。大家可以去 GitHub上关注它。Meteor本质上是Node.JS应用的开发,继承了Ruby on Rails、Node.JS、MongoDB API等框架的基础特性,模糊了服务器端和客户端,弱化网络连接质量造成的影响。

    如果简单定义“现代网站”是一个实时交互、超高性能、具备非凡体验的网站,那么 Meteor就是一个可为开发者以简单高效而且充满乐趣的方式进行现代网站开发的平台,以往开发周期需要几周到几个月的项目,现在可能只需要几个小时或者一个周末的时间就可以完成。Meteor构建的应用体验,会让人觉得浏览器的刷新按钮和地址栏是多余的。

    Meteor在2012年4月首次发布,该消息一经发布,便迅速占据了Haceker News头条宝座,并且成为Hacker News上最热门的文章之一。本文是作者Sacha Greif使用Meteor开发的心得体会,他认为Meteor会让实时Web App在未来成为主流。 

    下面是对原文的翻译:

    在过去6个月里,我使用Meteor做了点东西( Telescope,Meteor开源的主要应用程序之一),我觉得有必要分享一下我的感受。

     

    首先声明:在和Meteor代码打交道的每一天里,我的大部分时间都在使Telescope变更加可用,而不是去深入挖掘Meteor,所以我不敢自称是Meteor方面的专家,而之所以能很快上手,很大一部分原因是因为它是一个非常好用且高效的框架,即使在你不精通的情况下也能开发出非常出色的应用。

    简单 智能

    Meteor的一大特色就是可以轻松构建高品质的实时Web应用程序,相信很多程序员都是因为这一特性而熟知Meteor的。当开始使用Meteor时,会让你的生活变得很简单。

    安装Meteor也非常简单,只需一行命令即可。随即便创建第一个应用程序,就连部署也都非常简单,由于Meteor提供免费的托管,因此你可以在线部署,供世界各地的人来浏览。

     

    此外,使用Meteor编写的应用程序运行速度也非常快。例如,当你的项目引用JS或CSS文件时,这些文件将会被自动加载,而Meteor也提供了内置的用户管理,自动完成UI部件的加载。

    Meteor九大特性

    1. 纯JavaScript
    2. 实时页面更新
    3. 干净、强大的数据同步
    4.  延迟补偿
    5. 代码热推送
    6. 敏感代码运行于受限环境中
    7.  完全独立的应用包
    8. 互操作
    9. 智能的包

    实时的未来

    说实话,实时框架是Meteor的最大卖点,实时Web应用程序会让人联想到多人游戏和实时在线文档编辑,但在使用Meteor时,我快速发现实时也可以编写出更加实用且非常好的应用程序,而这种实时很有可能会成为未来几年内Web应用程序的默认编写方式。

    在桌面应用系统中,如果一个目录被两个窗口同时打开,那么当你在其中一个窗口删除一个文件后,你必须刷新另一个窗口,那个文件才会“消失”。因此,这就缺乏了实时性,而Meteor框架就可弥补这方面的不足。

    此外,实时也影响到我们的编码风格。你无需刷新页面或使用特定的回调逻辑来使应用程序做出响应:每一个块数据都会自动监测、任何与UI元素有关的数据也会自动更新。

    下面提供一个案例,一旦有人投票,就响应upvote按钮的“disable”类,模板代码(Meteor使用Handlebars):

    1
    2
    3
    4
    <div class="post">
      <a href="#" class="upvote btn {{upvotedClass}}">⬆<a />
      <h3><a href="{{url}}">{{title}}</a></h3>
    </div>

    下面是与之匹配的控制器代码:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    Template.post.helpers({
      upvotedClass: function() {
        // test if user is logged in, and if their userId
        // is included in the 'upvoters' array
        var userId = Meteor.userId();
        if (userId && !_.include(this.upvoters, userId)) {
          return 'upvoteable';
        } else {
          return 'disabled'
        }
      }
    });

    这段代码妙在何处呢?如果用户的userid从upvoters数组中删除(例如,实现一个“cancel upvote”操作),这会自动在UI上反应出来,无需编写额外的代码。

    一切就绪了吗?

    现在,你可能会随着这一行行代码思考些东西:“好,它看起来很棒,但是它真的就可以作为现实应用( real-world apps)吗?”

    答案肯定是依情况而定。Meteor当然可以作为现实应用使用。Telescope和Sidebar(基于Telescope)就是非常完美的例子。

    但并不是说Meteor就可以完全作为现实应用使用。Meteor没有服务端渲染功能,有些网站对加载速度要求特别高,比如电子商务网站,而有些则需要在旧的/老的设备上运行,比如过时的手机。

    Meteor Book

    目前,我和 Tom Coleman(Meteor开源生态系统的主要贡献者之一,创建Meteor包管理器Meteorite)正在专注于 The Meteor Book,教你如何使用Meteor编写基本的应用程序。

    更多精彩内容,大家可以来到Hacker News上和我一起 探讨。(编译/张红月 责编/付江)


    学习资料:

    官方提供的3个示例:

    • http://meteor.com/examples/leaderboard
    • http://meteor.com/examples/todos
    • http://meteor.com/examples/wordplay

    GitHub项目页:

    • http://github.com/meteor/meteor

    Meteor@StackOverflow

    • http://stackoverflow.com/questions/tagged/meteor?sort=newest&pagesize=15

    文档:

    • http://docs.meteor.com/

    FAQ:

    • http://meteor.com/faq


沪ICP备19023445号-2号
友情链接