xiaoheibanfe的博客

Hello，大家好。又一周结束了，我们又如约而至。我们是好未来集团晓黑板前端团队，简称晓前端。每周五，我们都会搜罗一些有趣，有意义的事情和大家分享。如果你喜欢，欢迎关注我们哟。封面图本次周刊话题为：信息的不对称与真实性（下篇），所以在阅读本周话题前推荐优先阅读上篇（第7期）哦~上回在我们的晓前端·周刊【第7期】：信息的不对称与真实性（下）中，尽可能简单易懂地为大家解释了信息的不对称性，并通过两个当时发生的社会热点——成都新冠女孩个人信息泄露遭网暴以及网约车司机为救婴儿连闯红灯家属却拒绝作证的乌龙事件

作者：沧海各种js解析器是前端工程化的基石，可以说如果没有它，很多工程化都无法正常执行，我们每天用到的babel、webpack、eslint、TypeScript背后都需要一套对应的js解析器，今天我们来看看，目前市场上有哪些常用的解析器，他们各自又拥有什么特性尼？前言在说js解析器前，我们需要先了解下ESTree这个项目，这个项目的初衷通过社区的力量，保证和es规范的一致性，通过自定义的语法结构来表述JavaScript的AST，后来随着知名度越来越高，多位知名工程师的参与，使得变成了事实意义上的

作者：梁棒棒简介electron打包工具有两个：electron-builder，electron-packager，官方还提到electron-forge，其实它不是一个打包工具，而是一个类似于cli的工具集，目的是简化开发到打包的一整套流程，内部打包工具依然是electron-packager。electron-builder与electron-packager相比各有优劣，electron-builder配置项较多，更加灵活，打包体积相对较小，同时上手难度大；而electron-packge.

Hello，大家好。又一周结束了，我们又如约而至。我们是好未来集团晓黑板前端团队，简称晓前端。每周五，我们都会搜罗一些有趣，有意义的事情和大家分享。如果你喜欢，欢迎关注我们哟。封面图信息不对称（asymmetric information）指交易中的各人拥有的信息不同。在社会政治、经济等活动中，一些成员拥有其他成员无法拥有的信息，由此造成信息的不对称。在市场经济活动中，各类人员对有关信息的了解是有差异的；掌握信息比较充分的人员，往往处于比较有利的地位，而信息贫乏的人员，则处于比较不利的地位。不对称信息

Hello，大家好。又一周结束了，我们又如约而至。我们是好未来集团晓黑板前端团队，简称晓前端。每周五，我们都会搜罗一些有趣，有意义的事情和大家分享。如果你喜欢，欢迎关注我们哟。封面图信息不对称（asymmetric information）指交易中的各人拥有的信息不同。在社会政治、经济等活动中，一些成员拥有其他成员无法拥有的信息，由此造成信息的不对称。在市场经济活动中，各类人员对有关信息的了解是有差异的；掌握信息比较充分的人员，往往处于比较有利的地位，而信息贫乏的人员，则处于比较不利的地位。不对称信息

作者：long.woo文件下载是我们开发中比较常见的业务需求，比如：导出 excel。web 应用文件下载存在一些局限性，通常是让后端将响应的头信息改成 Content-Disposition: attachment; filename=xxx.pdf，触发浏览器的下载行为。在 electron 中的下载行为，都会触发 session 的 will-download 事件。在该事件里面可以获取到 downloadItem 对象，通过 downloadItem 对象实现一个简单的文件下载管理器：.

作者：Kurosaki本节旨在汇总在开发Electron 窗口可能遇到的问题，做一个汇总，后续遇到问题会持续更新。1. 窗口闪烁问题。const { BrowserWindow } = require('electron');const win = new BrowserWindow();win.loadURL('https://github.com');使用new BrowserWindow() 创建出窗口，如果不作任何配置的话，窗口就会出现，默认是白色.

作者：Kurosaki本文主要讲解Electron 窗口的 API 和一些在开发之中遇到的问题。官方文档 虽然比较全面，但是要想开发一个商用级别的桌面应用必须对整个 Electron API 有较深的了解，才能应对各种需求。1. 创建窗口通过BrowserWindow，来 创建 或者 管理 新的浏览器窗口，每个浏览器窗口都有一个进程来管理。1.1. 简单创建窗口const { BrowserWindow } = require('electron');const win ..

作者：秦志英前言上一篇文章中我们分析了Vue3响应式的整个流程，本篇文章我们将分析Vue3中的computed计算属性是如何实现的。在Vue2中我们已经对计算属性了解的很清楚了，在Vue3中提供了一个computed的函数作为计算属性的API,下面我们来通过源码的角度去分析计算属性的运行流程。computedexport function computed<T>(getter: ComputedGetter<T>): ComputedRef<T>exp.

Hello，大家好。又一周结束了，我们又如约而至。我们是好未来集团晓黑板前端团队，简称晓前端。每周五，我们都会搜罗一些有趣，有意义的事情和大家分享。如果你喜欢，欢迎关注我们哟。封面图1937 年设计用来求解线性方程组的，阿塔纳索夫—贝瑞计算机（Atanasoff-Berry Computer，通常简称 ABC 计算机）（上图）是世界上第一台电子数字计算设备。注：更为人熟知的 ENIAC（伊尼亚克）是世界上第一台通用计算机，它是图灵完备的电子计算机，能够重新编程，解决各种计算问题。但是在 1973

作者: OBKoro1electron原生对话框electron的原生对话框dialog，提供了系统对话框, 提供了消息提示、消息提示操作以及选择文件、保存文件等操作，今天就跟着本文来了解一下electron。PS：本文以及相关示例出自electron-playground，所有示例都可以即时运行，这是一个可以快速实验electron的各种相关API的项目，你可以基于它来学习和了解electron的相关api。1. 消息提示 dialog.showMessageBoxSync1.1 消息提示..

不要冒然评价我，你只知道我的名字，却不知道我的故事，你只是听闻我做了什么，却不知我经历过什么。俗话说得好，产品有三宝，弹窗浮层加引导。上图截图自我司 App 晓黑板中的口算模块，相信每个 App 开发在工作中都碰到这种场景，为了避免用户对新功能产生困惑，会对一些功能加一些引导操作。在原生开发中，例如 Android 开发中，我们可以使用 NewbieGuide 等开源库来实现。但是很遗憾的是，在 Dart packages 中找了一圈，一无所获。但是我们还是很快就解决了问题，既然解决不了问题，.

作者: OBKoro11. 协议: 从网页端唤起Electron应用elelctron提供了一个方式来自动唤起electron应用(如下图)，这一次就让我们来学学如何通过连接来唤起electron应用，并且我们可以使用这个功能来做点什么。1.1 协议唤起示例:1.2 什么是协议electron注册的协议, electron会将协议注册到系统的协议列表中，它是系统层级的API，只能在当前系统下使用, 其他未注册协议的电脑不能识别。Electron的app模块提供了一些处理协议的方法, 这些方.

作者：余韵之LazyLoading 懒加载 Chunk是什么？我们可以使用懒加载的方式引入模块，比如说当触发了某个条件，在通过import的方式引入模块。这样可以使得项目的性能会更加的好。举个例子：当我们点击页面的时候，才会去引入lodash模块，这里 import()返回的是promiseasync function getComponent() { const {default: _} = await import(/* webpackChunkName:"lodash&qu.

作者：余韵之Tree Shaking1、什么是Tree Shaking表示 只引入需要的模块里的代码，没有使用的是不会打包import { add } from './math.js';add(1, 2);math.js里有两个方法，如果使用了Tree Shaking 那么只会打包add方法2、如何配置webpack.prod.js 生产环境不需要配置这个，即使配置了这个也是无作用的。optimization: { // 使用tree shaking usedE.

作者：余韵之webpack目前是前端常用的工程化工具了。它可以帮助我们自动化构建打包各类的资源，极大的提高了我们打包代码的效率。在webpack看来，所有的资源文件都是模块(module),只是处理的方式不同。一、初探webpack1、安装webpack建议不要全局安装webpack,因为不同的项目webpack的版本号是不一样的。这样多个项目来回切换是很不方便的。npm install wepack webpack-cli -g在项目内安装webpacknpm install wepack.

作者：梁棒棒托盘虽小，作用不小。它是你的应用正在操作系统运行的标识，它可以通知你有新消息，可以唤醒应用界面，可以设置上下文（右键）菜单设置更多的功能等。下面我们就来一一实现这些功能，要在主进程进行操作。1. 创建托盘首先来创建一个托盘图标，简单三步即可：从electron库引入Tray类获取图标地址实例化Tray并传入图标地址代码也很简单：const { Tray } = require('electron')const path = require('pa.

作者：梁棒棒1.简介菜单主要分为应用程序菜单、上下文菜单，在tray和dock中也有用到菜单，本节主要介绍前两种。文档地址1.1 应用程序菜单mac和windows都在左上角，但是一个在屏幕左上角一个在应用程序视图左上角。mac是这样的：windows长这样：如果windows下没有显示菜单，在当前窗口按alt键即会出现。1.2 上下文菜单即右键菜单。2. 创建菜单2.1 创建应用程序菜单接下来我们创建应用程序菜单。如下步骤：引入Menu类定义一个菜单模板调用Me.

突然让你开发Electron应用，你能hold住吗？如果领导突然说需要开发一款前端桌面端应用，那么对于我们前端er来说选择Electron是一件顺理成章的事情。但事实上很多同学对于Electron都不太了解和熟悉。如果突然让我们去开发Electron应用，很多人都会陷入迷茫和懵逼的状态。然后在依靠网上相对较少的资料，慢慢摸索、一路踩坑的完成Electronn的需求。为了解决上述问题，我们完成了一个项目，并把它开源了出来, 希望能够对大家学习Electron有点帮助。快速学习和上手Electron:

作者：肖剑华可视化是前端可视化图形是计算机图形学向量就是那个向量，高中学过的，你懂的树是那棵贼丑的树结果首先先看看本文最终的结果。是不是贼丑！是不是能在画展上卖个好价格！过程好了，话不多说， 看看这棵贼丑的树是怎么诞生的吧。坐标系坐标系，或者说平面直角坐标系，是几何图形学的基础，其次是点、线、面这些元素。坐标系大家都很熟悉， 最初接触坐标系应该是初中， 那时候的坐标系不知大家还有没有印象。原点在中间， 水平轴是 x 轴， 竖轴是 y 轴， 分为四个象限。但是呢, ht.