使用 Context 避免深层属性传递
最近在项目发现了一些看起来很神奇的代码,一个组件 A 的方法通过 props 传到组件 B,然后到组件 C,再到组件 D,再到组件 E,最后到组件 D, 简直是千层饼😂。前言最近在项目发现了一些看起来很神奇的代码,一个组件 A 的方法通过 props 传到组件 B,然后到组件 C,再到组件 D,再到组件 E,最后到组件 D, 简直是千层饼😂。提问一番后知道了这种将属性深层传递的现象叫 Prop Drilling,本文说明如何使用 React 的 Context API 避免这种现象。什么是 ContextContext 提供了一个无需为每层组件手动添加 props,就能在组件树间进行数据传递的方法。在一个典型的 React 应用中,数据是通过 props 属性自上而下(由父及子)进行传递的,但此种用法..
更多NestJS WebSocket 开始使用
使用NestJs提供WebSocket服务。本文会在新建项目的基础上增加2个类Gateway 实现业务逻辑的地方WebSocketAdapter WebSocket适配器新建项目新建一个项目来演示,用npm来管理项目。1nest new websocket-start得到一个有基础功能的工程。进入项目目录,安装2个库1npm i --save @nestjs/websockets @nestjs/platform-socket.io启动使用端口30011await app.listen(3001);npm run start启动我们的工程。用postman测一下,功能ok。gateway介绍Nest里的gateway(网关)只是一个用 @WebSocketGateway() 装饰器注释的类。从技术上讲,网..
更多Two Webs' Writeup in Google CTF Quals 2021
I played Google CTF Quals 2021 and here is my writeup.I played with the Tea Deliverers team in the Google CTF Quals 2021. We sovled 2 webs in Google CTF 2021 quals but I think I have only made a small contribution. In the end, we got 11th rank, sadly I couldn’t do much. Hope I could do more in the next time!OK. Let’s talk about the CTF.Empty LSThere is a ..
更多Python图表库Matplotlib 组成部分介绍
图表有很多个组成部分,例如标题、x/y轴名称、大刻度小刻度、线条、数据点、注释说明等等。我们来看官方给的图,图中标出了各个部分的英文名称Matplotlib提供了很多api,开发者可根据需求定制图表的样式。前面我们设置了标题和x/y轴的名称,本文介绍更多设置其他部分的方法。绘图先绘制一个事例图。然后以此为基础进行定制。123456789101112131415161718def demo2(): x_list = [] y_list = [] for i in range(0, 365): x_list.append(i) y_list.append(math.sin(i * 0.1)) ax = plt.gca() ax.set_title('r..
更多使用 Siege 和 Shell 脚本进行 HTTP 接口性能测试
因为公司业务对性能的需求,所以需要对某些接口进行性能测试,来决定是否需要增加机器配置或重构。因为运维人员担心安全方面的影响,所以不能直接运行可执行文件,只能使用以前的 Siege 和 Shell 脚本。安装 Siege1 2 3 4 5 6 7 wget http://download.joedog.org/siege/siege-4.0.4.tar.gz \ && tar zxvf siege-4.0.4.tar.gz \ && cd siege-4.0.4 \ && ./configure \ && make \ && make install \ && siege -h 设定指标并发量:系统同时处理的请..
更多【运营的Python指南】绘制图表Matplotlib快速入门
绘制图表是运营工作中常见的需求。前面我们试着用Python操作Excel来绘制图表,其实调用的是Excel里的图表功能。接下来我们利用Matplotlib来绘制图表。Matplotlib 是一个综合性的库。它是 Python 的可视化工具,可创建静态、带动画和可交互的图表Matplotlib 官网 https://matplotlib.org/官方使用手册 https://matplotlib.org/stable/users/index.html安装官方给出的安装方法是使用pip12python -m pip install -U pippython -m pip install -U matplotlib我们使用PyCharm,也可以先打1import matplotlib.pyplot as plt..
更多如何提高缓存系统的内存利用率和可扩展性 · NSDI '21
『看看论文』是一系列分析计算机和软件工程领域论文的文章,我们在这个系列的每一篇文章中都会阅读一篇来自 OSDI、SOSP 等顶会中的论文,这里不会事无巨细地介绍所有的细节,而是会筛选论文中的关键内容,如果你对相关的论文非常感兴趣,可以直接点击链接阅读原文。本文要介绍的是 2021 年 NSDI 期刊中的论文 —— Segcache: a memory-efficient and scalable in-memory key-value cache for small objects1,该论文实现的 Segcache 使用基于数据段的设计存储和管理缓存数据。Segcache 使用数据段(Segment)组织缓存中的数据,它会在固定大小的数据段中存储数据并提供以下三个特性:将创建时间和过期时间相似的对象分组存..
更多在 K3S 集群外监控集群内的指标
吃饱了撑的,尝试一下 Prometheus 在 K3S 集群外抓取集群内指标的若干姿势。 背景 前一阵子收了块树莓派 4,顺手在上面搭了一个单节点的 K3S. 几个月前在家里的服务器上搭过一个 Prometheus 的实例,于是就决定研究下如何在集群外收集 K3S 集群内 Pod 的指标。 先上一个简单的网络拓扑图: 众所周知(?),Pod Network 和 Node Network 是两个不同的网段,所以在 Node 之外是无法直接访问到 Pod 的。所以我们需要通过一些方法,让我们直接或间接地访问 Pod 中提供的 HTTP 接口,进而完成指标抓取。 我们在 k3s 集群中部署了一个暴露接口的 Deployment 用于指标抓取测试,它的指标端点为 http://localhost/metri..
更多NestJS 静态文件
为了提供静态资源,我们可以用@nestjs/serve-static包里的ServeStaticModule。服务器上的静态资源,一般指的是文件,比如图片、音频、视频、文本文件或者二进制文件等等。或者是一些单页面应用程序(Single Page Application, SPA)。从服务器上请求得到网页,然后网页再执行自己的业务。安装首先我们需要安装@nestjs/serve-static包。在工程路径下1$ npm install --save @nestjs/serve-static安装完成后,工程的package.json里会多出123"dependencies": { "@nestjs/serve-static": "^2.1.4",}使用在root AppModule中,引入ServeStat..
更多MongoDB安装和部署
MongoDB的版本可以在官网 https://docs.mongodb.com/manual/installation/ 上查询。我们使用的是社区版。mac目前用mac来开发,需要在本地安装运行一个mongdb,便于测试调试。安装mac上安装mongodb。在终端中用brew来安装速度有点太慢了。我们去 https://www.mongodb.com/try/download/enterprise 下载一个mac使用的版本。在网页右侧选择mongodb版本(这里选的是4.4.4),Platform选择macOS,压缩格式选tgz即可。点击Download需要填一些资料。填好后确认Submit即可。下载后解压文件,得到一个文件夹。1234567891011121314151617181920mongodb..
更多