- 博客(174)
- 资源 (12)
- 收藏
- 关注
RSS订阅原创 Docker助力前端开发，轻松打造高效应用
注意，docker RUN echo 输入的文本内容是在镜像中的目录，而非宿主机中，创建容器后会出现在容器中，要通过容器目录挂载到宿主机中才能在宿主机中操作。在使用Docker进行应用开发和部署的过程中，我们常常需要将本地构建好的镜像推送到远程仓库，以便于其他开发者或者服务器可以获取并使用这些镜像。我们可以通过docker tag命令来对已有镜像进行标记，修改镜像的名称以及tag，修改的镜像要有镜像仓库地址/项目名/自定义名:版本。要删除不再需要的Docker镜像，可以使用docker rmi命令。
2023-12-14 13:11:05
108
原创 探索Vue小程序框架的底层原理
最近晚上有时间复盘之前研究小程序框架的相关内容，总结文章记录一下。本篇文章主要介绍百度19年开源的Mars小程序开发框架，和Taro、mpvue、uniapp类似，都是编译型小程序框架，都是通过将 Vue 或 React 源码直接编译为小程序源码，实现小程序快速开发。我们来介绍一下其设计思路与原理。
2023-12-07 11:38:28
538
原创 解放你的项目！depcheck：清理无用依赖，让代码更精致
depcheck 是一款用于检测项目中未使用依赖项的工具。在软件开发中，我们经常引入各种依赖以支持项目功能，但这些依赖可能随着时间的推移变得多余或被遗忘。depcheck 通过扫描项目文件，帮助你找出未被引用的依赖，从而优化项目结构。
2023-11-17 15:46:42
176
原创 JS数组原理探究！
我们可以通过 arguments 这个例子定义一个函数来连接字符串。这个函数唯一正式声明了的参数是一个字符串，该参数指定一个字符作为衔接点来连接字符串。该函数定义如下。myConcat(";lion;snake"这段代码说明了，你可以传递任意数量的参数到该函数，并使用每个参数作为列表中的项创建列表进行拼接。从这个例子中也可以看出，我们可以在日常编码中采用这样的代码抽象方式，把需要解决的这一类问题，都抽象成通用的方法，来提升代码的可复用性。
2023-08-31 23:42:48
202
原创 教你实现一个深浅拷贝！
从上面的样例代码中可以看到，利用 object.assign 也可以拷贝 Symbol 类型的对象，但是如果到了对象的第二层属性 obj1.a.b 这里的时候，前者值的改变也会影响后者的第二层属性的值，说明其中依旧存在着访问共同堆内存的问题，也就是说这种方法还不能进一步复制，而只是完成了浅拷贝的功能。当然，如果你在考虑到循环引用的问题之后，还能用 WeakMap 来很好地解决，并且向面试官解释这样做的目的，那么你所展示的代码，以及你对问题思考的全面性，在面试官眼中应该算是合格的了。
2023-08-30 21:59:31
162
原创 apply&call&bind原理介绍
call、apply 和 bind 是挂在 Function 对象上的三个方法，调用这三个方法的必须是一个函数。其中 func 是要调用的函数，thisArg 一般为 this 所指向的对象，后面的 param1、2 为函数 func 的多个参数，如果 func 不需要参数，则后面的 param1、2 可以不写。这三个方法共有的、比较明显的作用就是，都可以改变函数 func 的 this 指向。call 和 apply 的区别在于，传参的写法不同：apply 的第 2 个参数为数组；
2023-08-29 20:14:40
135
原创 一文详解JS 闭包！
JavaScript 的作用域通俗来讲，就是指变量能够被访问到的范围，在 JavaScript 中作用域也分为好几种，ES5 之前只有全局作用域和函数作用域两种。ES6 出现之后，又新增了块级作用域，下面我们就来看下这三种作用域的概念，为闭包的学习打好基础。先来看下红宝书上和 MDN 上给出的闭包的概念。:::tip红宝书闭包的定义：闭包是指有权访问另外一个函数作用域中的变量的函数。MDN：一个函数和对其周围状态的引用捆绑在一起（或者说函数被引用包围），这样的组合就是闭包（closure）。
2023-08-28 22:41:09
93
原创 JS 常见的 6 种继承方式
原型链继承是比较常见的继承方式之一，其中涉及的构造函数、原型和实例，三者之间存在着一定的关系，即每一个构造函数都有一个原型对象，原型对象又包含一个指向构造函数的指针，而实例则包含一个原型对象的指针。从最后的输出结果中可以看到，person5 通过 clone 的方法，增加了 getFriends 的方法，从而使 person5 这个普通对象在继承过程中又增加了一个方法，这样的继承方式就是寄生式继承。从上面编译完成的源码中可以看到，它采用的也是寄生组合继承方式，因此也证明了这种方式是较优的解决继承的方式。
2023-08-27 20:47:44
380
原创 前端工程化之规范化
EsLint是目前最为主流的JavaScript Lint工具，专门用于检测JS代码质量，通过ESLint很容易统一开发者的编码风格，例如：缩进、换行、分号以及空格之类的使用。不仅如此，EsLint还能帮助我们找到代码中不合理的地方，例如我们定义了一个从未使用的变量，或者在变量使用之后才去做声明等等，而这些不合理的操作就是代码中潜在的问题，通过EsLint能有效避免这些问题，从而提高代码的质量。对于 JavaScript 这种动态、宽松类型的语言来说，开发者更容易犯错。
2023-08-25 22:58:21
445
原创 前端工程化之模块化
前端工程化是使用软件工程的技术和方法来进行前端的开发流程、技术、工具、经验等规范化、标准化，其主要目的为了提高效率和降低成本，即提高开发过程中的开发效率，减少不必要的重复工作时间，而前端工程本质上是软件工程的一种，前端工程是指将工程方法系统化地应用到前端开发中，以系统、严谨、可量化的方法开发、运营、维护前端应用程序，目的是降本提效。在实际开发的过程中，一个完整的迭代周期需要依次经过开发、测试、部署、发布这几个环节，并且在产品上线之后，我们还需要对产品进行稳定性保障也就是实时的监控和报警系统，避免产品宕机。
2023-08-24 22:06:03
433
原创 前端工程化概述
前端工程化是使用软件工程的技术和方法来进行前端的开发流程、技术、工具、经验等规范化、标准化，其主要目的为了提高效率和降低成本，即提高开发过程中的开发效率，减少不必要的重复工作时间，而前端工程本质上是软件工程的一种，前端工程是指将工程方法系统化地应用到前端开发中，以系统、严谨、可量化的方法开发、运营、维护前端应用程序，目的是降本提效。在实际开发的过程中，一个完整的迭代周期需要依次经过开发、测试、部署、发布这几个环节，并且在产品上线之后，我们还需要对产品进行稳定性保障也就是实时的监控和报警系统，避免产品宕机。
2023-08-23 23:56:18
223
原创 webpack 从入门到放弃！
Loader 作为 Webpack 的核心机制，内部的工作原理却非常简单。接下来我们一起来开发一个自己的 Loader，通过这个开发过程再来深入了解 Loader 的工作原理。这里我的需求是开发一个可以加载 markdown 文件的加载器，以便可以在代码中直接导入 md 文件。
2023-08-16 22:17:58
579
原创 React组件性能优化实践
在上面的代码中，当渲染条件发生变化时，React 内部在做 Virtual DOM 比对时发现，刚刚第一个组件是 AdminHeader，现在第一个组件是 Header，刚刚第二个组件是 Header，现在第二个组件是 Content，组件发生了变化，React 就会卸载 AdminHeader、Header、Content，重新挂载 Header 和 Content，这种挂载和卸载就是没有必要的。频繁的挂载和卸载组件是一项耗性能的操作，为了确保应用程序的性能，应该减少组件挂载和卸载的次数。
2023-08-08 23:46:39
379
原创 聊聊JavaScript性能优化!
GC就是垃圾回收机制的简写，当GC工作的时候可以找到内存中的垃圾对象，然后对对象空间进行释放和回收，方便后续代码进行使用。那么GC中的垃圾是什么呢？程序中不再需要使用的对象//当函数调用完后，不再需要使用name${//当函数调用完后，不再需要使用name//当函数调用完后，不再需要使用name程序中不能再访问到的对象//当函数调用完后，外部空间访问不到name了${//当函数调用完后，外部空间访问不到name了//当函数调用完后，外部空间访问不到name了。
2023-05-04 23:57:40
532
原创 关于微前端，你想知道的都在这!
微前端官网：https://micro-frontends.org/问题：如何实现多个应用之间的资源共享？之前比较多的处理方式是npm包形式抽离和引用，比如多个应用项目之间，可能有某业务逻辑模块或其他是可复用的，便抽离出来以npm包的形式进行管理和使用。发布效率低下：如果需要迭代npm包内的逻辑业务，需要先发布npm包之后，再每个使用了该npm包的应用都更新一次npm包版本，再各自构建发布一次，过程繁琐。如果涉及到的应用更多的话，花费的人力和精力就更多了。
2023-02-22 13:18:40
1105
原创 你不知道的npm
npm解决的核心问题是模块管理问题，npm包含cli脚手架、模块仓库、官网(https://www.npmjs.com/)三大部分。关于npm的相关信息可以查阅：https://docs.npmjs.com/about-npm。
2022-11-30 16:29:34
2780
原创 Eclipse Theia技术揭秘——自定义布局
以上介绍了ApplicationShell的组成和布局，那么我们要扩展一个toolbar或者simulator也就简单了，只需重写ApplicationShell的createLayout方法，添加自己定义的视图，然后使用inversify重新绑定即可。其实官方提供了一个@theia/toolbar的模块，也是按上述的方法去重写的。效果如图：});});} });};
2022-09-26 17:16:12
855
原创 Eclipse Theia技术揭秘——脚手架源码分析
首先我们在Github中下载Theia的源码。源码目录中我们主要关注dev-packages和packages两个包，dev-packages是开发工具包，packages下是Theia的核心依赖包，我们重点看一下dev-packages下的内容。然后我们重点看一下cli这个库。在package.json中可以看到bin字段注册的theia命令。然后我们看一下目录看一下bin/theia的内容。他引用了编译后lib下的theia，也就是编译前src下的theia.ts。我们具体看一下theia.ts
2022-09-26 17:04:16
662
原创 Eclipse Theia技术揭秘——构建桌面IDE
首先我们先介绍一下Eclipse Theia Blueprint这套模板，它是用于构建基于 Eclipse Theia 平台的基于桌面的产品，以及展示 Eclipse Theia 功能。它由现有 Eclipse Theia 功能和扩展的子集组成，可以轻松下载并安装在所有主要操作系统平台上。大家可以去下载体验一下，它也是开源的，可以在Github上参考其代码。我们可以基于这套模板去定制我们的IDE产品。
2022-09-23 13:50:00
379
原创 企业级npm仓库搭建
之前写过一篇前端物料平台的搭建，其中涉及到使用私有npm仓库来管理前端物料，为此写一下企业的npm仓库搭建。那么企业为什么要搭建私有的npm仓库呢，我们平时大部分使用的是npm官方仓库的一些依赖库，但是针对企业级，企业需要开发自己的一些组件库和工具库，这些库需要在组织内部进行管理和共享，不能够上传npm公有仓库中，因此我们需要搭建企业私有仓库来解决这种问题。同时搭建私有仓库，能够提升npm包的安装下载速度和源的稳定性，比如淘宝镜像，本质上也是私有仓库。接下来我们介绍一下常用npm私有仓库框架。
2022-09-21 18:05:28
1301
原创 JS基础——JS数据类型
JavaScript数据类型是入门的基础知识点，同时也是最为重要的，我们常常在代码中遇到边界数据类型条件判断问题，只有处理好才能让我们的代码更为严谨。
2022-09-11 13:54:26
137
原创 企业级前端组件建设
去年我们平台为客户提供了一套企业级前端组件方案，收集了一下客户的需求，同时也做了一部分调研工作，由于我们是为金融机构服务的，所以也发现了同业中广发所做的GFDesign也是这样的思路，大家可以看广发移动端统一组件库GFDesign来了这篇文章，同时像蚂蚁的Ant Design、字节的和以及腾讯的TDesign，都是类似的企业级设计系统以及组件库。那么提到了组件库不得不说一下组件化。组件化是一种非常优雅的提效率、保质量的解决方案，可以帮助研发人员实现功能复用，降低代码重复率，提高研发效率。
2022-09-07 13:01:30
868
原创 Eclipse Theia技术揭秘——初识Theia
自从接触IDE这方面的技术以来，一直关注其他厂商是如何做IDE的，刚开始了解IDE是从微信、百度、支付宝等这些开发者工具知道这些开发者工具是基于electron或NW.js去构建的，但是从头开始写成本比较高。后来也看了一些其他的IDE，像、白鹭Egret Wing、快应用IDE、这类的是基于VSCode源码定制的，技术相对成熟，大部分功能现成的，工作量相对较少，于是就基于VSCode去定制了第一版的开发工具，详情可以看之前写的VSCode技术揭秘。
2022-09-06 00:46:21
1404
原创 如何建设前端物料平台？
什么是物料？物料(Material) 这个概念在前端领域大家都不陌生，在阿里飞冰中的解释物料即组成一个前端项目的不同单位，根据抽象粒度的不同，我们将物料从小到大分为组件（component）、区块（block）和模板（scaffold）。其实在这里可以理解为前端可复用的组件模块都可理解成物料。为什么要有物料？在企业级前端开发中，我们经常会遇到一些问题，例如：项目中有很多重复的功能，你如何去优化？我想做一个新功能，有没有谁做过类似的功能可以拿来用大家写过的组件各具风格，不好交流针对这种情况我
2021-12-14 14:50:39
3486
2
原创 VSCode技术揭秘（一）
前言Visual Studio Code（以下简称VSCode）是一个轻量且强大的跨平台开源代码编辑器（IDE），VSCode 采用了 Electron，使用的代码编辑器名为 Monaco、Monaco 也是 Visual Studio Team Service（Visual Studio Online）使用的代码编辑器，在语言上，VSCode 使用了自家的 TypeScript 语言开发。V...
2019-10-27 18:01:49
13204
3
原创 Android NDK开发之JNI基础
前言之前写了一篇文章简单的介绍了Android NDK的组件和结构，以及在Android studio中开发NDK，NDK是Android底层的c/c++库，然而要在java中调用c/c++的原生功能，则需要使用JNI来实现。什么是JNIJNI(Java Native Interface)是java本地接口，它主要是为了实现Java调用c、c++等本地代码所封装的一层接口。大家都知道java...
2019-03-17 01:49:46
294
1
原创 Android系统源码目录解析
前言在之前的文章中介绍了Android系统源码的下载，这篇文章简单介绍一下源码结构，并结合Android系统结构，熟悉一下源码工程。阅读工具关于阅读源码的工具，这里使用的是visual studio code，但是visual studio code本身不支持java和c++的相关提示，所以你必须安装java和c的拓展插件，帮助你更好的阅读代码。源码结构各个版本的源码目录结构基本上是大同...
2019-03-14 21:59:12
438
原创 React Native开发环境搭建
前言本篇文章主要讲解React Native(简称RN)开发环境的搭建，学习这篇文章可能需要开发者要懂Android原生开发环境搭建、node环境搭建和mac基本使用。系统：macReact Native：0.58HomebrewHomebrew是Mac OSX上的软件包管理工具，能在Mac中方便的安装软件或者卸载软件，相当于linux下的apt-get、yum神器。Homebre可...
2019-02-27 22:24:04
182
原创 一篇文章了解大前端
大前端是什么？简单来说，大前端就是所有前端的统称，比如Android、iOS、web、Watch等，最接近用户的那一层也就是UI层，然后将其统一起来，就是大前端。大前端最大的特点在于一次开发，同时适用于所有平台，开发者不用为一个APP需要做Android和iOS两种模式而担心。大前端是web统一的时代，利用web不仅能开发出网站，更可以开发手机端web应用和移动端应用程序。大前端为什么出现？...
2019-02-24 12:09:57
278
原创 CornerStone使用教程
前言不管你在什么公司，对我们程序员来说，都要使用源码版本控制工具，否则多人开发就成了很大的问题，而且源码一般都保存在公司的远程仓库中，这样也能保证写好的代码不会丢失。现在源码版本控制工具有两种：git和svn，使用git的团队应该是最多的，但是也有使用svn的，windows中svn客户端一般使用TortoiseSVN，mac中比较好用的当属CornerStone了，接下来主要介绍CornerS...
2019-01-25 22:34:00
390
原创 tensorflow学习之Anaconda开发环境搭建
tensorflow的开发环境有很多，可以在Docker上搭建，也可以使用Anaconda管理工具搭建，也可以直接在本机中安装tensorflow。在这里为了工具包的方便管理，我选择使用Anaconda搭建。环境搭建下载并安装Anaconda下载并安装tensorflow下载并安装notebook下载AnacondaAnaconda是什么？Anaconda 是一...
2018-08-20 13:50:03
442
原创 VuePress从零开始搭建自己专属博客
VuePress从零开始搭建自己的博客最近将自己的博客从Hexo转移到VuePress中来，使用VuePress的过程中也遇到了一些问题，写一篇文章来记录一下搭建过程和踩过的坑。VuePress是什么？VuePress是以Vue驱动的静态网站生成器，是一个由Vue、Vue Router和webpack驱动的单页应用。在VuePress中，你可以使用Markdown编写文档，然后生成...
2018-08-18 12:56:55
10467
3
原创 Mac中编译FFmpeg教程(Android版)
Mac中编译FFmpeg教程(Android版)本篇文章主要介绍在Mac环境中，编译FFmpeg生成so库。FFmpeg简介FFmpeg既是一款音视频编解码工具，同时也是一组音视频编解码开发套件，作为编解码开发套件，它为开发者提供了丰富的音视频处理的调用接口。 FFmpeg提供了多种媒体格式的封装和解封装，包括多种音视频编码、多种协议的流媒体、多种色彩格式转换、多种采样率转换、多...
2018-07-13 22:45:08
1588
原创 Android开源库的制作
Android开源库的制作我们在写项目时经常用到开源库，特别是在android studio中，一句话引用就可以，比如compile ‘com.android.support:appcompat-v7:25.3.1’，剩下的交给gradle依赖就可以了。但是如何制作开源库给别人使用呢？现在制作开源库一般是上传到jcenter或者maven中，但是这两个比较麻烦，我将介绍一个简单的给大家使用。这...
2018-07-01 11:30:59
421
原创 Android平台架构的介绍和源码分析
本篇文章为Android源码学习的第一章，主要讲述Android平台架构的分层，以及如何下载Android源码。Android平台架构介绍Android 是一种基于 Linux 的开放源代码软件栈，为广泛的设备和机型而创建。下图所示为 Android 平台的主要组件。 从上图可以看出，Android系统大体可以分为6个层次，从下往上依次是： 1. Linux内核层：Androi...
2018-06-27 18:25:22
286
原创 Android中其他优化知识点
android不用静态变量存储数据静态变量等数据由于进程已经被杀死而被初始化使用其他数据传输方式：文件/sp/contentProvider有关SharePreference问题不能跨进程同步存储SharePreference的文件过大问题内存对象序列化序列化：将对象的状态信息转换为可以存储或传输的形式的过程实现SerializebleParcelableSerializeble是
2017-09-17 18:55:19
329
原创 Android中冷启动相关知识点
什么是冷启动冷启动的定义： 冷启动就是在启动应用前，系统中没有该应用的任何进程信息。也就是刚开始打开应用的时候。冷启动/热启动的区别：热启动就是用户使用返回键退出应用，然后马上又重新启动应用。Application在冷启动创建一次，热启动不会创建。冷启动时间的计算：这个时间值从应用启动(创建进程)开始计算，到完成视图的第一次绘制(即Activity内容对用户可见)为止。冷启动流程Zygo
2017-09-17 18:34:36
303
原创 Android中UI卡顿相关知识点
UI卡顿原理主要来源于Android系统中渲染做了太多的耗时操作，原因有可能是layout太复杂，layout层叠次数太多，动画次数过多。UI卡顿原因分析人为在UI线程中做轻微耗时操作，导致UI线程卡顿。布局Layout过于复杂，无法在16ms内完成渲染。同一时间动画执行的次数过多，导致cpu或gpu负载过重。View过度绘制，导致某些像素在同一帧时间内被绘制多次，从而使cpu或gpu负载过
2017-09-17 18:18:32
382
原创 OkHttp面试相关知识
OkHttp使用简介创建一个OkHttpClient对象创建一个request对象，通过内部类Builder调用生成Request对象创建一个Call对象，调用execute/enqueueOkHttp源码相关http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2015/0326/2643.html
2017-09-14 23:29:35
836
原创 去掉Toolbar的阴影效果
在Android 5.0以上，AppCompat toolbar控件会自带阴影效果，有些时候我们想要去掉阴影效果，这时候我们只需要在AppBarLayout中添加app:elevation=”0dp”即可去掉阴影效果。
2017-09-14 15:45:53
1162
1
精通Spring 4.x 企业应用开发实战.pdf
2019-05-13
神策数据-Android_全埋点技术白皮书.pdf
2019-05-13
大话JAVA性能优化.pdf
2019-05-13
《iOS10快速开发：18天零基础开发一个商业应用》_刘铭.pdf
2019-05-13
《SpringBoot揭秘：快速构建微服务体系》_王福强.pdf
2019-05-13
《Android进阶解密》_刘望舒.pdf
2019-05-12
《CTO说》_CTO训练营.pdf
2019-05-12
《Node.js微服务》_赵震一.pdf
2019-05-12
《RxJava响应式编程》_李衍顺.pdf
2019-05-12
Android群英传
2018-06-05
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人