综合( 右侧选择分类 )
xiaozhi

1.Web 性能优化: 使用 Webpack 分离数据的正确方法

制定向用户提供文件的最佳方式可能是一项棘手的工作。 有很多不同的场景,不同的技术,不同的术语。在这篇文章中,我希望给你所有你需要的东西,这样你就可以:了解哪种文件分割策略最适合你的网站和用户知道怎么做根据Webpack glossary,有两种不同类型的文件分割。 这些术语听起来可以互换,但显然不是。Webpack 文件分离包括两个部分,一个是 Bundle splitting,一个是 Code
143 人浏览
php

如何使用yii2框架自定义widget,和如何传参数

本教程教你如何自定义widget,widget是view中能被重用的代码块。创建widget的步骤:1 继承yii\base\Widget.2 实现yii\base\Widget::init() 和 yii\base\Widget::run()方法3 注意下面代码是如何传递参数的@ 创建widget首先在项目根目录创建components目录,然后新建一个HelloWidget 类。使用此widg
162 人浏览
xiaozhi

28.JavaScript 如何创建、读取和删除cookie

Cookie为 Web 应用程序保存用户相关信息提供了一种有用的方法。例如,当用户访问咱们的站点时,可以利用Cookie保存用户首选项或其他信息,这样,当用户下次再访问咱们的站点时,应用程序就可以检索以前保存的信息。Cookie 是什么鬼Cookie是一小段文本信息,伴随着用户请求和页面在 Web 服务器和浏览器之间传递。用户每次访问站点时,Web 应用程序都可以读取 Cookie 包含的信息。C
160 人浏览
xiaozhi

27.如何使用useReducer Hook

看到“reducer”这个词,容易让人联想到Redux,但是在本文中,不必先理解Redux才能阅读这篇文章。咱们将一起讨论“reducer”实际上是什么,以及如何利用useReducer来管理组件中的复杂状态,以及这个新钩子对Redux意味着什么?Reducer 是什么鬼如果你熟悉Redux或数组上中的reduce方法,你大概就知道“reducer”是什么。 如果不熟悉,“reducer”大概是一
157 人浏览
xiaozhi

26.ES新提案:双问号操作符

本文主要讲Gabriel Isenberg撰写的ES提案“Nullish coalescing for JavaScript”。 它提出??替换||的运算符,并提供默认值。这里先把这相提案叫作双问号操作符,如果你有好的叫法,欢迎留言讨论。1.概述双问号??的操作符跟||类似,如果给定变量值为null或者undefined,刚使用双问号后的默认值,否则使用该变量值。如下:>undefined?
139 人浏览
xiaozhi

25.JavaScript中函数式编程基本原理简介

原文:https://medium.com/better-programming/introduction-to-the-basic-principles-of-functional-programming-in-javascript-6849ae196326译者:前端小智为了保证的可读性,本文采用意译而非直译。想阅读更多优质文章请猛戳GitHub博客,一年百来篇优质文章等着你!在长时间学习和使用
181 人浏览
xiaozhi

24.JavaScript中轻松遍历对象属性的几种方式

自身可枚举属性Object.keys()方法会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和使用for...in循环遍历该对象时返回的顺序一致 。如果对象的键-值都不可枚举,那么将返回由键组成的数组。这是合理的,因为大多数时候只需要关注对象自身的属性。来看看一个对象拥有自身和继承属性的例子,Object.keys()只返回自己的属性键:letsimpleColors={
157 人浏览
xiaozhi

23.JS引擎:它们是如何工作的?从调用堆栈到Promise,需要知道的所有内容

为了保证可读性,本文采用意译而非直译。有没有想过浏览器如何读取和运行JS代码? 这看起来很神奇,我们可以通过浏览器提供的控制台来了解背后的一些原理。在Chrome中打开浏览器控制台,然后查看Sources这栏,在右侧可以到一个Call Stack盒子。JS 引擎是一个可以编译和解释我们的JS代码强大的组件。 最受欢迎的JS 引擎是V8,由 Google Chrome 和 Node.j s使用,Sp
133 人浏览
xiaozhi

22. JavaScript 是如何工作的:JavaScript 的共享传递和按值传递

关于JavaScript如何将值传递给函数,在互联网上有很多误解和争论。大致认为,参数为原始数据类时使用按值传递,参数为数组、对象和函数等数据类型使用引用传递。按值传递 和引用传递参数主要区别简单可以说:按值传递:在函数里面改变传递的值不会影响到外面引用传递:在函数里面改变传递的值会影响到外面但答案是 JavaScript 对所有数据类型都使用按值传递。它对数组和对象使用按值传递,但这是在的共享传
145 人浏览
xiaozhi

21.JavaScript 是如何工作的:JavaScript 的内存模型

//声明一些变量并初始化它们 vara=5 letb='xy' constc=true //分配新值 a=6 b=b+'z' c=false//类型错误:不可对常量赋值作为程序员,声明变量、初始化变量(或不初始化变量)以及稍后为它们分配新值是我们每天都要做的事情。但是当这样做的时候会发生什么呢? JavaScript 如何在内部处理这些基本功能?
152 人浏览
xiaozhi

20.JavaScript 是如何工作的:模块的构建以及对应的打包工具

如果你是 JavaScript 的新手,一些像 “module bundlers vs module loaders”、“Webpack vs Browserify” 和 “AMD vs.CommonJS” 这样的术语,很快让你不堪重负。JavaScript 模块系统可能令人生畏,但理解它对 Web 开发人员至关重要。在这篇文章中,我将以简单的言语(以及一些代码示例)为你解释这些术语。 希望这对你
160 人浏览
xiaozhi

19.JavaScript 是如何工作的:编写自己的 Web 开发框架 + React 及其虚拟 DOM 原理

响应式原理Proxy 允许我们创建一个对象的虚拟代理(替代对象),并为我们提供了在访问或修改原始对象时,可以进行拦截的处理方法(handler),如 set()、get() 和 deleteProperty() 等等,这样我们就可以避免很常见的这两种限制(vue 中):添加新的响应性属性要使用 Vue.$set(),删除现有的响应性属性要使用数组的更新检测Proxyletproxy=newProx
160 人浏览
xiaozhi

18.JavaScript 是如何工作的:WebRTC 和对等网络的机制

概述WebRTC,名称源自网页即时通信(英语:Web Real-Time Communication)的缩写,是一个支持网页浏览器进行实时语音对话或视频对话的API。在此之前,P2P技术(如桌面聊天应用程序)可以做一些网络做不到的事情,WebRTC 填补了 Web 这一关键空白点。WebRTC 是一项实时通信技术,它允许浏览器或者 app 之间可以不借助中间媒介的情况下,建立浏览器之间点对点的连接
163 人浏览
xiaozhi

17.JavaScript 是如何工作: Shadow DOM 的内部结构+如何编写独立的组件

概述Web Components 是一套不同的技术,允许你创建可重用的定制元素,它们的功能封装在你的代码之外,你可以在 Web 应用中使用它们。Web组件由四部分组成:Shadow DOM(影子DOM)HTML templates(HTML模板)Custom elements(自定义元素)HTML Imports(HTML导入)在本文中主要讲解Shadow DOM(影子DOM)Shadow DOM
139 人浏览
xiaozhi

16.JavaScript是如何工作的:存储引擎+如何选择合适的存储API

概述在设计 Web 应用程序时,为本地浏览器选择合适的存储机制至关重要, 一个好的存储引擎可以确保可靠地保存信息,减少带宽,提高响应能力。正确的存储缓存策略是实现离线移动 Web 体验的核心构建块,同时也大大的提高了用户体验。在本章中,讨论可选择的存储 Api 和服务,并提供一些在构建 Web应用程序,该使用哪种存储引擎。数据模型数据存储模型确定数据在内部的组织方式,这会影响 Web 应用程序的整
144 人浏览
xiaozhi

15.JavaScript是如何工作的:深入类和继承内部原理+Babel和 TypeScript 之间转换

现在构建任何类型的软件项目最流行的方法这是使用类。在这篇文章中,探讨用 JavaScript 实现类的不同方法,以及如何构建类的结构。首先从深入研究原型工作原理,并分析在流行库中模拟基于类的继承的方法。 接下来是讲如何将新的语法转制为浏览器识别的语法,以及在 Babel 和 TypeScript 中使用它来引入ECMAScript 2015类的支持。最后,将以一些在 V8 中如何本机实现类的示例来
153 人浏览
xiaozhi

14.JavaScript 是如何工作的:解析、抽象语法树(AST)+ 提升编译速度5个技巧

概述我们都知道运行一大段 JavaScript 代码性能会变得很糟糕。这段代码不仅需要通过网络传输,而且还需要解析、编译成字节码,最后执行。在之前的文章中,我们讨论了 JS 引擎、运行时和调用堆栈等,以及主要由谷歌 Chrome 和 NodeJS 使用的V8引擎。它们在整个 JavaScript 执行过程中都发挥着至关重要的作用。这篇说的抽象语法树同样重要:在这我们将了解大多数 JavaScrip
139 人浏览
xiaozhi

13.JavaScript是如何工作的: CSS 和 JS 动画底层原理及如何优化它们的性能

概述你肯定知道,动画在创建引人注目的 Web 应用程序中扮演着重要的角色。随着用户越来越多地将注意力转移到用户体验上,商户开始意识到完美、愉快的用户体验的重要性,结果 Web 应用程序变得越来越重,并具有更动态交互的 UI。这一切都需要更复杂的动画,以便用户在整个过程中更平稳地进行状态转换。今天,这甚至不被认为是什么特别的事情。用户正变得越来越挑剔,默认情况下,他们期望的是具有高响应性和交互性的用
149 人浏览
xiaozhi

12.JavaScript 是如何工作的:深入网络层 + 如何优化性能和安全

正如在上一篇关于渲染引擎的博客文章中提到的,我们认为优秀的 JavaScript 开发人员和杰出的 JavaScript 开发人员之间的区别在于,后者不仅理解语言的具体细节,而且理解其内部结构和周遭环境。讲一点历史49年前,一种叫做 ARPAnet 的网诞生了。它是一个早期的分组交换网络,也是第一个实现TCP/IP套件的网络。20年后,蒂姆·伯纳斯-李提出了一种“网状结构”的建议,这种结构后来被称
159 人浏览
xiaozhi

11.JavaScript是如何工作的:渲染引擎和优化其性能的技巧

当你构建 Web 应用程序时,你不只是编写单独运行的 JavaScript 代码,你编写的 JavaScript 正在与环境进行交互。了解这种环境,它的工作原理以及它的组,这些有助于你够构建更好的应用程序,并为应用程序发布后可能出现的潜在问题做好充分准备。浏览器的主要组件包括:用户界面 (User interface):包括地址栏、后退/前进按钮、书签目录等,也就是你所看到的除了用来显示你所请求页
150 人浏览