高先生的猫

前端埋点sdk的方案十分成熟，之前用的都是公司内部统一的埋点产品，从前端埋点和数据上报后的可视化查询全链路打通。但是在最近的一个私有化项目中就遇到了问题，因为服务都是在客户自己申请的服务器上的，需要将埋点数据存放到自己的数据库中，同时前端埋点的功能简洁，不需要太多花里胡哨的东西。公司内部的埋点产品不适用，外部一些十分成熟的埋点产品又显得太臃肿，因此着手自己在开源包的基础上封了一个简单的埋点sdk，简单聊聊其中的一些功能和解决方式。功能对于产品来说，埋点上首要关心的是页面的pv、uv，其次是一些重要操

gitlens安装后，这里应该有个图标，但不知道怎么回事就不显示了解决方法：打开vscode命令面板，windows下ctrl+shift+p找到gitlens set views layout命令，点击选择Gitlens Layout即可

AV1图像格式或AVIF是地球上最新的图像编解码器。AVIF是一种优化的图像格式，旨在使我们的图像更小，同时保持相同的质量（无损），AVIF的文件扩展名是 .avif。在本文中，我想谈谈它的功能和好处，以及为什么你应该开始使用AVIF。我还将向你展示在你的网站上包含AVIF图像的安全方法。什么是AVIF，它如何工作？AVIF是从开放媒体联盟（AOM）开发的如今流行的视频格式AV1的关键帧中提取的。AOM开发AVIF的目的是提供免版税的图像，与现有的图像格式相比，具有更好的压缩效率和更多.

之前有很多人问学好前端需要学习哪些js库, 主流框架应该学vue还是react? 针对这些问题, 笔者来说说自己的看法和学习总结.首先我觉得在学习任何知识之前必须要有一个明确的学习目标, 知道自己为什么要学它, 而不是看网上说的一股脑的给你灌输各种知识, 让你学习各种库, 从而不断的制造大家的焦虑感.前端由于入行门槛低, 更新换代很快, 每年都会有大量新的框架和库出现, 也有大量库被淘汰(比如 JQuery, 但是学习它的设计思想很有必要). 所以我们大可不必担心, 保持自己的学习步伐,...

对更快交付高质量软件（或"快速质量"）的需求要求组织以敏捷，持续集成（CI）和DevOps方法论来寻找解决方案。测试自动化是这些方面的重要组成部分。最新的《 2018-2019年世界质量报告》表明，测试自动化是实现"快速质量"的最大瓶颈，因为它是成功采用敏捷和DevOps的推动力。没有好的工具就无法实现测试自动化。因为它们决定了如何执行自动化以及是否可以实现自动化的好处。测试自动化工具是DevOps工具链中的关键组件。在应用人工智能和机器学习（AI / ML）来提供用于测试优化，智能测试生成，执行和报告

远程办公就需要远程连接的工具，当然，你说你用VPN那也是没有毛病的。远程桌面工具也极大的方便了我们进行远程技术支持、远程办公的便利性，但是呢，很多时候，有些工具不支持电脑或者手机操作。今天给大家推荐几款工具，即可以支持电脑操作，又支持手机操作，有国内的工具、也有国外的工具，功能非常强大、好用，最重要的是符合国人的口味：免费、免费、免费。1、Teamviewer产地：德国支持语言：多国语言，有中文版地址:http://www.teamviewer.comTeamViewer是用于实..

简介一个神奇的文档网站生成工具我们在做完项目的时候经常会写一些项目手册，来记录我们在项目开发过程中的一些开发流程、使用方式以及注意事项，分享给将会使用到这个项目的人，方便大家快速上手，让程序顺利运行。目前比较好的方式就是写成Markdown格式的技术文档，方便我们发布在github上，同时也可以发布到博客分享平台。除此之外我们还可以借助docsify这个工具，来帮助我们快速的搭建一个小型的文档网站，它可以自动将我们写在Markdown中的标题生成目录，整个页面的配色和布局也十分舒适易读，让整

简要描述腾讯短网址（微信url.cn短链接）生成api接口是腾讯官方对外公开的短网址生成接口，可以将一个冗长的链接缩短成10个字符以内的短链接。应用场景腾讯短网址的应用场景很广，譬如短信营销、邮件推广、微信营销、QQ营销、自媒体推广、渠道推广等，都会用到短网址。究其原因是在于短网址可以降低推广成本、用户记忆成本，提高用户点击率；在特定的场景下推广还能规避关键词，防止域名被拦截，隐藏真实地址等。腾讯短网址接口格式一：http://lnurl.cn/url-api.json?ur..

前言微软在10月3日举行了新品发布会，其中微软在这次发布会正式发布了Window是10的十月版，版本号是 Build 17763，版本为1809。博主怀着好奇心，决定试玩了一把。开启开发人员模式在 设置 -> 更新与安全 -> 开发者选项 选项中，勾选“开发人员模式”开发人员模式开启Linux子系统功能打开“控制面板”，在 程序和功能 -> 启用或关闭 Windows 功能 中，滚动条滑到最后，勾选“适用于 Linux 的 Windows 子系统”开启Lin

1. Enjoycss老实说，虽然我做过许多前端开发，但我并不擅长css。当我陷入困境时，[Enjoycss] 是我的大救星。Enjoycss提供了一个简单的交互界面，帮助我设计元素，然后自动输出相应的css代码。Enjoycss可以输出css、LESS、Scss代码，并支持指定需要支持哪些浏览器及其最低版本。开发简单页面时用起来比较方便，但不太适合复杂一点的前端项目（这类项目往往需要引入css框架）。2. Prettier Playground[Prettier] ...

进程与线程进程和线程都是CPU工作时间片的一个描述。进程描述了CPU在运行指令及加载和保存上下文所需的时间，放在应用上来说就代表了一个程序。线程是进程中的更小单位，描述了执行一段指令所需的时间。js是单线程执行的。把这些概念放到浏览器中来说，当你打开一个Tab页面，其实就是创建了一个进程，一个进程中可以有多个线程，比如渲染线程、js引擎线程、HTTP请求线程等等。当你发起一个请求时，其实就是创建了一个线程，当请求结束后，该线程可能就会被销毁。在js运行的时候可能会阻止UI渲染，这说明了两个线程是

一、Fiddler抓取环境搭建1、电脑需要安装Fiddler2、测试手机需要支持Wifi3、测试手机与电脑需要同一网络4、所测APP需支持代理二、finder配置1、代理端口Tools –> Options-> Connections，设置代理端口：8888， 勾选 Allow remote computers to connect，即允许远程计算机连接Fiddler，如图所示注：8888为默认端口号，可修改，但需注意两点，一是本机空闲端口，二是手机代理设置时要与fidd

开发环境（dev)：开发环境是程序猿们专门用于开发的服务器，配置可以比较随意，为了开发调试方便，一般打开全部错误报告。 测试环境(test)：一般是克隆一份生产环境的配置，一个程序在测试环境工作不正常，那么肯定不能把它发布到生产机上。灰度环境（pre）：灰度环境，外部用户可以访问，但是服务器配置相对低，其它和生产一样。 <很多企业将test环境作为Pre环境 生产环境（prod）：是值正式提供对外服务的，一般会关掉错误报告，打开错误日志。三个环境也可以说是系统开发...

1.cssViewer这个工具在识别和显示元素的css属性方面很有用。它包括一个浮动窗口，您可以把鼠标悬停在页面上任一元素上以查看它的所有css属性。您可以通过快捷键在cssViewer的窗体中轻松复制您选定元素的样式。也许您会感到奇怪，Chrome本身的开发者工具不是已经足够了吗，为什么我还要用它？其实这个插件比我们浏览器中的开发者工具显示的信息更多也更先进。除了基础的元素的宽度和高度的盒子模型外，还包括了所有已生效的样式及更多信息。2. AuguryAuury是由Rangle..

前言最近公司电脑换代，公司配了16寸新mbp，原15寸mbp自购后将硬盘全部清理后自用，意味着我要装机2次，程序员的电脑装机意味着大量的配置、软件、插件都要进行设置，还很容易遗漏，在装一个机器后，装第二个机器前专门整理一下并分享出来供大家参考，我是前端程序员所以可能部分内容更适合于前端，大家自行取舍。基本内容git在mac终端输入git命令会提示你安装xcode，但是xcode非常大，前端程序员也不太需要，所以大家可以通过下面命令只安装git。$ xcode-select --inst

MacOS上的包管理工具。类似RHEL/CentOS上的yum或者Ubuntu上的apt-get一样。安装前置条件：brew是ruby开发的，需要确认ruby是否已安装，缺省状况下是已经安装的。which rubyruby -v安装命令$ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"更换国内源$ cd "$...

给大家整理了 25 个前端相关的学习网站和一些靠谱的小工具，包括一些小游戏、教程、社区网站和博客，以及一些资源网站，希望可以帮助到大家!css相关1.cssBattle - 在线比拼csshttps://cssbattle.dev在线比拼css，一个挺有趣的竞争性游戏，一共有12个级别，需要你用html和css100%还原它给出的页面，然后再尽量减少代码，你也可以查看全球的排行榜，看解决方案。2.Learncsslayout - 学习css布局...

问题代码提示大大加快了书写速度和准确性, 但是发现在输入了Enter和(或;等按键莫名其妙的进行了代码补全. 要解决这个问题, 需要进行一下配置设置对应的settings.json字段{// 代码提示的选中是否通过Enter确认, 建议关闭, 否则在想要换行的时候会触发选中, 只用Tab键选中 "editor.acceptSuggestionOnEnter": "off", // 控制是否通过提交字符接收建议, 意思是;(等也会选中提示的代码, 这回造成失误, 建议关.

Mac环境下的vscode默认块注释的快捷键为shift + option + A, 而大多数块注释的快捷键都是cmd + shift + /, 本文教你更改其快捷键, 并附赠一个你可能遇到的问题的解决办法step1. 进入快捷键设置界面step2. 修改快捷键P.S. 解决Mac不能录入cmd + shift + /的问题如果输入cmd + shift + /弹出帮助页面问题原因: 全局按键cmd + shift + /被占用, 需要到Mac的系统偏好...

step1: 安装中文插件step2: 打开命令面板按快捷键⇧+⌘+p, 打开控制面板, 如图点击configure display language,选择zh-cn, 重启vscode即可

1.写作篇 ✏️❝基于之前很多童鞋在评论区，问树酱说比如思维导图很好看，用的是什么，首图是怎么制作的等等问题，于是通过一些工具的整理希望能帮助到大家❞1.1 语雀❝语雀是一个蚂蚁金服孵化出来的专业的云端知识库，类似wiki，目前已经覆盖了10 万阿里员工的使用，来进行文档编写及知识沉淀 官方链接????❞语雀我常用的两个方面 思维导图：一个是语雀自带的思维导图，个人觉得UI体验很强（外表协会） 日记编排：用语雀来保持记录每天在前端开发中遇到的问题及心得体会，方便

相信有很多的朋友会被这几个名词绕的有些头大，很多朋友觉得智能DNS跟双线加速、CDN加速是类似的技术。其实不然，虽然他们的目的都是一个：让用户更快的访问网站。但是他们的应用原理却大相径庭。大家一定很清楚这几种都是比较常见的主机加速的方式。所以文本主要介绍一下“智能dns解析”，“cdn加速技术”，“双线主机的加速方式”的基本加速原理，当你了解了这些就可以从这几种方式中找出一种更适合你的主机的加速方式。一、何谓双线加速双线加速比较常用的就是“双线双IP”和“双线单IP”,"BGP双线单IP"1）.

介绍对于很多人来说，使用Javascript来处理图像不是一件非常简单的事情，幸运的是我们可以借助第三方的库来实现我们想要的功能，本篇文章就介绍一有哪些Javascript图片处理库可供我们选择和使用!以下排名不分先后1. Pica此插件可减小大图像的上传大小，从而节省上传时间。它可以在浏览器中调整图像大小，而不会出现像素化现象并且相当快。它会从web-workers, web assembly, createImageBitmap and 纯JS自动选择优秀的可用技术。减小大图像...

微信和 QQ 内置浏览器 UAiOSQQ 内置浏览器 UA:Mozilla/5.0 (iPhone; CPU iPhone OS 7_1_2 like Mac OS X) > AppleWebKit/537.51.2 (KHTML, like Gecko) Mobile/11D257 > QQ/5.2.1.302 NetType/WIFI Mem/28iOS 微信内置浏览器 UA:Mozilla/5.0 (iPhone; CPU iPhone OS 7_1_2 ..

Linux Shell/terminal 命令非常强大，即使一个简单的命令就可能导致文件夹、文件或者路径文件夹等被删除。在一些情况下，Linux 甚至不会询问你而直接执行命令，导致你丢失各种数据信息。一般来说在 Web 上推荐新的 Linux 用户执行这些命令，当然，也有人哪些写过这代码的人不这么想，因为这玩意你一写下去就不是玩笑了。这里我收集了一些对系统有危害的 Linux 代码，帮助你避免他们。请记住：这些代码非常危险，甚至可以经过修改，变得更加有危害性。还有一些事情需要注意：一些命令只

这八个建议，来源于键者几年来编写 shell 脚本的一些经验和教训。事实上开始写的时候还不止这几条，后来思索再三，去掉几条无关痛痒的，最后剩下八条。毫不夸张地说，每条都是精挑细选的，虽然有几点算是老生常谈了。1. 指定bashshell 脚本的第一行，#!之后应该是什么？如果拿这个问题去问别人，不同的人的回答可能各不相同。我见过/usr/bin/env bash，也见过/bin/bash，还有/usr/bin/bash，还有/bin/sh，还有/usr/bin/env sh。这算是编程界的.

工欲善其事，必先利其器，chrome前端调试必备工具!要想操作浏览器更有效率，我们可以试试掌握以下这些快捷键。Ctrl+N打开新窗口Ctrl+T打开新标签页Ctrl+Shift+N在隐身模式下打开新窗口Ctrl+O在 Google Chrome 浏览器中打开计算机中的文件按住 Ctrl 键的同时点击链接 或用鼠标中键(或鼠标滚轮)点击链接从后台在新标签页中打开链接按住 Ctrl+Shift 的同时点击链接或按住 Shift 键的同时用鼠标中键(或鼠标滚轮)点击链接在新标签页中打开链.

在c:windows下执行get-ExecutionPolicy，如果显示的是Restricted说明他是禁止的。接下来就要执行set-ExecutionPolicy RemoteSigned回车，输入A 然后回车就好了。

前言高阶函数是对其他函数进行操作的函数，可以将它们作为参数或通过返回它们。简单来说，高阶函数是一个函数，它接收函数作为参数或将函数作为输出返回。例如Array.prototype.map，Array.prototype.filter，Array.prototype.reduce都是一些高阶函数尾调用和尾递归尾调用（Tail Call）是函数式编程的一个重要概念，本身非常简单，一句话就能说清楚。就是指某个函数的最后一步是调用另一个函数。function g(x) { console.

1.使用高性能 DNSCDN 服务本身并不具备域名解析功能，而是依托于 DNS 智能解析功能，由 DNS 根据用户所在地、所用线路进行智能分配最合适的 CDN 服务节点，然后把缓存在该服务节点的静态缓存内容返回给用户。如果域名转换为IP这一过程可用性低且延迟高，那么肯定会对 CDN 性能产生不良影响。另外，请确保在DNS记录上使用较高的TTL（生存时间），以便解析器可以长时间缓存记录。2.将源点移到CDN附近保持CDN与源之间的等待时间短暂，是CDN应对缓...

如果在电脑安装了nodejs并且全局安装了vue-cli但是用vue-cli搭建项目的时候会出现如下提示:那么可能是你在配置电脑环境的时候把vue的默认环境给覆盖了,或者是误删了,然后就找不到了,那我们可以再给他重新配置一下,你可以重新再全局安装一下vue-cli的脚手架,这样你可以在命令行看见文件路径提示,你可以顺着路径找到你的vue.cmd文件,比如我的文件路径如下:然后复制这个路径,在此电脑打开属性的高级系统设置里面编辑系统环境变量的path添加刚刚复制的路径..

localhost 就是一个域名，域名指向 127.0.0.1 ，两者是一样的。至于本机 IP，你可以理解为本机有三块网卡，一块网卡叫做 loopback（这是一块虚拟网卡），另外一块网卡叫做 ethernet （这是你的有线网卡），另外一块网卡叫做 wlan（这是你的无线网卡）。你的本机 IP 是你真实网卡的 IP，具体来说有线无线各有一个，而 127.0.0.1 是那块叫做 loopback 的虚拟网卡的 IP。操作系统解析网络地址是有优先级的。优先级最高的就是host查找，首先读取然后是net

微信登陆时前端展示二维码的方式(两种)1.前端采用js实例化一个二维码嵌入我们的HTML元素中(可以自定义样式)2.向后台发请求返回一个链接,这个链接指向二维码的扫描页面(不好修改样式)前端采用js实例化一个二维码//在<head>标签内添加如下js文件 <script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>//id为login.

表单一点击提交按钮(submit)必然跳转页面，如果表单的action为空也会跳转到自己的页面，即效果为刷新当前页。如下，可以看到一点击提交按钮，浏览器的刷新按钮闪了一下,如果想要阻止表单的默认提交事件，有以下几种方法：1.将<input>标签内按钮类型从type="submit"修改为type="button"2.表单内的<button>未指定类型时，默认的类型为submit，可以显式的修改为<button type="button">来阻止表单提交3..

1.邮箱export const isEmail = (s) => { return /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(s)}2.手机号码export const isMobile = (s) => { return /^1[0-9]{10}$/.test(s)}3.电话号码export const isPhone = (s) => {

Notification 是什么MDN:Notifications API 的 Notification 接口用于配置和向用户显示桌面通知。这些通知的外观和特定功能因平台而异，但通常它们提供了一种向用户异步提供信息的方式。其实，MDN 的说明已经可以让我们很清楚知道Notification的作用。Notification能够为用户提供异步的桌面消息通知，即使你缩小浏览器或是活动在其他标签页，只要调用该Api的标签页没被关闭，它都能工作。在桌面端的浏览器中，除了 IE 不支持外，其他就均...

Gradify - 提取图片颜色，创建响应式的 CSS渐变　　被请求的HTTP对象之间的延迟会有一个时间段，这个期间网页看起来不完整。Gradify 可以分析出图像中4个最常见的颜色，创建一个梯度(或纯色)作为图片占位符。Gradify 可以在在任何图像发现最突出的颜色并产生一个可伸缩的、响应式的CSS渐变。在线演示 源码下载...

1. Ballon.cssBalloon.css lets you create simple tooltips with pure CSS. It requires only a few lines of CSS to work, and no JavaScript. Also keep in mind that if pseudo elements are already in use on an element, the tooltip will conflict with them resulti

1. Compass.appCompass is a stylesheet authoring framework that makes your stylesheets and markup easier to build and maintain. With compass, you write your stylesheets in Sass instead of plain CSS. Compass.app is a menubar only app for Sass and Compass.