TAT.joeyguo 提高资源的安全性 – SRI 与 CSP
In Web开发 on 2021年01月14日 by view: 168
0

原文地址

《前端资源加载失败优化》文章中,我们聊到了前端资源加载失败的监控方式,以及资源加载失败时的优化方案。通过对加载失败的资源更换域名动态重新加载、同时确保最终代码正常的执行顺序,从而有效地减少了因为资源加载失败导致的网页异常。到此,资源文件成功加载了!但加载到的是否就是正确的资源呢?是否会在加载过程中被半路劫持?此时又该如何监控?是否还能做更多的防护措施呢?本文将逐步进行分析。

原文地址

Web 项目上线后,开始开门迎客,等待着来自大江南北、有着各式各样网络状态的用户莅临。在千差万别的网络状态中,访问页面难免会遇到前端资源加载失败的情况,占比或许不高,但一遇到,轻则页面样式错乱,重则白屏打不开,影响用户体验感受,紧急情况下甚至影响了用户的工作,属于非常严重的问题。本文将从如何监控加载失败、加载失败如何优化、始终加载失败又该如何处理等问题逐一分析。

TAT.vorshen 重学 HashTable
In Web开发 on 2020年12月31日 by view: 434
0

重学 HashTable

HashTable,又称散列表,一说到这个,可能很多人第一反应就是时间复杂度 O(1)!那是不是时间复杂度永远都是 O(1) 呢?别人说所得 hash 碰撞又是什么呢?
其实 HashTable 还是有很多细节的,这片文章就带大家梳理一下 HashTable 的细节,最后一起拜读一下 v8 和 redis 的 HashTable 相关源码。

TAT.SigmaLiu 一个有趣的内存泄漏案例
In Web开发 on 2020年12月17日 by view: 719
1

0. 背景

之前在这篇文章里说过做了个 SSR 《论如何像素级直出具有 14W 行代码量的前端页面》,本以为今天顺顺利利,高高兴兴。

e62eaf67-820c-49ee-9295-86011d7d596c

没想到项目放到线上后,随着请求量的增多,却感觉到首屏速度越来越慢,并且是在持续性地变慢。而且在发布完后(也就是容器重建了),耗时又陡然降下来了。

企业微信截图_52eb633b-73b9-4860-8033-3532e629875e

0. 前言

腾讯文档列表页在不久前经历了一次完全重构后,首屏速度其实已经是不错。但是我们仍然可以引入 SSR 来进一步加快速度。这篇文章就是用来记录和整理我最近实现 SSR 遇到的一些问题和思考。虽然其中有一些基础设施可能和腾讯或文档强相关,但是作为一篇涉及 NodeReact 组件性能网络docker 镜像云上部署灰度和发布等内容的文章,仍然可以小小地作为参考或者相似需求的 Checklist。

image-20201128121452829

编译的速度与激情:从 10mins 到 1s

导语:对于大型前端项目而言,构建的稳定性和易用性至关重要,腾讯文档在迭代过程中,复杂的项目结构和编译带来的问题日益增多,极大的增加了新人上手与日常搬砖的开销。恰逢 Webpack5 上线,不如来一次彻底的魔改~

《XSS 终结者-CSP 理论与实践》 中,讲述了 CSP 基础语法组成与使用方式。通过一步步的方案制定,最终我们利用 CSP 提供的域名白名单机制,有效地将异常的外联脚本拦在门外。然而在线上环境千千万万,虽然我们限制了外联脚本,但却仍被内联脚本钻了空子。

TAT.老教授 初探 Typescript 解析器
In JavaScript on 2020年08月24日 by view: 1,888
0

前言

前段时间看了下开源组件 stryker 的源码,对 Typescript 的解析器产生了兴趣。这个开源组件是用来检查单测质量的,通过识别源码自动更改某些代码内容,然后看单测能否检测出来。Typescript 解析器做的,就是识别源码这一关键步骤。

于是花了些时间学了下 Typescript 解析器,感觉像打开一个新的大门,可以玩很多有趣的事情。

附:stryke (https://github.com/stryker-mutator/stryker/tree/master)

最基础,生成 AST

翻了下 Stryker 的源码,发现应用 Typescript 解析器的关键语句如下:

TAT. cntchen Web Worker 文献综述
In Web 前端优化,Web开发 on 2020年07月21日 by view: 4,097
3

Title Image

Web Worker 文献综述

Web Worker 作为浏览器多线程技术, 在页面内容不断丰富, 功能日趋复杂的当下, 成为缓解页面卡顿, 提升应用性能的可选方案.

但她的容颜, 隐藏在边缘试探的科普文章和不知深浅的兼容性背后; 对 JS 单线程面试题倒背如流的前端工程师, 对多线程开发有着天然的陌生感.

TAT.vorshen 线程入门
In Web开发 on 2020年07月15日 by view: 1,945
0

导语

最近团队进行了一些线程的讨论,这里抽空水了一篇关于线程的文章,希望给没接触过线程相关知识的同学入个门。

线程是什么

进程

既然要说线程,那就不得不提它的两个好兄弟,进程、协程。
进程大家应该是最了解的,平时用的 ps 命令就是查看计算机中的进程情况,进程的特点: