FECoding

代码在线跑，知识轻松学

Python精品学习库

自行/邀约他人一键搬运博客，速成社区影响力并领取好礼

博客搬家 | 分享价值百万资源包

往期视频·干货材料·成员作品 最新动态

技术创作特训营·精选知识专栏

【玩转 EdgeOne Pages】体验 MCP Server 和 DeepSeek 模板的百变玩法

技术创作特训营 | 33 天实现自己的 AI 进化论

新邀入驻腾讯云开发者社区，福利多多！

经过持续的迭代，Rax 小程序迎来了一个大的升级，支持全新的运行时方案。站在 2020 年初这个时间点，我们想从 Rax 小程序的特点出发，进行一次全面的梳理与总结，并且在文末附上了 Rax 与当前主流的小程序开发框架的对比。本文将从 API 设计与性能、双引擎架构、优秀的多端组件协议设计和基于 webpack 的工程架构四个方向展开。

Rax，完美融合编译时与运行时的双引擎小程序框架

source map 是开发时调试代码的利器之一。现代的构建工具如 webpack 早已对 source map 有了完备的支持，对照文档就能很容易在打包时顺手生成然后在现代浏览器如 Chrome/Firefox 中使用。关于相关配置的介绍使用已经有很多文章，这里就不再赘述。本文想探究的是 source map 在编译器中的实现原理。

探究 source map 在编译过程中的生成原理

《Life of a Pixel》内容讲的是开发者编写的 web 内容（也就是通常所说的 HTML+CSS+JS 以及 image、video 等其他资源）渲染为图形并呈现到屏幕上的整个过程。我将其演讲内容分为以下三个部分，第一个是静态渲染过程，讲述一个完整的从 content 到 pixel 的渲染过程；第二个是动态更新过程，讲述浏览器如何高效更新页面内容。

《Life of a Pixel》——浏览器渲染流程概要

流式渲染技术，不同于传统意义上前端领域的服务端渲染（即 SSR），指的是云端性能强劲的机器进行画面渲染，将渲染完成的数据传送至客户端，客户端只负责播放及处理和上传用户输入信号至服务端的一种技术，谷歌的云游戏平台即是使用案例之一。在开源社区也有一些相关的方案，在拜读了 Parsec 公司的这篇博文——A Look at Game Streaming Tech in the Browser后，对整个技术体系中尤其是客户端（此处即浏览器）方面可能遇到的难点有了一个初步的认识，以下是一些相关的记录。

基于浏览器客户端的流式渲染技术难点一览

在读完 Muut 上 Frameworkless JavaScript 这篇博文后，我遇上了 Riot，请一定先阅读该博文！Muut 的程序员拿出实际行动编写了 Riot，一个 类似React 的用来构建响应式UI组件的微型库。

[译]使用 Riot，ES6 和 Webpack 构建应用

Composition Event，中文译为复合事件，是 DOM 3 级事件中新添加的一类事件类型，用于处理 IME 的输入序列。IME（Input Method Editor，输入法编辑器）可以让用户输入在物理键盘上找不到的字符。复合事件就是针对检测和处理这种输入而设计的。也因为以上所述原因，复合事件很少为通常使用拉丁系语言输入的开发者所知（因为拉丁字母都能通过物理键盘输入）。当然，即使是使用非拉丁系语言比如中文作为输入的开发者，也不见得知道复合事件，因为开发中用到该种事件类型的情况比较少见。

浅谈 Composition Event

相信很多开发者都会遇到在自己的电脑上使用不止一个 git 帐号的情况。一个一般是自己的 github 帐号，另一个则是公司的 git 帐号，比如 gitlab、bitbucket 等。如果采用 https 方式通信，那么 git 帐号间不会有冲突，但你在每次 pull、push 的时候都要输入帐号密码，十分繁琐。而且当代码库达到十分庞大的规模时，如果仍然采用 https 方式，在 git pull 时可能出现超时不响应的情况，此时只能采用 ssh 方式。ssh 在配置完 ssh key 后使用起来很方便，但是 git 帐号间可能出现冲突，这时候该如何解决呢？

多 git 账号配置解决方案


 env : process.env.BABEL_ENV or process.env.NODE_env
 

Babel 6 特性总结

Babel 的 loose 模式将 ES6 代码转译成 ES5 代码，loose 模式是不太忠实于 ES6 语义的。这篇文章解释了它是怎么工作的以及它的优点与缺点（剧透：通常是不推荐的）。

深入 Babel 6 loose 模式

本文档描述了一种超文本传输协议（HTTP）的内容编码，其可用于描述包含有效负载的辅助资源的位置。

[译][草案] HTTP “带外”内容编码

假设我们想给一个容器设置一层白色背景和一道半透明白色边框，body 的背景会从它的半透明边框透上来。我们最开始的尝试可能是这样的：

《CSS揭秘》读书总结：背景与边框

ES5 及之前时代的 JavaScript 中 this 的绑定机制是让很多开发者头疼不已的事情。this 的绑定变化多端，让笔者也吃了不少亏。本文根据《你不知道的 JavaScript》上卷中的内容总结了 this 的四条绑定规则，在此记录，以防遗忘。

JavaScript 中 this 的四条绑定规则

ES6 借鉴了其他编程语言的特性，为 JavaScript 带来了 for…of 循环语法，用于遍历数组等数据结构。当然，由于是 ES6 的特性，我们使用 for…of 的时候，依然要借助 Babel 进行转码。我们来看看 Babel 是如何处理 for…of 代码的。

由 for...of 深入看 Babel 转码的局限

最近在开发一个 JSSDK 的时候有一个需求：为了检测当前环境中是否已经加载过该脚本，需要在脚本开始运行时加入一层判断，如果检测到已存在该脚本导出的变量，则终止脚本的后续运行，否则再执行后续逻辑。 那么便碰上了本文标题的问题：如何终止 JS 程序的运行？

漫谈如何终止 JS 程序的运行

co 是著名的 TJ 于 2013 年推出的一个利用 ES6 的 Generator 函数来解决异步操作的开源项目，也是后来 JavaScript 异步操作的终极解决方案—— async/await 的先驱。时至今日，co 版本号已经来到了 4.x，不过其代码仍然只有寥寥数百行，十分适合阅读与学习。下面我们就来看一下 co 是如何对异步操作进行处理的。

co 源码精读

自定义事件，就是有别于有别于带有浏览器特定行为的事件（类似 click, mouseover, submit, keydown 等事件），事件名称可以随意定义，可以通过特定的方法进行添加，触发以及删除。

JavaScript 自定义事件的实现

由于一直无法通过网上搜索的方法快速在终端启动 MySQL，只能在设置里通过点击按钮开启（MySQL 的下载安装均根据官网提示的步骤进行），如下图所示：
 

macOS 终端下启动 MySQL

Node-Web-Console（以下简称 NWC）是一个基于 Node.js 开发的网页版 shell 应用，其想法来源于实验室 SDN 相关项目的一次组会讨论，需求大致是在网页中嵌入 shell，然后实现从前端页面展示的网络拓扑中直接进入虚拟机节点进行简单的管理。具体实现上则参考了 web-console，一个基于世界上最好的语言开发的项目。

Node-Web-Console——基于 Node.js 的网页版 shell

Hyperapp 是最近热度颇高的一款迷你 JS 框架，其源码不到 400 行，压缩 gzip 后只有 1kB，却具有相当高的完成度，拿来实现简单的 web 应用也不在话下。整体实现上，Hyperapp 的思路与 React 比较类似，都是借助 Virtual DOM 来实现高效的 DOM 更新。在探究 Hyperapp 背后的实现原理之前，我们先看一下如何使用它。

迷你 JS 框架 Hyperapp 源码解析

最近在做网页版图片处理相关的项目，也算是初入了 canvas 的坑。项目需求中有一个给图片添加水印的功能。我们知道，在浏览器端实现图片添加水印功能，通常的做法就是使用 canvas 的 drawImage 方法。对于普通的合成（比如一张底图和一张 PNG 水印图片合成）来说，其大致实现原理如下：

探究 canvas 绘图中撤销（undo）功能的实现方式

33 天实现自己的 AI 进化论？发文瓜分机械键盘、耳机等万元奖池！点击参加活动：<a href="https://cloud.tencent.com/developer/article/2503022" target="_blank">https://cloud.tencent.com/developer/article/2503022</a><br/> 
 <img src="https://qcloudimg.tencent-cloud.cn/raw/01543e0407db10898a7ee9f420794432.jpg"/>

技术创作特训营有奖征文

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋 

腾讯云AI代码助手

CODING DevOps

Cloud Studio

SDK中心

API中心

命令行工具

文章&问答评论现已支持表情

全新交互，全新视觉，新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能，全面提升创作效率和体验

社区富文本编辑器全新改版！诚邀体验～ 

腾讯云开发者社区推出了FECoding专栏，为你提供了FECoding的相关文章，致力于帮助开发者快速成长与发展。

FECoding

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐