PeterKellner.net

For my final of 3 presentations at DevConnections Orlando is about building a hugely performant web application with html5 storage.  The app we built was a simple photo viewer that let you first look at hour images on line, then view them being pulled from local storage.  Here are a couple screen shots of what we built:

And, here is the Visual Studio 2010 Project File:

To build fully-featured web applications that support complex interaction in a reasonable amount of time requires a high-end JavaScript library. Someday, maybe JQueryUI will be good for this, but for now, the choices are few and include ExtJS, Dojo, YUI and a handful of others. This session will use ExtJS as the example. We will use Microsoft’s ASP.NET MVC as the data / CRUD layer and from that, we will build a typical LOB (line of business) application using complex UI elements. Those elements include layout managers, data grids, extensive validation, spinner controls and other advanced UI features. To get an idea of what I’m talking about, spend five minutes looking at the examples on the ExtJS web site demonstrating these advanced web UI features http://www.sencha.com/products/js/. You will be convinced that spending hundreds of hours trying to build something not nearly as well done as this is a waste of time when there are such excellent libraries already built for you.

The source attached below for my demos.

(About 100 People)

The Presentation was broken down into three parts. 

Part 1

Created a windows razor project that cached in image on a web site using best practices for threading and locking.  The code and project to do this are below:

var downloadByteArray = HttpContext.Current.Cache[cacheName] as byte[];
 if (downloadByteArray == null)
 {
     // make sure multiple requestors are not filling up the cache
     lock (LockVal)
     {
         downloadByteArray = HttpContext.Current.Cache[cacheName] as byte[];
         if (downloadByteArray == null)
         {
             Thread.Sleep(sleep * 1000);

             string imageLocation = HttpContext.Current.Server.MapPath("~") + imageUrl;

             downloadByteArray = File.ReadAllBytes(imageLocation);
             if (cacheExpiresSeconds > 0)
             {
                 HttpContext.Current.Cache.Insert(cacheName, downloadByteArray,
                                                  null,
                                                  DateTime.Now.Add(new TimeSpan(0, 0, 0, cacheExpiresSeconds)),
                                                  TimeSpan.Zero, CacheItemPriority.NotRemovable, null);
                 CacheInsertCounter = 9999; // any touch of this increments the global counter
             }
         }
     }
 }

Part 2

Tips from Steve Souders

Part 3

Sprite Library from Microsoft Example: 

This past Wednesday, I presented a front end performance session for how to make web sites work well.  I primarily covered the content from from Steve Souders Excellent book, High Performance Web Sites: Essential Knowledge for Front-End Engineers.

Not being a browser engineer, my knowledge is not the best in that area so probably the talk was a little dry.  We did spend a bunch of time talking about the the Sprite library just released to codeplex from the Asp.Net team.  That was  a great discussion!  I plan on talking more about that at my upcoming DevConnections talks in Orlando (very soon).  One interesting note was that there was a browser compatibility slide regarding sprites from Microsoft.  One of the attendees said “Peter, are you sure that Sprites are only supported on IE 8 and above?”.  I said I was sure that is what the document that I got from Microsoft said.  Well, I had several emails today with the Asp.Net team including the author of the document and though I don’t know the final answer, I’m sure that the Microsoft document was wrong on browser compatibility.  It seems that css and sprite support would work all the back to IE6.  When I know more, I’ll post a comment below with a link.  I’m sure Microsoft plans on updating that doc.

That’s it for now.  Below are some pictures from before the meeting.  I’d say that we had about 75 people in attendance.

Register Here:  http://www.baynetug.org/DesktopModules/DetailXEvents.aspx?ItemID=480&mid=49

When: 

Wednesday, 3/16/2011 at 6:30 PM

Where: 

Microsoft San Francisco Office, 835 Market Street, Suite 700

Event Description

All web developers need to know how to write web apps that give users great experience. In this presentation, Peter Kellner will talk first about the top 15 programming tips that you can use in your web site to make sure it’s as fast as it can be. Following Peter’s general discussion of client side optimization techniques, Doris Chen will talk about JavaScript best practices in web client development.

Many client side improvements can be implemented in under 10 minute. You will come away knowing a handful of tools you can use to analyze your web site as well as know what to do to make your web site perform faster. This presentation will focus on client site performance tips, that is things like cache headers, JavaScript optimizations, CDN’s and Sprite’s. JavaScript techniques such as clean separation of concerns, De-referencing objects, and thinking asynchronous when working with objects will be discussed. Server technologies and optimizations will be discussed, but the focus will be on what it takes to make your browser deliver your web application faster.

Agenda

• 6:00 doors open (pizza and drinks)
• 6:10 – 6:25 Lightning talks
• 6:30 announcements
• 6:45 – 8:15 presentation
• 8:15 – 8:30 raffle

Presenter’s Bio

Peter Kellner, a Microsoft ASP.NET MVP since 2007, is founder and president of ConnectionRoad, and a seasoned software professional specializing in high quality, scalable and extensible .Net web applications. His experience includes building and leading engineering teams both on and off shore. When not working, Peter spends most his free time biking. He has ridden his bike across the globe. Most recently he and his wife, Tammy, rode across the U.S., from California to Georgia, in just 27 days.

Doris Chen is a Developer Evangelist at Microsoft for the Western region of the United States, specialized in web technologies (Ajax, jQuery, ASP.NET, and Java). Doris has over 13 years of experience in the software industry working in several open source web tier technologies, Java platform, .NET and distributed computing technologies. She has developed and delivered over 400 keynotes, technical sessions, code camps worldwide, published widely at numerous international conferences and user groups including Bay.Net, JavaOne, O’Reilly, SD Forum and worldwide User Groups. Doris works very closely to create and foster the community around NetBeans, Glassfish, and related technologies.

I had a great time tonight presenting to about 40 people at Kendal, an awesome retirement community in Northern Ohio, at Oberlin.  This was my first ever presentation to a group of people that were as mature as this group is.  As always, I encouraged lots of questions and I was not disappointed.  I taught the meaning of https and when to use it, I went over lots of topics around email, we talked about public/private key in detail, purchasing on line, paypal and lots of other topics.  I had originally planned on Tuesday, their normal day for presentations, but unfortunately I a little bout with a virus and had to postpone.

The computer steering committee took me to dinner before the presentation

Part of the group showed up on schedule, but quite a few wandered in. I actually heard people went out and got their friends. 

And finally, my slide deck

In this section, we will talk about what happens when the users presses the “Sessions” hyperlink from the speakers page.  If you remember from the last article, we used a special converter on the Speakers.xaml page and bound that to the hyperlink titled sessions as shown below.

NOTE ADDED 1/25/2010 by PETER KELLNER:    Just finished 7 blog posts that each have video that basically follows was was done in the presentation.  They are linked here on this blog at:  http://peterkellner.net/category/ria-services/

I just volunteered to present at the next Bay.Net Meeting (San Francisco, at the Microsoft office) RIA Services in Silverlight 4 (Visual Studio 2010).  The original speaker couldn’t make it so this is a last minute thing.  I’m busy preparing an example of using the Silicon Valley Code Camp Session Listings as an example.  The example will hopefully including authentication (logging in and out), special admin access to certain functions, validation as well as other cool tricks.

Today was my first time doing 2 presentations during the same day at a professional conference (VSLive, Las Vegas).  Both sessions were fun to present and hopefully the audience got as much out of it as I did.  Lots of great questions, several twitter posts and best of all, they both finished on time (that is, I finished the material at the time I meant to!).

Here is the material for the first presentation:

It was fun to do my first presentation on ExtJS at the Southern California Rock and Roll Code Camp at Fullerton.  It was also great to see so many friends.  As promised, I’m attaching the code and PowerPoint here.  I started my talk with a little introduction on RIA (rich internet applications), then moved into ExtJS.  I realize now, that because the audience all pretty much knew the RIA story, it would have been better to just dive into ExtJS.  As it was, I ran out of time.  Next time, I’ll go with plan B.

My guess is we had about 50 people in the room.  I took a picture about 10 minutes before class started that I’m showing below.  I’m thinking a lot more showed up after the picture.  The guy in the second row mentioned that they should be taking a picture of me, but then, I was running out of prep time so I figured I better go with what I had.

I just signed up to give a session at the SoCal Code Camp at CALSTATE Fullerton.  I’ve been to this event before and it’s totally awesome.  Those SoCal guys really know how to throw a camp.  If you’re from around there, please stop by and see me.  It’s going to be a lot of fun.

My Session which covers some basics of ExtJS (a rich JavaScript library) is:

http://www.baadd.org/NET/tabid/56/Default.aspx

June Meeting – Wednesday, June 25, 2008

Remember Our New Location:  835 Market Street, Suite 700.

This year I had the opportunity to work in the Microsoft MVP Community meeting place (next to the wireless community center) as a game show host, computer runner of the questions, general answer person as well as just hanging out with the gang.  I have to admit it was very fun.  Turns out I was much better at running the computer than being the game show host, but after 4 days this, I realized I had not hosted one game.  Today (Friday) things changed.  Just before leaving for the airport  I got my chance.

Below are pictures taken by Terry showing my solo performance.  No one got any questions right.  We were forced into a tie breaker.  The first tie breaking question (what color was Spok’s blood) was answered incorrectly.  The second question, what color was George Washington’s white horse was fortunately answered correctly.  Otherwise, I might still be there.

For those that have never been to a Silverlight Dev Camp (OK, maybe nobody has ever been to one), this is an event where people on he (b)leading edge get together and talk about how much fun they are having and share war stories.  For me, life couldn’t get any better.  Well, as one of the other moderators on asp.net forums recently pointed out to me… Get a life.

Topic: Building animation into "Community Media Browser" for Leverage Software with Silverlight Alpha 1.1

As many of you know, I’ve been organizing CodeCamp here in Silicon Valley (Northern California) for the past month or so.

We have over 40 sessions signed up now and closing in on 700 attendees! Yee ha, this is getting fun. Please visit the site and if you have any feedback, please send it to me through the contact me page on this blog. Included in the 14 class rooms that are available to us, we plan on using 5 that are fully equipped with internet connected PC’s. Through these PC’s, I expect people to be constantly checking the schedules and adding feedback to classes they are attending. I’m currently having some trouble with printing the schedule through the sessions page, buth hopefully some one will come to my rescue soon on that.

I’ve been busy running SqlServer Tracing to Cache every database access I can possibly cache. The sessions page, which touches almost every table, does not create one database hit once the data is cached. My ISP (ultimate hosting) assures me we have a beefy server at the other end of the pipe. It’s a college campus on a weekend so the pipe from codecamp will be wide open. Hopefully all my hard work will run well when put to the test.

Wish us luck

Class Description:
Roll your own ObjectDataSource (and some Neat ADO Tricks) Presentation, Seattle Code Camp October 23, 2005

In this session, we will build an updateable ObjectDataSource from scratch that accesses a sql database. There are many tricks to make an ObjectDataSource truly reusable. Most of the tricky attributes and how to use them will be presented.

Web Site With Full Description