- 博客(813)
- 资源 (9)
- 收藏
- 关注
RSS订阅
原创 快速创建自己的第一个 Typescript 项目
1.基于脚手架项目创建你的项目git clone <https://github.com/alexjoverm/typescript-library-starter.git> ${yourProjectName}cd ${yourProjectName}2.安装依赖npm install3.启动开发指令npm run start4.在实例网页中引入构建的产物<!DOCTYPE html><html lang="en">&
2021-01-17 10:31:21
2874
9
原创 AST 入门必知必会
1. AST简介AST ( Abstract syntax tree ) 是编译原理中的一个概念，即源代码语法结构的一种抽象表示。它以树的形式表现编程语言的语法结构，树上的每个节点都表示源代码中的一种结构。 例如这样的一段 js 代码，可以表示为下面的结构：function abs(number) { if (number >= 0) return number else return -number}有了 AST，我们面对的就不再是一坨各种符号混杂空格...
2021-01-13 06:54:07
4017
原创 详解大型前端项目知识点
目标解决实际问题 成本与产出（效率） 可度量，可定义 ，数据驱动 快速可复制，降低边际成本内容：前端基础架构 项目管理 代码管理 版本管理 CI/CD 缺陷管理 外包管理 开发环境 预发布环境 测试环境 本地开发环境 公有云、私有云环境 规范 代码风格 性能，可用性，可访问性 技术文档 培训分享 统一脚手架 前后端分离 软件安全 Mock服务 BFF GraphQ
2021-01-12 08:36:49
2809
4
原创 一行代码实现网站移动化的原理与实现
阅读时间10分钟前言在2013年，智能手机才刚刚开始进入千元机时代，手机硬件和手机 App 开发成本远远高于2020年现在的市场平均价，并且企业网站移动化还是一个新概念。企业和政府开始重视门户网站在移动端浏览器的体验，例如中国政府网，联想，微软，w3c，csdn, 探路者等等，他们在寻找企业网站移动化解决方案的过程中，在经过预算，技术，产品体验以及服务质量的综合对比，最后选择云适配 （Allmobilize ）方案，而这个方案的特点是在原有的 pc 前端工程中引入"一行代码实现网站移动化"，这行
2021-01-08 12:01:53
3699
13
原创 JavaScript的DOM操作(节点操作)
创建节点createElement()var node = document.createElement(“div”);没什么可说的，创建一个元素节点，但注意，这个节点不会被自动添加到文档（document）里。2、创建文本节点createTextNode()var value = document.createTextNode(“text”);创建一个文本节点，常
2013-01-11 08:54:04
16632
1
原创 不同类型的测试
例如，它可以在执行大量请求时观察响应时间，也可以查看系统在处理大量数据时的行为。这些类型的测试的运行成本更高，因为它们需要应用的多个部分才能启动并运行。但是，他们也可以更进一步，衡量系统的性能，并在某些目标未实现时拒绝变更。建议进行一些关键的端到端测试，更多地依赖较低级别的测试类型（单元和集成测试），以便能够快速识别重大变更。单元测试的级别非常低，接近应用的源代码。冒烟测试可以在创建新版本后立即用于决定是否可以运行更昂贵的测试，或者在部署之后立即使用，以确保应用在新部署的环境中正常运行。
2022-12-28 14:51:56
643
1
原创 书摘 - 重新定义公司：谷歌是如何运营的
比如 ：“我们的使命 ，是通过企业成员的知识 、创意及努力 ，为客户建立起坚韧无比的合作关系 ，为客户带来无可匹敌的价值 ，为股东创造可观的利益。在一家普通的公司 ，如果首席执行官看到某款产品有问题 ，便会把负责人叫来问责 ，还会召开两三次会议 ，商讨可行的解决方案 ，然后决定应该采取的行动。这份解决方案的细节烦冗且专业性强 ，但其大意就是 ：我们准备计算出 “广告相关度数值 ” ，以此来评估广告与搜索请求的相关性 ，然后根据得出的数值来决定广告是否出现 ，以及出现在页面的什么位置。
2022-09-14 09:16:56
751
原创 A Recommendation for interface-based programming
Whenimplementingcustomdatastructures,itisbesttokeepmethodssuchasforEach,findandfindLastcoherentwithJavascript'sinterfacestandards.Thisisbeneficialtothefutureupgradeofdatastructure,andalsosavesyoutimetorememberdifferentrealizationprocessesofthesameinterfac。
2022-07-20 14:27:13
673
原创 blog 初创团队的git flow演进
1-3人阶段，研发工程师都在master分支上开发，这时候项目从无到有，主架构师搭建多包管理方案，CICD流程，UI框架选型，能够每小时都有发布 4-7人阶段，研发工程师基于master分支签出特性分支，这时候项目在快速完善各个业务模块，复杂UI模块以及数据通信模块，每天都有发布 8-15人以上阶段，研发工程师在深入各个业务细节，进行频繁的产品打磨和细节优化，并且互相工作产生大量交织，通过code review by pull request + workflow把控代码质量和规范，每两天都会...
2022-07-02 11:31:44
329
原创 Linux 主要目录含义
名称的来源：/bin - 二进制文件。 /boot - 启动所需的文件。 /dev - 设备文件。 /etc - 该名称继承自最早的 Unix，当时它成为放置配置文件的地方。 /home - 保存主目录的位置。 /lib - 保存代码库的地方。 /media - 一个更现代的目录，但是安装了可移动媒体。 /mnt - 安装临时文件系统的位置。 /opt - 安装可选附加软件的位置。这与 /usr/local/ 是不同的。 /run - 保存运行时变量数据的地方。 /sbin - 超级
2022-05-30 10:19:40
344
原创 关于 assert 断言的思考
关于 assert 断言的思考断言的作用assert模块主要用于编写程序的单元测试时使用，通过断言可以尽早发现错误。一般在测试环境使用，正式环境禁用。断言的使用场景使不使用断言可以先考虑以下如果断言的条件不满足，程序是否可以正常运行，如果可以，就不用使用了，如果不可以，就可以使用。工程实践在开发的过程中，如果输入参数不符合期望，尽量在第一时间断言中断执行。比如：function getBlock(blockId: string): Block { assert(blockId, ".
2022-05-23 09:58:31
261
原创 高可用的 Saas Web 应用的经验总结
1.CDN 容灾前端资源所使用的的CDN根目录支持多个运营商，例如阿里云，七牛云，AWS，UClound等等，当部分用户CDN节点不可用，支持部分用户直接访问源站2.图像支持多域名，避开浏览器并发限制对于应用包含大量图像请求的情况，应对图片请求随机分配域名，例如a1.ycdn.com/images/ a2.ycdn.com/images/ a3.ycdn.com/images/ a4.ycdn.com/images/ a5.ycdn.com/images/3.短信发送业务安全限制
2022-05-16 21:22:19
372
原创 人才分享：招聘，没有那么难
一、梳理人才画像精准描述人才画像，完整传递给HR， 招聘团队与业务 Leader 一起提升招聘效率Docs前端专家岗位需求招聘需求 部门负责人 部门 二级部门 Leader 序列 国家/城市 目前在岗 全职 实习 张小池 研发中心 创新中心
2022-05-09 10:31:15
589
原创 使用 JavaScript 构建一个组织架构树节点
Demohttps://jsfiddle.net/me7jb6f8/Code<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" cont.
2022-05-05 09:48:07
687
原创 使用 JavaScript 实现一个消消乐游戏
示例地址https://jsfiddle.net/7fm1px5d/https://jsfiddle.net/7fm1px5d/源码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewpo.
2022-04-18 15:26:27
4001
1
原创 使用 JavaScript 模拟光标随机移动端
1.效果预览https://jsfiddle.net/0qmaytco/https://jsfiddle.net/0qmaytco/2.代码运行<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="v..
2022-04-11 09:29:48
614
原创 使用 JavaScript 搜索网页上 a 或者 d 标签的集合
function scanTagsByKeywords(node) { const set = new Set(); const isTargetNode_ = function (tagName) { return ( ["a", "d"].indexOf( tagName.charAt(0) ) > -1); }; const scanTagsByKeywor...
2022-04-04 12:11:18
919
原创 快速扩展在线文档产品特性的9个开源项目
在线文档，笔记应用近几年发展迅速，这些产品的内容创造与管理也不再仅仅局限于文字或者图片，诸如科学公式，多维表格，流程图，思维导图，电子表格等元素也逐步被引入文档内容中。而这些元素的编辑与展示在各个特定的领域都是需要长期的积累才能做到优秀可用，为了给用户快速去提供这些能力，工程师们会选择在开源项目上去做集成，而本文整理了9个开源项目揭开文档新元素背后的秘密。一、代码块https://github.com/codemirror/CodeMirror是在JavaScript 中实现的多功能文本编辑器.
2022-03-28 10:25:29
2615
原创 EasySync协同技术指南（译）
EasySync协同技术指南（译）1 文档 一个文档（document）是一个字符（char）列表或一个字符串（string） 一个文档也可以被表示为一个变更集（changeset）列表 2 变更集 一个变更集表示对文档的一个更改 一个变更集可以被应用于一个文档以产生一个新的文档 当一个文档被表示为一个变更集列表时，我们认为第一个变更集应用于空文档 []。 3 变更集表示(l→l′)[c1, c2, c3, ...]l代表文档更改前的长度，
2022-03-21 11:20:07
661
原创 Etherpad and EasySync Technical Manual
AppJet, Inc., with modifications by the Etherpad FoundationDecember 9, 2018ContentsDocuments 2 Changesets 2 Changeset representation 2 Constraints on Changesets 2 Notation 3 Composition of Changesets 3 Changeset Merging 3 Follows 4 System Ov.
2022-03-14 11:26:43
697
1
原创 常用的一些 linux 指令
压缩与解压文件## 压缩tar -czvf ${sourceName}.tar.gz ${sourceName}## 解压 example## tar -xzvf ${sourceName}.tar.gzlinux查看目录或文件大小## du -→ disk usagedu -h --max-depth=1 echuandan ## 查看文件大小linux 批量重命名rename 's/\\.jpg/.gif/' *.jpg本地nginx 配置文件 vi.
2022-03-10 10:20:28
286
原创 chrome 升级后如果配置自由设置cookie
在chrome最新版本升级后，在 Application→Cookie中自由设置cookie受到了限制，为了解决这个问题，我们可以通过访问 chrome://flags/ ，修改以下配置即可
2022-03-01 10:07:34
497
原创 计算机中的字符和字节的关系
一个字符占几个字节？在ASCII码编码方案中，一个英文字符占用一个字节，一个汉字字符占用两个字节的空间；在Unicode编码方案中，一个英文字符或一个汉字字符都占用两个字节的空间；3.在UTF-8编码方案中，一个英文字符占用一个字节，一个汉字字符占用三个字节的空间。如何理解信息通常以字符编码的方式存在于计算机中，并进行信息传播。而字符编码又有不同的方案，鉴于世界上有各种各样的语言字符信息，为了把这些符号信息编码到计算机中，并进行互相传播，字符的编码方案也层出不穷。下面对以下三种字符编码方案加
2022-02-24 19:17:19
2151
原创 32位操作系统和64位操作系统的区别
文章目录一、32位和64位的关系二、32位和64位的“位”是什么三、32位和64位操作系统的区别1、支持的系统不同2、运行数据的速度不同3、支持内存大小不同4、软件5、系统体积大小不同一、32位和64位的关系32位和64位指的是处理器 CPU，32位处理器每次最多能处理32位数据，而64位处理器每次最多处理64位数据。电脑系统，也针对32位处理器和64位处理器，分别开发了32位操作系统和64位操作系统，这样系统与处理器匹配，可以使处理器的性能发挥到最大程度。二、32位和64位的“位”是什么“位”，
2022-02-13 12:40:09
4852
原创 从典型软件来看 SaaS 的私有化部署方式
1. 部署可执行程序1.1 confluenceConfluence 是一个专业的企业知识管理与协同软件，也可以用于构建企业wiki。使用简单，但它强大的编辑和站点管理特征能够帮助团队成员之间共享信息、文档协作、集体讨论，信息推送。安装方式：安装环境依赖，例如安装 Java + MySQL 开放网关端口 启动 jar 包进程 完成配置流程1.2 JenkinsJenkins是一个开源软件项目，是基于Java开发的一种持续集成工具，用于监控持续重复的工作，旨在提供一个开放易用的软.
2022-02-07 13:27:18
1343
原创 npm init ＜initializer＞的含义
npm init <initializer>等同于npx create-<initializer>例如npm init qwik等同于npx create-qwik
2022-01-26 09:52:35
461
原创 OOP 设计模式：接口与类的封装和重写(override)以及重载(overload)
要点 子类是 extends 父类出来的 子类会集成父类所有 public 类型的实例变量和方法，但不会集成父类所有 private 类型的变量和方法 继承下来的属性可以被覆盖掉，但实例变量不能被覆盖掉 类的多态性可以从方法override 和 overload 来体现 一个类可以继承另外一个类或者实现多个接口 重写 Overr...
2022-01-18 15:47:26
903
原创 在线文档 - Google 文档的数据协议设计
在线文档 - Google 文档的数据协议设计Google 文档作为 G Suite 重要的产品套件之一，作为优秀的在线协作文档而经常被开发者所讨论，在 Google 文档背后，有着一整套优秀的相关架构设计支撑，数据协议设计就是其中之一，非常具有学习和研究价值。前言截至 2020 年，Google 旗下的 G Suite 用户量达到 20 亿，而 Google 文档作为其重要的产品套件之一，作为优秀的在线协作文档而经常被开发者所讨论，在Google文档背后，有着一整套优秀的相关架构设计支撑，数据协
2022-01-13 10:36:09
667
原创 2022年协作文档的发展趋势与技术选型
一、过去与未来二、协作文档的业务价值三、各厂商的技术选型文字编辑器表格编辑器四、扩展阅读：文字编辑器分级我们来看这个图片，这三个图形介绍了L0,L1,L2编辑器区别，可以看到L1是在L0的基础扩展而来，主要依赖浏览器的能力，对于电子文档，飞书文档，石墨文档都采用这种方案，但是对于Google Docs，腾讯文档，金山文档，为了支持对Office 文档内容的在线编辑，以及保持夸平台的一致性，而采用了L2编辑器，将排版和渲染的能力完全掌控，为了更好的让大家理解L2编辑
2022-01-04 17:11:47
538
原创 工具SaaS的标准定义：三高一低的标准
一、定义一个好的工具 SaaS标准呢？在协同办公中，人和工具是生产力关联的二要素 人包括角色和心智 工具包括功能和性能 二、构建人与工具的四象限图基于角色，心智，功能以及性能四个维度，两两对应，构建一个四象限图，最终提炼出一个文档协作工具的3高1低的标准。三、3高一低的标准一个工具 SaaS 的3高1低好的标准包括四个方面： 首先是高扩展，功能适用多角色用户 其次是高效率，流程的体验提升效能 再者是高可用，可用性高于99.99%
2021-12-28 11:35:03
676
原创 Tailwind.css 体验总结
为什么使用 Tailwind.csshtml 与 css 融为一体 强大的原子class 生产环境按需按需构建 完整的响应式布局 支持hover以及focus状态 在前端框架实现充分复用 使用@apply融入业务css 支持深色模式 通过配置易于扩展、调整和改变 支持 CSS grid 以及更多的现代选择器，例如 :focus-visible VSCode 集成代码片段提示 付费或者免费的组件库代码片段 组合 figma 使用中文站Tailwind CSS - 无需离开您的
2021-12-23 11:21:13
1077
原创 如何统计web fps变化
核心知识点requestAnimationFrame统计一秒内的frame次数fps → Frames Per Second示例代码在线地址 https://jsfiddle.net/zhangchi/1gm9a84L/14/<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" co
2021-12-15 20:47:45
334
原创 Web 中读取 e.clipboardData.files 耗时过长原因分析与解决
原因分析在chrome浏览器引擎的底层实现中，这一步隐含了转Blob的操作，当文件非常大时，耗时惊人// data_transfer.ccFileList* DataTransfer::files() const { auto* files = MakeGarbageCollected<FileList>(); if (!CanReadData()) return files; for (uint32_t i = 0; i < data_object_->
2021-12-07 10:54:19
568
原创 通过 matchMedia 获取 Web 中系统主题
JavaScript 中的 APIif (window.matchMedia('(prefers-color-scheme)').media !== 'not all') { console.log('???? Dark mode is supported');}CSS 媒体查询.day { background: #eee; color: black; }.night { background: #333; color: white; }@media (prefers-color-
2021-11-29 16:22:37
613
原创 什么是Product Lead Growth( PLG)
PLG的定义PLG 是 Product Led Growth 的缩写，指产品驱动增长。这个概念最早由风投公司 OpenView 于2016年提出PLG 是一个聚焦终端用户的增长模型，依赖于产品自身作为获取、转化、扩展客户的核心动力。PLG与SLG的区别PLG 一般跟 SLG（销售驱动增长）相对，两者侧重不一样。以前大家卖软件靠的是销售和渠道，而 PLG 模式下销售的权重就低了，因为产品好，客户通过内容找到产品、自助注册试用、自助学习应用并且能自助付费。所以在PLG模式下，SaaS公司可以
2021-11-28 22:19:59
1077
原创 在线画布自定义选区 Selection 的主要设计与 Demo
选区主要设计Selection 的 UISelection 的 Rect(width,height) 变化Selection 的 Position 变化在浏览器的 DOM 中，Selection 在鼠标点击位置的垂直线右侧变化于左侧变化的计算Demo 演示<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-
2021-11-19 12:44:32
561
原创 什么是ClickHouse？
ClickHouse是一个用于联机分析(OLAP)的列式数据库管理系统(DBMS)。在传统的行式数据库系统中，数据按如下顺序存储： Row WatchID JavaEnable Title GoodEvent EventTime #0 89354350662 1 Investor Relations
2021-11-16 14:41:46
1823
原创 WebGL 和 Canvas 的关系
定义Canvas 是 HTML5 提供的一个特性，你可以把它当做一个载体，简单的说就是一张白纸。而 Canvas 2D 相当于获取了内置的二维图形接口，也就是二维画笔。Canvas 3D 是获取基于 WebGL的图形接口，相当于三维画笔。你可以选择不同的画笔在上面作画。OpenGL是 底层的驱动级的图形接口（是显卡有直接关系的） 类似于 DirectX但是这种底层的 OpenGL 是 寄生于浏览器的JavaScript无法涉及的但是为了让 Web 拥有更强大的 图形处理能力 2010年时候Web
2021-11-16 12:26:30
7080
2
kibana-5.3.1
2017-09-06
apache-maven-3.5.0
2017-09-06
elasticsearch-5.3.1.zip
2017-09-06
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人