# 通过 JavaScript 使用 Discourse 作为评论系统：延迟加载或滚动加载

**URL:** https://meta.discourse.org/t/using-discourse-as-commenting-system-via-javascript-delay-load-or-load-on-scroll/103724
**Category:** Support
**Created:** [2018年十二月7日 18:46 UTC](https://meta.discourse.org/t/using-discourse-as-commenting-system-via-javascript-delay-load-or-load-on-scroll/103724 "2018-12-07T18:46:25Z")
**Posts on this page:** 8
**Page:** 1

<div class="post-metadata">

### Author: ![Jane\_Jojo](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jane_jojo/32/119485_2.png) [@Jane\_Jojo](https://meta.discourse.org/u/Jane_Jojo)
#### Post date: [2018年十二月7日 18:46 UTC](https://meta.discourse.org/t/using-discourse-as-commenting-system-via-javascript-delay-load-or-load-on-scroll/103724/1 "2018-12-07T18:46:25Z")

</div>

As mentioned above, I use discourse as the [commenting system](https://meta.discourse.org/t/embedding-discourse-comments-via-javascript/31963?source_topic_id=74803) and here’s an example

> **[Soya Chunks Masala Dry](https://alittlebitofspice.com/soya-chunks-masala-dry-recipe)**
>
> Learn how to make Soya Chunks Masala Dry, a healthy stir-fry with soya chunks cooked in spices and chilies. A flavorful side dish .

Quite a few users upload images to the comments and the JS itself is impacting the load time.

Is there a way I can load the commenting system only **on scroll**? Which if you think about it makes sense – you need to load it only on user intent – when to read comments.

**Edit**

This is the code I use

```
<div id="comments" class="ct-post-end-section">
	<div id='discourse-comments'></div>
	<script type="text/javascript">
	  DiscourseEmbed = { discourseUrl: 'https://comments.alittlebitofspice.com/',
                     discourseEmbedUrl: '<?php echo get_permalink(); ?>' };
	  (function() {
	    var d = document.createElement('script'); d.type = 'text/javascript'; d.async = true;
	    d.src = DiscourseEmbed.discourseUrl + 'javascripts/embed.js';
	    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(d);
	  })();
	</script>
</div><!-- #comments -->

```

Wonder if it’s the right approach to attach the script to onscroll? Although I understand complexities between repeated scroll events firing.

---

<div class="post-metadata">

### Author: ![rootsh3ll](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rootsh3ll/32/119507_2.png) [@rootsh3ll](https://meta.discourse.org/u/rootsh3ll)
#### Post date: [2018年十二月7日 18:51 UTC](https://meta.discourse.org/t/using-discourse-as-commenting-system-via-javascript-delay-load-or-load-on-scroll/103724/2 "2018-12-07T18:51:19Z")

</div>

Look for a plugin named “lazy load” on your blog. that’ll only load images when it actually enters the viewport of the reader.

---

<div class="post-metadata">

### Author: ![Jane\_Jojo](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jane_jojo/32/119485_2.png) [@Jane\_Jojo](https://meta.discourse.org/u/Jane_Jojo)
#### Post date: [2018年十二月7日 19:04 UTC](https://meta.discourse.org/t/using-discourse-as-commenting-system-via-javascript-delay-load-or-load-on-scroll/103724/3 "2018-12-07T19:04:16Z")

</div>

I don’t do lady load on the blog posts due to SEO reasons. Hit me hard some time back. Nevertheless, a lazy load plugin is not going to do anything to the commenting system (which is in an IFRAME).

---

<div class="post-metadata">

### Author: ![rootsh3ll](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rootsh3ll/32/119507_2.png) [@rootsh3ll](https://meta.discourse.org/u/rootsh3ll)
#### Post date: [2018年十二月7日 19:19 UTC](https://meta.discourse.org/t/using-discourse-as-commenting-system-via-javascript-delay-load-or-load-on-scroll/103724/4 "2018-12-07T19:19:29Z")

</div>

Right. an iframe won’t be affected by lazy load. my bad. maybe developers can help you out.

But I don’t get this. How lazy load affected SEO?

Crawlers look for HTML code and tags. images load only after entering the viewport, but the code is always available after first load.

---

<div class="post-metadata">

### Author: ![jesus2099](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jesus2099/32/119720_2.png) [@jesus2099](https://meta.discourse.org/u/jesus2099)
#### Post date: [2018年十二月7日 19:22 UTC](https://meta.discourse.org/t/using-discourse-as-commenting-system-via-javascript-delay-load-or-load-on-scroll/103724/5 "2018-12-07T19:22:32Z")

</div>

That Discourse lazy load might be more relevant:  
[https://meta.discourse.org/t/lazyload-images/90472?u=jesus2099](https://meta.discourse.org/t/lazyload-images/90472)

---

<div class="post-metadata">

### Author: ![Jane\_Jojo](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jane_jojo/32/119485_2.png) [@Jane\_Jojo](https://meta.discourse.org/u/Jane_Jojo)
#### Post date: [2018年十二月7日 19:22 UTC](https://meta.discourse.org/t/using-discourse-as-commenting-system-via-javascript-delay-load-or-load-on-scroll/103724/6 "2018-12-07T19:22:51Z")

</div>

In theory what you are saying is right. But Google works in mysterious ways.

---

<div class="post-metadata">

### Author: ![rootsh3ll](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rootsh3ll/32/119507_2.png) [@rootsh3ll](https://meta.discourse.org/u/rootsh3ll)
#### Post date: [2018年十二月7日 19:31 UTC](https://meta.discourse.org/t/using-discourse-as-commenting-system-via-javascript-delay-load-or-load-on-scroll/103724/7 "2018-12-07T19:31:33Z")

</div>

I don’t think that’d help on the blog as well.

There needs to be a lazy loading option within the discourse comments plugin itself, if that’s what she is asking for

---

<div class="post-metadata">

### Author: ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)
#### Post date: [2021年十月15日 13:50 UTC](https://meta.discourse.org/t/using-discourse-as-commenting-system-via-javascript-delay-load-or-load-on-scroll/103724/8 "2021-10-15T13:50:16Z")

</div>