Direct technical comment from Nokia engineers about the latest app development issues
This is a follow up article to Measuring site performance with JavaScript on mobile, I suggest you read it before you continue. In the previous article I talked about the Navigation Timing spec, here I will talk about the Performance Timeline and Resource Timing specs and how they work in IE10, the first browser to implement them. I created a page that shows some of the data available and a library that generates a HAR that you can later analyse.
There is a lot of talk around responsive Web design being too slow or too resource intensive and that other methodologies can achieve better performance. I don’t want to go into the details of which approach is better because I think different scenarios require different solutions. What is certainly true in all cases is that a Web site or app that loads faster is better than one that is slow. Companies like Google, Gomez and Akamai have all published papers and survey results showing how speed affects user perception of a service from your desktop computer and even more on a mobile device (KISSmetrics has also drawn a nice infographic for the lazy ones). This is the first article and another one will follow shortly. Continue reading
One of the many improvements introduced by HTML5 is around forms, users hate filling forms and developers hate validating the data submitted. HTML5 makes these tasks a lot simpler.
In this article I will not talk about what HTML5 added, but I will rather focus on what is new in IE10 mobile, i.e. the browser that comes with Windows Phone 8. At the end of the article I have collected a few useful links that cover HTML5 forms at large and provide more examples and complete support tables. All the code examples are meant to be cross-browser, unless specified. Continue reading
A few months ago we introduced the ability to distribute files from your project space as releases, allowing owners to upload file releases and mark them as "Featured" to appear in the summary page.
As part of the module there are also a couple of macros that can be used in wiki pages to show a table with a lot of inforamtion about each file. This was very successful, but the tables came by default with a lot of information, sometimes even too much and as a result it did not fit the summary page. Given the wide use across the site we decided to add a couple new macros that allow project members to customise what is displayed.
The first macro is called CustomListDownloads and accepts a list of column names as parameter. The macro will only display the columns that match the list provided and in the order provided. For example typing [[CustomListDownloads(id,file,time,count,author)]] in any wiki page will list all the packages, but only show the ID, filename, date of upload, number of downloads and user. This is how it looks:
The same macro also allows to specify the names of each column, this is for example ideal to for localisation. [[CustomListDownloads(id,file=filename,time=added,count=dls count,author=user who applied)]] will generate this:
We created another macro that works exactly like CustomListDownloads but only shows Featured downloads, it’s called CustomFeaturedDownloads and supports the exact same parameters.
As a final touch we changed the style of the table so that the width would adapt to the page width. This means that you can use these tables in your summary pages and the table will not overlap the information on the right. Of course you should make sure that the number of columns and total width fits the available space.
You can read a brief documentation of the macros in the Projects’ wiki.
PS: we also changed the default order, showing the latest uploaded packages at the top.
Last week we upgraded the codebase of our DiscussionPlugin.The update came with a number of features that we think will be very welcome and on top of those we added our own. Topics flags, better management of subscribers and announcements.
Flags
When I search for something online, finding a discussion topic that is marked as "solved" to me is an immediate win, I will go read that topic as soon as I can. With this update of our discussions we have added the ability to mark topics as solved. Only the author of the topicand the moderators can set this flag.
Moderators can also take advantage of two other flags, locked and sticky. As expected, the former blocks users from writing new replies and the latter sticks the topic to the top of the discussion.
All flags are reflected in the topic title immediately, so that as users browse a discussion can see them.
Manage subscribers
If you are a moderator you will see at the bottom of each board that theforms have changed. Managing existing subscribers is now a select box. Deselect the users you want to remove and click "Save".
Adding users is now super-easy, start typing the username you want to add and the server will suggest name completions, pick the one you want and click "Add". Always remember to press "Save" to confirm. This is a two steps process, but allows you to add some users and remove others inone go, if you want to do so. This should also prevent adding users accidentally.
A little under-the-hood update that we did was also to use usernames instead of direct emails. It turned out some people change their emails and of course it wasn’t very useful to send them notifications to address that don’t exist anymore. Well now that should be sorted. If youstill have problems, unsubscribe and subscribe again.
Announcements
Also, did you notice that all projects have an "Announcements" board? The main difference between this board and all others is that when you write a new topic here it will appear in your project’s summary page. Also, by default only members can write in this board, if you want to change this, visit the admin tab and then "Announcements"; there you canchange rights and also rename the board, for example you might want to have an Italian name such as "Annunci".
Whether you are a member of a project or simply interested in an app, sometimes you want to receive timely notifications about the activity in a project space.
Up until recently it was possible to check the timeline page periodically or for those of us that still use an RSS reader you could subscribe to the timeline’s feed (see the icon in your browser or the link at the bottom of the page). In line with the latest buzzwords and social sites we have now added the ability to "Follow" a project. If you visit the summary page, for example of Podcatcher, you can see this bar with a link to follow or unfollow (i.e. stop following) the project.
As you can see from this image we also show the number of followers.
So what does it mean to follow a project? Well, it means that you will receive an email when something happens, be it a code update, a message in the discussion boards, a Wiki page.
Email notifications are great. Oh no, wait, my inbox is flooded with notifications, friend requests from Facebook, messages from Twitter, Quora, etc. Maybe you want to be alerted as soon as something changes in a project because you are a member, but maybe you want to have weekly updates. That’s fine, we can handle that. Go to your preferences, there’s a tab labelled following. There you can configure how frequently Projects will alert you and you can do it for each project that you follow. Perfect combination of timely alerts and periodic updates, exactly the way you want them.
When we launched Projects we decided to play safe and configured the Web server and access to all repositories over SSL. Some users have expressed interest in Git over SSH, other users have mentioned how SSL is not a requirement to them and would be happy with normal HTTP.
We started working on our server configuration, but decided that we wanted to allow everyone to decide for himself. We configured Projects so that everything is enabled by default, but project owners are free to configure and limit which protocols can be used to access the resources of a project.
So this is how it works, all project Web sites are now accessible both using HTTP and HTTPS. Although the Web server will default to HTTPS, you can simply specify "http://" in front of the URL and switch SSL off. If your network has a proxy, you should see a performance improvement when you don’t use SSL. In general your browser will cache static files such as images, CSS and JavaScript, so you should have a good performance anyway.
Similarly to the Web site, all repositories can now be accessed both via HTTP and HTTPS. If you had issues with Git over HTTPS in the past you can now remove SSL and avoid recompiling your libraries. If you like SSH better, don’t forget to read how to use Git over SSH in Projects. Last but not least, the WebDAV server can now be accessed with or without SSL.
If you are working in the Open Source you probably don’t worry about protecting your files and using HTTP might be a better option than HTTPS. Please note that when authenticating over HTTP, your password will be sent in clear and a man-in-the-middle might still try to steal it.
A project owner can control which protocols are enabled by visiting the Admin tab and then clicking on Protocols. By default they are all enabled. If you are concerned about security, disable HTTP.
This is how it looks in one of my projects, where I have disabled all HTTP access to Git and only allow HTTPS for WebDAV:
As a user you can choose which protocol you want to use when checking out or cloning a repository. To make life easier we changed the source page a little bit. See how now there are two buttons to choose the protocol you want to use. These change based on the repository type and available protocols.
The same applies to the Files section and the WebDAV protocol.
From day one we supported three different repositories in Projects, Git, SVN and Mercurial. All of them worked over HTTPS. A lot of us are used to using Git from the command line and SSH is much more convenient as a protocol and is still very secure. In some cases it also offers better performance.
It took us a little bit to configure properly our servers, proxies and make sure that it was secure. We chose gitosis and although we did not tell anyone we have been testing this for a couple of weeks now and it works GREAT!
If you have Git and SSH you don’t need to do very much, just give us your SSH key and allow a few minutes for our servers to sync and then you are ready to go.
Add your SSH key
On the Projects site, go to My projects (login required, of course).
Click on My projects settings.
Here you have all your preferences specific to Projects. Click on the SSH keys tab.
Enter a description of the key, your SSH key and press save. If there is ay error you will see a message in red and the key will not be save. The key MUST be 2048 bytes and not more than 4096. Make sure you upload you public key.
After a few minutes you will be able to clone your Git repository.
This is a screenshot of me cloning a test repository.
For more information see our updated manual on how to configure Git.
We ran a survey in December and one of the most requested features was to be able to define file releases in your project and provide links to download the latest package directly from the summary page of your project space.
I admit that I was not surprised by the request and in fact we had already started working on it. We used the neat DownloadsPlugin as a base and we integrated it with our system and added a couple of features that we needed.
Defining a new file release is quite easy, go to the admin panel and there is a new menu called Downloads.
The above screenshot is for our QtQuickPlayground and as you can see we have already uploaded a few files.
To add new files all you have to do is fill the form on the right.
You will have to pick the file from your computer and you will have to type an appropriate description. All the other fields are drop-downs and are pre-filled with the information you entered in the appropriate sections via the admin interface. We have defined some defaults that should work for most projects, but you are invited to change them to match your needs. If you don’t want to define any of those fields, all you have to do is go in the appropriate section in the admin menu, for example "Platforms", and remove all entries. You may add them back at any time in the future.
Note that these are all extra parameters to help you and your users to recognise the different releases, the only fields that are required are the file itself and the description.
Featured downloads
The first column on the left is a checkbox, use it to select as many files as you need and below the list of files you can see a drop-down, use it to select the action you want to perform on the selected files. You may mark them as "Featured downloads" or remove them.
Featured downloads are identified in the admin menu with a green tick in the second column. In our case all the uploaded files are featured.
The most important part is, of course, how will your users see the new downloads. We added a new section in the summary page called "Featured downloads" and that will show those files that you have marked as featured. You may also use the new macros that are described in the small guide below the list of files to show a table, try them in your wiki.
This is a screenshot of how the featured downloads appear in QtQuickPlayground, as you can see we shortened the filenames that were too long.
Happy releasing!
It’s been at least a few weeks now since we deployed the improved layout and features for the Files and Discussion board sections in Forum Nokia Projects. We are very excited about them and we think the latest changes add a lot of value to both.
Files now look a lot more in line with the rest of the site, but most of all we have made uploading much easier. You can now select multiple files and upload them all in one go. It is developed in flash because that allowed us to do more things, but if you don’t have flash we "fall back" to the standard HTML file upload so that should work for everyone.
We decided not to go into all the directory management because it involved too much complexity and the UI would have suffered. If you want to organise your files you can still do it by mounting the share on your computer using WebDAV. If you are not familiar with WebDAV I suggest you check out on wikipedia. For Windows users I would recommend BitKinex a free client that is simple to use and very powerful (and has that 90s look that reminds me of Norton commander).
While for the Files it is mostly a restyle with a little addition, for the Discussion boards (or forums) we did quite a few changes. Not only we improved the design but we added a number of small features that you expect from a board. We added the number of views per thread, we added quick links to jump to the last posts and a label to identify threads that have been updated since your last visit.
Last but not least we improved the editor, although it still needs some work.
If you are tired of reading and would rather watch a short (about 2 minutes) video, you can check this out. Yes, we were SO excited about these improvements that we made a video.
