加入收藏 | 设为首页 | 会员中心 | 我要投稿 核心网 (https://www.hxwgxz.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 建站 > 正文

如何选择正确的Node框架:Next, Nuxt, Nest?

发布时间:2019-05-08 07:59:17 所属栏目:建站 来源:一二三
导读:简介 在上一篇文章中,我探讨了三种最流行的Node框架:Express、Koa和Hapi的区别、优点和缺点。在这篇文章中,我们将研究另外三种非常流行的框架之间的区别:Next、Nuxt和Nest。这三个框架都是服务器端渲染,它们分别与React、Vue和Angular(三个目前最流行的

为了快速入门,Nuxt.js团队创建了脚手架工具 create-nuxt-app     

  1. // 确保安装了npx(npx在NPM版本5.2.0默认安装了)  
  2.         npx create-nuxt-app <项目名> 

它会让你进行一些选择:在集成的服务器端框架如:Express、Koa、Hapi、Feathers、Micro、Adonis (WIP);选择您喜欢的UI框架:Bootstrap、Vuetify、Bulma、Buefy等等

  •  Hello World

Nuxt依据 pages 目录结构自动生成 vue-router 模块的路由配置     

  1. // ./pages/index.vue  
  2.         <template>  
  3.           <div>  
  4.             <h1>Hello world!</h1>  
  5.             <NLink to="/about">  
  6.               About Page  
  7.             </NLink>  
  8.           </div>  
  9.         </template> 
  •  好处
    •   它的主要范围是UI渲染,同时抽象出客户端/服务器分布
    •   静态渲染、前后分离
    •   自动代码分层
    •   服务、模板皆可配置
    •   项目结构清晰
    •   组件与页面无缝切换
    •   默认支持得ES6 / ES7
    •   支持开发热更新
    •   路由级别的异步数据获取
    •   支持静态文件服务
    •   样式预处:Sass,Less,Stylus等
  •  缺点
    •   周边资源较少
    •   开发复杂的组件可能会很麻烦
    •   自定义配置显得很麻烦
    •   很多具有副作用的数据操作this.items[key]=value
    •   高流量可能会给服务器带来压力
    •   只能在某些挂钩中查询和操作DOM
  •     性能

Nuxt中的基本HelloWorld应用。每秒能处理190.05个请求。平均一个请求时间为52.619毫秒。在此度量标准上,Nuxt与其他两个框架相比表现最差

  Lighthouse测试报告中Preformance、Accessibility、SEO三项中得分最高

  •  社区活跃
    •   贡献者数量:191
    •   Pull Requests:1,385

Nest

Nest是一个渐进式Node框架,深受Angular的启发。用于构建高效,可扩展的Node.服务器端应用程序的框架。使用TypeScript构建,保留与纯JS的兼容性,集OOP(面向对象编程),FP(函数式编程),FRP(响应式编程)一身。服务引擎盖默认使用Express但也提供与各种其他库的兼容性,例如Fastify,允许轻松使用可用的无数第三方插件

  •     安装

nest提供cli使用该cli命令安装Nest并创建新项目     

  1. npm i @nestjs/cli  
  2.        nest new project-name 

或者,使用Git安装TypeScript启动项目:   

  1. git clone https://github.com/nestjs/typescript-starter.git project  
  2.       cd project  
  3.       npm install  
  4.       npm run start 
  •     Hello World

使用该npm cli命令创建新项目后,src目录下会出现几个核心文件,main.ts是我们的入口     

  1. // 创建一个服务然后监听3000端口  
  2.        import { NestFactory } from '@nestjs/core';  
  3.        import { ApplicationModule } from './app.module';      
  4.         async function bootstrap() {  
  5.          const app = await NestFactory.create(ApplicationModule);  
  6.          await app.listen(3000);  
  7.        }  
  8.        bootstrap();       
  9.         // 启动起来   
  10.        npm start 
  •  好处
    •   作为基于TypeScript的Web框架,可以进行严格的类型定义
    •   自动生成Swagger文档
    •   Nest中的文件夹结构主要基于Angular
    •   基于模块的框架,代码可复用
    •   项目结构清晰,只需要关注业务无需关注架构
    •   使用最新版本的TypeScript,意味着JS的型特性基本都可用
    •   为开发人员提供更少的上下文切换。从Angular代码到Nest的过渡相对容易
    •   与Angular类似,Nest也有一个不错的命令行工具
  •  缺点
    •   缺乏文档。该框架与其他框架有很好的集成,但文档很少
    •   背后没有大型企业的支持力
    •   总体而言,与其他框架相比,Nest的社区规模较小
  •     性能

(编辑:核心网)

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

热点阅读