背景

对现有开源项目的代码进行翻译(文件名/命名/注释) · Issue #107 · program-in-chinese/overview

简单地说, 通过翻译源码, 提高项目代码可读性(对于母语为中文的开发者). 并在此过程中小结源码翻译辅助工具的需求.

源码库分支: program-in-chinese/vue

源码分析参考文档: Vue.js 技术揭秘 | Vue.js 技术揭秘

14个重命名的文件列表

core/vdom/helpers/normalize-children->规格化子节点
core/vdom/create-element->创建元素
core/vdom/vnode->虚拟节点
platforms/web/entry-runtime-with-compiler->入口-运行时-带编译器
platforms/web/runtime/index->索引
core/index->索引
core/instance/index->索引
core/instance/inject->注入
core/instance/lifecycle->生命周期
core/instance/proxy->代理
core/instance/events->事件
core/instance/render->渲染
core/instance/state->状态
core/instance/init->初始化

大概翻译过程

  1. fork原代码库, clone到本地, 默认分支为dev. 在此基础上新建分支"translate-source". 运行npm test通过所有测试.
  2. 逐章阅读参考文档, 将涉及的文件重命名. 在此之前运行npm run dev, 可以监控文件修改并自动编译, 根据编译错误修改对应文件
  3. 在刚开始时做了太多修改, 运行npm test时发现问题难以排错, 因此现在采取每个文件重命名后第二步构建成功后就运行npm test, 通过后就commit. 奇怪的是之前的问题再没出现.

源码库基本统计

src目录中236个文件, 16893行JavaScript代码

参考: How do you list number of lines of every file in a directory in human readable format.

源码根目录下运行命令:

$ wc -l `find src -type f`

小结

估计30个小时重命名所有src下文件(包括文档初步学习时间). 下一步尝试重命名源码中的中文命名, 已预估所有源码翻译时间, 相信由于对源码和基本术语了解更多之后, 翻译方法有改进空间, 速度也会加快.

源码翻译是一种简单的重构, 对测试用例范围覆盖要求较高. 唯一碰到不稳定的测试用例已有报告: tests fail from clean environment · Issue #7130 · vuejs/vue

暂时没有发现难以解决的技术问题. 不过命名风格还在小结中, 比如带"-"的文件名, 有些单词构成短语, 但另一些没有. 比如"create-element", 翻译成"创建-元素"就觉得"-"是冗余的, 因此略去为"创建元素". 而"entry-runtime-with-compiler", 暂时翻为"入口-运行时-带编译器", 但也许"带编译器的运行时入口"更自然些.

2018-11-21 手工翻译Vue.js源码第一步:14个文件重命名的更多相关文章

  1. 2018-11-23 手工翻译Vue.js源码:尝试重命名标识符与文本

    续前文: 手工翻译Vue.js源码第一步:14个文件重命名 对core/instance/索引中的变量, 方法进行重命名如下(题图): import { 混入初始化 } from './初始化' im ...

  2. vue.js源码精析

    MVVM大比拼之vue.js源码精析 VUE 源码分析 简介 Vue 是 MVVM 框架中的新贵,如果我没记错的话作者应该毕业不久,现在在google.vue 如作者自己所说,在api设计上受到了很多 ...

  3. 从template到DOM(Vue.js源码角度看内部运行机制)

    写在前面 这篇文章算是对最近写的一系列Vue.js源码的文章(https://github.com/answershuto/learnVue)的总结吧,在阅读源码的过程中也确实受益匪浅,希望自己的这些 ...

  4. Vue.js源码——事件机制

    写在前面 因为对Vue.js很感兴趣,而且平时工作的技术栈也是Vue.js,这几个月花了些时间研究学习了一下Vue.js源码,并做了总结与输出.文章的原地址:https://github.com/an ...

  5. 从Vue.js源码角度再看数据绑定

    写在前面 因为对Vue.js很感兴趣,而且平时工作的技术栈也是Vue.js,这几个月花了些时间研究学习了一下Vue.js源码,并做了总结与输出.文章的原地址:https://github.com/an ...

  6. vue源码分析—Vue.js 源码构建

    Vue.js 源码是基于 Rollup 构建的,它的构建相关配置都在 scripts 目录下.(Rollup 中文网和英文网) 构建脚本 通常一个基于 NPM 托管的项目都会有一个 package.j ...

  7. 【转】从Vue.js源码看异步更新DOM策略及nextTick

    在使用vue.js的时候,有时候因为一些特定的业务场景,不得不去操作DOM,比如这样: <template> <div> <div ref="test" ...

  8. vue.js源码学习分享(一)

    今天看了vue.js源码  发现非常不错,想一边看一遍写博客和大家分享 /** * Convert a value to a string that is actually rendered. *转换 ...

  9. Vue.js 源码分析(一) 代码结构

    关于Vue vue是一个兴起的前端js库,是一个精简的MVVM.MVVM模式是由经典的软件架构MVC衍生来的,当View(视图层)变化时,会自动更新到ViewModel(视图模型),反之亦然,View ...

随机推荐

  1. 边学边做,简单的 GraphQL 实例

    项目中有功能要调用 API,对方 API 用的是 GraphQL 实现,就简单学了下,感叹技术进步真快,Facebook 发明的这玩意儿咋这么牛逼,使前端开发人员变得主动起来,想要什么接口.返回什么结 ...

  2. 页面怎么引用外部css+js代码

    外部css样式:把css样式写到一个文件内,方便使用,减少冗余. 如果使用的是外部css样式,页面怎么引用: 使用 <link rel="stylesheet" type=& ...

  3. 在ubuntu下搜索文件的几种方式

    1.whereis 文件名 特点:快速,但是是模糊查找,例如 找 #whereis mysql 它会把mysql,mysql.ini,mysql.*所在的目录都找出来.我一般的查找都用这条命令. 2. ...

  4. 使用 WRK 压力测试工具对 ASP.NET Core 的接口进行压力测试

    0. 简要介绍 WRK 是一款轻量且易用的 HTTP 压力测试工具,通过该工具我们可以方便地对我们所开发的 WebAPI 项目进行压力测试,并且针对测试的情况返回结果. PS:Wrk 并不能针对测试的 ...

  5. oracle批量去掉字段值空格

    --查询验证 select ltrim(col1) from t1; --去掉字段值左边空格update t1 set col1=ltrim(col1); --去掉字段值右边空格update t1 s ...

  6. mycat 从入门到放弃 (转)

    http://blog.csdn.net/u013235478/article/details/53178657   1.非分片字段查询 Mycat中的路由结果是通过分片字段和分片方法来确定的.例如下 ...

  7. Ansible--Ad-Hoc

    什么是Ad-Hoc (这其实是一个概念性的名字,是相对于写Ansible playbook来说的.类似于在命令行敲入shell命令和写shell scripts两者之间的关系)... 如果我们敲入一些 ...

  8. RPC框架--missian框架

    Missian简介 注:(创始者不明,应用于sina下面的公司(爱问)) Missian是一个构建于Mina和Hessian基础上的异步RPC框架,能够兼容HTTP协议和TCP协议,能和Hessian ...

  9. Ajax 上传input type file 文件

    Html: <div class="attach-img"> <label><input type="file" id=" ...

  10. μC/OS-II 任务的同步与通信 --- 信号量

    任务间通信 系统中的多个任务在运行时,经常需要互相无冲突地访问同一个共享资源,或者需要互相支持和依赖,甚至有时还要互相加以必要的限制和制约,才保证任务的顺利运行.因此,操作系统必须具有对任务的运行进行 ...