作者：boxizeng，腾讯高级工程师 |导语 近期在做Hippy首屏节点提前渲染的优化，实现过程中查阅了SDK中相关的源码，对底层实现的理解更深了一步，编写此文小结一番。 01 背景 背景主要是减少页面打开耗时，提升业务秒开率。 回顾 Hippy 业务从入口点击到页面呈现整个过程，大致包含引擎初始化，jsbundle 加载和 view 创建三块，其中还包括 js 与native 之间的通讯耗时以及数据的编解码耗时。减少页面 loading 或白屏时间，同样可从这三方面入手，而 Hippy SDK 或团队
1.数组元素childNodes[0]有更直观易读的优点,这边在介绍一个有同样功能的属性,且更加语义化-------->firstChild属性 假设我们需要目标元素节点下的所有子元素中的第一个子元素我们可以这样做: 目标元素节点下的子元素节点数组.firstChild 这句代码等价于 目标元素节点下的子元素节点数组[0]; 目标元素节点.childNodes[0] 这句代码等价于 目标元素节点.firstChild; 与此类推当我们需要目标元素节点下的所有子元素节点中的最后一个元素我们可以这样做: 目标
上一篇我们研究了 Immutable.js 持久化数据结构的基本实现原理，对其核心数据结构Vector Trie进行了介绍，并着重探究了其中的位分区机制。采用位分区的根本原因是为了优化速度，而对于空间的优化， Immutable.js 是怎么做的呢？接下来先探讨下这点。
在上篇文章中（D3.js 力导向图的显示优化），我们说过 D3.js 在自定义图形上相较于其他开源可视化库的优势，以及如何对文档对象模型（DOM）进行灵活操作。既然 D3.js 辣么灵活，那是不是实现很多我们想做的事情呢？在本文中，我们将借助 D3.js 的灵活性这一优势，去新增一些 D3.js 本身并不支持但我们想要的一些常见的功能。
方法2.c=-(a+b): 确定了a和b，那就可以想两数之和一样，在map中寻找-(a+b)，减少一层循环，时间复杂度O(n^2)，空间复杂度O(n)。
项目中使用 vue3的 ref 功能来获取当前组件暴露的api。但是在控制台打印的dom数组的时候却和实际页面中的节点顺序不一致。这就导致可怜我在页面点了获取排在第一个的数据。但是给我返回的却是第三个。代码如下：
一般来说，图形渲染总是需要从磁盘数据开始，最终保存到磁盘数据中，保存这种数据的就是3D模型文件。3D模型文件一般会把顶点、索引、纹理、材质等等信息都保存起来，方便下次直接读取。3D模型文件格式一般是与图形渲染工作强关联的，了解3D模型文件格式的组成，有助于进一步了解图形渲染的流程。
let是局部变量（在他所在的代码块可用），const是常量，var是全局变量（前两个是ES6的，因为前面两个更加严谨，var被抛弃（貌似））
堆排序 前言 堆排序相比冒泡排序、选择排序、插入排序而言，排序效率是最高的，本文从堆的属性和特点出发采用图文形式进行讲解并用JavaScript将其实现，欢迎各位感兴趣的开发者阅读本文? 堆属性 堆分
分治会将大问题拆解成小问题，拆解到最小问题之后，开始不断合并结果，递归是分治实现的一种形式或者是分治实现的一部分，分治包括三分部分，分解、计算、合并。分治的场景很多，例如快速排序，归并排序。
对于前段时间流出的QQ群数据大家想必已经有所了解了，处理后大小将近100G，多达15亿条关系数据（QQ号，群内昵称，群号，群内权限，群内性别和年龄）和将近9000万条群信息（群号，群名，创建时间，群介绍），这些数据都是扁平化的2维表格结构，直接查询不能直接体现出用户和群之间的直接或者间接关系。通过数据可视化，可以把扁平结构的数据作为点和线连接起来，从而更加直观的显示出来从而进行分析。 d3.js是一个近年来推出的基于javascript的数据展示库，全称为Data Driven Document， 在浏览器
在交叉对比中，当新节点跟旧节点头尾交叉对比没有结果时，会根据新节点的key去对比旧节点数组中的key，从而找到相应旧节点（这里对应的是一个key => index 的map映射）。如果没找到就认为是一个新增节点。而如果没有key，那么就会采用遍历查找的方式去找到对应的旧节点。一种一个map映射，另一种是遍历查找。相比而言。map映射的速度更快。
给你二叉树的根节点 root ，返回其节点值的 「层序遍历」 。（即逐层地，从左到右访问所有节点）。
内存泄漏是一个累积的过程，只有页面生命周期略长的时候才算是个问题（所谓“刷新一下满血复活”）。频繁交互能够加快累积过程，偏展示的页面很难把这样的问题暴露出来。最后，JS逻辑相对复杂才有可能出现内存问题（“bug多是因为代码量大，我自己都hold不住”），如果只是简单的表单验证提交，还没什么机会影响内存
根据提供的文章内容，撰写摘要总结。
现在到处都是JavaScript，倘若花点时间去体察，每次都能知道点新的东西。一旦你入了门，你总能从这里或是那里领悟到很多知识。一旦发现些许有意思的东西，总习惯先收藏起来。待到时技(时间＋技术)成熟，再去感觉他们的源代码，看一看它们是怎么办到的，览一览大牛们的“奇技淫巧”。这里便是关于所遇精妙JS代码的收藏室，愿随时间的渐行渐远，这里收集的日渐丰盈，技术也能“层林尽染”。 CSS布局调试代码片段 在浏览器控制台运行此段代码(当然也只能在控制台运用)，会给页面里所有的 DOM 元素添加一个 1px 的描边（o
对于一个新生程序猿来说。HTML是什么，事实上并不重要。可是都知道。html文件，能够用浏览器打开。
最近公司面试了一些中高级前端，由于公司技术栈以 Vue 为主，而对于中高级前端，必不可少要问及 Vue 源码的问题。很多面试者，对于源码只能简单讲到响应式是基于 Object.defineProperty 或者 Proxy 等老生常谈的基础概念。Vue 经过这么多年的发展，成了很多前端开发者职业生涯不可或缺的一个框架。诚然，每个人都可以在短时间学习一个框架的使用，但是要深入阅读它的源码确实不是一件容易的事。这里面有很多因素，除了业务开发繁忙外，面对一个复杂庞大的代码库，以及众多平时不经常使用的构建工具和新的编程语言等干扰因素，我们时常不知道该从哪里切入。为了应付面试，只能通过一些面经文章和博客，快速获得一些基本的认知，但一旦面试官深入拷问，真正看过源码还是只看过文章，就水落石出。真正读懂源码不是靠一场突击战就能做到的，而是像浇花种树一样，日积月累，反复刻意的练习和回顾，到最后甚至可以自己写出一个框架，才算真正掌握。既然是一场持久战，我们就不能指望在短时间内把整个框架一口吃进去，而是将其分割成一个个小的技术点，一次消化一个单一技术点，连点成线，最后就能吃下整个框架。本文以及接下来一系列文章，尝试将 Vue 源码拆分成独立的技术点，并动手编码实现。
特点： 1. 弱类型 2. 基于对象。(因为面向对象需要具有封装、继承、多态的特征)
https://gitee.com/ishouke/front_end_plugin/blob/master/jquery-3.2.1.min.js
有一天上线后大佬反馈了一个问题，他刚发的动态在生成分享卡片的时候，卡片底部的小程序码丢失了，然而其他小伙伴都表示在自己手机上运行正常。事实上大佬也说除了这条动态以外，其它都是正常的。
面试官:"你了解虚拟DOM(Virtual DOM)跟Diff算法吗,请描述一下它们";
义了一个currentNodeKey来存储当前选中节点的 key。每次点击节点时，我们首先检查是否已经有一个节点被选中，如果是，则通过this.$refs.tree.setCurrentKey(null)取消选中它。然后，我们更新currentNodeKey为新选中的节点 key。
计算出Virtual DOM中真正变化的部分，并只针对该部分进行原生DOM操作，而非重新渲染整个页面。
zTree 是一个依靠 jQuery 实现的多功能 “树插件”。优异的性能、灵活的配置、多种功能的组合是 zTree 最大优点。
写在前面，总结面试题不一定是为了准备面试，更是对于自己的一种温故知新，了解自己知识的熟练度和理解度。 问题一览 如何判断一个值是否为NaN？运行环境内建的方法isNaN()有坑 如何判断两个浮点数相等
DOM：Document Object Model，文档对象模型。DOM 为文档提供了结构化表示，并定义了如何通过脚本来访问文档结构。目的其实就是为了能让js操作html元素而制定的一个规范。
关于WebGIS JS API，只喜欢两种：上手容易，简单灵活的Leaflet，以及系统全面功能强大丰富的Arcgis JS API。
计算树的节点数: 函数TreeSize用于递归地计算二叉树中的节点数。如果树为空（即根节点为NULL），则返回0。否则，返回左子树的节点数、右子树的节点数和1（表示当前节点）的总和。
从表面上来看，这就是个普通的html标签。但是注意看左边，我们将这个html标签赋值给了一个js变量！
根据指定的层次结构数据构造一个根节点。指定的数据 data 必须为一个表示根节点的对象。比如:
正如文章 Data Structures With JavaScript: Singly-Linked List and Doubly-Linked List 中所言，链表这种数据结构非常像电视节目里的 寻宝游戏 —— 而不是 火车。
Immutable.js 由 Facebook 花费 3 年时间打造，为前端开发提供了很多便利。我们知道 Immutable.js 采用了持久化数据结构，保证每一个对象都是不可变的，任何添加、修改、删除等操作都会生成一个新的对象，且通过结构共享等方式大幅提高性能。
Mongo shell中使用大整数字面量，但默认整数字面量类型却是双精度浮点数，导致丢失精度
解析XML文件是开发中常见的需求之一。为了以一种简单易用的方式访问XML数据，你可能不想编译一个C解析器，而是想寻找一个更方便的解决方案。那么，xml2js就是你需要的工具！xml2js是一个简单的XML到JavaScript对象转换器，支持双向转换。它使用了sax-js和xmlbuilder-js这两个工具库。
diff是什么？diff就是比较两棵树，render会生成两颗树，一棵新树newVnode，一棵旧树oldVnode，然后两棵树进行对比更新找差异就是diff，全称difference，在vue里面 diff 算法是通过patch函数来完成的，所以有的时候也叫patch算法
人和座位由一个整数数组 row 表示，其中 rowi 是坐在第 i 个座位上的人的ID，
• 节点a 的邻接点是节点b 、d ，其邻接点的存储下标为1、3，按照头插法（逆序）将其放入节点a 后面的单链表中；
图的结构比较复杂，任何两个顶点之间都可能有关系。如果采用顺序存储，则需要使用二维数组表示元素之间的关系，即邻接矩阵(Adjacency Matrix),也可以使用边集数组，把，每条边顺序存储起来。如果采用链式存储,则有邻接表.十字链表和邻接多重表等表示方法。其中，邻接矩阵和邻接表是最简单、最常用的存储方法。。
说起，「链表」在前端领域，可能有些许的陌生。但是，它作为一个传统的数据结构，在一些高阶领域还是有用武之地的。
人和座位由一个整数数组 row 表示，其中 row[i] 是坐在第 i 个座位上的人的ID，
不知道你是不是和我一样，看到“编译器”三个字的时候，就感觉非常高大上，同时心底会升起一丝丝“害怕”！
之前学习爬虫的时候，如果是 HTML 的数据，通过 xpath 或是 css 选择器，就能很快的获取我们想要的数据，如果是 json 有没有类似 xpath 这种，能够直接根据条件定位数据，而不需要自行 json 解析在遍历获取。答案是有的，也就是 JSONPath。
树的重心是指，删除某个结点后剩下的最大连通子树的结点数目最小，如下图是根据样列生成的树，若删除结点1，则剩下三个子树最大的是中间那颗结点有4个，即剩下的最大连通子树的结点数目为4；若删除结点2，则剩下两个数目为1的子树和一个数目为6的子树，即剩下的最大连通子树的结点数目为6；若删除结点3，剩下一个数目为1的子树，和一个数目为7的子树，即剩下的最大连通子树的结点数目为7……枚举可得剩下的最小的最大连通子树的结点数目为4也就是说结点1是树的重心。另外注意题目要求答案是输出剩下的最小的最大连通子树的结点数目。
前面我们介绍过二叉树的单向表示和双向表示发，分别是借用了几个指针来实现。双亲表示法则是用了一个非常详细的结构体描述了一个节点，然后将节点串联到另外一个结构体中（这个结构体包含一个数组），具体的代码如下：
树这种数据结构包括根节点root，左右节点，子树中又有父节点，子节点，兄弟节点，没有子节点的成为叶子节点，树分为二叉树和多叉树
MongoDB 将数据存储在灵活的json文档中，这意味着可以直接得到从文档到文档的数据、结构等。
题目：给定一个非空二叉树的根节点 root , 以数组的形式返回每一层节点的平均值。与实际答案相差 10^(- 5) 以内的答案可以被接受。
我们知道树是一种非线性数据结构。它对儿童数量没有限制。二叉树有一个限制，因为树的任何节点最多有两个子节点：左子节点和右子节点。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM
