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

48 阅读2分钟

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

一、重点内容

1.前端工程化

2.Web服务端应用

3.Electron跨端桌面应用

4.Node.js运行时结构

5.编写HTTP Sereve

6.Node.js贡献代码

7.编译Node.js

8.诊断/追踪

二、Node.js与前端开发实战

1.前端工程化

image.png

  • Bundle:webpack,vite,esbuild,parcel
  • Uglify:uglifyjs
  • Transpile:bablejs,typescript
  • 其他语言加入竞争:esbuild,parcel,prisma
  • 现状:难以替代

2.Web服务端应用

  • 学习曲线平缓,开发效率较高
  • 运行效率接近常用的编译语言
  • 社区生态丰富及工具链成熟(npm,V8 inspector)
  • 与前端结合的场景会有优势(SSR)
  • 现状:竞争激烈,Node.js有自己独特的优势

3.Electron跨端桌面应用

  • 商业应用:vscode,slack,discord,zoom
  • 大型公司内的效率工具
  • 现状:大部分场景在选型时,都值得考虑

4.Node.js运行时结构

image.png

  • 异步I/O
  • 单线程
  • 跨平台

5.编写HTTP Sereve

编写HTTP Sereve-HTTP Sereve
const http =require('http')

const port = 3000

const server = http.createSever((req,res) =>{res.end('hello')
})

server.listen(port, () => {
    console.log(`server listens on: ${port}`)
})
编写HTTP Sereve-Promisify

用Promise + async await重写

技巧:将callback转换成promise

function wait(t) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve()
        }, t)
    })
}

wait(1000).then(() => { console.log('get called') })

6.Node.js贡献代码

好处:

  • 从使用者的角色逐步理解底层细节,可以解决更发复杂的问题;
  • 自我证明,有助于职业发展;
  • 解决社区问题,促进社区发展;

难点:

需要花费大量时间去做

7.编译Node.js

为什么要学习编译Node.js

  • 认知:黑盒到白盒,发生问题时能有迹可循
  • 贡献代码的第一步

8.诊断/追踪

诊断是一个低频、重要同时也相当有挑战的方向。是企业衡量自己能否依赖一门语言的重要参考。

技术咨询行业中的热门角色。

难点:

  • 需要了解Node.js底层,需要了解操作系统以及各种工具
  • 需要经验