这是我参与「第五届青训营」伴学笔记创作活动的第 8 天

Node.js与前端开发实践

Node.js的应用场景

首先要提到的是前端工程化的场景。

早期ajax, jquery比较流行的时候，我们直接在页面中引入需要的lib 即可。后续随着模块化、transpile 逐渐成熟、需求逐渐增多，对后端能力的需求也逐渐强烈。反过来说，也正是Node.js赋予了js开发者在浏览器外运行代码的能力，加速催生了这些项目的出现。
使用Node.,js开发Web服务端应用，也就是后端服务。
Electron跨端桌面应用，这里不只是指electron，还包括nw.js；这个场景在较大的企业里面非常常见。

Node.js运行时结构

V8: JavaScript Runtime, 诊断调试工具 (inspector)
libuv: eventloop (事件循环，syscall(系统调用)

举例:用node-fetch 发起请求时.…

特点：

异步I/O

当Node.js 执行I/O操作时，会在响应返回后恢复操作，而不是阻塞线程并占用额外内存等待
单线程
- JS单线程
  
  实际：JS线程+UV线程池+V8任务线程池+V8 Inspector线程
- 优点：不用考虑多线程状态同步问题，也就不需要锁；同时还能比较高效地利用系统资源；
- 缺点：阳塞会产生更多负面影响
  
  解决办法：多进程或多线程
跨平台
- 跨平台(大部分功能、api)
- Node.js 跨平台+JS 无需编译环境(+ Web跨平台＋诊断工具跨平台)
  
  =开发成本低(大部分场景无需担心跨平台问题)，整体学习成本低

编写Http Server

1.引入required模块

使用 require 指令来载入 http 模块，并将实例化的 HTTP 赋值给变量 http，例子：

var http = require("http");

2.创建服务器

使用 http.createServer() 方法创建服务器，并使用 listen 方法绑定 8888 端口。函数通过 request, response 参数来接收和响应数据。

实例如下，在你项目的根目录下创建一个叫 server.js 的文件，并写入以下代码：

var http = require('http');

http.createServer(function (request, response) {

    // 发送 HTTP 头部 
    // HTTP 状态值: 200 : OK
    // 内容类型: text/plain
    response.writeHead(200, {'Content-Type': 'text/plain'});

    // 发送响应数据 "Hello World"
    response.end('Hello World\n');
}).listen(8888);

// 终端打印如下信息
console.log('Server running at http://127.0.0.1:8888/');

使用node命令执行以上代码：

node server.js
Server running at http://127.0.0.1:8888/

分析Node.js 的 HTTP 服务器：

第一行请求（require）Node.js 自带的 http 模块，并且把它赋值给 http 变量。
接下来我们调用 http 模块提供的函数： createServer 。这个函数会返回一个对象，这个对象有一个叫做 listen 的方法，这个方法有一个数值参数，指定这个 HTTP 服务器监听的端口号。

React SSR

Q：SSR (server side rendering)有什么特点?

A：

相比传统 HTML 模版引擎：避免重复编写代码
相比 SPA (single page application)：首屏渲染更快,SEO友好
缺点：

通常qps 较低，前端代码编写时需要考虑服务端渲染情况

Q：SSR的难点？

A：

需要处理打包代码
需要思考前端代码在服务端运行时的逻辑
移除对服务端无意义的副作用,或重置环境

Debug

V8 Inspector

开箱即用、特性丰富强大、与前端开发一致、跨平台

node --inspect
open http://localhost:9229/json

场景：

查看console.log内容
breakpoint
高CPU、死循环：cpuprofile
高内存占用:heapsnapshot
性能分析

Node.js与前端开发实践 | 青训营笔记