I am fairly new to asp.net and am not sure which is the most efficient way to write certain code. I am showing two examples, the first which is shorter too write, but when the browser produces the html code which is best? I am combining Asp.Net with Bootstrap BTW. Thank you

code
<div class="container two">

<h1>Crete</h1>
<h4>Beautiful beaches,great accomodation, fabulous food...A great place for a holiday with your family and friends.</h4>

<ul class="thumbnails three">
<li>
<asp:ListView ID="ListView1" runat="server" DataSourceID="EntityDataSource1">
<ItemTemplate>

<asp:HyperLink ID="HyperLink1"
ImageUrl='<%# Eval("Photo") %>'
NavigateUrl='<%# Eval("Link") %>'
ToolTip='<%# Eval("Description") %>'
Target="_blank"
runat="server"></asp:HyperLink>

</ItemTemplate>
</asp:ListView>
</li>
</ul>

<asp:EntityDataSource ID="EntityDataSource1" runat="server"
ConnectionString="name=PictureEntities1"
DefaultContainerName="PictureEntities1" EnableFlattening="False"
EntitySetName="ImageWalls" Select="it.[Link], it.[Description], it.[Photo]">
</asp:EntityDataSource>

</div> <%--End Container Two--%>
/code


code
<li>
<a href="Tavernas.aspx" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/1b.jpg" alt="" />
</a>
</li>

<li>
<a href="Tavernas.aspx" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/2b.jpg" alt="" />
</a>
</li>

<li>
<a href="Beach.aspx" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/3b.jpg" alt="" />
</a>
</li>

<li>
<a href="Beach.aspx" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/4b.jpg" alt="" />
</a>
</li>

<li>
<a href="Beach.aspx" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/5b.jpg" alt="" />
</a>
</li>

<li>
<a href="Beach.aspx" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/6b.jpg" alt="" />
</a>
</li>

<li>
<a href="http://www.googleartproject.com/collection/acropolis-museum/" target="_blank" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/7b.jpg" alt="" />
</a>
</li>

<li>
<a href="http://www.googleartproject.com/collection/acropolis-museum/" target="_blank" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/8b.jpg" alt="" />
</a>
</li>

<li>
<a href="http://www.heraklion.gr/en/city/archeological-museum/archeological-museum.html" target="_blank" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/9b.jpg" alt="" />
</a>
</li>

<li>
<a href="http://www.botanical-park.com/" target="_blank" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/10b.jpg" alt="" />
</a>
</li>

<li>
<a href="http://www.chania-oldtown-walks.com/" target="_blank" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/11b.jpg" alt="" />
</a>
</li>

<li>
<a href="#" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/12b.jpg" alt="" />
</a>
</li>

<li>
<a href="http://en.wikipedia.org/wiki/Georgioupoli" target="_blank" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/13b.jpg" alt="" />
</a>
</li>

<li>
<a href="Beach.aspx" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/14b.jpg" alt="" />
</a>
</li>

<li>
<a href="http://www.cretanvillas.co.uk" target="_blank" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/15b.jpg" alt="" />
</a>
</li>

<li>
<a href="http://www.cretanvillas.co.uk" target="_blank" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/16b.jpg" alt="" />
</a>
</li>

<li>
<a href="Beach.aspx" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/17b.jpg" alt="" />
</a>
</li>

<li>
<a href="http://www.samariagorge.eu/" target="_blank" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/18b.jpg" alt="" />
</a>
</li>

<li>
<a href="http://en.wikipedia.org/wiki/Aptera,_Greece" target="_blank" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/19b.jpg" alt="" />
</a>
</li>

<li>
<a href="Beach.aspx" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/20b.jpg" alt="" />
</a>
</li>

<li>
<a href="Beach.aspx" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/21b.jpg" alt="" />
</a>
</li>

<li>
<a href="#" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/22b.jpg" alt="" />
</a>
</li>

<li>
<a href="http://limnoupolis.gr" target="_blank" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/23b.jpg" alt="" />
</a>
</li>

<li>
<a href="Beach.aspx" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/24b.jpg" alt="" />
</a>
</li>

<li>
<a href="Beach.aspx" class="thumbnail">
<img data-src="holder.js/200x200" src="CubePhotos/25b.jpg" alt="" />
</a>
</li>

/code

Given that I don't know your domain, my suggestion would try to page it and example 1000 rows at a time because I cannot see user seeing all 2 million rows at one time

Else get only the records just required of the user, for the user, by the user

You're really comparing apples and oranges.

Your first code snippet is server side code that goes out to the database using an EntityDataSource, gets the request picture information and then builds up the HTML that is eventually sent to the client.

The second example is already plain HTML and as such can be sent to the client directly.

Considering the fact that the server side code queries the database to get data, it will always be slower. However, if you need to get dynamic data, then you really don't have a choice. If all you need is static HTML, now and in the future, the second example might be enough.

So, this isn't about speed, but about functionality. If you don't need data from a database, use the second example.

Cheers,

Imar

__________________
Imar Spaanjaars
http://Imar.Spaanjaars.Com
Follow me on Twitter

Author of Beginning ASP.NET 4.5 : in C# and VB, Beginning ASP.NET Web Pages with WebMatrix
and Beginning ASP.NET 4 : in C# and VB.
Did this post help you? Click the button below this post to show your appreciation!

Thank you Imar
I did understand the different workings, I did not know which method would produce the quickest loading of the web-site.

Thank you again for your time

The first code block references a small table in a database.
The fields were:-

code
ThumbID (PK, int not null)
Link (nvarchar(max), not null)
Description (nvarchar(100), not null)
Photo (nvarchar(100), not null)
/code

I used the wizard in Visual Studio to set up a link with Entity Framework.

Hope this helps

Tom

Hi hocnishwhite
If you follow chapter 14 in Imars book Beginning asp.net, this is a good description of how to set up E.F. database with the format shown, then the code block that is right at the top of the page goes into your aspx page.
Shown below is one row from the database. The number is the 'ID', the next section is the 'Link' and the third is the 'link to the image'
code
'7' 'http://www.googleartproject.com/collection/acropolis-museum/' 'The Acropolis, a day trip to Athens' 'CubePhotos/7b.jpg'
/code

I used Bootstrap to format the page.
You can see the result at http://www.tersanas.com/LinkWall.aspx .
Good luck and hope this helps