Showing posts with label SyntaxHighlighter. Show all posts
Showing posts with label SyntaxHighlighter. Show all posts

How to Easily highlight source codes in content?

So if you are a blogger who writes on computer programming and publish source codes in your blog post or if you just want to publish some source codes in your website, then what you can do to stand-out the code from other text is

  • Use <code /> tags
  • Use <pre /> tags
Cool. It will look like codes but not look like as it looks like in your favorite code editor, with different colors for constants, variables, functions, strings etc. along with line numbers.

So, what you want to do is to highlight source codes and make them appearing like in a code editor, which is just not for colors, but for more readability too.

How to Optimize syntax highlighter loading speed?

If you are using SyntaxHighlighter in your blog or website, then you might have noticed that you have to load the brushes you used in a post or page. The way you load them is generally by 

  1. Linking specific brush scripts used on a given page or post, 
  2. Or you load them statically by including all the brushes being used though-out the blog or website.
The first option for loading is disgusting as you have to write the code for each post or pages, however it is better as in this way you load only those brushes you used in an specific post or page.

The second option is better as you don't have to write code for each post or page, but will put impact on website loading speed as you will be loading brush scripts unnecessarily in every post or page despite their usage.