Skip to main content

19 posts tagged with "前端"

View All Tags

· 19 min read
LIU

腾讯实时音视频（Tencent Real-Time Communication，TRTC）是腾讯云提供的一套低延时、高质量的音视频通信服务。本文将详细介绍如何在 uni-app 和 Web 端接入 TRTC，并提供完整的示例代码，包括多人视频通话的实现。

· 5 min read
LIU

技术方案​

1. IndexedDB​

IndexedDB 是一个强大的浏览器内置数据库，具有以下优势：

  • 支持存储大量结构化数据
  • 支持索引，便于快速检索
  • 支持事务，保证数据一致性
  • 异步 API，不会阻塞主线程

2. 数据加密：jsencrypt​

· 7 min read
LIU

Vue2 与 Vue3 的 Diff 算法对比​

Vue 的虚拟 DOM 和 Diff 算法是其高效渲染的核心。Vue3 在 Vue2 的基础上对 Diff 算法进行了重大优化，本文将深入对比两者的差异，并分析这些优化带来的性能提升。

1. 虚拟 DOM 基础​

虚拟 DOM 结构​

Vue2 和 Vue3 的虚拟 DOM 结构有所不同：

· 5 min read
LIU

Vue.js 是一个渐进式JavaScript框架，其源码设计精巧，包含了响应式系统、虚拟DOM、模板编译等核心功能。本文将从源码角度深入分析Vue2的核心实现原理。

· 9 min read
LIU

1.元素挂载顺序​

vue元素挂载的顺序之分

  1. 如果存在render函数，就用render函数渲染组件；
  2. 如果没有render函数，但是存在template，就将template中的内容编译成render函数，最后做渲染；
  3. 如果既没有render函数也没有template函数，就获取el里的内容作为template，同样编译成render函数。
  Vue.prototype.$mount = function (el) {
    // 挂载
    const vm = this;
    const options = vm.$options;
    el = document.querySelector(el);
    vm.$el = el;
    if(!options.render) { // 没有render方法
      let template = options.template;
      if(!template && el){ // 没有template 但是有el 获取el中的内容
        template = el.outerHTML
      }
      // 将模板编译成render函数
      const render = compileToFunctions(template)
      options.render = render;
    }
    // 渲染时用的都是render函数
    // 挂载组件
    mountComponent(vm,el);
  }

· 6 min read
LIU

错误的分类​

  • 代码运行错误：也称为代码错误。这个错误一般在代码书写时造成的，比如语法错误、逻辑错误，这样的错误通常在开发或测试阶段就会被发现
  • 资源加载错误：这个错误通常是找不到文件（404）或者是文件加载超时出现的

代码运行错误​

SyntaxError 解析时发生语法错误

const abc

window.onerror捕获不到SyntxError，一般SyntaxError在构建阶段，或是本地开发阶段就会被抛出

TypeError 值不是所期待的类型

· 5 min read
LIU

业务模块​

...

项目依赖​

注：node > v12.0.0

{
    "axios": "^0.24.0",
    "vant": "^3.2.8",
    "vue": "^3.2.16",
    "vue-router": "^4.0.12",
    "vuex": "^4.0.2",
    "sass": "^1.43.4",
    "typescript": "^4.4.3",
    "vite": "^2.6.4",
}

· 12 min read
LIU

1.开始​

Node.js 是一个开源和跨平台的 JavaScript 运行时环境。它几乎是任何类型项目的流行工具

Node.js 应用程序在单个进程中运行，无需为每个请求创建新的线程。Node.js 在其标准库中提供了一组异步的I/O原语，以防止 JavaScript 代码阻塞，通常，Node.js 中的库是使用非阻塞范式编写的

2.非阻塞​

node 核心运行机制，node应用运行在单个进程中，node是单线程的（意思是node中只有一个线程用于处理 javascript），一个进程包含多个线程

image-20220613120754407

· 11 min read
LIU

时间复杂度​

一般看的都是 O(1) ~ O(n^2) 范围，其它都是需要优化的

  • O(1)

    • if(i==1)
    • res = 100 1000、res = n 200
    • push(2)、pop()
    • map.set(1,1)、map.get(1)
    • 计算复杂度时，O(1)一般会被忽略

  • O(n)

    • for循环，while循环（不使用二分搜索）

  • O(log n)

    • 二分搜索

· 4 min read
LIU

一个是定义属性，一个是代理

Object.defineProperty()​

define 定义 property 属性

(obj , prop , descriptor)
description 叙述、表述
descript 动词
descriptor 描述项集合