Matt RaibleMatt Raible is a Web Developer and Java Champion. Connect with him on LinkedIn.

The Angular Mini-Book The Angular Mini-Book is a guide to getting started with Angular. You'll learn how to develop a bare-bones application, test it, and deploy it. Then you'll move on to adding Bootstrap, Angular Material, continuous integration, and authentication.

Spring Boot is a popular framework for building REST APIs. You'll learn how to integrate Angular with Spring Boot and use security best practices like HTTPS and a content security policy.

For book updates, follow @angular_book on Twitter.

The JHipster Mini-Book The JHipster Mini-Book is a guide to getting started with hip technologies today: Angular, Bootstrap, and Spring Boot. All of these frameworks are wrapped up in an easy-to-use project called JHipster.

This book shows you how to build an app with JHipster, and guides you through the plethora of tools, techniques and options you can use. Furthermore, it explains the UI and API building blocks so you understand the underpinnings of your great application.

For book updates, follow @jhipster-book on Twitter.

10+ YEARS


Over 10 years ago, I wrote my first blog post. Since then, I've authored books, had kids, traveled the world, found Trish and blogged about it all.

[OSCON 2008] Even Faster Web Sites by Steve Souders

Steve works at Google on web performance and open source initiatives. To begin his talk, Steve is running YSlow in "autorun" mode. This runs YSlow Performance tests on the top 100 sites according to Alexa. Before Google, Steve was at Yahoo for 7 years. You can download Steve's slides from his site (don't ask me where).

iGoogle with an empty cache: 9% of the time is spent getting the HTML document. The % of time of what a webserver does is a pretty small percentage of the overall picture. If the cache is primed, the time goes up to 17% of the time.

80-90% of the end-user response time is spent on the frontend. Start there.

There's a greater potential of improvement on the frontend. If you improve the backend performance by 50%, chances are the end-user only sees a 5% improvement.

The 14 Rules are encapsulated in the YSlow plugin. At OSCON last year, Yahoo released YSlow. 500,000 downloads since it was released. Following the release of YSlow, Steve wrote High Performance Web Sites.

High Performance Web Sites, Vol 2. The 3 most important rules are:

  • Split the initial payload
  • Load scripts without blocking
  • Don't scatter inline scripts

Why focus on JavaScript? A lot of the top sites use JavaScript. For example, up until a few weeks ago, Facebook served up 1MB of JavaScript, uncompressed. Scripts block parallel downloads and page rendering. To see it in action, go to http://stevesouders.com/cuzillion/?ex=10008.

Any content below a <script> is blocked from rendering - even if it's already cached in the browser. Cuzillion is an open source project that Steve is releasing that allows you to add components to a page and test their performance.

Split your JavaScript between what's needed to render the page and everything else. Load "everything else" after the page is rendered. To do this, you can use Firebug to do it manually, or you can use Doloto from Microsoft to automate the splitting of your files.

MSN.com solves the script blocking problem by using JS DOM to allow for parallel downloading. There's 6 techniques for doing this:

  • XHR Eval (must have same domain as page)
  • XHR Injection (same domain)
  • Script in iFrame (same domain)
  • Script DOM Element (domains can differ)
  • Script Defer (only supported in IE, domains can differ)
  • document.write (not recommended, parallelization only works in IE)

How do these techniques cause "browser busy" indicators? XHR Eval and Injection don't trigger any indicators. You need to choose when you want to show busy indicators. It's good to show them when you want to show your users that something is processing (but not for lazy-loading JavaScript that's not required for load). For the different techniques, most don't ensure order of parsing.

Based on 3 factors, Steve can tell you which technique is best to use. These three factors are 1) the URL of the page and script 2) if you want busy indicators and 3) if you care about order. Steve thinks it would be awesome if web frameworks could support this to write out JavaScript appropriately for the developer's input.

Long executing inline scripts block rendering and downloads. If you know you're going to have scripts like this, you can solve it with a couple workarounds:

  • Initiate execution with setTimeout(>250 for Firefox)
  • Move JavaScript to enternal script with advanced downloading techniques
  • Use defer attribute for IE

In Firefox 2, stylesheets block parallel downloads just like scripts. IE doesn't. However, IE will block when you have a stylesheet followed by an inline script. To solve, it's best to move line scripts above stylesheets or below other resources. use <link>, not @import.

Takeaways: focus on the frontend, run YSlow, focus on JavaScript (split initial payload, load scripts w/o blocking, don't scatter inline scripts).

Three Announcements:

Posted in The Web at Jul 24 2008, 04:23:12 PM MDT 8 Comments

[OSCON 2008] CSS for High Performance JavaScript UI by Gavin Doughtie

Gavin is a front end developer on Google’s Picasa Web Albums and a contributor to the dojo toolkit. The original designer tools for Web 1.0 were the FONT tag, TABLE hacks and spacer gifs. Now we live in the future (shows a picture of the iPhone). Maybe it's time to accept that we're stuck with CSS. "I'm a coder, not a designer" is what happens at OSCON.

There are costs of JavaScript: development, download, parse time and runtime performance. It's extremely powerful and high-level, but it's slow because it's interpreted. Drawing a box with JavaScript in Firefox 3 isn't too difficult. Another way to do the same thing is with CSS. Doing the same thing in CSS is much faster and requires less code. Surrender To Win. You don't have to code it all. You can hand off part of that to your runtime environment (browser).

CSS Fundamentals
You want to how things flow in a page. Browsers were originally designed to render text. They're built to render flowing text. Other important fundamentals include float, positioning, negative margins, relative units, pseudo-selectors. Lastly, you need to know when to use tables. Gavin is now showing an example of using CSS to modify an image so it scales with the browser window. It's pretty simple:

body {
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
  overflow: hidden;
}

img { 
  position: relative;
  width: 100%;
  height: 100%;
}

Relatively Absolutely: "Absolute" in relative to position:relative. If an element has absolute positioning, it will only be positioned relative to it's parent element. To draw a box on an image, it's usually best to calculate the percentage position and sizes in script or on the server. The world's greatest psuedo-selector is :hover. Unfortunately, :hover doesn't work on anything but <a> in IE 6.

With floats, you can "float" elements to the top, right, bottom and left. In Firefox and Safari, you can set a border-radius to draw lines that are curved. Before Firefox 3, these lines where terrible looking.

Tables make a lot of sense when you have a grid layout. Use table-layout:fixed if you don't want table cells to be the width of their contents.

For sizing images and other elements, it's usually best to use em for the height and width and relative measurements. You can then use style.fontSize to resize the images. Using this technique is must faster than using JavaScript to set the height and width on an image.

WebKit, the CSS Wonderland. Gavin loves WebKit. It's on Safari (Windows, OS X and iPhone), Android, GNOME and KDE. With WebKit, you can build expanding lists w/o any coding. To do gradients in WebKit, you use:

background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#00abeb));
-webkit-border-radius: 0.24em;

To do animation, you can use:

-webkit-transition-property: width, height;
-webkit-transition-duration: 250ms;
-webkit-transition-timing-function: default;

Another thing you can do with WebKit is rotate images (using -webkit-transform: rotate()) and just about anything (divs, forms, etc.). WebKit also supports SVN masks, which means you can open up a hole and view an image through it.

Gecko's pretty cool too. Firefox 3 introduced a new rendering engine based on Cairo. You can do an SVG transform in Firefox 3 to create reflections of elements (divs) in your page.

"With browsers, you cut people off at the knees, but everyone's the same height." -- Alex Russell

IE 6 is not the problem, we're the problem. If you drop support for IE 6, you won't have to worry about coding towards it. It might not be possible if you work for a large company, but if you're small, you should definitely think about it hard.

It's funny to think that IE 6 is the new Netscape 4.

Gavin's slides from this talk will be available at http://xdraw.org/oscon2008.html in the next few days.

Posted in The Web at Jul 24 2008, 03:30:32 PM MDT 1 Comment

[OSCON 2008] The State of Lightning Talks

From this session's detail page:

As a repeat of the last 2 years, 15 open source project leaders will be given five minute lightning talk slots to bring the audience up to date on their projects.

This year’s speakers and projects include: Brian Aker: Memcached, Glynn Foster: OpenSolaris, OSI: Danese Cooper, MySQL: Monty Widenius, PostgreSQL: Bruce Momjian, GNOME: Dave Neary, Gentoo: Donnie Berkholz, OpenOffice.org: Louis Suarez-Potts, Jabber: Peter Saint-Andre, Mozdev: Brian King, OpenID: Scott Kveton, Open Scrum: James Dixon, and Cliff Schmidt for the Talking Book Project. A couple more projects may be added later.

Each speaker has exactly 5 minutes, and we use various “fun” tools to make sure they stick to their time. The session usually ends with a “zinger” presentation worth staying for.

Unlike the description above, apparently there's 17 projects instead of 15. This session is 95 minutes long (spans 2 normal sessions). I figure this will be the most challenging event for me to blog, so here we go!

OSI (Open Source Initiative), Danese Cooper
Danese has been on the board of OSI since 2001 and will be on the board for another 3 years. This year, they've been asking themselves "What are the ways to make OSI more effective?" The best answer they've come up with is that they should run OSI more like an open source project (with lots of transparency). Minutes are posted publicly on website and they have a public blog. They're also transferring their archives to a searchable system. They'll be using Trac to do more objective tracking of all the issues that've been brought to their attention.

They're also going to establish (formal) membership. They're going to use Apache as a model and allow Charter, Individual, Organizational and have an Annual Members Meeting. ASF currently has 300 members and these folks are in charge of making decisions for the foundation. There's a good chance you'll recognize all the Charter Members of OSI. The names will be announced in the next couple months (I believe). There will be opportunities to be individual or organizational members.

There's new board members this year with an international focus: Nnenna (Africa), Harshad Gune ...honk... out of time.

Open Scrum, James Dixon
James is the founder and Chief Geek at Pentaho. Pentaho recently took their products open source and they're releasing Open Scrum as an agile methodology for managing open source projects. Open Source is not a methodology, it is a set of principles.

Some agile principles are used in open source, but some are not. For instance, trusting developers and face-to-face contact can be difficult with open source projects. Simplicity sometimes comes out of open source projects, but usually only for projects with a large developer base. There's a 45% good fit between Agile and Open Source.

Open Scrum is based on Scrum, but geared towards open source projects. It's simple and flexible and template driven. It scales from single-geek, part-time, single-projects to massively multi-geek full-on and multi-layered undertakings.

MySQL, Monty Widenius
Monty is the Chief Fonder of MySQL and he's talking about what's new in MySQL. There's been no new releases for users, but internally they've been doing lots of bug fixes in 5.1. He expects to have a reasonable GA of 5.1 in 3-5 months. 5.0 will include online backup and optimizer changes for faster joins and sub queries. 5.1 has an InnoDB Plugin.

MySQL was acquired by Sun for $1 billion and 6 months later, life is good. MySQL Backup was announced to be crippleware by MySQL management, but later changed to be open source.

Switched to use Bazaar and Launchpad to increase community participation. Started public bug hunt for MySQL 5.1. Started using case competition for new features in 5.1. There's also a new MySQL forge. Please help MySQL get better by filing bugs!

Maria engine 1.0 and 1.5; now crashsafe and multi-versioned. Transactional part to follow soon.

OpenID, Scott Kveton
Scott is on the board of the OpenID Foundation and his son is on stage with him (with a Twitter shirt on). In terms of adoption, they have a hockey stick graph with the big upturn starting in February 2007. OpenID is only 3 years old and there's over 20,000 sites that now support it. There's about ~500 million OpenIDs (including every AOL, Yahoo, MySpace and LiveJournal user).

OpenID 2.0 was released as final 12/7/2007. What's next: usability (currently sucks), security (PAPE), integration with other protocols, more than just providing, and possibly OpenID 3.0. One of the biggest problems with usability is people just can't remember URLs, so they're trying to figure out a URL -> e-mail mapping.

OpenID Foundation has added 5 corporate board seats and has 7 community board seats and elections are in August. You can get code at openidenabled.com and you can get involved at openid.net.

Gentoo, Donnie Berkholz
Donnie is one of 7 people that's on the council that tries to make sure Gentoo is going in a good direction. In the last year, they've been struggling with community and releasing. Gentoo is just getting old enough where people are quitting and new developers are coming on board. In 2005, they had a lot of voters for their council. 2006 and 2007 were bad years from a community participation standpoint. This year, they've fixed "poisonous people" and participating is back up.

Rather than voting for single candidates, they use a "rank all the candidates" voting system. Community is very important and they've recently kicked out 3 people that didn't think community was important. They released 2008.0 a few weeks ago. It was supposed to be released in February. When they released, they made the front page of Digg, which made Donnie very happy. Gentoo news announcements were way down in 2007, but now they're back up.

Recommended books for community building: Good to Great, The No Asshole Rule, Getting to Yes.

PostgreSQL, Bruce Momjian
Bruce is a PostgreSQL core developer and works for EnterpriseDB. The future for PostgreSQL is going to be a lot different than the past. PostgreSQL's path to the future isn't a straight line. Rather, it's a meandering path like a road up a mountain with switchbacks. People would like a catapult to put features into to get things in, but it's not that easy. It's difficult to improve software that's been around for 20 years.

Companies have very clearly defined goals that usually revolve around money. With open source, it's a lot different. Goals are usually for a feature set, for adoption of open source or for the challenge and fun of it.

PostgreSQL 8.0 was released in January 2005 and had a lot of enterprise features: Win32, Savepoints, Point-In-Time Recovery, Tablespaces. The latest release (8.3 in February) was much different and much more exotic features. In the future, they're going to expand on running queries on multiple CPUs and maintaining their leadership in the open source database space.

Bazaar, Mark Shuttleworth
Mark's interest in distributed version control predates his interest in Ubuntu. If we can elevate our process of version control, we can elevate the entire open source community. Bazaar is a distributed version control system that's developed in Python. It focuses relentlessly on a couple of key values:

  • Cross-platform: Linux, Windows, Mac OS X
  • Performance: sub-second status on > 10,000 files
  • Being adaptive to the way that people want to work (can use it like Subversion if you want or you can have distributed branches or have a team checkout)
  • Extensibility and embeddable - has a plugin system
  • Python Hackable - people can easily modify

Projects that use Bazaar: GNU, MySQL, Twisted and Ubuntu.

Memcached, Alan "Dormando"
Memcached is a very simple project with a mailing list with very simple people on it that run very simple websites. They haven't had a release in 6 months. Memcached was written by a guy named Fitz that wrote it and left. They've only recently created a developer community that's all over the globe. Alan didn't bring any slides, but he did release 1.2.6 RC1 as he was standing on stage. They also hope to release 1.3.1 this week, but there's not a lot of documentation.

People fork Memcached a LOT, mostly because they need a new backend. They've added a new storage engine that's pluggable to hopefully fix the forking problem. Also, their new binary protocol should make it a lot faster for high traffic web sites.

The Talking Bridge Project, Cliff Schmidt
While the network at OSCON has been slow, the folks that live in rural areas around the world have an incredibly slow means of getting information. Their network is often roads that people travel on to communicate with each other.

They've created a Talking Book device that is an MP3 player that costs $5-10. They're also creating kiosks that people in rural areas can interact with to download new information (i.e. podcasts and other educational content). It also has a microphone and can be found at literacybridge.org. They're creating open source projects to help build the device and content around it. They'd love to have open source developers join their projects and help them make access to information easier for rural societies.

Open Source Lab at Oregon State University, Lance Albertson
Lance is a Kansas native and grew up on a farm. He's a Gentoo developer and joined OSL a year ago. OSL was created in 2003 to utilize "extra" unused bandwidth. They provide managed and co-located hosting for open source software projects. They also provide on-the-job learning opportunities for students in system administration and development.

In addition to hosting, they have a development and outreach side. They have 12 student employees that are given developers/sys admins are given real world practical opportunities. Their work is seen and used by many people and students are given extraordinary amounts of responsibility. They're working on a couple external OSS projects: Oregon Virtual School District and One Laptop Per Child.

Outreach wise, they have an Open Source Education Lab and they've been doing Drupal training for OSU employees. They've also helping organize GOSCON, which is an open source conference for governments.

They currently offer hosting for over 70 OSS projects. Services include, email relays, databases, web hosting, file mirroring and code repositories. Notable clients: ASF, Drupal, kernel.org (master), OpenOffice, Freenode, Gentoo Linux & Debian, phpBB and many others. Datacenter currently has 50 racks; they'll be moving to 75 in the near future.

OpenOffice
They've had 150 million downloads and believe there's around 1 million users. There's 350 committers and most of them work from Sun. Presently, their biggest focus is Desktop. In the future, they'll focus on the Web. The idea is that people will want to use OpenOffice from their mobile devices. ODF is a format that can be expressed by any application. OO 3.0 is about extensions, not bloat. They're adding linkage to a free PIM (Outlook replacement). They're also adding better interoperatbility with other suites and formats (e.g., Microsoft Office 2007). They're adding productivity tools and adding toolkits to make things easier for developers. In the next year, they expect to go way beyond 150 million downloads. They also expect to expand greatly internationally.

Mozdev, Brian King
Brian has been in the Mozilla Community since 1999. Mozdev.org is a community site that provides free hosting for Mozilla applications and extensions since 2000. Established as a non-profit organization in 2004. It has over 250 active projects today and there's over 500 developers discussing issues on the [email protected] list.

Services provided: source code hosting, bug tracking (Bugzilla), communication tools (lists, newsgroups, blogs, forums), file management tools, project tagging, wiki, statistics, permissions system and public planning.

They've experienced some grown pains in the last few years, but they're mostly solved now. They've added developer resources to help develop their site, but they need more. Up until Firefox, they were the #1 place to go for Mozilla projects. They're still working on letting people know that they're around and have projects that are interested. They're looking for new avenues for funding.

Moving forward: they'll be add more items to roadmap, making it easier for less technical folks to host and create extensions, solving the funding issue, and developing deeper relationship with Mozilla (MoFo and MoCo). Quite simply, they want to continue with their goal of supporting developers in order to proliferate Mozilla technologies.

Glen Foster, OpenSolaris
Hey - I had a beer with this guy last night at Kells! Rather than focusing on the older Solaris users, they want to move to focus on getting kids to learn and use it. A couple of months ago, they released 200805 and reduced 5 CDs down to a single live CD. The packaging system is now network based. They changes the default shell to bash and changed to GNU tools as they default as well.

They introduced a new site - opensolaris.com. Since Sun released the source code 3 years ago, they've had a long evolution of getting the source out the door. They were using Teamware and doing much of the development behind the door. Early next month, they're moving to Mercurial and they'll be moving all the source outside the firewall. They'll be using Bugzilla as their bug tracking system.

Similar to Gentoo, they've had quite a few people in their community that don't like change. They're working on fixing this and have had good progress. Several years ago, they created a governance system before they had a community. This was a mistake and their new community-driven governance system should work much better.

GNOME, Dave Neary
GNOME is a desktop environment and set of utilities. It's the default on Ubuntu and Fedora. It's the face of Linux on the Desktop. It's also a platform for development. They have a vibrant ISV community that includes Adobe, VMWare and IBM. In addition to desktop, GNOME is also a mobile platform. They also act as a big tent that provides an infrastructure for projects that are part of the GNOME ecosystem.

The most important thing to Dave is the shared vision of universal access to anyone and everyone. Very important things to the GNOME project: usability, internationalization and localization, accessibility (Sun and IBM have done a lot of work). Accessibility is something they've really focused on in the last year. They've created an Outreach Project for Accessibility and have gotten funding from Mozilla, Canonical and Google. Mozilla has done a lot to fund them and help provide accessibility for Rich Internet Applications. To see if a website is accessible, try it in lynx.

Subversion, John Mark Walker
John is the Community Manager for openCollabNet and is not a Subversion developer. Subversion 1.4 was released in September 2006. There was much anticipating for 1.5 and was released last month. The people rejoiced.

What's new in 1.5? Merge tracking: easier to merge changes from trunk to branch and vise versa. You can also do sparse checkouts (replaces -N). Interactive conflict resolution so you can do it from the command line client. It also add changelist support. svn:externals is no longer required to be absolute (sweet!) and you can add peg revisions in your URLs. FSFS repos never change a rev after written to disk. Clients many now perform chained copy/move operations locally. It also supports moving multiple sources for copy and move. Client operations are now significantly more responsive to canceling operations. "resolve" subcommand replaces "resolved" (deprecated). Delete (remove) now takes a --keep-local option.

Now it's time for the fun stuff...

Ken Drachnik had to leave for an emergency and is unable to give his talk on GlassFish. An audience member (Carl Fogel) volunteers to do his presentation. It's very funny, especially since he's not a Java Developer and has never heard of GlassFish. The only thing I got out of this presentation (besides lots of laughs) is that v3 will be released in June 2009.

Drizzle, Brian Aker
Stored procedures, triggers, prepared statements and many other things have been discarded. "One CPU to rule them, and in the query cache, bind them." If you have a query cache turned on in our database, turn it off or delete it.

Drizzle is currently ~420K. The Master Plan is to rethink everything and not assume everything was bad. Also, they can reuse many other libraries w/o writing them from scratch. They don't have to ship every library because many are present on operating systems. In with the new: C99, Posix, package-lib. They're moving to a MicroKernal design and moving code to the edge. No new features will be in core. To add interfaces you have to remove code so there's an equal amount of code.

Multi-Core support: no new locks, remove old locks. Think today (burn memory, messages scales). They can leverage Sun because they can build machines with more cores than anyone else.

Field Types: Less primitives - now there's just one "blob". Removed the 3 byte int and add UUID/IPV4(6). They dumped ACL because we authenticate in clouds. KISS.

You can get involved with Drizzle at http://launchpad.net/drizzle (bzr branch lp:drizzle) and http://launchpad.net/drizzle-discuss (mailing list).

Posted in Open Source at Jul 24 2008, 01:34:08 PM MDT 1 Comment