澄清Gatsby页面加载网络请求 [英] Clarification on Gatsby page load network request

问题描述

我正在学习盖茨比的工作原理，并且拥有一个包含2页的网站，两者都有彼此的超链接.

I am learning how Gatsby works and have got a website with 2 pages, both having hyperlinks to each other.

由于gatsby将网站编译为带有javascript捆绑包的静态页面，所以我希望html链接单击事件触发向服务器的页面请求以加载second页面.但是，我没有看到这样的请求.该网站的行为类似于从first页加载的单页应用程序.链接单击不会导致网络页面请求second页面.同时，我可以看到服务器正确响应了second页的请求.在这种情况下，将加载second页面，并且通过单击链接导航到first页面也不会引起HTTP请求.

Since gatsby compiles a website to static pages with javascript bundles, I would expect html link click event to trigger page request to the server to load the second page. However, I do not see such a request. The website behaves like single-page application loaded from the first page. Link click does not cause network page request for the second page. At the same time, I can see that the server responds on the request to the second page correctly. In this case the second page is loaded and navigation to the first page via link click does not cause HTTP request too.

• 是设计使然吗?您能澄清一下编译后的网站中实际上发生了什么吗?

• Is it by design? Could you please clarify what is actually happening in the compiled website?

如果这种单页行为是设计使然，我想知道它会对搜索引擎搜寻器产生多大的负面影响?我认为单页应用程序对于Google bot等的索引编制不是很好.

If such single-page behavior is by design, I wonder how much negatively it impacts search-engine crawlers? I thought that single-page applications are not very good for indexing by google bot, etc..

另外，如果我的页面很大(假设是从降价促销书或类似商品呈现的)怎么办?我希望单页应用程序不是一次加载所有内容的最佳选择.盖茨比在这种情况下施加了什么魔法?

Also, what if my pages are quite big (let's say rendered from markdown books or similar)? I would expect that single-page application would not be very optimal to load everything at once. What magic is applied by Gatsby in this case?

推荐答案

是的，盖茨比是单页网站，是的也是多页网站. Gatsby将各个页面预先渲染为html文件，并将相应的反应代码编译为捆绑包.

Yes Gatsby is single-page website and yes it is also a multi-page website. Gatsby pre-renders individual pages as html files and also compiles corresponding react code into bundles.

冷启动时，任何给定页面都会像其他静态页面一样快速且SEO友好地加载到浏览器中.加载静态页面后，将引导自启动代码并有效地运行show("a la"单页面应用程序样式).很聪明吧?但是，仅从服务器获取了所需的js捆绑包(有时为了速度也进行了预提取).

On cold start any given page loads into the browser like any other static page, fast and SEO friendly. Once a static page is loaded, react code is bootstrapped and effectively runs the show ('a la' single-page app style). Pretty clever huh? However, only needed js bundles are fetched from the server (sometimes pre-fetched as well for speed).

Gatsby实际上只是一个聪明的服务器渲染的html react应用程序，它可以理解内容类型.

Gatsby is really nothing more then a clever server rendered html react app that understands content types.

这篇关于澄清Gatsby页面加载网络请求的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！