Slightly ajar

Some demos to check out Kestrel's new capabilities

Wednesday, September 5, 2007 8:45:03 PM

, , , ,

You may have downloaded Kestrel by now, and glanced at the change log, but you may not have tested out its new capabilities. I don't profess to be a JavaScript expert, so I'll leave that to those of you who know better, but I've cooked up some demos of the new CSS and SVG capabilities along with an article explaining them. That article is now ready, so please go and check it out.

For those of you who want to go straight to the examples (some modified from previous demos on this blog), here they are:

This article and demos have just scratched the surface. There is a lot to look forward to with our new JavaScript engine, improved DOM support, more HTML5 and canvas, and a more complete SVG implementation including partial SVG 1.2 Tiny support, and more. If you've been experimenting with Kestrel and have tried out some of the new features, share your examples and experiences in the comments. Hope you enjoy the article.

Kestrel spreads its wings on test flightShort-sightedness of iPhone only development

Comments

Anonymous Wednesday, September 5, 2007 9:15:59 PM

Anonymous writes: i dont want to sound rude, but what is the EXACT real-life use of these tricks in, lets say, 2yrs timeframe? using them on a production page is a waste, doing something for .5% of a market? until firefox incorporates it, it is a paper, useless stuff. better copy what firefox uses and opera doesnt have, because these things ARE GOING to be used, and opera, as frequent recently, will not work. silverlight casus anyone? opera is no longer a 'major' browser, it is blocked by default. no time for cheap tricks, fix the basis first. on topic: for me, the most important one included in kestrel is overflow-x/y property, funny you havent mention it. and even that was implemented 3 years too late. most pages, that use these were coded to hack opera around (or ignore it, it is easier), and that mindset is deeply coded into webdevs minds. so most likely opera is going to be serverd 'social' version of page. there are few more ooooooold things not included - by design, or by 'design' (like oncontextmenu - yes, i know that opera has its own menu, but well, webdevs can draw another menu side-by-side, or use right click to increment/decrement. and btw, hows are the Tools going? without them, nobody will seriously consider using opera for anything than browsing, and without designers testing in opera, there are MANY things to fail = users leaving = opera leaving the market in disgrace. btw2. killing viewBar killed operaWebDev Toolbar. congrats on sawing of a branch you were sitting on.

AyushAyushJ Wednesday, September 5, 2007 9:32:45 PM

Rounded corners combining SVG and border-radius. Allows rounded corners in Opera, Safari and Firefox, without images or JavaScript.


Try Zooming wink

Anonymous Wednesday, September 5, 2007 9:58:08 PM

Wolf writes: They both fuck up when zooming BUT the iTunes table looks fantastic.

Fredrik Anderssonfred Wednesday, September 5, 2007 10:02:16 PM

Good article and nice demos. smile

David Storeydstorey Wednesday, September 5, 2007 10:42:55 PM

Mr Anonymous:

Firstly, if you read the article, they are a look forward to techniques you'll be able to do in the future, which work in Kestrel today. They are for the most part additional eye candy that degrade in other browsers. They are suppose to showcase the new features in Core-2. However, Opera is more than just a web browser. The engine can be used to render interfaces on devices and applications such as widgets. These device interfaces don't need to work in Firefox or even IE, so they techniques are useful in those context. It is still important that they use standards even in these context, as there is a reuse of skill and the code is more portable. There is also mobile, where we are using the same rendering engine. We are the market leader in this space, and growing rapidly, with more growth than rival more well publicised mobile browsers.

Other browsers will add the standards support to be able to render these examples too. KHTML can already do the selectors stuff, and that will probably be merged into WebKit at some point. The other stuff is also a natural evolution for Firefox and the Safari. I can't answer when they'll be useable in these browsers and IE, as i don't work for those browsers. We are quite happy worrying about our own browser and adding as much standards support and bug fixes as we can.

If we should just copy Firefox, then we'd may as well give up and just use Gecko. We are adding stuff the Gecko supports that are breaking web sites, such as Gecko DOM Range.comparePoint. It would be nice if we didn't have to add none standard features, but unfortunately they get added by other browsers and we do have to support them (which is much harder than supporting a defined standard as there is often no spec and you have to also be bug compatible). But to add Gecko and IE extensions we have to know which ones are the ones that are going to be used first.

We are also working with Microsoft on Silverlight. I've had a number of discussions with them and we've fixed blocking bugs. Different people also work on plug-in support than layout, DOM, ECMAScript etc.

I've also mentioned overflow-x and overflow-y (which were IE extensions until they were added to CSS3) previously. I've even done a demo using it on CSS3.info. I didn't showcase it here as it didn't fit into any of the examples and most developers already know how to use it. They are nothing new.

Tools are not the discussion of this post (check a previous one), but they are going well. We know they are important and we are working on them.


porneL Wednesday, September 5, 2007 11:20:54 PM

@Anon:
Opera has such insignificant market share in US, but in parts of Europe or Scandinavia, they're reaching 10-20% of the market.

And even before these features become popular enough on the Internet, they'll find their use on intranet apps (I'm actually using them already - SVG and advanced selectors make my life much easier!)

Some of that stuff is usable on the net today, because other browers implement some sort of equivalent functionality (IE has CSS+activex filters and VML which can emulate some very basic SVG) or because it degrades nicely (although use of SVG backgrounds will probably be tricky sad)

And someone has to implement these things first. There's always the first "crazy" one to come up with "tricks" before it becomes normal thing when rest follows (or not... and continues doing their Microsoft stuff wink)

I agree on the dev tools though. Especially "error console" is a total embarrassment. And lack of view bar killed my few dev tools indeed!

Steve DarkenDarken Thursday, September 6, 2007 12:55:28 AM

Rounded corners combining SVG and border-radius. Allows rounded corners in Opera, Safari and Firefox, without images or JavaScript.


Nice trick!

WildEnte Thursday, September 6, 2007 2:54:54 AM

david,

in your comments, having a black comment background on a white general background that is framed by some green-greyish sides (I have a color-weakness so it may also be brownish (c;= ) and a super-thin dotted vertical line to the right of the comments and and THEN using white text...

... makes everything flicker before my eyes for 2 minutes after reading your long comment, and my fingers itch for switching to user mode.

Other than that, thanks for the instructive article (c;=

Alexis DeveriaFyrd Thursday, September 6, 2007 12:55:00 PM

Very nice! smile I see that you opted for the safer "fill" option for the SVG rounded corners (which should indeed be useful in many cases), rather than just a stroke/border.

If only SVG allowed something like stoke-position="inside", or margin="3px", then that would work...maybe I should find an SVG forum or something that might have a solution for fitting the stoke inside the box.

Anyway, I like the dynamic Media Queries too, certainly beats messing with javascript to accomplish the same.

Michael Paynehartley231 Thursday, September 6, 2007 3:09:08 PM

Newly updated Google Reader fails to work in Kestral or prior versions of Opera. This is bad. http://googlereader.blogspot.com/2007/09/we-found-it.html

FataL Thursday, September 6, 2007 4:14:15 PM

Some parts of the page become black after you change zoom to anything except 100% in demos which use SVG as background. Don't make another Malevich Black Square bug that was just fixed in 9.5. wink
Also please pay attention to this bugs:
http://rusrestaurant.com/tests/opera-bugs/~first-letter-regression2.html
http://rusrestaurant.com/tests/opera-bugs/~opera9-bug-nifty-numbered-list.html

Anonymous Thursday, September 6, 2007 6:45:12 PM

sid writes: i was the first anonymous poster, sorry, but 9.5 failed captcha test first time and signature wasnt filled after back/forward (nice to have autofill, isnt it?) as for the techniues - until firefox ads them - they are of no use. it is obvious for any experienced designer, not even web designer. web divided into two spheres - basic: ie, and advanced/modern - firefox. opera isnt even mentioned on most new sites, even in 'we dont support it' context. it does not exist as a desktop browser. mobile is another thing, but adding stuff esp for mobile is another sign, that opera is backing from desktop market. it is clear from observer standpoint that desktop does get less attention that mobiles/my.opera. btw. mentioning them as usefull along with widgets in the same sencence, makes me HATE the man who made you make widgets for opera. what a colosal waste of resources. another part is the 'standard' weapon. weapon of the weak i might add. i dont like it, but in reall world standards are defined by the market. and if 99.5% of the market uses some technique, how can it be less standard than some geeky css3 stuff that nobody uses. and btw. in most cases, the gecko dom extensions are BETTER documented than w3c specs. w3c specs are in parts so general and misleading that no wonder, why browser vendors interpret them differently. but the right way in such cases is to follow the crowd. 'i know better' attitide that opera used many time in the past makes it the 'broken' browser even before launch. users really dont care much about what w3c specs say. they care about yahoo mail not working, about google pages not working. google is a lost case, they actively dont want opera to work with their pages, and in some part i understand them, opera attitude sometimes in the past was REALLY frustrating. yahoo, given the recent partnership (that is important to opera only, it is a drop in y! income) should at least try better, but they couldnt care less as it seems. dev tools.. well, yeah, ive read that 'we are working on it' and 'it will be great' stuff severall times now. it reminds me the 'new and groundbreaking feature' that happened to be a speed dial. sorry to say, but i believe you (opera) no longer. until it is relased, there is no way of fixing many, many bugs. of course, companies could hire guys like Hallvord, who are experts (and i mean that, he is awesome), but there arent many guys on that level. most pages are done by medicore, medium skilled developers, in most cases as their first or second IT job, before moving onto something serious. debugging stuff like y! mail without tools for them is impossible. so you get pages done in Web Expression and debugged with Firebug and VStudio2k5/Orcas. "no opera was used in the making of this site". and you expect it to work? and btw - i dont believe to see silverlight supported by Opera anytime soon. MS couldnt care less. sorry. they couldnt care less to relase wmp11 plugin for opera..

_Grey_ Thursday, September 6, 2007 7:05:01 PM

Originally posted by 'sid':

and btw - i dont believe to see silverlight supported by Opera anytime soon. MS couldnt care less. sorry. they couldnt care less to relase wmp11 plugin for opera..


I think you're wrong about that one, MS is imho planning to get a hold on this "new" kind of platform and is therefore trying to get it to work for as many people as possible. Heck, I just even read Novell will bring about a Linux version of it...

Alexis DeveriaFyrd Friday, September 7, 2007 8:43:54 PM

Yay! I solved my problem (scroll to end for link to SVG file). Rounded Borders are now an option.

Anonymous Saturday, September 8, 2007 11:30:31 AM

Anonymous writes: see the testcase in this forum post: http://my.opera.com/SVGraphics/forums/topic.dml?id=203830 you can see how inner borders with svg in css work, and also this example works perfectly with page zoom. cheers

FataL Saturday, September 8, 2007 6:14:49 PM

SVG crasher

Haavardhaavard Thursday, September 13, 2007 10:21:31 AM

Originally posted by Anonymous:

as for the techniues - until firefox ads them - they are of no use.


And if one waits for Firefox to add them instead of staying ahead, one would be criticized of lagging behind smile

adding stuff esp for mobile is another sign, that opera is backing from desktop market. it is clear from observer standpoint that desktop does get less attention that mobiles/my.opera.


Actually, the desktop team at Opera has more people and resources than ever. And we are not pulling out of the desktop market. On the contrary, the dekstop product is very important, both as a way to make money (160% revenue growth in the second quarter of this year for desktop alone), and as a way to get new technologies out there, and used by a large number of people. Desktop users are often the first ones to get their hands on new technologies, and their help in testing and giving us feedback makes our product stronger on other platforms as well. A competitive advantage.

Anyone who claims that we are pulling out of the desktop market is simply not paying attention smile

Write a comment

You must be logged in to write a comment. If you're not a registered member, please sign up.