Tecnoblog's Experience With Discourse Comments

Hi there!

I’m really excited about this new feature. I’ve been waiting for a solution like this for a long time, and the initial feedback from our readers at Tecnoblog has been great – they love having the community integrated.

However, after some real-world testing, I’ve spotted a few technical hurdles we need to clear to make this feel like a truly native commenting system and, more importantly, to make it sustainable for high-traffic sites.

Here’s what I’ve found so far:

1. Performance & Server Load

Our server load spiked significantly after we embedded the full app. Looking at Cloudflare, our request volume multiplied by 10. A few ideas on how to optimize this:

  • Lazy Loading: Implementing lazy load for the JS helps a lot (I’m already using a workaround for this).
            <script type="text/javascript">
                DiscourseEmbed = {
                    discourseUrl: '<?php echo esc_url($discourse_url); ?>',
                    
                    <?php if ($use_topic_id): ?>
                        // Modo ID: Tópico salvo no banco, imune a mudanças de URL
                        topicId: <?php echo intval($topic_id); ?>,
                    <?php else: ?>
                        // Modo URL: Fallback quando a criação via API falha
                        discourseEmbedUrl: '<?php echo esc_url($permalink); ?>',
                    <?php endif; ?>
                    fullApp: true,
                    embedHeight: '800px',
                };

                (function() {
                    var container = document.getElementById('discourse-comments');

                    // Verifica se o navegador suporta IntersectionObserver
                    if ('IntersectionObserver' in window) {
                        var observer = new IntersectionObserver(function(entries, observer) {
                            entries.forEach(function(entry) {
                                if (entry.isIntersecting) {
                                    // Quando o div entra na tela, carrega o script
                                    loadDiscourse();
                                    observer.unobserve(entry.target);
                                }
                            });
                        }, { rootMargin: "1500px" }); // Carrega 1500px antes de chegar no div

                        observer.observe(container);
                    } else {
                        // Fallback para navegadores antigos
                        loadDiscourse();
                    }

                    function loadDiscourse() {
                        var d = document.createElement('script'); 
                        d.type = 'text/javascript'; 
                        d.async = true;
                        d.src = window.DiscourseEmbed.discourseUrl + 'javascripts/embed.js';
                        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(d);
                    }
                })();
            </script>

Here you can see the number of requests dropping after the Lazy Load was implemented (and some parts of the website were still cached, so it’s not the final result):

  • Stripping the payload: Can we reduce the resources loaded within the embed? Ex: i noticed queries for Chat URLs and AI credit checks—are these necessary for the embed view?

  • Request Frequency: The real-time POST requests are a bit aggressive. Maybe we can dial back the polling frequency for the embed version?

  • Cache: Improved cache management for embedded topics to handle traffic spikes.

2. Analytics Mess

Right now, the embed is firing Google Analytics/GTM scripts. This is doubling our pageviews (one hit for the post, another for the iframe), which messes up our data. It would be ideal if the system could detect it’s in an iframe and kill any tracking scripts automatically (the Discourse analytics too).

3. The iFrame Height Issue

This is probably the biggest hurdle for UX. If a post has no comments, there’s a weird empty gap. If it has a long thread, the iframe gets cut off within the first 2 or 3 comments, forcing a “scroll-within-a-scroll” which is pretty bad, especially on mobile.

To really compete with something like Disqus, we need the height to be dynamic (according to the number of comments) and also have a “Read More” button that expands the thread after a certain number of replies.

4. Plugin Conflicts

Since the embed loads all active plugins, we’re seeing some weird behavior. For example, “Google One Tap” pops up inside the blog post. When a user logs in, the iframe refreshes and drops them on the community homepage instead of the comment thread. Being able to manually disable specific plugins for the embed view would be a lifesaver.

5. Login Friction

The current flow is a bit of a conversion killer: User clicks login → New tab opens → Login happens → User is left on the community homepage. Back on the blog post, the iframe still looks logged out until the user manually refreshes the whole page. It’s a confusing loop that makes people give up and leave before commenting.

Since we activated the new embed, our daily registrations have more than doubled, which is great. However, our engagement metrics haven’t moved at all. In fact, our DAU/MAU dropped – we have more logged-in users, but they aren’t interacting. Metrics like “Daily Engaged Users,” “New Contributors,” and “Postings” haven’t seen any increase.

This proves that people want to join the conversation, but they’re getting lost in the login loop and abandoning the post before they can actually comment.

6. Mobile UI

On mobile, the reply window takes up the entire screen, so you lose all context of the conversation you’re replying to. It feels a bit claustrophobic—anything we can do to keep it more compact would be a huge win.


I really want to make this the default system for Tecnoblog (and also in another site we own). Let me know if you want to dive deeper into any of these points!

9 Likes

This will be fixed by

7 Likes

Thanks for the detailed feedback @Thiago_Mobilon !

I will work the list and try to cover everything eventually.

I just did a check here, and looks like your CSS in misconfigured on your Discourse site. You have double cache-control headers, and one of them is no-cache.

curl -v https://tecnoblog.net/comunidade/stylesheets/common_cd45efa28175431b0b8ff143783178d55206920b.css?__ws=tecnoblog.net -s 2>&1 | grep cache-control
< cache-control: max-age=31556952, public, immutable
< cache-control: no-store, no-cache, must-revalidate, private
6 Likes

Are you using the Discourse built-in Google Analytics integration?

5 Likes

Handling these in

6 Likes

Handled in

8 Likes

I believe Cloudflare must have added that header because I bypassed the cache for the /comunidade/ directory. If I don’t remove it, it will apply its caching rules to the Discourse CSS and JS, which could potentially create conflicts later on.

Anyway, when I brought up the caching issue, it was more with the aim of reducing the server load. The CSS files are static, correct? If so, the fact that they are not cached, while undesirable, wouldn’t directly impact the server load.

2 Likes

I am utilizing the Discourse integration with Google Tag Manager.

1 Like

They impact end user performance, as they are 59 requests downloading 1.43MB of CSS (compressed to 340KB) on every article.

And they are also served by the Ruby server, as we expect sites to not break the cache, meaning that in normal conditions this route is very rarely used.

If I’m not mistaken, serving those with a broken cache means they even hit the database.

1 Like

This is a great idea, I’m adding native support for it

7 Likes

That is a more general issue with composing on the go, and will benefit from improvements from Creating/Editing a post on mobile: let's discuss the 2026 Discourse experience.

5 Likes

We have an amazing cache for anonymous users hitting topic pages, and it also covers this new mode, so you should be able to scale well to handle spikes as long as there are enough Pitchfork workers and Redis I/O workers.

2 Likes

Pooling automatically dials down on background tabs or during high load events, and the same should apply here.

2 Likes

Opted into tagging those in

5 Likes

I am encountering difficulties in getting dynamic height to function correctly. Despite updating Discourse and refreshing my snippet with the latest configurations, the issue persists.

        <h4 class="comments-main-title component-title">Comentários</h4>
        <div id='discourse-comments'></div>

        <meta name='discourse-username' content='<?php echo esc_attr($discourse_author); ?>'>

        <script type="text/javascript">
            DiscourseEmbed = {
                discourseUrl: '<?php echo esc_url($discourse_url); ?>',
                
                <?php if ($use_topic_id): ?>
                    // Modo ID: Tópico salvo no banco, imune a mudanças de URL
                    topicId: <?php echo intval($topic_id); ?>,
                <?php else: ?>
                    // Modo URL: Fallback quando a criação via API falha
                    discourseEmbedUrl: '<?php echo esc_url($permalink); ?>',
                <?php endif; ?>
                fullApp: true,
                lazyLoad: true, // disable lazy loading of the iframe
                lazyLoadMargin: '1500', // pixels before viewport to start loading
                dynamicHeight: true,
                embedMinHeight: '400',
                embedMaxHeight: '3000',
					  embedHeight: '800px',
                // className: 'CLASS_NAME',
            };

            (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>

https://tecnoblog.net/noticias/samsung-wallet-agora-suporta-pix-por-aproximacao/

1 Like

Could we use <iframe loading="lazy"> here? That way, we don’t need custom JS or intersection observers?

1 Like

Oh that is now widely supported across browsers? TIL! Will change is ASAP.

5 Likes

Thanks for testing, found the issue

3 Likes

Excellent! The dynamic height is now functioning as expected. However, this has introduced a minor issue: when I click to respond, the input field for the reply attempts to adjust to the iframe’s height. In this instance, it has erroneously become 7385px in height.

The post contained 31 comments, and the embedded iframe was 9757px tall (I had set the embedMaxHeight to 15000px).

https://tecnoblog.net/noticias/samsung-wallet-agora-suporta-pix-por-aproximacao/

Update: I’ve actually noticed that the comment form expands the iframe’s height to its maximum, so when I click “discard”, the layout ends up with a huge blank space remaining below the comments.

Screenshot 2026-04-16 at 16.03.37

2 Likes

I think you will need a max-height at a more sane value there, like 1000 to 1500px.

So this feature will cover your initial problem of

and scales up to a certain point, but given Discourse native infinite scroll behavior, you don’t want the height for increase that much.

This feature won’t remove the “scroll withing scroll” anytime soon.

As for mobile composer, I’m looking into what we can do here.

3 Likes