Syntax highlighting of strings
secretGeek .:dot Nuts about dot Net:.
home .: about .: sign up .: sitemap .: secretGeek RSS

Syntax highlighting of strings

Maybe this is a fiddly little point, but I think it's the sort of detail that's worth paying attention to.

The theory is:

Syntax highlighting of strings could be improved to make reading easier

In the following code example, look at the way the string is 'highlighted':

return string.Format("<a href=\"{0}\">{0}</a>", link);

The red highlighting covers not just the literal string itself, but also the quote characters and the escape characters: the 'meta' guff that decorates the string.

So in the previous example, there's no clue given to the naked eye that some of the quote marks are "literal" quote marks, and others are delimiters to mark the beginning or end of the string.

Instead, syntax highlighting gives up, right when it could be most helpful. And it's left as a parsing exercise for the programmer to determine what is and isn't really a string.

Here's a different way the syntax highlighting could be implemented:

return string.Format("<a href=\"{0}\">{0}</a>", link);

Now colour (actually -- saturation) is used to differentiate between the literal parts of the string, and the 'meta' parts of the string (the escape characters and the quote delimiters).

It looks strange at first glance, because it's an alien concept -- but i think that if you were used to this type of highlighting, it would allow you to "see" what escaping is going on in a string, far more readily.

More importantly -- it allows you to selectively 'see past' the escaping.

If you look at the second example, you can 'train' your eyes to focus on just the literal string itself -- until you see basically:

return string.Format("<a href=\"{0}\">{0}</a>

And thus you can reason about the text you've written, or proof-read it, in greater isolation from things that only the parser needs to worry about (the mechanics of escape characters etc.)





'Shog9' on Fri, 11 Apr 2008 21:34:00 GMT, sez:

You know, that's a good idea.
It'd work even better if they were colored gray-on-white (instead of black-on-gray), since they'd sorta fade into the background (assuming you use a white background).



'Troy Goode' on Fri, 11 Apr 2008 22:30:09 GMT, sez:

See, this is the kind of thing I wish I had never read. Not because I disagree with what you wrote, but because I've instantaneously gone from ignorantly complacent with my current string syntax highlighting to completely depressed that it doesn't work the way you suggest.

Thanks for ruining my day. ;-)



'Zooba' on Fri, 11 Apr 2008 23:06:18 GMT, sez:

The VS 2008 XAML editor does highlighting of binding codes within strings.

No HTML allowed, so I'll describe it:

<TextBlock Text="{Binding Path=Name}" />

In the default colour scheme:
All non-alpha characters are blue (<, =, ", {, }, /, >)
"TextBlock" and "Binding" are brown
"Text" and "Path" are red
"Name" is blue (same as non-alpha)



'Jeremy' on Sat, 12 Apr 2008 03:06:32 GMT, sez:

I was going to say the exact same thing as Shoq9, but he beat me to it. First of all... good idea. Second, yes, have the quotes and escape characters fade a bit into the background (gray on white), so that the actual string jumps out at you more.



'Omer van Kloeten' on Sat, 12 Apr 2008 05:49:43 GMT, sez:

Great idea and I'm with Shoq9. The more interesting bits in my string are the non-meta characters :)



'lb' on Sat, 12 Apr 2008 07:14:19 GMT, sez:

Top feedback Shoq9 and Omer -- i will update the post to reflect the colours you suggest,

I was never happy with the colours I went with, and nearly stopped myself from blogging this as a result.

"I don't know graphic design, but i know what i hate" -- and i hated the grey background.

I'll try a "faded-out" red colour and that should improve the appearance a bit.



'Steve Bohlen' on Sat, 12 Apr 2008 18:16:27 GMT, sez:

Not only is this a truly EXCELLENT idea, but its already entirely achievable in Visual Studio using some freeware tools (or the 'naked' VS SDK if you feel brave).

Check out this video from the Deveoper Express website about how to do just the kind of thing you're suggesting using their DXCore freeware VSSDK-abstraction layer:

http://www.devexpress.com/Products/NET/IDETools/CodeRush/Trainings/DXCore_PaintAssignmentExpressions/DXCore_PaintAssignmentExpressions.html

This isn't intended as an inadvertent advertisement for DXCore (tho personally I happen to love the toolset) but is more intended to maybe whet the appetite of someone with more spare time than I to quickly code just such an add-in and then make it available to the world-at-large out of the goodness of their heart :)

-Steve B.



'Dom' on Sun, 13 Apr 2008 22:27:07 GMT, sez:

Now it'd be nice if when you float over that monstrosity of a string, if it rendered the final result in a tooltip using appropriate text. Something like like the font previewer, but a string previewer instead.



'Jon Schneider' on Mon, 14 Apr 2008 11:23:12 GMT, sez:

I like this idea as well!

How would escape sequences other than backslash-doublequote look with respect to this syntax highlighting? Probably sequences such as \n would *not* be faded, since you wouldn't want the reader to "see past" the fact that a newline is embedded in the string?



'lb' on Mon, 14 Apr 2008 20:49:25 GMT, sez:

@jon, good question.
here's my thought:

for double backslash -- the first backslash is faded, the second one isn't.

for backslash anything else (e.g. \n, \r, \" \t ) both characters are faded.

A tooltip (as Dom suggested above) could be used to give a 'wysiwyg' view of the string.




name


website (optional)


enter the word:
 

comment (HTML not allowed)


All viewpoints welcome. Incivility is not tolerated, such comments are deleted.

 

I'm the co-author of TimeSnapper, a life analysis system that stores and plays-back your computer use. It makes timesheet recording a breeze, helps you recover lost work and shows you how to sharpen your act.

 

NimbleText - FREE text manipulation and data extraction

NimbleText is a Powerful FREE Tool

I wrote this, and use it every day for:

  • extracting data from text
  • manipulating text
  • generating code

It makes you look awesome. You should use NimbleText, you handsome devil!

 

Articles

The Canine Pyramid The Canine Pyramid
Humans: A Tragedy. Humans: A Tragedy.
ACK! ACK!
OfficeQuest... Gamification for the Office Suite OfficeQuest... Gamification for the Office Suite
New product launch: NimbleSET New product launch: NimbleSET
Programming The Robot from Diary of a Wimpy Kid Programming The Robot from Diary of a Wimpy Kid
Happy new year 2014 Happy new year 2014
Downtime as a service Downtime as a service
The Shape of Your Irrationality The Shape of Your Irrationality
This is why I don't go to nice restaurants any more. This is why I don't go to nice restaurants any more.
A flowchart of what programmers do at work all day A flowchart of what programmers do at work all day
The Telepresent Man. The Telepresent Man.
Interview with an Ex-Microsoftie. Interview with an Ex-Microsoftie.
CRUMBS! Commandline navigation tool for Powershell CRUMBS! Commandline navigation tool for Powershell
Little tool for making Amazon affiliate links Little tool for making Amazon affiliate links
Extracting a Trello board as markdown Extracting a Trello board as markdown
hgs: Manage Lots of Mercurial Projects Simultaneously hgs: Manage Lots of Mercurial Projects Simultaneously
You Must Get It! You Must Get It!
AddDays: A Very Simple Date Calculator AddDays: A Very Simple Date Calculator
Google caught in a lie. Google caught in a lie.
NimbleText 2.0: More Than Twice The Price! NimbleText 2.0: More Than Twice The Price!
A Computer Simulation of Creative Work, or 'How To Get Nothing Done' A Computer Simulation of Creative Work, or 'How To Get Nothing Done'
NimbleText 1.9 -- BoomTown! NimbleText 1.9 -- BoomTown!
Line Endings. Line Endings.
**This** is how you pivot **This** is how you pivot
Art of the command-line helper Art of the command-line helper
Go and read a book. Go and read a book.
Slurp up mega-traffic by writing scalable, timeless search-bait Slurp up mega-traffic by writing scalable, timeless search-bait
Do *NOT* try this Hacking Script at home Do *NOT* try this Hacking Script at home
The 'Should I automate it?' Calculator The 'Should I automate it?' Calculator

Archives Complete secretGeek Archives

TimeSnapper -- Automated Screenshot Journal TimeSnapper: automatic screenshot journal

25 steps for building a Micro-ISV 25 steps for building a Micro-ISV
3 minute guides -- babysteps in new technologies: powershell, JSON, watir, F# 3 Minute Guide Series
Universal Troubleshooting checklist Universal Troubleshooting Checklist
Top 10 SecretGeek articles Top 10 SecretGeek articles
ShinyPower (help with Powershell) ShinyPower
Now at CodePlex

Realtime CSS Editor, in a browser RealTime Online CSS Editor
Gradient Maker -- a tool for making background images that blend from one colour to another. Forget photoshop, this is the bomb. Gradient Maker



[powered by Google] 

How to be depressed How to be depressed
You are not inadequate.



Recommended Reading


the little schemer


The Best Software Writing I
The Business Of Software (Eric Sink)

Recommended blogs

Jeff Atwood
Joseph Cooney
Phil Haack
Scott Hanselman
Julia Lerman
Rhys Parry
Joel Pobar
OJ Reeves
Eric Sink

InfoText - amazing search for SharePoint
LogEnvy - event logs made sexy
Computer, Unlocked. A rapid computer customization resource
Aussie Bushwalking
BrisParks :: best parks for kids in brisbane
PhysioTec, Brisbane Specialist Physiotherapy & Pilates
 
home .: about .: sign up .: sitemap .: secretGeek RSS .: © Leon Bambrick 2006 .: privacy

home .: about .: sign up .: sitemap .: RSS .: © Leon Bambrick 2006 .: privacy