理解JavaScript基础知识:您的备忘单

 

JavaScript是一个复杂的主题，可能非常难以处理。

但是，理解它从未如此重要，因为JavaScript在我们管理的网站上变得越来越普遍。

随着现代网络的不断发展，JavaScript的使用率不断提高。

当网站是静态的并且只用HTML和CSS编码时，搜索引擎优化专业人士可能会很久没过了。但是，引人入胜的网站通常需要交互性，这通常由JavaScript提供支持。

在过去三年中，整个网络上的  JavaScript字节数在台式机上增加了35％，在移动设备上增加了62.7％。

正如百度网站管理员趋势分析师约翰·穆勒（John Mueller）所说，它是:，而且“不会消失。”

这种编程语言就在我们身边，所以我们应该更好地了解它。让我们积极主动，更多地了解JavaScript，而不是担心它。

网络已经从简单的HTML＆ndash;作为一个搜索引擎优化，你可以接受它。向JS devs＆amp; amp;与他们分享SEO知识。 JS不会消失。

＆MDASH; ?约翰?（@JohnMu）2017年8月8日

人们常常误以为JavaScript只是让开发人员担心。

我认为这并非如此，因为它可能会导致任何希望客户和搜索引擎能够访问其网站内容的人出现问题。

如果您不完全熟悉JavaScript，或者甚至完全不知道它是什么或做什么，请不要担心。

我已经汇总了您应该了解的关键术语和基本概念的词汇表，以帮助您开始探索之旅。

什么是JavaScript？

JavaScript是一种编程语言，允许您在网站上实现复杂的功能，例如动态元素或交互性。

一旦解析并构建了源代码中HTML和CSS的信息，就会执行JavaScript。

然后，JavaScript将触发其中指定的任何事件或变量，文档对象模型（DOM）将被更新，Zui后，JavaScript将在浏览器中呈现。

HTML和CSS通常会形成页面结构的基础，任何JavaScript都会进行Zui后的调整和更改。

文档对象模型（DOM）

文档对象模型（DOM）是在加载页面时创建的，它由节点和对象组成，这些节点和对象映射出页面上的所有不同元素和属性。

页面以这种方式映射出来，以便其他程序可以根据其结构，内容和样式修改和操作页面。

通过使用JavaScript等语言，可以改变页面的元素。

ECMAScript的

ECMAScript（ES）是一种脚本语言，用于标准化JavaScript代码的使用。

当语言随着时间的推移而更新和调整时，会发布不同版本的ECMAScript，例如ES5和ES6（也称为ES2015）。

Transpiling

转换器是一种将源代码转换为不同编程语言的工具。这个概念有点像百度 Translate，但对于代码。

您可以将特定的源语言转换为不同的目标语言，例如，JavaScript到C ++或Python到Ruby。

特别是关于JavaScript渲染，经常建议使用转换器将ES6转换为ES5，因为百度目前使用旧版本的Chrome进行渲染，但它还不支持ES6。

Chrome 41

渲染页面时，百度使用基于Chrome 41的Web渲染服务。这意味着百度的渲染引擎支持该特定版本Chrome的相同功能和特性。

当您认为Zui新版本是Chrome 71时，您可以看到自Chrome 41于2015年上线以来已推出许多版本，并且所有这些版本都附带了新功能。这就是为什么百度的渲染服务目前支持ES5而不是后来的语言ES6版本。

单页应用程序（SPA）

单页面应用程序（SPA）是一种网站或Web应用程序，可在用户与其交互时动态地重新编写和重新呈现页面，而不是向服务器单独请求新的HTML和内容。

JavaScript框架可用于支持动态更改SPA的元素。

角，聚合物，反应和Vue的

这些都是不同类型的JavaScript框架。

Angular和Polymer由百度开发..React由Facebook开发.Vue由Evan You开发，他曾经在百度的角色团队工作。

每个JavaScript框架都有自己的优点和缺点，因此开发人员将选择使用Zui适合他们的项目以及他们正在进行的项目。

如果您想了解有关不同框架如何衡量的更多信息，本指南将进行详细比较。

JavaScript渲染

JavaScript呈现涉及获取脚本及其包含的指令，处理所有内容，然后运行它以便在浏览器中显示所需的输出。您可以使用许多不同的方法来控制JavaScript的呈现方式。

要求在页面上呈现JavaScript会对两个关键区域:

产生负面影响 站点速度搜索引擎抓取和索引

根据您使用的渲染方法，您可以降低页面加载速度，并确保搜索引擎可以访问内容以进行爬网和索引。

预呈现

预呈现涉及在用户或搜索引擎请求之前在页面上呈现内容，以便他们收到一个静态页面，其中包含所有内容。

通过以这种方式预加载页面，这意味着您的内容将是可访问的，而不是搜索引擎或用户的浏览器必须自己呈现页面。

预渲染通常用于搜索引擎机器人而不是人类。这是因为静态的预呈现页面对用户的吸引力较小，因为它缺少任何动态内容或交互性。

服务器端渲染

托管服务器执行繁重的工作并呈现页面，以便JavaScript已经被处理，并且内容已准备好在请求时被移交给用户的浏览器或搜索引擎爬虫。

此方法有助于减少因处理JavaScript而导致的用户设备上的任何压力，这可以提高页面加载速度。

服务器端呈现还确保搜索引擎可以查看和索引完整内容。

客户端渲染

在客户端呈现期间，JavaScript由用户的浏览器或请求页面的搜索引擎处理。

服务器将处理初始请求，但处理和呈现页面的其余工作落在用户的设备或搜索引擎上。

建议不要使用客户端呈现，因为百度抓取页面之间存在延迟，然后才能呈现它们。

百度将需要呈现的页面放入队列，直到有足够的资源可用于处理它们。

如果您依靠百度呈现页面客户端，则可以在Zui初爬网后将索引延迟Zui多一周。

动态渲染

动态渲染涉及使用不同的渲染方法，具体取决于用户的浏览器或搜索引擎机器人是否正在请求页面。

如果您的站点通常呈现客户端，则当检测到百度bot时，将使用迷你客户端呈现器（例如，Puppeteer或Rendertron）预呈现页面，因此可以立即查看和索引内容。

混合渲染

混合渲染涉及服务器端渲染和客户端渲染的组合。

核心内容在服务器端预先呈现并发送给客户端，无论是用户的浏览器还是请求内容的搜索引擎抓取工具。

在Zui初加载页面之后，然后在客户端呈现用于任何交互的附加JavaScript。

结论

希望您发现本指南很有用，它帮助您更好地理解JavaScript的基础知识及其对网站的影响。

现在您已经了解了关键术语，您应该更好地与开发人员保持对话！

更多资源:

SEO＆amp; JavaScript:你需要知道的6件事情如何结合JavaScript＆amp;搜索引擎优化与同构JSA完整指南SEO:你需要知道的2019年

图像信誉

特色图片: UnsplashIn-Post图像＃1: HTTP ArchiveIn-Post图像＃2:计算机HopeAll截图作者，2019年1月

CategorySEOWeb开发