Shawnchen / XMU 。

  • Home
  • Categories
  • about
  • Timelines
  • Tags

一个 web 页面的生命周期

发表于 2021-02-14
简单来说,一个 web 页面的生命周期,可以从用户输入 url 并点击访问开始(1⃣️)。浏览器发出请求给对应的服务端(2⃣️),服务端接收到请求后处理响应内容,并发送响应(3⃣️),浏览器收到服务端的返回请求(4⃣️),此时我们的页面才正式进入渲染阶段。 web 页面的渲染由两部分构成: 页面构 ...
阅读全文 »

From Nand to Tetris Note - 从与非门到俄罗斯方块课程总结

发表于 2020-12-05   |   分类于 Note
简介课程官网:From Nand to TetrisCourse 视频课程:part1, part2 课程在 Coursera 上可免费观看,课后的作业可通过官网的工具进行正确性的验证(也可申请 Coursera 奖学金,通过网站的评分系统进行作业的提交)。 本课程的全称是“依据基本原理构建现代计算 ...
阅读全文 »

CS50 note

发表于 2020-06-14   |   分类于 技术止熵
Week 0 Scratch 😺resourceCS50 2019 - Lecture 0 - Computational Thinking, Scratch - YouTubeLecture 0 - CS50xProblem Set 0 - CS50xCS50 Programmer’s Manu ...
阅读全文 »

前端模块化

发表于 2020-06-11   |   分类于 技术止熵
require,import区别? - 寸志的回答 - 知乎https://www.zhihu.com/question/56820346/answer/150724784 import - JavaScript | MDN 浏览器已原生支持 ES 模块,这对前端开发来说意味着什么? | rianm ...
阅读全文 »

Rethinking Asynchronous Programming Note

发表于 2020-06-06   |   分类于 技术止熵
01 - Course IntroductionAsync Patterns Parallel vs Async Callbacks Thunks Promises Generators/Coroutines Event Reactive (observables) CSP (channel-ori ...
阅读全文 »

最小生成树

发表于 2020-03-14   |   分类于 技术止熵
introduction加权图:是一种为每条边关联一个权值或是成本的图模型 最小生成树:给定一幅加权无向图,找到它的一棵最小生成树 定义: 图的生成树是它的一棵含有其所有顶点的无环联通子图。一幅加权图的最小生成树(MST)是它的一棵权值(树中所有边的权值之和)最小的生成树。 Given. Und ...
阅读全文 »

有向图

发表于 2020-03-14   |   分类于 技术止熵
IntroductionDigraph. Set of vertices connected pairwise by directed edges. 有向图常见问题Path. Is there a directed path from s to t ?Shortest path. What is ...
阅读全文 »

无向图

发表于 2020-03-14   |   分类于 技术止熵
Introduction定义: 图是由一组顶点和一组能够将两个顶点相连的边组成 Undirected graphsGraph. Set of vertices connected pairwise by edges. Graph applications 图的相关术语Path. Sequence o ...
阅读全文 »

散列表

发表于 2020-03-14   |   分类于 技术止熵
Introduction如果所有的键都是小整数,我们可以用一个数组来实现无序的符号表,将键作为数组的索引而数组中的键 i 处储存的就是它对应的值。这样我们就可以快速访问任意键的值。 使用散列的查找算法分为两步:第一步:使用散列函数将被查找的键转化为数组的一个索引第二步:处理碰撞冲突(拉链法和线性探测 ...
阅读全文 »

平衡查找树

发表于 2020-03-13   |   分类于 技术止熵
2-3 树Allow 1 or 2 keys per node. 2-node: one key, two children. 3-node: two keys, three children. Symmetric order. Inorder traversal yields keys in ...
阅读全文 »

快速排序

发表于 2020-03-13   |   分类于 技术止熵
简介快速排序是一种分治的排序算法。它将一个数组分成两个子数组,将两部分独立地排序。 优点:原地排序(只需要一个很小的辅助栈),且将长度为 N 的数组排序所需的时间和 NlogN 成正比;缺点:非常脆弱,在实现时要非常小心才能避免低劣的性能。 Basic Plan Shuffle the array. ...
阅读全文 »

归并排序

发表于 2020-03-11   |   分类于 技术止熵
简介要将一个数组排序,可以先(递归地)将它分为两半分别排序,然后将结果归并起来。 优点: 将任意长度为 N 的数组排序所需时间和 NlogN 成正比;缺点:所需的额外空间和 N 成正比。 Basic Plan Divide array into two halves. Recursively sor ...
阅读全文 »

背包、队列和栈

发表于 2020-03-09   |   分类于 技术止熵
栈定义栈是一种基于后进先出(LIFO)策略的集合类型。 API 链表实现 pop push 代码12345678910111213141516171819202122232425public class LinkedStackOfStrings { private Node firs ...
阅读全文 »

数据结构与算法

发表于 2020-03-08   |   分类于 技术止熵
整体大纲 Topic Data structure and algorithms data types stack, queue, bag, union-find, priority queue sorting quicksort, mergesort, heapsort sea ...
阅读全文 »

二叉查找树

发表于 2020-02-29   |   分类于 技术止熵
二叉树的定义我们可以将二叉树定义为一个空链接,或者是一个有左右两个链接的节点,每个链接都指向一棵(独立的)子二叉树。 定义:一棵二叉查找树(BST)是一棵二叉树,其中的每一个节点都含有一个 Comparable 的键(以及相关联的值)且每个节点的键都大于其左子树中的任意节点的键而小于右子树的任意节点 ...
阅读全文 »

前端数据采集

发表于 2020-01-16   |   分类于 技术止熵
各种采集方式的对比 代码埋点 全埋点 可视化埋点 服务端埋点 采集方式 嵌入 SDK 定义事件并添加事件代码 嵌入 SDK 嵌入 SDK 可视化圈选定义事件 接口调用 数据结构化 场景 任何以业务价值为出发点的行为分析 无需采集事件 适用于活动页 关键页面设计体验衡量 用户在页面的 ...
阅读全文 »

关于cookie

发表于 2020-01-08   |   分类于 技术止熵
什么是 cookieHTTP Cookie(也叫Web Cookie或浏览器Cookie)是服务器发送到用户浏览器并保存在本地的一小块数据,它会在浏览器下次向同一服务器再发起请求时被携带并发送到服务器上。通常,它用于告知服务端两个请求是否来自同一浏览器,如保持用户的登录状态。 Cookie的意义:C ...
阅读全文 »

符号表

发表于 2019-11-10   |   分类于 技术止熵
关于符号表基本功能Insert a value with specified key.Given a key, search for the corresponding value. 应用DNS lookup Insert domain name with specified IP address ...
阅读全文 »

优先队列与堆排序

发表于 2019-11-07   |   分类于 技术止熵
优先队列 APIRequirement. Generic items are Comparable. 123456789101112131415161718192021public class MaxPQ<Key extends Comparable<Key>> // ...
阅读全文 »

鱼翅与花椒

发表于 2019-10-06   |   分类于 纸上得来
序言 中国人啥都吃这两瓣皮蛋好像在瞪着我,如同闯入噩梦的魔鬼之眼,幽深黑暗,闪着威胁的光。蛋白不白,是一种脏兮兮、半透明的褐色;蛋黄不黄,是一坨黑色的淤泥,周边一圈绿幽幽的灰色,发了霉似的。整个皮蛋笼罩着一种硫磺色的光晕。仅仅出于礼貌,我夹起一块放在嘴里,那股恶臭立刻让我无比恶心,根本无法下咽。之后 ...
阅读全文 »

Advanced React

发表于 2019-08-24   |   分类于 技术止熵
生命周期React 16 Lifecycle Methods: How and When to Use Them constructorThe first thing that gets called is your component constructor. Most Common Use C ...
阅读全文 »

DevOps

发表于 2019-08-20   |   分类于 技术止熵
DevOps 是什么DevOps 中的 Dev 指的 Development,Ops 指的是的 Operations,用一句话来说 DevOps 就是打通开发运维的壁垒,实现开发运维一体化。 从敏捷开发到 DevOps敏捷开发 👉 持续集成 👉 持续交付 👉 持续部署 👉 DevOps 持 ...
阅读全文 »

调用栈

发表于 2019-08-19   |   分类于 技术止熵
调用栈是解释器追踪函数执行流的一种机制。当执行环境中调用了多个函数时,通过这种机制,我们能够追踪到哪个函数正在执行,执行的函数体中又调用了哪个函数。 每调用一个函数,解释器就会把该函数添加进调用栈并开始执行。 正在调用栈中执行的函数还调用了其它函数,那么新函数也将会被添加进调用栈,一旦这个函数被调 ...
阅读全文 »

搭建 react 脚手架

发表于 2019-08-14   |   分类于 技术止熵
基本构建(React, webpack, and Babel 7)项目初始化12345mkdir react-project && cd $_mkdir -p srcnpm init -y 配置 webpack1234npm i webpack --save-dev// 可能还需要 ...
阅读全文 »

ES Module

发表于 2019-08-14   |   分类于 技术止熵
为什么 ES Module 的浏览器支持没有意义
阅读全文 »

ES6+

发表于 2019-08-12   |   分类于 技术止熵
ES2019ArrayArray.flat()可将多层数组扁平化,默认深度为 1,若想获得完全扁平化数组,可传入 Infinity 12345678910111213const arr1 = [1, 2, [3, 4]];arr1.flat(); // [1, 2, 3, 4]const arr2 ...
阅读全文 »

HTTP

发表于 2019-08-09   |   分类于 技术止熵
Overview of HTTPAn overview of HTTP HTTP is an application-layer protocol for transmitting hypermedia documents. HTTP follows a classical client-serve ...
阅读全文 »

Domain Name System(DNS)

发表于 2019-07-25   |   分类于 技术止熵
基本介绍相关术语Domain Name SystemNetworking system in place that allows us to resolve human-friendly names to unique addresses. Domain NameA domain name is ...
阅读全文 »

About The Internet

发表于 2019-07-23   |   分类于 技术止熵
Who runs the Internet Understanding client and serverThe Client The device in front of you Runs some kind of web browser The Server Where your public ...
阅读全文 »

The Good Parts of JavaScript and the Web

发表于 2019-07-09   |   分类于 NOTE
Function the Ultimatethis The this parameter contains a reference to the object of invocation. this allows a method to know what object it is concerne ...
阅读全文 »

网站通用解决方案

发表于 2019-07-08   |   分类于 NOTE
小型网站通用解决方案——日均 PV 1-10 万 中型网站通用解决方案-日均 PV 达 10 万 ~ 50 万
阅读全文 »

🐳 docker

发表于 2019-07-07   |   分类于 技术止熵
docker 是什么什么是容器What is a Container? A container is a standard unit of software that packages up code and all its dependencies so the application runs ...
阅读全文 »

穷查理宝典

发表于 2019-07-07   |   分类于 纸上得来
穷查理宝典:查理·芒格智慧箴言录彼得·考夫曼35个笔记 中文版序言 书中自有黄金屋股票本质上是公司的部分所有权,股票的价格就是由股票的价值,也就是公司的价值所决定的。而公司的价值又是由公司的盈利情况及净资产决定的。 虽然股票价格上上下下的波动在短期内很难预测,但长期而言一定是由公司的价值决定的。而 ...
阅读全文 »

内容分发网络CDN

发表于 2019-07-06   |   分类于 技术止熵
CDN 将源站内容分发至最接近用户的节点,使用户可就近取得所需内容,提高用户访问的响应速度和成功率。解决因分布、带宽、服务器性能带来的访问延迟问题,适用于站点加速、点播、直播等场景。 相关名词加速域名加速域名即需要使用CDN加速的域名。域名是一组服务器的地址,可以是网站、电子邮件、FTP等。 源站实 ...
阅读全文 »

对象存储OSS

发表于 2019-07-06   |   分类于 技术止熵
什么是云对象存储对象存储服务(Object Storage Service,OSS)是一种海量、安全、低成本、高可靠的云存储服务,适合存放任意类型的文件。容量和处理能力弹性扩展,多种存储类型供选择,全面优化存储成本。 什么是云对象存储 云对象存储的优势 持久性、可用性和可扩展性 合规性和安全性 灵活 ...
阅读全文 »

Linux FHS

发表于 2019-07-06   |   分类于 技术止熵
FHS,全称为 Filesystem Hierarchy Standard (文件系统层次结构标准),定义了 Linux 操作系统中的主要目录及目录内容。 根目录下的子目录* 为比较重要目录 目录 描述 / 第一层次结构的根、 整个文件系统层次结构的根目录。 /bin/ bin是 ...
阅读全文 »

玩转Charles

发表于 2019-07-05   |   分类于 技术止熵
Charles 是在 Mac 下常用的网络封包截取工具,在做移动开发时,我们为了调试与服务器端的网络通讯协议,常常需要截取网络封包来分析。Charles 通过将自己设置成系统的网络访问代理服务器,使得所有的网络访问请求都通过它来完成,从而实现了网络封包的截取和分析。 基础设置Charles 从入门到 ...
阅读全文 »

常用Linux指令

发表于 2019-07-03   |   分类于 技术止熵
目录和文件处理mkdir 建立目录1234# 用法:mkdir [OPTION] DIRECTORY...# 例:mkdir fangru rmdir ( remove directory ) 删除给定的目录 ls ( list ) 列出目录下的内容1234# 用法:ls [OPTION]... ...
阅读全文 »

CSS Layout

发表于 2019-06-30   |   分类于 技术止熵
几种 CSS 布局 Normal flow Flexbox Grid Floats Positioning Table layout Multiple-column layout 针对具体场景使用合适的布局方式 Each technique has its uses, advantages, a ...
阅读全文 »

Nginx

发表于 2019-06-29   |   分类于 技术止熵
Nginx 简介Nginx(发音:engine X)是一款轻量级的 HTTP 服务器(相比于Apache、Lighttpd而言),同时是一个高性能的 HTTP 和反向代理服务器。 NGINX is a free, open-source, high-performance HTTP server ...
阅读全文 »

关于移动端开发

发表于 2019-06-29   |   分类于 技术止熵
移动前端开发和 Web 前端开发的区别兼容性 PC:IE、Firefox、Chrome、Safari Mobile:webkit 内核浏览器和 Chrome、UC、QQ、小米手机浏览器 移动端系统下面甚至同一系统不同机型下面,因为内核版本的不同,以及厂商对系统的定制,渲染出来会存在比较大的差异,典 ...
阅读全文 »

《Effective JavaScript》

发表于 2019-06-28   |   分类于 技术止熵
Chapter 1: Accustoming Yourself to JavaScriptItem 1: Know Which JavaScript You Are UsingItem 2: Understand JavaScript’s Floating-Point NumbersItem 3: ...
阅读全文 »

Functional Programming

发表于 2019-06-27   |   分类于 技术止熵
JS 函数式编程指南 A GENTLE INTRODUCTION TO FUNCTIONAL JAVASCRIPT 系列 PART 1 PART 2 PART 3 PART 4 FUNCTIONAL JAVASCRIPT 系列 FUNCTIONAL JAVASCRIPT: FIVE WAYS ...
阅读全文 »

Git Usage Guide

发表于 2019-06-26   |   分类于 技术止熵
What is Git? Why Git?What is Git? Why Git for your organization Why Git for your organizationFeature Branch Workflow: One of the biggest advantages of ...
阅读全文 »

flex 布局

发表于 2019-06-25   |   分类于 技术止熵
背景长久以来,唯一可用的且有稳定的跨浏览器兼容性的能用来构建 CSS 布局的工具只有 floats 和 positioning。它们能够简单且有效地满足大部分布局场景,但是在某些复杂布局方面它们就难以实现了,如: 在父内容里面垂直居中一个块内容。 使容器的所有子项占用等量的可用宽度/高度,而不管有 ...
阅读全文 »

Promise

发表于 2019-06-23   |   分类于 技术止熵
什么是 PromisePromise 是异步编程的一种解决方案,比传统的解决方案(回调函数和事件)更合理和更强大。 A promise is a placeholder for the result of an asynchronous operation. Promise 的特点1. 对象的状态 ...
阅读全文 »

Ein Hund namens Money

发表于 2019-06-23   |   分类于 纸上得来
博多·舍费尔22个笔记 前言并非困难使我们放弃,而是因为我们放弃,才显得如此困难。 第一章 白色的拉布拉多犬我也不认为钱是人一生中最重要的东西。可是假如我们缺钱的话,钱就会变得格外重要。 第二章 梦想储蓄罐和梦想相册好奇是好的,但是绝不能让好奇阻碍你做事。太多的人做事犹豫不决,就是因为他们觉得没有完 ...
阅读全文 »

Rich Dad Poor Dad

发表于 2019-06-16   |   分类于 纸上得来
富爸爸穷爸爸(20周年修订版)罗伯特·清崎80个笔记 后见之明 20年后的今天 此图证明在这个新世纪的最初10年有三次巨大的股市崩盘,并详细地展示了这三次股市崩盘。 1895-2015年间的道琼斯工业指数 第一次崩盘是2000年左右的科技股崩盘。第二及第三次则是2007年的房地产市场崩盘,紧接着 ...
阅读全文 »

初级排序算法

发表于 2019-06-15   |   分类于 技术止熵
意义:排序算法常常是我们解决其他问题的第一步 选择排序 插入排序 希尔排序 初级算法的意义 这些简单的算法在某些情况下比复杂算法更有效; 它们有助于改进复杂算法的效率 1️⃣ 选择排序定义首先,找到数组中最小的那个元素,其次,将它和数组中的第一个元素交换位置。再次,在剩下的元素中找到最小的元 ...
阅读全文 »

JavaScript 面向对象的程序设计

发表于 2019-06-15   |   分类于 技术止熵
理解对象属性类型数据属性数据属性有 4 个描述其行为的特性。 [[Configurable]]:表示能否通过 delete 删除属性从而重新定义属性,能否修改属性的特性,或者能否把属性修改为访问器属性。像前面例子中那样直接在对象上定义的属性,它们的这个特性默认值为 true。 [[Enumer ...
阅读全文 »

一生中最幸福的时刻

发表于 2019-03-10   |   分类于 想养一只北极熊
其实任何人,在经历时,都不会知道自己正在经历一生中最幸福的时刻。也许一些人在某些欣喜若狂的时刻能够真诚地想到或者说,『此刻』他们正在经历一生中那个金色的时刻,但是他们依然会相信,他们将在以后经历比这还要美好和幸福的时刻。因为特别是在青年时期,就像没人一边想着今后的一切将会更糟糕,一边来继续他们的生活 ...
阅读全文 »

Unit Testing with Vue.js

发表于 2019-02-27   |   分类于 技术止熵
Basic Notions Expect: Used to construct assertions, compare a value with the expected result on a test. Chai Assertions. Spy: A test spy is an object ...
阅读全文 »

Dive Into Chrome DevTool

发表于 2019-01-19   |   分类于 技术止熵
Elements左边是 DOM 元素, 右边是对应的 CSS。 颜色切换颜色格式 按住 shift 键点击颜色框可以切换颜色的不同格式 调色板 Material: Material Design 配色方案 Page colors: 页面中使用到的颜色 对比度建议 DOM 元素展开子元素 按住 ...
阅读全文 »

海王

发表于 2019-01-04   |   分类于 想养一只北极熊
2018 年的最后一天,跨年夜看了海王,和哥哥还有他的朋友。 客观上来说海王算得上是一部很好的商业片,剧情简单,场面宏大,特效震撼。观影门槛不高,省脑子,所以受众广,很适合在这种节假日和朋友一块看。不过这种电影呢,看完了也就过去了,脑子里剩下的东西不多,感官上倒是刺激,像是一起坐了一趟过山车。 有些 ...
阅读全文 »

『深入 VUE』路由

发表于 2019-01-02   |   分类于 技术止熵
极简路由实现需求: 当 url 为 #foo 时显示 foo 当 url 为 #bar 时显示 bar 12345678910111213141516171819202122<div id="app"> <component :is="url"></compone ...
阅读全文 »

『深入 VUE』状态管理

发表于 2018-12-31   |   分类于 技术止熵
我们在开发应用时,存在许多子组件需要响应同一个数据变化的情况,一般我们是把这个数据维护在这些子组件的共同父组件上,通过 props 向下传递,但是当项目变得复杂时,这种方法会显得很繁琐且难以维护。 当这种情况变得越来越多时,就要考虑在项目中引入状态管理了。 状态管理和普通的 props 传值有什么区 ...
阅读全文 »

子贡赎人

发表于 2018-12-23   |   分类于 想养一只北极熊
鲁国之法,鲁人为人臣妾于诸侯,有能赎之者,取其金于府。子贡赎鲁人于诸侯,来而让,不取其金。孔子曰:『赐失之矣。自今以往,鲁人不赎人矣。取其金则无损于行,不取其金则不复赎人矣。』《吕氏春秋》 前几天看到一个帖子,发帖者被医院告知他的骨髓和一位白血病患者正好配对,他犹豫要不要帮助这个患者做进一步的骨髓 ...
阅读全文 »

『 深入 VUE 』响应

发表于 2018-12-22   |   分类于 技术止熵
简单的响应给定 a 和 b 两个参数,要求无论 a 如何变化,b 永远等于 a 的 10 倍,如何实现? 即如下效果: 123456let a = 3let b = a * 10console.log(b) // 30a = 4b = a * 10console.log(b) // 40 在每次改变 ...
阅读全文 »

西湖

发表于 2018-12-10   |   分类于 想养一只北极熊
2018 年 12 月 7 日,是一年二十四节气中的大雪,杭州城迎来今年的第一场雪。 雪后直奔断桥,时间在午饭过后的下午一两点钟。 雪后的断桥真可谓人山人海、摩肩擦踵。人人都道断桥残雪,所以杭州城每下大雪,大家都往西湖断桥跑,于是如今桥上有空间的地方几乎都站了人,人再一走动,地上的雪都被踩成了冰,又 ...
阅读全文 »

必然

发表于 2018-12-02   |   分类于 想养一只北极熊
1587 年,是为万历十五年,岁次丁亥,表面上似乎是四海升平,无事可记,实际上我们的大明帝国却已经走到了它发展的尽头。在这个时候,皇帝的励精图治或者宴安耽乐,首辅的独裁或者调和,高级将领的富于创造或者习于苟安,文官的廉洁奉公或者贪污舞弊,思想家的极端进步或者绝对保守,最后的结果,都是无分善恶,统统不 ...
阅读全文 »

NodeJS 的适用场景

发表于 2018-07-20   |   分类于 技术止熵
Apache 的多线程高并发模式优点:支持多线程并发 缺点:阻塞 什么是线程线程是可以独立运行的最小的 CPU 单位,可以在同一个进程里并发运行,共享该进程下的内存地址空间。 当不同的线程需要占用同一个变量时,根据先到先得的原则,先到的线程在运作时,后来的线程只能在旁边等待,也就是加入到了阻塞排队序 ...
阅读全文 »

使用 gulp 实现基于文件内容的指纹

发表于 2018-07-17   |   分类于 技术止熵
指纹是什么指纹可以根据文件内容生成文件名。文件内容变化后,文件名也会改变。对于静态内容,或者很少改动的内容,在不同的服务器之间,不同的部署日期之间,使用指纹可以区别文件的两个版本内容是否一样。 为什么需要指纹如果文件名基于内容而定,而且文件名是唯一的,HTTP 报头会建议在所有可能的地方(CDN,I ...
阅读全文 »

亚洲周刊:20世纪最优秀的100部中文小说

发表于 2018-06-30   |   分类于 NOTE
《呐喊》鲁迅 ✔️ 《边城》沈从文 ✔️ 《骆驼祥子》老舍 ✔️ 《传奇》张爱玲 《围城》钱锺书 ✔️ 《子夜》茅盾 ✔️ 《台北人》白先勇 ✔️ 《家》巴金 ✔️ 《呼兰河传》萧红 ✔️ 《老残游记》刘鹗 ✔️ 《寒夜》巴金 《彷徨》鲁迅 《官场现形记》李伯元 《财主底儿女们》路翎 《将军族》陈 ...
阅读全文 »

JavaScript 中 this 的绑定

发表于 2018-06-27   |   分类于 技术止熵
关于 thisthis 关键字是 JavaScript 中最复杂的机制之一,它是一个很特别的关键字,被自动定义在所有函数的作用域中。 this 提供了一种更优雅的方式来隐式『传递』一个对象的引用,因此可以将 API 设计得更加简洁并且易于复用。 注意: 1.this 不指向自身 1234567891 ...
阅读全文 »

通用服务设计

发表于 2018-06-23   |   分类于 技术止熵
设计背景源于当时负责的一个官网主页的全新项目,由于官网类型的项目业务逻辑简单,主要是静态内容的展示,同时需要考虑到 SEO,所以很适合将这类应用的服务端设计成一套通用的解决方案,加快同类型应用开发的效率。 设计原则 简单:在满足业务需求的前提下尽量简单,不引入功能重复的模块 通用:与业务解耦,使得同 ...
阅读全文 »

JavaScript设计模式

发表于 2018-06-19   |   分类于 技术止熵
设计模式的意义 模式为常见问题提供了行之有效的解决方案:模式提供了解决特定问题的优化模板; 模式旨在重用:它们具备通用性,适合于各种问题。 《设计模式:可复用的面向对象软件基础》的作者『四人帮』将设计模式宽泛地划分为以下几类: 创建型设计模式:该模式处理的是用于创建对象的各种机制,这种模式着眼于 ...
阅读全文 »

JavaScript中的作用域

发表于 2018-06-07   |   分类于 技术止熵
1. LHS 与 RHSLHS 即找到变量容器本身,并对其进行赋值,RHS 即得到某某的值。 12345function foo(a) { var b = a; return a + b;}var c = foo(2) 以上代码中的LHS查询有3处:c = ..、a ...
阅读全文 »

防抖、节流

发表于 2018-04-16   |   分类于 技术止熵
浏览器的 resize、scroll、keypress、mousemove 等事件在触发时,会不断地调用绑定在事件上的回调函数,极大地浪费资源,降低前端性能。为了优化体验,需要对这类事件进行调用次数的限制。 防抖(debounce)作用是在短时间内多次触发同一个函数,只执行最后一次,或者只在开始时执 ...
阅读全文 »

失眠

发表于 2018-04-06   |   分类于 想养一只北极熊
你知道吗?你的梦可能导致一个人的失眠。 当你在做梦时,你所梦到的场景不仅仅是靠你的大脑产生,每个参与到你梦中的人都需要贡献各自的能量。 通俗点来说,我们可以把睡眠当成是恢复体力的一个过程,一个好的睡眠当然是一觉睡到天亮自然醒,然后感觉精神抖擞体力充沛。而做梦是个耗体力的过程,睡觉时梦一多就容易睡不好 ...
阅读全文 »

无限

发表于 2018-04-03   |   分类于 想养一只北极熊
如果空间是无限的,我们就处在空间的任何一点。如果时间是无限的,我们就处在时间的任何一点。 空间的无限,为物质的重复提供了可能性。在无限的空间中必然存在另一个相同的地球,相同的国家,相同的人。无限扩展的空间让所有偶然性得以组合。 时间的无限,为历史的重复提供了可能性。在无限的时间当中,任何之前发生过的 ...
阅读全文 »

语言的陷阱

发表于 2018-03-31   |   分类于 想养一只北极熊
语言是我们沟通的工具,是我们描述客观世界和表达内心的途径。 对语言使用的熟练度直接决定了沟通效率的高低以及描述客观世界和内心情感的准确度。 我们将大脑中的思维通过语言表述出来,而语言反过来也将作用于大脑,影响思维。 语言如何影响思维? 想象有这么一种语言,在这种语言体系之下所有表述方位的词语只有东南 ...
阅读全文 »

Responsive Layout In an Easy Way

发表于 2018-03-19   |   分类于 技术止熵
在这里我们将实现一个基于窗口宽度的自适应布局,并且实现方法极为简单,不用在 HTML 文件中添加那些复杂的类名(col-sm-4、col-md-8 之类的),也不需要为各种屏幕尺寸添加媒体查询。 The setup我们使用下面的 HTML 模板: 12345678<div class=&qu ...
阅读全文 »

CSS 栅格系统

发表于 2018-03-18   |   分类于 技术止熵
GridCSS 栅格布局中最重要的两个元素是 wrapper(parent) 和 items(children)。wrapper 实际上就是栅格,而 items 就是栅格里面的元素。 以下面的代码为例: 12345678<div class="wrapper"> ...
阅读全文 »

遗忘之美

发表于 2018-03-10   |   分类于 想养一只北极熊
想象一下,你有一个 1T 的硬盘,但是你每次只能以几个字节的速度写入, 而且时间久了数据还会自动清除,有些时候一些数据还读取得很慢,甚至无法读取。 是不是让人很绝望。但人的大脑差不多就是这么一种情况,我们会忘掉很多事情,有些记忆在脑海里会慢慢的变淡,甚至完全忘却,没有一点点痕迹。 我们会为这种遗忘感 ...
阅读全文 »

Mac-Tips

发表于 2018-03-07   |   分类于 技术止熵
配置 Launchpad1defaults write com.apple.dock springboard-columns -int 8; defaults write com.apple.dock springboard-rows -int 7; defaults write com.apple ...
阅读全文 »

5 分钟了解 CSS 变量

发表于 2018-02-27   |   分类于 NOTE
原文链接 Learn CSS Variables in 5 minutes CSS 自定义属性(即变量属性)是前端开发者的一大利器,它将变量的强大属性引入到 CSS 当中,从而减少了代码的重复性、提高了代码的可读性和灵活性。 此外,与一些 CSS 预处理器不同的是,CSS 变量实际上是 DOM 的一 ...
阅读全文 »

废人是怎样炼成的

发表于 2018-02-26   |   分类于 想养一只北极熊
如何成为一个废人? 总结为四点:懒、闲、不学习、不思考。 具体为: 沉溺于轻易获得的快感喜欢用很小的付出来获得成就感,例如:游戏、彩票、赌博、吸毒。 习惯于接受『低信息密度』的内容不愿意处理太需要动脑的信息,只愿意接受信息密度低的信息,例如:无需太多动脑的视频、没有深度的电影、一些娱乐、八卦、花边新 ...
阅读全文 »

客观

发表于 2018-02-25   |   分类于 想养一只北极熊
客观性是哲学的一个中心概念,指从不同观点或角度来思考或判断某件事物的合理性,一个事物不受主观思想或意识影响而独立存在的性质。 我们常常说要以客观的角度来看待问题,以客观的角度来看世界,那到底我们有没有办法以一种最客观的角度去看待一切事情? 博尔赫斯写过一个叫『阿莱夫』的东西。阿莱夫是什么?阿莱夫其实 ...
阅读全文 »

如何创建并发布一个Chrome扩展应用

发表于 2018-02-24   |   分类于 NOTE
原文链接:How to Create and Publish a Chrome Extension in 20 minutes 有没有想过自己创建一个 Chrome 扩展应用?看完这篇文章你将会发现这是多么的简单。按照下面这些步骤,你将会很快地将你的想法实现为真实的应用,并在 Chrome Web ...
阅读全文 »

前端性能

发表于 2018-02-22   |   分类于 技术止熵
性能衡量指标 相关指标及计算方式: 维度: 运营商 网络 URL 性能监控如何监控 7 天打造前端性能监控系统 使用性能API快速分析web前端性能 你是如何搭建 Web 前端性能监控系统的 性能优化优化点: 高频事件消抖、节流。使用_.debounce()和_. throttle(), ...
阅读全文 »

无用

发表于 2018-02-20   |   分类于 想养一只北极熊
山木自寇也,膏火自煎也。桂可食,故伐之;漆可用,故割之。人皆知有用之用,而莫知无用之用也。《庄子·内篇·人间世》 何谓有用之用? 利人之用也。 何谓无用之用? 悦己之用也。 看一些无用的书,做一些无用的事,发展一些无用的爱好,都是为了在一切功利性的选择之间,保留一个超越自己的机会,追求一种存在的价 ...
阅读全文 »

Closures

发表于 2018-01-20   |   分类于 NOTE
定义A closure is the combination of a function and the lexical environment within which that function was declared. 1234567891011function makeAdder(x) ...
阅读全文 »

使用 CSS 变量实现酷炫的悬停效果

发表于 2018-01-02   |   分类于 NOTE
原文链接:Stunning hover effects with CSS variables 最近在 Grover 上看到一个有趣的悬停动画,由此受到启发,让鼠标悬停在按钮上然后按钮随着光标的移动出现渐变色。这个想法很简单,但结果却很惊艳。 那么如何实现这么一个酷炫的效果呢?其实远没有你想象的那么 ...
阅读全文 »

获取站点图标的两种方法

发表于 2017-12-21   |   分类于 技术止熵
使用 google 的服务1https://www.google.com/s2/favicons?domain={domain-name} 将 domain-name 替换为目标网页 使用 firefox 开发者工具打开网页 → 点击工具 → 页面信息 → 媒体 复制站点图标的地 ...
阅读全文 »

使用 pm2 管理项目

发表于 2017-12-21   |   分类于 技术止熵
PM2 安装123npm install pm2 -gnpm install pm2@latest -gnpm install git://github.com/Unitech/pm2#master -g 升级12npm install pm2@latest -gpm2 update #Updat ...
阅读全文 »

变形记

发表于 2017-12-12   |   分类于 想养一只北极熊
一天早晨,格里高尔从睡梦中醒来,发现自己躺在床上,变成了一只巨大的臭虫。卡夫卡·《变形记》 在文学评论当中一般把卡夫卡的《变形记》评价为荒诞派文学的代表作。 荒诞派文学有这么几个特点: 『荒诞』作为艺术的表现手段,整体荒诞而细节真实; 艺术手段上的夸张变形是极端化的主题需求,通过『荒诞』的手段来 ...
阅读全文 »

关于测试

发表于 2017-12-02   |   分类于 技术止熵
单元测试 由开发人员写,给开发人员使用 小段代码,目的是开发人员确定源代码做了希望它做的事 一个UT case 只能针对一个类 一个类的 UT 必须是完全独立的 UT 可以是自动的,也可以是手动的 UT 覆盖率问题 测试时,当调用了其他类的代码时,应该使用 mock 将被测试类和其他类隔开 测试 ...
阅读全文 »

Stray Birds

发表于 2017-11-17   |   分类于 纸上得来
Stray Birds, written by Indian poet Rabindranath Tagore, is one of my favorite poetry. It is about love, about nature, about humanity. It is full of h ...
阅读全文 »

听歌

发表于 2017-10-05   |   分类于 想养一只北极熊
有没有一直以来最喜欢的一首歌? 对我来说是没有的,很难有一首歌可以永远占据着最喜欢的那个位置。旋律在一次次的循环后可能会听腻,歌词在一遍遍的品味之后可能就没有一开始的新奇的感觉。好的作品确实经得起反复品味,每一次听的感受都会有所不同,当你完全熟悉了这首歌的旋律和歌词的时候和你初次听到这首歌时的感觉往 ...
阅读全文 »

居中方案

发表于 2017-09-17   |   分类于 技术止熵
让一个元素水平居中很简单:如果是内联元素,可以在父元素上设置text-align: center;如果是一个块元素,可以使用margin: auto。 而垂直居中就复杂得多。 有如下样式: 1234<main> <h1>Am I centered yet?</h ...
阅读全文 »

搭建账户系统

发表于 2017-09-12   |   分类于 NOTE
Building account systems Troy Hunt 近期发表了一篇题为『新时代的认证指南』的博文。文章对于「在你的网站中应该使用什么样的密码规则」给予了诸多建议,而这些参考了正式的政策提议的建议常常很能帮助你去说服你的同事或老板。 我在 Google 工作期间所从事的一个项目 ...
阅读全文 »

函数式编程

发表于 2017-08-16   |   分类于 NOTE
函数式编程入门教程 为什么要『函数式编程』?范畴论函数式编程的起源,是一门叫做范畴论(Category Theory)的数学分支,它认为世界上所有的概念体系,都可以抽象成一个个的”范畴”(category)。 范畴的概念彼此之间存在某种关系的概念、事物、对象等等,都构成”范畴”。随便什么东西,只要能 ...
阅读全文 »

如何用好 console

发表于 2017-08-05   |   分类于 NOTE
原文链接:How to get the most out of the JavaScript console 在JavaScript中,最基本的调试工具就是console.log()。console中有还很多其他的实用方法可以成为开发者调试的好帮手。 使用console,你可以做到: 输出一个计时 ...
阅读全文 »

当我们在谈大前端时,我们谈的是什么

发表于 2017-08-01   |   分类于 NOTE
当我们在谈大前端的时候,我们谈的是什么 三个层面上的大前端大前端与NodeJS与前后端分离过去几年,前端技术经历了爆发式的发展,这种发展最重要的推动者之一就是NodeJS。 前后端分离指的是后端只提供接口,前端对页面有完整控制,同时通过中间层将前后端隔开,在这里对数据进行抽取、聚合、分发等操作。 从 ...
阅读全文 »

HTTP 状态码

发表于 2017-07-29   |   分类于 技术止熵
状态码为客户端提供了一种理解事物处理结果的便捷方式。 总的来说,可以将HTTP状态码分为五类: 以1开头的信息性状态码;以2开头的成功状态码;以3开头的重定向状态码;以4开头的客户端错误状态码;以5开头的服务器错误状态码; 100 ~ 199 —— 信息性状态码100 Continue说明收到了初始 ...
阅读全文 »

HTTP报文

发表于 2017-07-29   |   分类于 技术止熵
HTTP报文是HTTP应用程序之间发送的数据块。 这些数据块以一些文本形式的元信息开头,这些信息描述了报文的内容及含义,后面跟着可选的数据部分。 这些报文在客户端、服务器和代理之间流动。 报文流术语“流入”、“流出”、“上游”及“下游”都是用来描述报文方向的。 HTTP使用术语流入和流出来描述事务处 ...
阅读全文 »

URL与资源

发表于 2017-07-29   |   分类于 技术止熵
URL是因特网资源的标准化名称,URL指向一条电子信息片段,告诉你它们位于何处,以及如何与之进行交互。 浏览因特网资源URL是人们对HTTP和其他协议的常用访问点:一个人将浏览器指向一个URL,浏览器就会在幕后发送适当的协议报文来获取人们所期望的资源。 URI是一类更通用的资源标识符,URL实际上是 ...
阅读全文 »

HTTP 概述

发表于 2017-07-26   |   分类于 技术止熵
Web浏览器、服务器和相关的Web应用程序都是通过HTTP相互通信的。HTTP是现代全球因特网中使用的公共语言。 HTTPHTTP(Hypertext Transfer Protocol),中文一般翻译为“超文本传输协议”,HTTP使用的是一种可靠的数据传输协议,使用HTTP通信能够保证数据在传输的 ...
阅读全文 »

前端跨域问题

发表于 2017-06-19   |   分类于 技术止熵
造成跨域的两种策略跨域请求存在问题是因为浏览器存在安全策略,第一个是同源策略(SOP, Same-Origin Policy),第二个是浏览器中不同域的框架(iframe)之间不能通过 js 进行交互。 同源策略的同源定义:如果协议(protocol),端口(port)和主机(host)对于两个页面 ...
阅读全文 »

用 JavaScript 实现树

发表于 2017-03-27   |   分类于 技术止熵
树是一种非顺序数据结构,它用于存储需要快速查找的数据非常有用。 树是一种分层数据的抽象模型。现实中最常见的例子是家谱,或是公司的组织架构: 树的相关术语一个树结构包含一系列存在父子关系的节点。每个节点都有一个父节点(除了顶部的第一个节点)以及零个或多个子节点: 节点:树中的每个元素都叫做节点, ...
阅读全文 »

用 JavaScript 实现队列

发表于 2017-03-26   |   分类于 技术止熵
队列和栈非常类似,但是使用了不同的原则,而非后进先出。 队列是遵循FIFO(First In First Out,先进先出, 也称先来先服务)原则的一组有序的项。队列在尾部添加新元素,并从顶部移除元素。最新添加的元素必须排在队列的末尾。 在现实中,最常见的例子就是排队: 排在第一位的人会先接受服务。 ...
阅读全文 »

用 JavaScript 实现集合

发表于 2017-03-26   |   分类于 技术止熵
集合是由一组无序且唯一(即不能重复)的项组成的,在数学中,集合是一组不同的对象(的集),包含并集、交集、差集等基本操作。 创建集合在新的ECMAScript6中已经包括了Set类的实现,不过我们可以自己来实现它。 以下是我们Set类的骨架: 123function Set(){ va ...
阅读全文 »

用 JavaScript 实现栈

发表于 2017-03-26   |   分类于 技术止熵
栈是一种遵从后进先出(LIFO)原则的有序集合。新添加的或待删除的元素都保存在栈的末尾,称作栈顶,另一端就叫做栈底。在栈里,新元素都靠近栈顶,旧元素都靠近栈底。 简单点来说,类似于餐厅里面堆放的盘子,先放进来的盘子放在最底下,最后面放进来的盘子堆在最上面,洗的时候从最顶上的盘子开始洗,也就是后面来的 ...
阅读全文 »

关于时间管理

发表于 2017-02-24   |   分类于 纸上得来
什么是时间管理?时间管理是运用策略和技术,帮助你尽可能有效地利用你的时间。 这一部分包含两方面: 回顾一下你目前是如何利用你的时间。为了做到这一点,我们需要了解三个非常重要的概念: 意识是时间管理的先决条件。 目标提供线路。 选择是难点 意识:只有对时间的流逝保持高度敏感,你才能成为一个有 ...
阅读全文 »

The Great Gatsby

发表于 2017-02-14   |   分类于 纸上得来
我们都曾幻想过飞翔,最后却都留在了地上。 盖茨比一生的信念就寄托在那盏绿灯上,这个一年一年在我们眼前渐渐远去的极乐未来。 当我遥想那个古老而未知的世界时,我也可以体会到盖茨比第一次认出黛西家码头那在夜色笼罩下格外迷人的绿光时有多么惊奇。 他走过漫漫长路才来到这片碧绿的草坪上,他的梦想似乎近在眼前,触 ...
阅读全文 »
shawnchen

shawnchen

一个脱离了高级趣味的人

105 日志
5 分类
116 标签
GitHub 500px Weixin
© 2015 - 2021 shawnchen
一切都将逝去