After researching and reviewing on whether to choose XPATH or CSS selector, the following are the points I came across.
Some points to CSS
Generally CSS is easy to use and readable over XPATH.
CSS is native to browsers and XPATH is not
CSS is preferred for testing as it is having more advantages over XPATH
Some points to XPATH
XPATH can travese up the document from a child element to parents.
Speed wise CSS and XPATH can be equal, or either one would be a bit speedier than other.
Therefore speed comparison can be ignored. However off the record, I have encountered that most mention that CSS is much faster than XPATH.
If we are down to select either CSS or XPATH reference, as I see we should compare the generated CSS and XPATH and select the better readable and short path locating string. Others comments are highly appropriated.
Converting XPATH to CSS seletors: Following article layout on how to change XPATH element reference to CSS.
Differences between CSS and XPATH
A general guideline on how to select elements in a preferred order (where ID is the king)
A video presentation on how why CSS is preferred on many occations and comprehensive presentation on CSS vs XPATH for Selenium.