Monaco Editor

Monaco 是一个代码编辑器，大名鼎鼎的 VS Code 便是基于 Monaco 实现。

背景

在公司里做了一个 PC 端应用，应用名 RPCUI，开发语言 Objective-C。可以在该应用中发起 RPC 调用，调试接口。

RPCUI 实现了一个 JSON 编辑器，用于呈现 RPC 的输入和输出数据。这个编辑器实现原理很简单：使用 WKWebView 加载 Monaco，然后再将 webView 贴到原生视图上。

本文介绍 Monaco 使用的一些实用功能。

Read More

置身事内-读书笔记

封面

置身事内-中国政府与经济发展

目录与前言

上篇 微观机制
第一章 地方政府的权力与事务
第二章 财税与政府行为
第三章 政府投融资与债务
第四章 工业化中的政府角色

下篇 宏观现象
第五章 城市化与不平衡
第六章 债务与风险
第七章 国内国际失衡
第八章 总结：政府与经济发展

本书以我国地方政府投融资为主线。

发展经济是政府的核心任务，而招商引资需要调动各种资源和手段，所涉具体事务既深且广。了解招商引资，是理解地方政府深度融入经济发展过程的起点。

Read More

React 实现原理之异步渲染

React 从 v16 开始逐步引入异步可中断的渲染架构。

React 渲染过程可以分为三个阶段 Scheduling、Reconciliation、Commit。

Scheduling 阶段执行任务调度，Reconciliation 阶段更新虚拟 DOM，本文主要讲述这两个阶段。(Commit 阶段更新 UI。e.g. 在浏览器环境中更新 DOM、在移动端环境中更新 Native 视图。)

本文基于目前最新的 React v18.2.0 代码。

Read More

理解 JSX

JSX 简介

JSX 的介绍参考 React 官方文档 JSX 简介。

JSX 编译后会转为名为 React.createElement 的函数调用。

React.createElement 函数签名

1
function createElement(type: any, props?: any, ...children: ReactNode[])

createElement 函数接收三个参数。

第一个参数为节点类型 type。比如，若在 JSX 中是 div，则 type 为 “div” 字符串；若在 JSX 中是自定义函数组件 CustomComponent，则 type 为 CustomComponent 函数。

第二个参数为节点属性 props。比如，若 JSX 中声明 <div className="wrap">，则 props 为 { className: "wrap" }；若 JSX 中声明 <div>，则 props 为 null。

第三个参数为不定参数，每个参数值对应一个当前节点的子节点。

Read More

加密通信

OSI 模型

OSI将计算机网络体系结构划分为以下七层，标有1～7，第1层在底部。

第7层 应用层

应用层（Application Layer）提供为应用软件而设计的接口，以设置与另一应用软件之间的通信。例如：HTTP、HTTPS、FTP、Telnet、SSH、SMTP、POP3等。

第6层 表现层

表现层（Presentation Layer）把数据转换为能与接收者的系统格式兼容并适合传输的格式。

Read More

2022年国庆回家

今年国庆提前请了两天假回老家，儿子终于实现了他的坐着高铁去旅行的梦想。

儿子的行程

儿子现在三岁半，越来越可爱，与亲戚朋友聚会时，无论什么时候都是焦点。这个国庆节他的行程最忙，先是坐高铁到盐城，第二天又被爷爷开车接到扬州，三天后爷爷又开车送回盐城，5号随我们坐高铁回到上海。在盐城和扬州还随着爷爷奶奶外公外婆到处走亲访友。

儿子正处于快速学习说话的阶段，大人不经意说过的话也能记住，然后不知道在什么时候说出来，让我们惊叹不已。不过大人说的一些不好的话，他也会学着说，着实让人苦恼。

Read More