随笔分类 - JavaScript
摘要:
描述了如何通过自定义脚本简化 ESLint 命令的执行。该脚本支持指定文件或文件夹,指定 ESLint 配置文件,附带命令,以及前后置执行命令等功能,极大地提高了代码检查和格式化的效率。
阅读全文

摘要:在搜索时常常在输入一半或者输入错误时,搜索引擎就给出智能提示。  已知的搜索推荐主要包括以下几个方面: * 包含:“清华” 和 “清华大学” *
阅读全文
摘要:## 背景 作为文档工具人,经常需要把代码里面的注释转换成语义化的 Markdown 文档,有时也需要进行反向操作。以前是写正则表达式全局匹配,时间长了这种方式也变得繁琐乏味。所以写了脚本来互转,增加一些便捷性。 ## 解决方案 ### 注释转 Markdown 下载地址:https://githu
阅读全文
摘要:背景 npm 命令运行时,往往通过命令行指定相关配置,最常用的便是使用 --registry 来指定依赖的安装源。 npm install --registry=https://registry.npmmirror.com 同样的效果也可以使用 .npmrc 来实现: registry=https:
阅读全文
摘要:npm 查看当前镜像源: npm config get registry # https://registry.npmjs.org/ 修改当前镜像源: npm config set registry https://registry.npmjs.org/ cnpm 安装 cnpm: npm inst
阅读全文
摘要:PWA(Progressive Web App – 渐进式网页应用)是一种理念,由 Google Chrome 在 2015 年提出。PWA 它不是特指某一项技术,而是应用多项技术来改善用户体验的 Web App,其核心技术包括 Web App Manifest、Service Worker、Web Push 等,用户体验才是 PWA 的核心。
阅读全文
摘要:单页面结构简单、布局清晰,常常用来做手机 App 或者某个产品的下载介绍页面。现在,展示型网页整体趋向于单页网站设计,这样一次性把核心信息展现出来,对于用户来说更加直观和简单,能够快速了解一个产品。
阅读全文
摘要:一、npm 直接安装 GitHub/GitLab 仓库代码 语法 npm install <git remote url> 示例 命令: npm i git@github.com:mazeyqian/mazey.git -S # 或 npm i https://github.com/mazeyqia
阅读全文
摘要:注册和登录在社交和商业网站中是必不可少的一个部分。
阅读全文
摘要:响应式布局就是一个网站能够兼容多个终端,而不是为每个终端做一个特定的版本。这个概念是为解决移动互联网浏览而诞生的。导航栏与轮播在大部分网站的头部占很高的比重,特别是导航栏,扮演着网站地图的角色。在响应式布局中,要求导航栏能够根据终端屏幕大小显示不同的样式。
阅读全文
摘要:一、背景:页面为何会卡? 1.1 等待时间长(性能) 项目本身包/第三方脚本比较大。 JavaScript 执行阻塞页面加载。 图片体积大且多。 特别是对于首屏资源加载中的白屏时间,用户等待的时间就越长,用户感知到页面的速度就越慢。麻省理工学院的 Richard Larson 在讲话中指出,“人类将
阅读全文
摘要:讲 Bootstrap 基础的教程网上已经很多了,实际上 Bootstrap 中文网(bootcss.com)里的文档已经写的很详细了,但实战的案例却不多。这里用一些当前流行的网页布局为导向,使用 Bootstrap 中的样式来完成它。每次只讲与案例相关的知识点,边学边练,加强理解。练习本案例需有
阅读全文
摘要:背景 试想在一个需要频繁更新数据的场景(例如:监控、图表类),常规方法是设置一个间隔 N 秒的定时器 setInterval;但是这种方式存在一个问题,当前一个请求时间过长时(超过了间隔时间),后一个请求的接口响应会先于前一个请求,也就是说,将导致旧的数据渲染会覆盖新的数据渲染。 解决方案 利用 A
阅读全文
摘要:一、什么是 CI/CD? CI(持续交付)是功能迭代后自动构建、打包、校验代码格式、跑单测、单测覆盖率,常见的就是 Webpack、Rollup、ESLint等。 CD(持续部署)是经过 CI 后,代码自动部署到服务器。 在 GitLab 中部署 CI、CD GitLab CI/CD 通 .gitl
阅读全文
摘要:背景 为了使页面加载更快,常常将一些不重要的第三方脚本在页面完成加载后进行懒加载。 // 做一些不影响业务的事情 window.addEventListener('load', () => { // 懒加载埋点分析 loadScript({ url: 'https://www.domain.com/
阅读全文
摘要:## jQuery 链接: - v1.9.1:https://i.mazey.net/lib/jquery/1.9.1/jquery.min.js - v2.1.1:https://i.mazey.net/lib/jquery/2.1.1/jquery.min.js - v3.1.1:https:/
阅读全文
摘要:安装 rollup npm install rollup --save-dev 配置文件 rollup.config.js export default { input: 'src/index.js', output: { file: 'lib/bundle.js', format: 'cjs' }
阅读全文
摘要:安装 npm install --save-dev webpack@4.30.0 webpack-cli@3.3.2 更新 package.json 脚本 "scripts": { "build": "webpack --config webpack.config.js" } 更新目录结构 webp
阅读全文
摘要:一、什么是 Promise 1.1 Promise 的背景介绍 Promise 最早出现在 1988 年,由 Barbara Liskov、Liuba Shrira 首创(论文:Promises: Linguistic Support for Efficient Asynchronous Proce
阅读全文
摘要:一、postMessage window.postMessage() 方法可以安全地实现跨源通信。通常,对于两个不同页面的脚本,只有当执行它们的页面位于具有 相同的协议 (通常为https),端口号(443为https的默认值),以及主机(两个页面的模数 Document.domain设置为相同的值
阅读全文