咖啡机（K.F.J）_社区达人页

2022年04月

• 04.25 23:22:46
  发表了文章 2022-04-25 23:22:46

  两本趣味算法书

  两本趣味算法书
• 04.25 23:20:42
  发表了文章 2022-04-25 23:20:42

  前端工程化的理解

  前端工程化是一个新兴的词语，改变了前端的开发模式，《前端工程化体系设计与实践》系统的阐述了前端工程化的方方面面。
• 04.25 23:17:55
  发表了文章 2022-04-25 23:17:55

  原子设计系统

  原子设计是一种方法，由五个不同的阶段一起工作，以更慎重和更具层次的方式创建界面设计系统。

  
• 04.25 23:14:58
  发表了文章 2022-04-25 23:14:58

  前端架构设计

  最近在拜读一本《前端架构设计》的书，该书讲到前端架构师的用户是开发人员。所选择的工具、编写的代码、创建的流程，都是为了让开发人员能够构建出最高效的、不出错的、可扩展的和可持续优化的系统。
• 04.25 23:11:46
  发表了文章 2022-04-25 23:11:46

  学习项目管理

  这些天突然想了解一点关于项目管理方面的知识，因此找了一本叫做《写给大家看的项目管理书》的书，该书比较通俗易懂，下面将该书的重点部分加以记录。

  
• 04.25 23:11:36
  发表了文章 2022-04-25 23:11:36

  Web设计思想——渐进增强

  最近在拜读一本Web体验相关的书《渐进增强——跨平台用户体验设计 》，阅读后做些总结，消化一下书中的精髓。

  
• 04.25 23:11:25
  发表了文章 2022-04-25 23:11:25

  移动端H5通用表单验证插件

  将表单验证的通用部分提炼出来，做成一个简易插件，方便调用。 已将源码放到GitHub上，名字叫zValidate。

  
• 04.25 23:11:03
  发表了文章 2022-04-25 23:11:03

  JavaScript性能优化 DOM编程

  最近在研读《高性能JavaScript》，在此做些简单记录。示例代码可在此处查看到。

  
• 04.25 23:10:53
  发表了文章 2022-04-25 23:10:53

  程序员英语高效学习法

  大多数程序员的英语是软肋，包括我在内。自己也曾经试过多种方法来学习英语，但最后都是不了了之，现在回想起来，

  
• 04.25 23:09:07
  发表了文章 2022-04-25 23:09:07

  让正则更上一层楼

  《正则指引》

  
• 04.25 22:55:59
  发表了文章 2022-04-25 22:55:59

  移动端 H5图片裁剪插件，内置简单手势操作

  移动端 H5图片裁剪插件，内置简单手势操作

  
• 04.25 22:45:37
  发表了文章 2022-04-25 22:45:37

  Web性能优化工具WebPageTest（三）——本地部署（Windows 7版本）

  这次先能够使用PC端的浏览器测试，首先需要下载官方的发布版本“WebPageTest 3.0”。

  
• 04.25 22:45:26
  发表了文章 2022-04-25 22:45:26

  Web性能优化工具WebPageTest（二）——性能数据

  在前一篇《配置》完成后，点击“START TEST”，就可以开始测试，测试需要一段时间。 有时候可能还要排队，如下图所示，测试完成后可查看到测试结果。

  
• 04.25 22:42:56
  发表了文章 2022-04-25 22:42:56

  Web性能优化工具WebPageTest（一）——总览与配置

  网站性能优化工具大致分为两类：综合类和RUM类（实时监控用户类），WebPageTest属于综合类。 WebPageTest通过布置一些特定的场景进行测试，例如不同的网速、浏览器、位置等。 测试完成后，能获得优化等级、性能参数、请求瀑布图、网页幻灯片快照等，更多信息可以参考《WebPageTest快速入门》。

  
• 04.25 22:29:38
  发表了文章 2022-04-25 22:29:38

  JavaScript定时器分析

  JavaScript是单线程，同一个时间只能做一件事情，所以执行任务需要排队。如果前一个耗时很长，那么下一个只能等待。

  
• 04.25 22:29:32
  发表了文章 2022-04-25 22:29:32

  几句话描述简单算法——排序与搜索

  准备大量的木桶，用木桶的标号（数组下标）作为数据，按照木桶标号的顺序进行排序。

  
• 04.25 22:29:26
  发表了文章 2022-04-25 22:29:26

  《你不知道的JavaScript》整理（六）——强制类型转换

  JavaScript中通常分为两种类型转换，“隐式强制类型转换”（implicit coercion）和“显式强制类型转换”（explicit coercion）。 下面所有代码的源码可以在此处查看。

  
• 04.25 22:29:20
  发表了文章 2022-04-25 22:29:20

  《你不知道的JavaScript》整理（五）——值与原生函数

  JavaScript只有一种数值类型：number（数字），包括“整数”和带小数的十进制数。
• 04.25 22:29:13
  发表了文章 2022-04-25 22:29:13

  表格花式效果

  对于table的一些基础信息不了解的，可以参考我以前写过的一篇《关于table的一些记录》。下面演示的代码，具体的源码可以参考此处。

  
• 04.25 22:29:07
  发表了文章 2022-04-25 22:29:07

  JavaScript实现按键精灵

  JavaScript实现按键精灵

  
• 04.25 22:09:24
  发表了文章 2022-04-25 22:09:24

  JavaScript中几个相似方法对比

  返回字符串两个索引之间（或到字符串末尾）的子串。

  
• 04.25 21:59:05
  发表了文章 2022-04-25 21:59:05

  谨慎能捕千秋蝉（三）——界面操作劫持与HTML5安全

  ClickJacking点击劫持，这是一种视觉上的欺骗。 攻击者使用一个透明的、不可见的iframe，覆盖在网页的某个位置上，诱使用户点击iframe。

  
• 04.25 21:59:01
  发表了文章 2022-04-25 21:59:01

  谨慎能捕千秋蝉（二）——CSRF

  CSRF（Cross Site Request Forgery）跨站点请求伪造。 CSRF的本质是当重要操作的参数都能被攻击者预测到，才能成功伪造请求。

  
• 04.25 21:58:54
  发表了文章 2022-04-25 21:58:54

  谨慎能捕千秋蝉（一）——XSS

  最近在研读《白帽子讲web安全》和《Web前端黑客技术揭秘》，为了加深印象，闲暇之时做了一些总结。

  
• 04.25 21:58:29
  发表了文章 2022-04-25 21:58:29

  日月如梭，玩转JavaScript日期

  Date对象

  
• 04.25 21:43:43
  发表了文章 2022-04-25 21:43:43

  Wireshark网络抓包(四)——工具

  1. File：了解抓包文件的各种属性，例如抓包文件的名称、路径、文件所含数据包的规模等信息 2. Time：获悉抓包的开始、结束和持续时间 3. Capture：抓包文件由哪块网卡生成、OS版本、Wireshark版本等信息 4. Display：剩下的是汇总统计信息，数据包的总数、数量以及占比情况、网速等

  
• 04.25 21:30:50
  发表了文章 2022-04-25 21:30:50

  Wireshark网络抓包(三)——网络协议

  IP地址在OSI模型第三层，MAC地址在OSI第二层，彼此不直接通信； 在通过以太网发生IP数据包时，先封装第三层（32位IP地址）和第二层（48位MAC地址）的报头； 但由于发送数据包时只知道目标IP地址，不知道其Mac地址，且不能跨越第二、三层，所以需要使用地址解析协议。

  
• 04.25 21:28:46
  发表了文章 2022-04-25 21:28:46

  Wireshark网络抓包(二)——过滤器

  捕获过滤器

  
• 04.25 21:18:46
  发表了文章 2022-04-25 21:18:46

  Wireshark网络抓包(一)——数据包、着色规则和提示

  Packet Details面板内容如下，主要用于分析封包的详细信息。

  
• 04.25 20:54:14
  发表了文章 2022-04-25 20:54:14

  JavaScript字符集编码与解码

  字符是各种文字和符号的总称，包括乱码；一个字符对应1~n个字节，一字节对应8位，每位用0或1表示。

  
• 04.25 20:47:20
  发表了文章 2022-04-25 20:47:20

  梅须逊雪三分白，雪却输梅一段香——CSS动画与JavaScript动画

  CSS动画并不是绝对比JavaScript动画性能更优越，开源动画库Velocity.js等就展现了强劲的性能。

  
• 04.25 20:42:10
  发表了文章 2022-04-25 20:42:10

  前端网络、JavaScript优化以及开发小技巧

  YSlow有23条规则，中文可以参考这里。这几十条规则最主要是在做消除或减少不必要的网络延迟，将需要传输的数据压缩至最少。

  
• 04.25 20:31:22
  发表了文章 2022-04-25 20:31:22

  更愉快的书写CSS

  我在写CSS的时候经常会碰到些麻烦事儿： 1）看上去蛮简单的排版却写了很久 2）代码写的越来越散，总是这里补一句，那里补一句，没有条理性 3）margin、padding、font-size等属性在不停的重写

  
• 04.25 20:22:05
  发表了文章 2022-04-25 20:22:05

  H5项目开发分享——用Canvas合成文字

  以前曾用Canvas合成、裁剪、图片等《用H5中的Canvas等技术制作海报》。这次用Canvas来画文字。

  
• 04.25 20:17:56
  发表了文章 2022-04-25 20:17:56

  《JavaScript设计模式 张》整理

  最近在研读另外一本关于设计模式的书《JavaScript设计模式》，这本书中描述了更多的设计模式。
• 04.25 20:14:53
  发表了文章 2022-04-25 20:14:53

  Linux常用指令指南，终端装逼利器

  最近搞了台Macbook Pro，就学习了一下Linux命令，在网上查了些资料，看了本书叫《快乐的 Linux 命令行》，里面涉及到了各个方面的命令。 在此将常用的整理出来，以备将来使用。

  
• 04.25 19:11:55
  发表了文章 2022-04-25 19:11:55

  飞起来的正则表达式

  最近在研读一本巨著《JavaScript忍者秘籍》，里面有一篇涉及到了正则表达式。 我在以前也曾经写过一篇正则表达式相关的文章《JavaScript与PHP中正则》，这次再做些补充。 书中的源码可以在此下载。我将源码放到了线上，如果不想下载，可以直接访问在线网址，修改页面名就能访问到相应示例代码。

  
• 04.25 19:03:07
  发表了文章 2022-04-25 19:03:07

  JavaScript特性（attribute）、属性（property）和样式（style）

  最近在研读一本巨著《JavaScript忍者秘籍》，里面有一篇文章提到了这3个概念。 书中的源码可以在此下载。我将源码放到了线上，如果不想下载，可以直接访问在线网址，修改页面名就能访问到相应示例代码。

  
• 04.25 17:26:53
  发表了文章 2022-04-25 17:26:53

  《JavaScript设计模式与开发实践》整理

  AOP（面向切面编程）的主要作用是把一些跟核心业务逻辑模块无关的功能抽离出来，这些跟业务逻辑无关的功能通常包括日志统计、安全控制、异常处理等。
• 04.25 17:02:54
  发表了文章 2022-04-25 17:02:54

  《你不知道的JavaScript》整理（四）——原型

  JavaScript中的对象有一个特殊的[[Prototype]]内置属性，其实就是对于其他对象的引用。

  
• 04.25 16:54:04
  发表了文章 2022-04-25 16:54:04

  《你不知道的JavaScript》整理（三）——对象

  引擎可以将一些基础类型自动转换成相应的内置对象，然后就能调用对象的属性或方法。
• 04.25 16:48:33
  发表了文章 2022-04-25 16:48:33

  《你不知道的JavaScript》整理（二）——this

  最近在读一本进阶的JavaScript的书《你不知道的JavaScript（上卷）》，这次研究了一下“this”。 当一个函数被调用时，会创建一个活动记录（执行上下文）。
• 04.25 16:44:02
  发表了文章 2022-04-25 16:44:02

  《你不知道的JavaScript》整理（一）——作用域、提升与闭包

  最近在读一本进阶的JavaScript的书《你不知道的JavaScript（上卷）》，里面分析了很多基础性的概念。 可以更全面深入的理解JavaScript深层面的知识点。

  
• 04.25 16:01:07
  发表了文章 2022-04-25 16:01:07

  制作自己的MVC框架（三）——应用

  目前封装了两种数据库，“MongoDB”和“MySQL”，用到了一次接口“IDatabase.php”。

  
• 04.25 15:58:02
  发表了文章 2022-04-25 15:58:02

  制作自己的MVC框架（二）——启动

  app中就是控制器和视图，public中是入口文件和静态资源，library中既有框架的核心类，还有工具类，数据操作类等。

  
• 04.25 15:52:12
  发表了文章 2022-04-25 15:52:12

  制作自己的MVC框架（一）——简单粗暴的实现

  现在市面上有很多成熟的MVC框架，可以拿来直接用，但自己造一下轮子其实也挺有意思的。 下面先来看个最简单粗暴的MVC实现。

  
• 04.25 15:49:31
  发表了文章 2022-04-25 15:49:31

  前端页面性能参数搜集

  经常会看些性能分析的书，但是实际在做优化的时候又无从下手。 因为没有数据，也不能确定实际用户到底在哪一环影响了他们的性能。 现在H5提供了一些很方便的Performance接口，可以让我们更方便的搜集到用户的数据，不过有几个方法的兼容性实在太差。 插件已经上传到Github中，可以在这里获取到，index.html中写的是一些示例，插件源码在“js/primus.js”中。

  
• 04.25 15:43:24
  发表了文章 2022-04-25 15:43:24

  前端性能优化的另一种方式——HTTP2.0

  最近在读一本书叫《web性能权威指南》谷歌公司高性能团队核心成员的权威之作。 一直听说HTTP2.0，对此也仅仅是耳闻，没有具体研读过，这次正好有两个篇章，分别讲HTTP1.1和HTTP2.0。

  
• 04.25 15:37:20
  发表了文章 2022-04-25 15:37:20

  H5图片裁剪升级版

  前段时间做了个跟裁剪相关的活动《用H5中的Canvas等技术制作海报》，这次公司要做个与奥运相关的活动，扫车牌赢奖。

  
• 04.25 15:34:29
  发表了文章 2022-04-25 15:34:29

  用H5中的Canvas等技术制作海报

  在去年的时候也实现过合成海报的功能，不过当时时间仓促，实现的比较简单。 就一个旋转功能，图片也不能拖动放大，也不能裁剪。 去年的实现可以参考《移动图片操作--上传》和《移动图片操作--预览旋转合成》 这次有时间就实现一个功能稍微多点的海报。