Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >在浏览器中本地运行Node.js

在浏览器中本地运行Node.js

作者头像
Peter谭金杰
发布于 2022-03-22 06:41:25
发布于 2022-03-22 06:41:25
4.2K0
举报
一切要从收到一封邮件开始

大早上,我收到一封邮件,StackBlitz说正在与Next.js和Google的团队合作开发一项新技术

  • 几年前,StackBlitz意识到网络正朝着关键的拐点发展。WebAssembly和新功能API的出现使编写基于WebAssembly的操作系统似乎变得可能,该操作系统功能强大到可以完全在浏览器中运行Node.js。我们设想了一个比本地环境更快,更安全和一致的高级开发环境,以实现无缝的代码协作而无需设置本地环境
技术名为:WebContainers
  • WebContainers允许您创建完整的Node.js环境,这些环境可以在毫秒内启动,并且一键即可立即联机和链接共享。该环境具有VS Code强大的编辑经验,完整的终端,npm等功能。它还可以完全在您的浏览器中运行,从而带来一些关键的好处:
  • 比本地环境快。与yarn / npm相比,构建速度最多可提高20%,而卷装安装速度则可快5倍以上。
  • 浏览器中的Node.js调试。与Chrome DevTools的无缝集成可实现本机后端调试,无需安装或扩展。
  • 默认为安全。所有代码执行都发生在浏览器的安全沙箱中,而不是在远程VM或本地二进制文件上。
  • 同样,这些环境不在远程服务器上运行。而是,每个环境都完全包含在您的Web浏览器中。没错:Node.js运行时本身第一次在浏览器中本机运行。 从现在开始,WebContainers现在处于公开测试阶段。当前支持包括Next.js,GraphQL和Vanilla Node.js,我们正在与其他开源项目合作以扩展支持
为什么会有WebContainers
安全
  • StackBlitz通过利用浏览器中数十年来的速度和安全性创新来解决这些问题。StackBlitz中的所有计算都会在浏览器安全沙箱中立即发生,并且无法爆发到您的本地计算机上。该模型还释放了一些关键的开发和调试优势(在几秒钟内便会提供更多优势)。
释放浏览器的功能
  • 使用Chrome DevTools无缝进行Node.js调试
    • 事实证明,浏览器确实非常擅长调试Javascript。我知道,这令人震惊;)通过在浏览器中执行Node.js,与Chrome DevTools的集成即开即用。无需安装,无需扩展,仅在浏览器中进行本机后端调试即可
运行服务器,在你的浏览器中
  • 实际上。WebContainers包含一个虚拟的TCP网络堆栈,该网络堆栈已映射到浏览器的ServiceWorker API,使您可以即时创建实时Node.js服务器,即使您处于脱机状态也可以继续工作。因为它完全在浏览器安全沙箱中运行,所以服务器响应的延迟比本地主机(!)少,并且可以保护您的Web服务器免受本地主机抓取攻击
  • 毫秒级启动时间
  • 每个页面加载时都有一个全新的环境
    • 再见rm -rf node_modules!WebContainer的内置npm客户端是如此之快,以至于它在每次页面加载时都运行全新的安装,从而确保您每次都能获得一个干净的环境。如果您的环境确实出现问题,则可以像处理其他任何Web应用程序一样恢复到干净的状态:单击“刷新”按钮
  • 借助StackBlitz,无论您是在火车上,在飞机上还是在雨中后座时,都可以在没有互联网连接的情况下继续工作

使用StackBlitz新颖的计算模型,100%的代码执行发生在浏览器安全沙箱中。与本地相比,这导致了更快,更少限制的开发环境,同时又提供了更高的安全性,这是非常罕见的组合。

  • 实际上,默认的安全状况是如此稳固,以至于我们的嵌入式软件包管理器是第一个可公开获得的工具,可以解决五年多来未解决的Sam Saccone长期未解决的npm漏洞
  • 同样,这些环境不在远程服务器上运行。而是,每个环境都完全包含在您的Web浏览器中。没错:Node.js运行时本身第一次在浏览器中本机运行 写在最后
  • WebAssembly强大到足以编写操作系统,但是这次WebContainers把这个技术使用方向放在了Node.js上,我觉得是有划时代意义的
  • 在我看来,这个技术在未来最主要应用方向是,可以使世界范围内的软件在以前无法运行的地方运行,以后电脑上可能只需要安装一个谷歌浏览器
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2021-05-23,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
一看就懂的快速排序
快速排序属于交换排序,主要步骤是使用基准元素进行比较,把小于基准元素的移动到一边,大于基准元素的移动到另一边。从而把数组分成两部分,然后再从这两部分中选取出基准元素,重复上面的步骤。过程如下:
Johnson木木
2019/11/24
4440
快速排序-归并排序-堆排序
数组取标pivot,将小的元素放在pivot左边,大元素在右侧,然后依次对右边的子数组继续快排,以达到整个序列有序
Java架构师必看
2021/05/14
3620
快速排序
快速排序是最效率极高的一种排序方法,正因为它效率高,所以也受到了面试官的青睐,同样成了程序员必会的内容。O(∩_∩)O哈哈~
kai666666
2020/10/17
3410
快速排序 : 调优:3亿数据40秒,2亿数据30秒,1亿数据15秒
上一章我们讲到并归排序,并归排序的重要思想是对大问题进行分解,解决分解出来的小问题达到解决大问题的效果
执生
2020/09/27
5390
快速排序算法(quick sort)——较优的算法
快速排序的最坏运行情况是 O(n²),比如说顺序数列的快排。但它的平摊期望时间是 O(nlogn),且 O(nlogn) 记号中隐含的常数因子很小,比复杂度稳定等于 O(nlogn) 的归并排序要小很多。所以,对绝大多数顺序性较弱的随机数列而言,快速排序总是优于归并排序。
一条晒干的咸鱼
2024/11/19
2230
快速排序算法(quick sort)——较优的算法
Qz学算法-数据结构篇(排序算法--快速、归并)
快速排序(Quicksort)是对冒泡排序的一种改进。基本思想是:通过一趟排序将要排序的数据分割成独立的两部分,其中一部分的所有数据都比另外一部分的所有数据都要小,然后再按此方法对这两部分数据分别进行快速排序,整个排序过程可以递归进行,以此达到整个数据变成有序序列
浅辄
2023/06/19
2410
【Java数据结构和算法】012-排序:快速排序*、归并排序*、基数排序(桶排序)、堆排序、排序算法比较
通过一趟排序将要排序的数据分割成独立的两部分,其中一部分的所有数据都比另外一部分的所有数据都要小,然后再按此方法对这两部分数据分别进行快速排序,整个排序过程可以递归进行,以此达到整个数据变成有序序列;
訾博ZiBo
2025/01/06
1330
【Java数据结构和算法】012-排序:快速排序*、归并排序*、基数排序(桶排序)、堆排序、排序算法比较
快速排序填坑口诀
快速排序由于排序效率在同为O(N*logN)的几种排序方法中效率较高,因此经常被采用,再加上快速排序思想----分治法也确实实用,因此在很多笔试面试中出现的几率很高。
KevinYan
2019/10/13
8470
【数据结构与算法】:选择排序与快速排序
在这里我们可以遍历一次同时找到最小元素和最大元素,对应放到相应的位置, 基本代码如下:
用户11029103
2024/03/19
5070
【数据结构与算法】:选择排序与快速排序
【排序算法】 快速排序(快排)!图解+实现详解!
英国计算机科学家Tony Hoare在1960年为了解决计算机上的排序问题,提出了快速排序的算法,最初是为了在英国的英尔兰电子公司(ELLIOTT Brothers)的快速硬件上实现高效的排序算法。
屿小夏
2024/01/22
40.4K0
【排序算法】 快速排序(快排)!图解+实现详解!
【算法】快速排序及优化
其实,这就是快排的partition过程,通过三个指针,index,less,more进行的,初始less=左边界-1,more=右边界+1,说明一开始不存在less域和more域: 1)若arr[index] < num,less域增加,即less++,然后index和less位置的数交换后,index++继续指向下一个数 2)若arr[index] > num,more域增加,即more++,然后index和more的数交换后,继续判断交换后arr[index]和num的关系 3)若arr[index] == num,index++继续指向下一个数,不坐任何处理 4)重复以上过程,直至index==more
MapleYe
2020/03/28
4540
【初阶数据结构与算法】八大排序算法之交换排序(冒泡排序,快速排序---hoare、挖坑法、lomuto双指针3种版本)
   冒泡排序的命名是因为它的排序操作就像水平面在冒泡一样,当我们讲完冒泡排序就知道为什么这么说了,接着我们来一起学习一下冒泡排序    冒泡排序的基本思路很简单,就是模拟冒泡的过程,如果我们要排升序,就把当前待排序的元素中,把最大的那个元素看成泡,数组的最后看做水平面,我们通过一趟冒泡排序就要将泡 “冒” 出来,其实就是让最大的那个元素放在数组的最后    如果我们要排降序,就把最小的那个元素看做泡,数组的最后看做水平面,把它 “冒” 出来,也就是把最小的那个元素放在数组的最后,无论是排升序还是排降序,都是不断地把这些特殊的泡泡冒出水面    那么我们如何将泡泡冒出水面呢?其实就是如何把最大或最小的那个元素放到数组最后,在直接选择排序中的策略是,遍历当前的有效元素,找出最大的值的下标,然后和数组有效元素的最后一个元素交换    它的核心思想在于“选择”,而冒泡排序属于交换排序的一种,它的实现是基于元素之间的交换的,具体方法就是:    遍历当前有效的元素,比较当前元素和后一个元素的大小,将大的元素往后挪动,这样遍历完所有有效元素后,最大的那个元素自然就在数组中的最后了,我们画图理解理解,如下:
TANGLONG
2024/12/21
4380
【初阶数据结构与算法】八大排序算法之交换排序(冒泡排序,快速排序---hoare、挖坑法、lomuto双指针3种版本)
阮一峰快速排序
本打算学一波快速排序,查了查资料,吓一大跳,说阮一峰大神的快排是不对的,以此开始了一大波大神针对这个问题的各种观点。感兴趣的可以看看知乎这篇帖子:
wade
2020/04/24
1.2K0
深入理解——快速排序
这是快速排序递归实现的主框架,可以发现与二叉树的递归十分相似,在递归时可以想想二叉树的递归规则。
P_M_P
2024/01/18
2500
深入理解——快速排序
快速排序(Quicksort)的Javascript实现
日本程序员norahiko,写了一个排序算法的动画演示,非常有趣。 这个周末,我就用它当做教材,好好学习了一下各种排序算法。 排序算法(Sorting algorithm)是计算机科学最古老、最基本的
ruanyf
2018/04/12
8570
快速排序(Quicksort)的Javascript实现
十大排序算法最详细讲解
冒泡排序无疑是最为出名的排序算法之一,从序列的一端开始往另一端冒泡(你可以从左往右冒泡,也可以从右往左冒泡,看心情),依次比较相邻的两个数的大小(到底是比大还是比小也看你心情)。
说故事的五公子
2020/07/10
6070
十大排序算法最详细讲解
常用的排序算法之快速排序(Quick Sort)
快速排序是由英国计算机科学家托尼·霍尔(Tony Hoare)在1960年提出的一种排序算法。它的基本思想是分治法(Divide and Conquer)的应用。
jack.yang
2025/04/05
2190
手敲一遍数据结构和排序算法 Java
​ 不管元素在什么情况下都要做这些步骤,所以花销的时间是不变的,所以该算法的最优时间复杂度和最差时间复杂度及平均时间复杂度都是一样的为:O( nlogn )
小锋学长生活大爆炸
2022/03/29
4760
手敲一遍数据结构和排序算法 Java
排序算法——Golang实现(一)
如果要排序数据序列中下标从 low 到 high 之间的一组数据,我们选择 low 到 high 之间的任意一个数据作为 pivot(分区点),假设对应下标是 pivotIndex。
传说之下的花儿
2023/10/09
3310
排序算法——Golang实现(一)
漫画:什么是快速排序?(完整版)
同冒泡排序一样,快速排序也属于交换排序,通过元素之间的比较和交换位置来达到排序的目的。
小灰
2022/07/05
3450
漫画:什么是快速排序?(完整版)
推荐阅读
相关推荐
一看就懂的快速排序
更多 >
交个朋友
加入架构与运维工作实战群
高并发系统设计 运维自动化实践
加入前端工作实战群
前端工程化实践 组件库开发经验分享
加入架构与运维趋势交流群
技术趋势前瞻 架构演进方向
换一批
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档