【前端面试3+1】16 TCP与UDP的区别、如何清除浮动、哪些原因造成阻塞页面渲染、【相同的树】

一、TCP与UDP的区别

TCP(Transmission Control Protocol)和UDP(User Datagram Protocol)是两种常用的网络传输协议,它们有以下几点区别:

1、连接性:

  • TCP是面向连接的协议,通信双方在传输数据之前需要建立连接,数据传输完毕后需要断开连接。
  • UDP是无连接的协议,通信双方之间在传输数据时不需要建立连接,数据包之间相互独立。

2、可靠性:

  • TCP提供可靠的数据传输,它通过序列号、确认应答、重传机制等来确保数据的完整性和可靠性。
  • UDP不提供数据传输的可靠性保证,数据包可能会丢失或乱序,应用程序需要自行处理数据的丢失或重传。

3、传输效率:

  • TCP的可靠性和连接管理会带来一定的开销,因此在传输效率上通常比UDP略低
  • UDP没有连接管理和可靠性保证,传输效率较高,适用于实时性要求较高的应用场景。

4、应用场景:

  • TCP适用于需要可靠数据传输和顺序传输的应用,如文件传输、网页访问等。
  • UDP适用于实时性要求较高、数据量较小、允许数据丢失的应用,如音视频传输、在线游戏等。

二、如何清除浮动?

清除浮动是为了解决父元素包含浮动子元素时可能导致的高度塌陷或布局错乱的问题。

1、使用clearfix技巧:

        在父元素上应用 clearfix 类,可以通过以下方式实现:

.clearfix::after {
    content: "";
    display: table;
    clear: both;
}

2、使用overflow属性:

        在父元素上添加 overflow: hidden; 或 overflow: auto; 属性,可以触发 BFC(块级格式化上下文),从而清除浮动。

3、使用伪元素清除浮动:

        在父元素上使用伪元素清除浮动,如下所示:

.parent::after {
    content: "";
    display: table;
    clear: both;
}

4、使用clear属性:

        在父元素之后添加一个空元素,并为其应用 clear: both; 属性,也可以清除浮动。

5、使用父元素设置高度:

        如果知道子元素的高度,可以在父元素上设置一个固定高度,也可以清除浮动。

三、哪些原因会造成阻塞页面的渲染?

以下是一些常见的原因:

1、CSS和JavaScript资源的加载:

        当浏览器解析HTML文档时,遇到外部CSS和JavaScript资源的引用时,会停止解析并开始下载这些资源。如果这些资源加载速度较慢或者有大量资源需要下载,会导致页面渲染被阻塞。

2、JavaScript的执行:

        JavaScript的执行会阻塞页面的渲染。特别是在页面底部加载的JavaScript文件,如果JavaScript代码执行时间过长,会延迟页面的呈现。

3、CSS和JavaScript的解析:

        如果CSS和JavaScript文件较大或者包含复杂的代码,会增加解析时间,从而影响页面的加载速度

4、DOM的构建:

        当浏览器构建DOM树时,如果遇到复杂的DOM结构或者大量的DOM元素,会导致页面渲染被阻塞。

5、渲染树的构建

        浏览器在构建渲染树时会合并DOM树和CSSOM树,生成最终的渲染树。如果CSSOM树的构建时间较长,会延迟页面的显示

6、字体加载:

        如果页面中使用了自定义字体或者远程字体,浏览器需要下载并解析这些字体文件,会阻塞页面的渲染。

7、图片加载:

        如果页面中有大量的图片需要加载,或者图片文件较大,会影响页面的加载速度。

8、重排和重绘:

        当页面中的元素样式发生改变时,浏览器会进行重排(reflow)和重绘(repaint),这也会影响页面的渲染速度。

四、【算法】相同的树

1、题目:

给你两棵二叉树的根节点 p 和 q ,编写一个函数来检验这两棵树是否相同。

如果两个树在结构上相同,并且节点具有相同的值,则认为它们是相同的。

/**
 * Definition for a binary tree node.
 * struct TreeNode {
 *     int val;
 *     struct TreeNode *left;
 *     struct TreeNode *right;
 * };
 */
bool isSameTree(struct TreeNode* p, struct TreeNode* q) {
    
}

2、解题:

这道题可以通过递归的方式来解决。具体的解题思路如下:

  1. 首先判断两棵树是否都为空,如果是,则认为它们相同,返回true
  2. 然后判断其中一棵树为空的情况,如果有一棵树为空一棵树非空,则认为它们不同,返回false
  3. 接着比较两棵树的根节点值是否相同,如果不同,则认为它们不同,返回false
  4. 最后递归比较两棵树的左子树和右子树,如果左右子树都相同,则返回true,否则返回false
bool isSameTree(struct TreeNode* p, struct TreeNode* q) {
     if (p == NULL && q == NULL) {
        return true; // 两棵树都为空,认为相同
    }
    if (p == NULL || q == NULL) {
        return false; // 一棵树为空,一棵树非空,认为不同
    }
    if (p->val != q->val) {
        return false; // 根节点值不同,认为不同
    }
    // 递归比较左右子树
    return isSameTree(p->left, q->left) && isSameTree(p->right, q->right);
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/544066.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

以太网数据量大小字符串生成方法(可变单位)

0 前言 当我们想显示以太网数据量大小时,往往有个头疼的单位需要处理,单位取小了不一目了然,单位取大了精度太低。本例设计一个函数,将根据以太网数据量大小自动生成单位可变的字符串(KB、MB、GB、TB、PB)…

【大语言模型】基础:TF-IDF

TF-IDF (Term Frequency-Inverse Document Frequency) 是一种用于信息检索与文本挖掘的统计方法,用来评估一个词对于一个文件集或一个语料库中的其中一份文件的重要性。它是一种常用于文本处理和自然语言处理的权重计算技术。 原理 TF-IDF 由两部分组成&#xff1…

Qt:发出一个信号,有多少相关槽函数执行?

返回连接signal的接收者的个数。 因为信号和槽都能作为信号的接收者,同时相同的连接能被建立很多次,接收者的数量和与该信号建立连接的数量相同。 当调用该函数时,你能使用SIGNAL()宏来传递一个特定的信号: if (receivers(SIGNA…

【core analyzer】core analyzer的介绍和安装详情

目录 🌞1. core和core analyzer的基本概念 🌼1.1 coredump文件 🌼1.2 core analyzer 🌞2. core analyzer的安装详细过程 🌼2.1 方式一 简单但不推荐 🌼2.2 方式二 推荐 🌻2.2.1 安装遇到…

Servlet实现常用功能及其他方法

getParameter 获取body或url中指定的key/value值 String classIdreq.getParameter("classId"); getQueryString 获取请求的所有查询参数key,values1 String queryStringreq.getQueryString(); from表单提交 前端通过from表单提交用户名和密码 <!DOCTYPE htm…

<计算机网络自顶向下> P2P应用

纯P2P架构 没有或者极少一直运行的Server&#xff0c;Peer节点间歇上网&#xff0c;每次IP地址都可能变化任意端系统都可以直接通信利用peer的服务能力&#xff0c;可扩展性好例子&#xff1a;文件分发; 流媒体; VoIP类别:两个节点相互上载下载文件&#xff0c;互通有无&#…

Android Gradle 开发与应用 (七) : 实现打包自动复制文件插件

1. 前言 项目中遇到了一个问题 : 其中一个模块MyLibrary的assets文件夹中,需要存放很多文件(每个文件对应一个功能)。 这样导致的问题是MyLibrary打出的这个aar包体积特别大。 如果把MyLibrary严谨地拆解成若干个Module又比较费时,对于现在业务现状来说也显得没那么必要。…

Matlab隐式方程拟合【案例源码+视频教程】|隐函数拟合|非线性拟合|视频教程

专栏导读 作者简介&#xff1a;工学博士&#xff0c;高级工程师&#xff0c;专注于工业软件算法研究本文已收录于专栏&#xff1a;《复杂函数拟合案例分享》本专栏旨在提供 1.以案例的形式讲解各类复杂函数拟合的程序实现方法&#xff0c;并提供所有案例完整源码&#xff1b;2.…

day10 | 栈与队列 part-2 (Go) | 20 有效的括号、1047 删除字符串中的所有相邻重复项、150 逆波兰表达式求值

今日任务 20 有效的括号 (题目: . - 力扣&#xff08;LeetCode&#xff09;)1047 删除字符串中的所有相邻重复项 (题目: . - 力扣&#xff08;LeetCode&#xff09;)150 逆波兰表达式求值 (题目: . - 力扣&#xff08;LeetCode&#xff09;) 20 有效的括号 题目: . - 力扣&…

机器学习第34周周报VBAED

文章目录 week34 VBAED摘要Abstract一、文献阅读1. 题目2. abstract3. 网络架构3.1 序列问题阐述3.2 变分模态分解3.3 具有 BiLSTM 和双向输入注意力的编码器3.4 具有 BiLSTM 和双向时间注意力的解码器 4. 文献解读4.1 Introduction4.2 创新点4.3 实验过程4.3.1 数据集数据预处…

AI大模型之idea通义灵码智能AI插件安装方式

问题描述 主要讲述如何进行开发工具 idea中如何进行通义灵码的插件的安装解决方案 直接在idea的plugin市场中安装 下载插件之后进行安装 见资源

【QT+QGIS跨平台编译】161:【qgispython跨平台编译】—【qgis_python.h生成】

点击查看专栏目录 文章目录 一、qgis_python.h介绍二、信息分析三、qgis_python.h生成一、qgis_python.h介绍 qgis_python.h 是 QGIS(Quantum Geographic Information System)GIS 软件的一个头文件。QGIS 是一个开源的地理信息系统软件,提供了丰富的地图制图和空间分析功能。…

Google最新论文: 复杂的 Prompt 如何更好的调试?

本文介绍了Sequence Salience&#xff0c;这是一个专为调试复杂的大模型提示而设计的系统。该系统利用广泛使用的显著性方法&#xff0c;支持文本分类和单标记预测&#xff0c;并将其扩展到可处理长文本的调试系统。现有的工具往往不足以处理长文本或复杂提示的调试需求。尽管存…

ASP.NET公交车管理系统的实现与设计

摘 要 随着经济的日益增长&#xff0c;信息化时代已经到来&#xff0c;生活中各种信息趋向数字化、清晰化。公交车作为现代城市生活中一种重要的交通工具&#xff0c;其数量增多&#xff0c;车型也不再单一&#xff0c;雇用的司机增多&#xff0c;这样使得公交车公司的车辆信…

架构师系列-搜索引擎ElasticSearch(四)- 高级查询

ES查询 matchAll 脚本方式 该方式可以通过kabana、curl、elasticsearch-head&#xff08;纯前端&#xff09;去操作 # 默认情况下&#xff0c;es一次展示10条数据,通过from和size来控制分页 # 查询结果详解 GET goods/_search {"query": {"match_all":…

计算机网络 实验指导 实验17

实验17 配置无线网络实验 1.实验拓扑图 Table PC0 和 Table PC1 最开始可能还会连Access Point0&#xff0c;无影响后面会改 名称接口IP地址网关地址Router0fa0/0210.10.10.1fa0/1220.10.10.2Tablet PC0210.10.10.11Tablet PC1210.10.10.12Wireless互联网220.10.10.2LAN192.16…

JavaScript(六)-高级篇

文章目录 作用域局部作用域全局作用域作用域链JS垃圾回收机制闭包变量提升 函数进阶函数提升函数参数动态参数多余参数 箭头函数 解构赋值数组解构对象解构 遍历数组forEach方法&#xff08;重点&#xff09;构造函数深入对象创建对象的三种方式构造函数实例成员 & 静态成员…

舒欣上门预约系统源码-按摩预约/家政预约全行业适用-小程序/h5/app

上门预约或者到店预约均可&#xff0c;家政&#xff0c;按摩&#xff0c;等等上门类行业均可适用。&#xff08;后台的技师及前台技师这两个字是可以更改的&#xff0c;例如改成家政老师&#xff0c;保洁&#xff0c;等等&#xff09; 视频教程是演示搭建的小程序端&#xff0c…

Leetcode 235. 二叉搜索树的最近公共祖先

心路历程&#xff1a; 这道题可以完全按照二叉树的公共祖先来做&#xff0c;但是由于题目中给了二分搜索树的条件&#xff0c;因此可以通过值的大小简化左右子树的递归搜索。 解法一&#xff1a;按照二分搜索树的性质 # Definition for a binary tree node. # class TreeNod…

【1000个GDB技巧之】如何在远端服务器打开通过vscode动态观测Linux内核实战篇?

Step: 配置ssh的服务端host &#xff08;也可以直接在vscode中配置&#xff0c;忽略&#xff09; 主要步骤&#xff1a;在~/.ssh/config中添加服务端的host&#xff0c;以便vscode的remote中能够登录 详细配置过程参考兄弟篇文章&#xff1a;ssh config如何配置用host名替代ro…