Improving Google Page Speed Score for BlogEngine

by filip 22. February 2012 17:47

I was getting a 72/100 score from Google Page Speed, so I attempted to improve that a bit.

I added caching to static resources via the web config, which raised my score by about 10:

<staticContent>
  <clientCache cacheControlMode="UseMaxAge" cacheControlMaxAge="365.00:00:00" />
  <remove fileExtension=".mp4" />
  <remove fileExtension=".gif" />
  <remove fileExtension=".htm" />
  <remove fileExtension=".html" />
  <remove fileExtension=".jpeg" />
  <remove fileExtension=".jpg" />
  <remove fileExtension=".js" />
  <remove fileExtension=".png" />
  <remove fileExtension=".txt" />
  <mimeMap fileExtension=".mp4" mimeType="video/mp4" />
  <mimeMap fileExtension=".gif" mimeType="image/gif" />
  <mimeMap fileExtension=".htm" mimeType="text/html" />
  <mimeMap fileExtension=".html" mimeType="text/html" />
  <mimeMap fileExtension=".jpeg" mimeType="image/jpeg" />
  <mimeMap fileExtension=".jpg" mimeType="image/jpeg" />
  <mimeMap fileExtension=".js" mimeType="application/x-javascript" />
  <mimeMap fileExtension=".png" mimeType="image/png" />
  <mimeMap fileExtension=".txt" mimeType="text/plain" />
</staticContent>

New page score: 82/100

I then made sure that all of my custom javascript files went through the javascript handler in BlogEngine, which raised my score to by 3:

<script language="javascript" type="text/javascript" 
src="/js.axd?path=%2fmyuploads%2fbf_script.js&minify="></script>

New page score: 85/100

I then uninstalled the syntax highlighter extension from BE. This upped my page rank by another 3.

New page score: 88/100

There's still some room for improvement, though... I want to get as close as possible to 100 :)

Tags: , , , ,

Web Development

Disqus Recent Comments, Top Commenters, and Most Discussed Widget for BlogEngine.NET

by filip 20. February 2012 21:11

After I switched to Disqus comments, I noticed that my recent comments widget no longer worked. So I wrote a new widget that adds some JavaScript to the web page which includes the recent comments (and a few other options, if desired) when using Disqus.

The widget is is available on the blogengine.net gallery website.

Known issues
-The character limit when using the combination look doesn't seem to be working. I need to look into this more, but right now it seems Disqus is ignoring the character count.

Tags: , ,

Web Development

New Comment System

by filip 17. February 2012 15:13

The blog now uses a new comment system - Disqus.

I upgraded to BE v2.5, and found various instructions on how to move to Disqus... including these.

There was one problem, however. The instructions state that on post.aspx, JavaScript needs to change to the following:

<script type="text/javascript">
    var disqus_title = '<%=Post.Title %>';
    var disqus_identifier = '<%= Post.Id.ToString() %>';
    var disqus_url = '<%= Post.AbsoluteLink %>';
    var disqus_developer = '<%= BlogEngine.Core.BlogSettings.Instance.DisqusDevMode ? 1 : 0 %>';
    (function () {
        var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
        dsq.src = 'http://<%=BlogEngine.Core.BlogSettings.Instance.DisqusWebsiteName %>.disqus.com/embed.js';
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
    })();
</script>

However, that is not accurate and will result in errors.  The correct code needs to reference Page, and not Post.

<script type="text/javascript">
    var disqus_title = '<%=Page.Title %>';
    var disqus_identifier = '<%= Page.Id.ToString() %>';
    var disqus_url = '<%= Page.AbsoluteLink %>';
    var disqus_developer = '<%= BlogEngine.Core.BlogSettings.Instance.DisqusDevMode ? 1 : 0 %>';
    (function () {
        var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
        dsq.src = 'http://<%=BlogEngine.Core.BlogSettings.Instance.DisqusWebsiteName %>.disqus.com/embed.js';
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
    })();
</script>

If the above is not changed, the blog will throw the following error:

page.aspx(14): error CS0120: An object reference is required for the non-static field, method, or property 'BlogEngine.Core.Post.Title.get'

One more change needs to be done if the above takes place. In archive.aspx.cs, the following line:

comments.InnerHtml = string.Format("<span><a href=\"{0}#disqus_thread\">{1}</a></span>", post.PermaLink, Resources.labels.comments);

needs to change to:

comments.InnerHtml = string.Format("<span><a href=\"{0}#disqus_thread\">{1}</a></span>", post.AbsoluteLink, Resources.labels.comments);

The change above will allow the Archive to correctly display the number of comments and reactions to each post.

Tags: , , ,

Web Development

About Filip Stanek

Death Note Pic I'm a developer at ACG in Cincinnati, OH. I like ASP.NET, Flash, and other web technologies, & enjoy playing chess, video games, etc.

Currently playing:
- StarCraft IIE-mail me Send mail

Disqus

Month List