首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    我的前端学习历程

    网页内容 减少http请求次数 避免页面跳转 减少DOM元素数量 避免404 服务器 Gzip压缩传输文件 避免空的图片src Cookie 减少Cookie大小 CSS 将样式表置顶 避免CSS...例如下面的inline image的显示效果为一个勾选的checkbox。...避免空的图片src   空的图片src仍然会使浏览器发送请求到服务器,这样完全是浪费时间,而且浪费服务器的资源。尤其是你的网站每天被很多人访问的时候,这种空请求造成的伤害不容忽略。...浏览器如此实现也是根据RFC 3986 – Uniform Resource Identifiers标准,空的src被定义为当前页面。...CSS 将样式表置顶   经样式表(css)放在网页的HEAD中会让网页显得加载速度更快,因为这样做可以使浏览器逐步加载已将下载的网页内容。

    1.4K60

    关于http 500错误的小结分享

    : 现象: 浏览ASP时 HTTP500内部错误 [解决ⅡS 服务器无法加载应用程序 '/LM/W3SVC/1/ROOT' 错误是 '没有注册类别 查看了一下事件查看器: 服务器无法加载应用程序 '/LM...找不到 MS DTC 日志文件。在确认所有由 MS DTC 协调的资源管理器不具有“不确定”状态的事务之后,请运行 msdtc-resetlog 创建日志文件。...下面说起来有点难,如果上面都对,那100%是下面的问题,如 果这里设置不到,打开网页时,将弹出一个对话框确认后出现“未登陆,无权访 问”,又或者显示那一行出现错误等。...(这里一般可以省略,按默认的用户就可) 在“匿名访问”处打勾,“允许IIS控制密码”不打勾,密码(你刚才选择的用户 的密码,无密码为空,确定密码也为空)。"基本....."不打勾,"集成....."...重新进入刚才的“身份验证方法对话框”,在“匿名访问”处重新打勾再“应用”,如出现之前我说的那条信息再点击选择它,再确定,即可完成了。

    6.4K10

    前端 Web 开发常见问题概述

    除了可以打包 JS 文件,webpack 还可以打包 css 文件、压缩 Html/JS/CSS 文件内容等。这些功能也是通过在配置文件中添加描述信息实现的。...除了 404 页面,与此同类需要注意的优化,是 img 标签的 src 属性为空,这也会造成浏览器发送空请求至服务器。也可以使用同样的检测工具,检测页面中哪些 src 属性没有值。...,服务器会返回一个 HTTP 状态码 304(代表页面无变化)及一个空报文,避免重复加载。...这可以理解为是一个网页文件的版本号,格式如下: ETag: "50b1c1d4f775c61:df3" 浏览器第一次某网页时,服务器会返回一个 Etag。...浏览器在第二次向服务器重复加载同一个网页时,会同时询问: If-None-Match: W/"50b1c1d4f775c61:df3" 如果文件没有变化,服务器直接返回304状态码。

    1.4K21

    HTML5离线缓存技术

    原理和环境 如上面提到的HTML5的离线存储是基于一个新建的.appcache文件的,通过这个文件上的解析清单离线存储资源,这些资源就会像cookie一样被存储了下来。...:一个 CSS 文件,一个 GIF 图像,以及一个 JavaScript 文件。...,我不是在demo.appcache文件的NETWORK写了星号吗?...好吧,那我把.appcache文件更新下,于是乎把头部的版本号修改一下#v02。刷新下页面还是没反应!再刷新,有了!为什么? 对于浏览器来说,manifest的加载是要晚于其他资源的....文件同源,在同一个域下 在manifest中使用的相对路径,相对参照物为manifest文件 CACHE MANIFEST字符串应在第一行,且必不可少 系统会自动缓存引用清单文件的 HTML 文件 manifest

    3.8K70

    服务器针对文件的解析漏洞汇总

    因此我可以上传一个 test.php.qwea 文件绕过验证且服务器依然会将其解析为 php。Apache 能够认识的文件在 mime.types 文件里: ?...也就是说php3,php4,php5,pht,phtml也是可以被解析的。 ? 我在本地测试只有php3可以,应该是配置文件的问题,不过我并没有找到对应的正则表达式配置文件。...传递给 PHP CGI,但是 PHP 为什么会接受这样的参数,并将 phpinfo.jpg 作为 PHP 文件解析呢?...Ngnix 在遇到 %00 空字节时与后端 FastCGI 处理不一致,导致可以在图片中嵌入 PHP 代码然后通过访问 xxx.jpg%00.php 来执行其中的代码。...解析文件类型 有的网站在上传检测中会用"黑名单"方法 ,但是 IIS6.0 默认的可执行文件除了 asp 还包含这三种 : /test.asa /test.cer /test.cdx iis 为什么会把

    2.8K00

    【中间件】一些中间件的相关漏洞总结v1.0

    今天跟大家唠唠一些常见的中间件漏洞 包括IIS、Apache、Nginx以及Tomcat 废话不多说,让我们直接开始吧~(好啦我承认今天的表情包是因为好想去迪斯尼,难道是上年纪了吗,嗯?)...还需要配置/etc/php5/fpm/pool.d/www.conf文件,修改security.limit_extensions为空,允许解析其他格式文件为PHP,原本的配置为: ?...//只解析php,php3,php4,php5后缀的文件 修改为空后,会把所有后缀都以php解析。 ? 例如1.jpg是我上传的一个图片马,利用该漏洞进行访问: ?...(3)防护方法 配置项 security.limit_extensions 不要填写为空,填写需要解析的文件后缀。 关闭 cgi.fix_pathinfo 路径修剪功能。 ?...Part.4 Tomcat Tomcat 任意文件上传 漏洞的编号为:CVE-2017-12615 当我们将readonly参数设置为false时,可以通过PUT方式创建一个JSP文件,并且可以执行任意代码

    1.5K30

    网站优化思路总结之前端

    CSS代码显示一张大图片中的某个位置 2:合并脚本和样式表 一个页面应该使用不多于一个的脚本和样式文件 但是用什么样的办法才能使一个大型网站达到这个要求 我的想法:前端开发人员可以尽可能的按自己的架构和思路开发...JS和CSS文件 最后发布代码的时候通过工具把这些文件进行合并(目前暂时没有发现类似的工具,不过开发一个不难) 二:为静态文件建立不同的域 把图片、脚本、FLASH、CSS等静态的内容放到单独的域当中去...如下是在IIS下给指定目录添加HTTP头的方法 在IIS中选中某个网站下的一个目录,点属性,HTTP头,添加即可。...五:将样式表放在顶部 如果把CSS文件放到HTML的尾部 当HTML内容全部加载完后才下载CSS文件 浏览器在加载完CSS之前是不会呈现任何内容的(因为它现在还不知道如何呈现) 应该在Html文档的...head标签中使用css.css">来引用CSS文件 不应该使用@import在CSS文档内部引用其他的CSS文件,这样做不利于调试 未完待续

    61130

    如何删除渲染阻止JS 和 CSS以提高网站速度

    虽然网站的美感很重要,但它的内容和加载速度会让人们回访。WordPress 为用户提供了一个复杂的插件和主题工具箱,可以快速创建他们自己的自定义网站。...image.png 1.优化加载顺序 网页的头部( )用于预加载元素。您的网页的基础应该放在此处,因此当用户加载您的网页时,不会出现白屏。...这意味着它还将加载与网页并行的脚本,但仅在浏览器解析网页时执行它。 我们建议您不要在用于渲染和显示视觉元素的脚本上使用async或defer属性。...Autoptimize:这可以推迟和消除不必要的脚本,集成内联 CSS 并缩小脚本、HTML 和图像。Autooptimize 通过开放的 API 和高级选项高度可定制。...它允许您检测阻塞渲染的 JavaScript,然后延迟它或异步加载它。 ---- 那么为什么我们不首先推荐插件呢?不幸的是,其中一些插件会花费你。例如,Autooptimize 每年花费 49 美元。

    3K20

    页面导入样式时,使用link和@import有什么区别?

    你不得不重复地为每个 添加相同的样式,如果想要修改一种样式,又不得不修改所有的 style 中的代码。...因为 CSS 代码是在 HTML 文件中,所以会使得代码比较集中,当我们写模板网页时这通常比较有利。因为查看模板代码的人可以一目了然地查看 HTML 结构和 CSS 样式。...CSS 文件的方式,下面我们来比较这两种方式,并且说明为什么不推荐使用 @import。...1、link 属于 HTML,通过 标签中的 href 属性来引入外部文件,而 @import 属于 CSS,所以导入语句应写在 CSS 中,要注意的是导入语句应写在样式表的开头,否则无法正确导入外部文件...; 2、@import 是 CSS2.1 才出现的概念,所以如果浏览器版本较低,无法正确导入外部样式文件; 3、当 HTML 文件被加载时,link 引用的文件会同时被加载,而 @import 引用的文件则会等页面全部下载完毕再被加载

    4.1K20

    网站性能最佳体验的34条黄金守则(转载)

    合并文件是通过把所有的脚本放到一个文件中来减少HTTP请求的方法,如可以简单地把所有的CSS文件都放入一个样式表中。...优点: ·     解决加载缓慢的第三方内容如图标和广告等的加载问题 ·     Security sandbox ·     并行加载脚本 的缺点: ·     即时内容为空...默认情况下,Apache和IIS都会把数据嵌入ETag中,这会显著减少多服务器间的文件验证冲突。       Apache 1.3和2.x中的ETag格式为inode-size-timestamp。...IIS中的ETag格式为Filetimestamp:ChangeNumber。用ChangeNumber来跟踪IIS配置的改变。网站所用的不同IIS服务器间ChangeNumber也不相同。 ...这就是为什么说使用event delegation(事件代理)是一种好方法了。如果你在一个div中有10个按钮,你只需要在div上附加一次事件句柄就可以了,而不用去为每一个按钮增加一个句柄。

    1.4K10

    网站性能优化

    当客户端中的DNS缓存都为空时(浏览器和操作系统都为空),DNS查找的次数和页面中主机名的数量相同。这其中包括页面中URL、图片、脚本文件、样式表、Flash对象等包含的主机名。...优点: 解决加载缓慢的第三方内容如图标和广告等的加载问题 Security sandbox 并行加载脚本 的缺点: 即时内容为空,加载也需要时间 会阻止页面加载 没有语意...默认情况下,Apache和IIS都会把数据嵌入ETag中,这会显著减少多服务器间的文件验证冲突。   Apache 1.3和2.x中的ETag格式为inode-size-timestamp。...IIS中的ETag格式为Filetimestamp:ChangeNumber。用ChangeNumber来跟踪IIS配置的改变。网站所用的不同IIS服务器间ChangeNumber也不相同。...这就是为什么说使用event delegation(事件代理)是一种好方法了。如果你在一个div中有10个按钮,你只需要在div上附加一次事件句柄就可以了,而不用去为每一个按钮增加一个句柄。

    3.1K40

    网页优化系列二:使用Cache缓存静态文件、图片(asp.net版)

    网站中存在一些不会经常变更的内容如静态文件、图片等,我们称之为静态资源。针对这些静态资源使用cache缓存到客户端中,以减少用户再次浏览该网页时的请求量,从而加速了网页的加载、呈现速度。...同样,要设置静态资源缓存到客户端,我们需要加一个中间层来处理静态资源的请求。下面以图片为例进行说明。...(若图片十分巨大情况下才使用该方法,若图片k级数的话,初次加载速度会更慢,因为IIS对于静态文件和动态文件的处理是不同的,如果图片容量小,动态文件处理的时间占大部分总体加载时间) 未优化:   Default.aspx...x-png":suffix);//设置MIME,如果是png文件,MIME信息为text/x-png 5 context.Response.Expires = 60*24*30;//设置图片...假如处理中没有png格式的文件,那么15行至17行的代码可以改写成 img.Save(context.Response.OutputStream,ift); 那是为什么呢?

    2.3K70

    Web 加载速度优化清单,让你的网站快上加快

    为什么: 缩小 CSS 文件后,内容加载速度更快,并且将更少的数据发送到客户端,所以在生产中缩小 CSS 文件是非常重要,这对用户是有益的,就像任何企业想要降低带宽成本和降低资源。...rel="stylesheet" href="global.min.css"> 为什么: CSS 文件可以阻止页面加载并延迟页面呈现。...使用 preload 实际上可以在浏览器开始显示页面内容之前加载 CSS 文件。 4、减小 CSS 类 (class) 的长度: class 的长度会对 HTML 和 CSS 文件产生(轻微)影响。...5、删除不用的 CSS: 删除未使用的 CSS 选择器。 为什么: 删除未使用的 CSS 选择器可以减小文件的大小,提高资源的加载速度。...为什么: 如果设置了高度和宽度,则在加载页面时会保留图像所需的空间。如果没有这些属性,浏览器就不知道图像的大小,也无法为其保留适当的空间,导致页面布局在加载期间发生变化。

    2.2K10

    《精通reactvue组件设计》之5分钟教你实现一个极具创意的加载(Loading)组件

    首先我们设计的不是后台管理系统专用的加载动画,而是作为一个C端产品的功用型加载动画.我们都知道加载动画的作用是:在用户等待网页时能看到有用的信息,比如网站介绍,引导, 公司信息等,缓解用户焦虑....策略型加载动画往往用在C端产品或者系统中,用来为用户提供更多的引导信息, 当用户首次访问系统或者网站时, 由于某种主动型引导(网站在加载时或者切换页面时故意给用户看到的加载信息)或者环境原因(网络,带宽限制导致的加载过慢...通过以上需求分析, 其实一个加载动画非常简单, 不会涉及到太多功能, 主要在于css3动画的使用...."> 那么我们在css里可以通过这种方式直接使用data-tip属性的值: div::after{ content: attr(data-tip) } 通过以上的方式我们可以在::after...这样,我们的Loading组件就完成了, 还有一个问题是我代码里的组件命名,为什么叫骨架屏呢?其实我们只要改变内容结构, 它立马就可以变成一个骨架屏,所以命名这块可以按照实际需求来确定. 3.

    99220

    .NETASP.NET 4.5 Bundle组件(捆绑、缩小静态文件)

    UI层上使用;这就带来一个问题,文件多了会影响浏览器加载页面的速度,而且由于浏览器的并发限制,对于并行的请求不是无限制的,所以捆绑静态文件的功能就产生;其实在以前,IIS还没有集成管道模型的时候我们只能通过动态资源的方式进行输出...,也就是我们经常在*aspx页面里看见很多*.axd结尾的请求,当然多数情况下是配合ASP.NETAJAX用来输出动态JS、HTMDOM、CSS用的; 最新的IIS已经很好的集成了ASP.NET管道模型...,也就是说我们完全可以通过ASP.NET本身的扩展来控制所有经过IIS的请求,包括静态文件,所以让捆绑静态文件成为了可能; 下面我们将分析一下System.Web.Optimization组件的基本运行原理...;刚好这里我们可以跟动态输出的静态文件地址的后面的参数对上了; 比如: /Content/css?...我加了一个width:auto的style,那么这个时候我刷新客户端应该是不会再有304出现了; 显然/Content/css?

    1K70

    从URL输入到页面展现到底发生什么?

    ,首先要经过域名解析,因为浏览器并不能直接通过域名找到对应的服务器,而是要通过 IP 地址。...浏览器如何通过域名去查询 URL 对应的 IP 呢?DNS域名解析分为递归查询和迭代查询两种方式,现一般为迭代查询。...DNS负载均衡(DNS重定向) DNS负载均衡技术的实现原理是在DNS服务器中为同一个主机名配置多个IP地址,在应答DNS查询时, DNS服务器对每个查询将以DNS文件中主机记录的IP地址按顺序返回不同的解析结果...当你浏览网页时,浏览器会在加载网页时对网页中的域名进行解析缓存,这样在你单击当前网页中的连接时就无需进行 DNS 的解析,减少用户等待时间,提高用户体验。...常见的web server产品有apache、nginx、IIS、Lighttpd等。

    56620
    领券