从浏览器输入url到页面加载(六)前端必须了解的路由器和光纤小知识
前言
上一章我们说到了数据包在网线中的故事,说到了双绞线,还说到了麻花。这一章继续沿着这条线路往下走,说一些和cdn以及路由器相关,运营商以及光纤相关的小知识,前端同学应该了解一下的

目录
前言
1. CDN和路由器有关系吗?
2. 你的电脑能直接上网吗?
3. 运营商的井盖
4. 通信线路服务
5. 小结
1. CDN和路由器有关系吗?
我们做前端开发经常会谈到cdn加速的话题,意思就是比如我们的网站部署在县里,村里的人访问网站,就要发送请求数据,输入url,然后请求从生产队出发,到达村里,村里在到乡里,乡里又到县里,最终找到那台服务器,访问网站内容,然后数据再从县里原路返回生产队,然后我们的手机上显示了响应的网页内容。
这样必定路途遥远,所以县里为了解决这个问题,出现了一家服务商,提供cdn加速服务。他们在在全县18个乡镇部署了CDN缓存节点,每次县里升级网站后,顺带着把最新的内容部署到18个乡镇的CDN缓存节点上。这样,我们在自己家里,再发出请求的时候,到自己的乡里就直接请求到数据了,这样是不是很快了。所以,如果这个CDN服务商足够强悍,可以往全县193个存大队书记家也部署上节点,这样,我们在家里访问网站就更快啦。
而在数据电信号传输过程中,请求包是要从村里往乡里发,在从乡里往县里发,我们知道每次数据走向是路由器根据配置信息做的决定。所以,路由器和CDN服务器配置后,路由器便知道如何调度到适当的缓存服务器上,当然,路由器还可以根据用户与服务器的就近性,服务器的设备状态等情况进行分配。
如果在回答CDN问题的时候,如果可以顺带着说一些路由器的小知识点,是绝对有用的。但也不排除,那个面试官不知道这回事,觉得你在瞎说,然后断定你回答的不好。

2. 你的电脑能直接上网吗?
很多时候,例如在公司的个人电脑,是没有公有地址的,意思就是你的个人电脑其实并没有直接连接到互联网中。
一般我们用公司的电脑上网查资料,上CSDN找代码, 其实是必须通过公司的大路由器设备的。但在家里,如果你的网线直接插在电脑上,其实就给自己的电脑配置了TCP/IP信息,这就相当于家里的电脑有了公有地址。但在公司的电脑,这个公有地址会配置在路由器上,我们的个人电脑就被配置了一个私有地址,必须得依靠这个大路由器才能上网。
很多公司控制的比较严格,记得有一次给朋友发图片发不出去了,后来才发现,自己电脑为了调试,用whistle做了代理,导致和公司的那一层代理服务器起了冲突,被拦截了。
但如果个人电脑配置了TCP/IP信息,就拥有了公有地址,这意味着来自互联网的包可以直接到达计算机,这可能导致计算机被攻击。因此,对于直接上网的客户端计算机,我们应该采取安装防火墙软件等防御手段。

3. 运营商的井盖
我们普通用户要访问一个网站,中间必定要经过运营商的地盘。(没错,运营商是基建)而我们访问后,数据包绝对不会只通过一家运营商的地盘,他们的管辖盘根错节的。
一般我们公司的机房或者个人家庭电脑就是那种网线,上一章说到那种双绞线就满足使用了,但运营商走的数据量一定是巨大的,他们会更多的使用光纤。(哈哈,近几年小区单元门里,墙上经常看见一张纸上写的光纤入户,说明了什么?)
光纤不像普通的电线,架设个高压线大高塔就行了(我曾不止一次看见那种高压线高塔就想,我啥时候能往上爬一爬啊)。光纤需要地下铺设,出了问题还需要大量的维护人员进行排查维修,日常还需要巡检维护,所以能用得起光纤的运营商必定很有能力。而且平时我们在路上看见的井盖,也不都是下水道的,的确也有运营商相关的。

4. 通信线路服务
运营商有光纤,那么也有一些小的例如电话公司(咱们的运营商就是电话公司),他们没有光纤,但是如果电话线走光纤传输速度那将是相当快的。没有光纤,怎么办,租。但一条光纤并不是只能传输一条语音数据,光纤是可以复用的,一条语音数据只占其通信能力的一部分。
这样,拥有光纤的运营商就可以靠收租金,收服务费带来一定的收益,这就是通信线路服务。
其实“从浏览器输入url到页面加载”这个话题,你可以换着问,
- 例如我们页面中加载一个图片的过程是怎么样的?
- 例如我们发送一个ajax请求的过程是怎么样的?
- 你甚至还可以问,打电话的时候,你说出一句“好阿又”,对方回复了一句“艾亩fai 三可由”的过程是怎么样的?
所以,无论电话业务,还是互联网业务,他们在传输这一点上,其实是有共同性的。你是不是想问,我的安卓手机打个电话还要走光纤?我说的是这个电话,如下图的电话:

5. 小结
其实学完这一节,我们可以解释很多问题,比如为什么国外某些网站我们可以访问,但有些访问不了;比如为什么那些知名网站可以访问速度这么快(排序他们本身做的web性能优化);比如我们日常看见的井盖为什么还有运营商标志的;比如为什么公司的陆游气坏了,大家都上不了网了等等吧。
我为大家精心准备了投票环节,你一定会喜欢哒!!!
相关文章:
从浏览器输入url到页面加载(六)前端必须了解的路由器和光纤小知识
前言 上一章我们说到了数据包在网线中的故事,说到了双绞线,还说到了麻花。这一章继续沿着这条线路往下走,说一些和cdn以及路由器相关,运营商以及光纤相关的小知识,前端同学应该了解一下的 目录 前言 1. CDN和路由器…...
C语言假期作业 DAY 06
题目 一、选择题 1、以下叙述中正确的是( ) A: 只能在循环体内和 switch 语句体内使用 break 语句 B: 当 break 出现在循环体中的 switch 语句体内时,其作用是跳出该 switch 语句体,并中止循环体的执行 C: continue 语句的作用是&…...
[nlp] tokenizer加速:fast_tokenizer=True
fast_tokenizer 是一个布尔值参数,用于指定是否使用快速的 tokenizer。在某些情况下,使用快速的 tokenizer 可以加快模型训练和推理速度。如果 fast_tokenizer 参数为 True,则会使用快速的 tokenizer;否则,将使用默认的 tokenizer。 快速的 tokenizer 通常使用一些技巧来减…...
基于OpenCV solvePnP函数估计头部姿势
人脸识别 文章目录 人脸识别一、姿势估计概述1、概述2、姿态估计3、在数学上表示相机运动4、姿势估计需要什么5、姿势估计算法6、Levenberg-Marquardt 优化 二、solvePnP函数1、函数原型2、参数详解 三、OpenCV源码1、源码路径 四、效果图像示例参考链接 一、姿势估计概述 1、…...
STC12C5A系列单片机内部 EEPROM 的应用
参考范例程序。 eeprom.c #include "eeprom.h"/*---------------------------- Disable ISP/IAP/EEPROM function Make MCU in a safe state ----------------------------*/ void IapIdle() {IAP_CONTR 0; //Close IAP functionIAP_CMD 0; …...
搭建测试平台开发(一):Django基本配置与项目创建
一、安装Django最新版本 1 pip install django 二、创建Django项目 首先进入要存放项目的目录,再执行创建项目的命令 1 django-admin startproject testplatform 三、Django项目目录详解 1 testplatform 2 ├── testplatform # 项目的容器 3 │ ├──…...
JavaWeb教程笔记
JavaWeb Java Web 1、基本概念 1.1、前言 web开发: web,网页的意思 , www.baidu.com静态web html,css提供给所有人看的数据始终不会发生变化! 动态web 淘宝,几乎是所有的网站;提供给所有人…...
数据库压力测试方法小结
一、前言 在前面的压力测试过程中,主要关注的是对接口以及服务器硬件性能进行压力测试,评估请求接口和硬件性能对服务的影响。但是对于多数Web应用来说,整个系统的瓶颈在于数据库。 原因很简单:Web应用中的其他因素,…...
Spring Boot——Spring Boot自动配置原理
系列文章目录 Spring Boot启动原理 Spring Boot自动配置原理 系列文章目录前言一、Spring Boot自动配置原理剖析二、自动配置生效三、总结: 前言 一直在使用Spring Boot特别好奇的是为什么Spring Boot比Spring在项目构建和开发过程中要方便很多,无需编…...
深度学习:Pytorch最全面学习率调整策略lr_scheduler
深度学习:Pytorch最全面学习率调整策略lr_scheduler lr_scheduler.LambdaLRlr_scheduler.MultiplicativeLRlr_scheduler.StepLRlr_scheduler.MultiStepLRlr_scheduler.ConstantLRlr_scheduler.LinearLRlr_scheduler.ExponentialLRlr_scheduler.PolynomialLRlr_sched…...
【uniapp】更改富文本编辑器图片大小
代码块 //<view v-html"productDetails"></view><rich-text :nodes"productDetails"></rich-text>// 假设htmlContent字段是后台返回的富文本字段var htmlContent res.result.productDetailsconst regex new RegExp(<img, gi…...
数据结构和算法一(空间复杂度、时间复杂度等算法入门)
时间复杂度: 空间复杂度: 时间比空间重要 递归: 递归特征: 递归案例: 汉诺塔问题: def hanoi(n,A,B,C):if n>0:hanoi(n-1,A,C,B)print("moving from %s to %s"%(A,C))hanoi(n-1,B,A,C)hanoi…...
Pytorch深度学习-----神经网络的基本骨架-nn.Module的使用
系列文章目录 PyTorch深度学习——Anaconda和PyTorch安装 Pytorch深度学习-----数据模块Dataset类 Pytorch深度学习------TensorBoard的使用 Pytorch深度学习------Torchvision中Transforms的使用(ToTensor,Normalize,Resize ,Co…...
QT开发快捷键
QT开发快捷键 alt enter // 自动创建类的定义 Ctrl / 注释当前行 或者选中的区域 Ctrl R 运行程序 Ctrl B Build 项目 CtrlShiftF 查找内容 F5 开始调试 ShiftF5 停止调试 F9 设置和取消断点 F10 单步前进 F11 单步进入函数 Shift F11 单步跳出函数 F1 // 查看帮助&#…...
RabbitMQ 教程 | RabbitMQ 入门
👨🏻💻 热爱摄影的程序员 👨🏻🎨 喜欢编码的设计师 🧕🏻 擅长设计的剪辑师 🧑🏻🏫 一位高冷无情的编码爱好者 大家好,我是 DevO…...
【雕爷学编程】MicroPython动手做(10)——零基础学MaixPy之神经网络KPU2
KPU的基础架构 让我们回顾下经典神经网络的基础运算操作: 卷积(Convolution):1x1卷积,3x3卷积,5x5及更高的卷积 批归一化(Batch Normalization) 激活(Activate) 池化&…...
BUG分析以及BUG定位
一般来说bug大多数存在于3个模块: 1、前台界面,包括界面的显示,兼容性,数据提交的判断,页面的跳转等等,这些bug基本都是一眼可见的,不太需要定位,当然也不排除一些特殊情况…...
Day46 算法记录| 动态规划 13(子序列)
这里写目录标题 300.最长递增子序列 674. 最长连续递增序列718. 最长重复子数组 300.最长递增子序列 视频解析: 第一层for循环遍历每一个元素, ------- 第二层for循环找到当前元素前面有几个小于该值的元素 结尾需要统计最多的个数 class Solution {pu…...
结构型-桥接模式(Bridge Pattern)
概述 桥接模式(Bridge Pattern)是一种结构型设计模式,将抽象部分和实现部分分离,使它们可以独立地变化。桥接模式通过将继承关系转化为关联关系,将抽象部分和实现部分分离开来,从而使它们可以独立地变化。…...
基于小波哈尔法(WHM)的一维非线性IVP测试问题的求解(Matlab代码实现)
目录 💥1 概述 📚2 运行结果 🎉3 参考文献 🌈4 Matlab代码实现 💥1 概述 小波哈尔法(WHM)是一种求解一维非线性初值问题(IVP)的数值方法。它基于小波分析的思想…...
【杂谈】-递归进化:人工智能的自我改进与监管挑战
递归进化:人工智能的自我改进与监管挑战 文章目录 递归进化:人工智能的自我改进与监管挑战1、自我改进型人工智能的崛起2、人工智能如何挑战人类监管?3、确保人工智能受控的策略4、人类在人工智能发展中的角色5、平衡自主性与控制力6、总结与…...
TDengine 快速体验(Docker 镜像方式)
简介 TDengine 可以通过安装包、Docker 镜像 及云服务快速体验 TDengine 的功能,本节首先介绍如何通过 Docker 快速体验 TDengine,然后介绍如何在 Docker 环境下体验 TDengine 的写入和查询功能。如果你不熟悉 Docker,请使用 安装包的方式快…...
stm32G473的flash模式是单bank还是双bank?
今天突然有人stm32G473的flash模式是单bank还是双bank?由于时间太久,我真忘记了。搜搜发现,还真有人和我一样。见下面的链接:https://shequ.stmicroelectronics.cn/forum.php?modviewthread&tid644563 根据STM32G4系列参考手…...
R语言AI模型部署方案:精准离线运行详解
R语言AI模型部署方案:精准离线运行详解 一、项目概述 本文将构建一个完整的R语言AI部署解决方案,实现鸢尾花分类模型的训练、保存、离线部署和预测功能。核心特点: 100%离线运行能力自包含环境依赖生产级错误处理跨平台兼容性模型版本管理# 文件结构说明 Iris_AI_Deployme…...
前端倒计时误差!
提示:记录工作中遇到的需求及解决办法 文章目录 前言一、误差从何而来?二、五大解决方案1. 动态校准法(基础版)2. Web Worker 计时3. 服务器时间同步4. Performance API 高精度计时5. 页面可见性API优化三、生产环境最佳实践四、终极解决方案架构前言 前几天听说公司某个项…...
React Native在HarmonyOS 5.0阅读类应用开发中的实践
一、技术选型背景 随着HarmonyOS 5.0对Web兼容层的增强,React Native作为跨平台框架可通过重新编译ArkTS组件实现85%以上的代码复用率。阅读类应用具有UI复杂度低、数据流清晰的特点。 二、核心实现方案 1. 环境配置 (1)使用React Native…...
页面渲染流程与性能优化
页面渲染流程与性能优化详解(完整版) 一、现代浏览器渲染流程(详细说明) 1. 构建DOM树 浏览器接收到HTML文档后,会逐步解析并构建DOM(Document Object Model)树。具体过程如下: (…...
DIY|Mac 搭建 ESP-IDF 开发环境及编译小智 AI
前一阵子在百度 AI 开发者大会上,看到基于小智 AI DIY 玩具的演示,感觉有点意思,想着自己也来试试。 如果只是想烧录现成的固件,乐鑫官方除了提供了 Windows 版本的 Flash 下载工具 之外,还提供了基于网页版的 ESP LA…...
Python如何给视频添加音频和字幕
在Python中,给视频添加音频和字幕可以使用电影文件处理库MoviePy和字幕处理库Subtitles。下面将详细介绍如何使用这些库来实现视频的音频和字幕添加,包括必要的代码示例和详细解释。 环境准备 在开始之前,需要安装以下Python库:…...
成都鼎讯硬核科技!雷达目标与干扰模拟器,以卓越性能制胜电磁频谱战
在现代战争中,电磁频谱已成为继陆、海、空、天之后的 “第五维战场”,雷达作为电磁频谱领域的关键装备,其干扰与抗干扰能力的较量,直接影响着战争的胜负走向。由成都鼎讯科技匠心打造的雷达目标与干扰模拟器,凭借数字射…...
