Chrome Application Development: Overview
Habré has published quite a few articles about creating extensions for Chrome, but the topic of developing Chrome applications (they are Chrome apps) was mentioned much less frequently. Recently, it has become more relevant due to the proliferation of devices on ChromeOS. In addition, the infrastructure for creating applications for Chrome has become more stable and easy to use. In this article I will try to answer the basic questions: why write applications for Chrome at all, how do they differ from extensions, web services, desktop applications, etc., and how they are developed, and what restrictions are imposed on them. If this topic is of interest, the article will continue to address more specific issues.
Continued: Creating a simple Chrome application
The same functionality can be implemented using completely different technologies: you can write a program for Windows, create a web service, a mobile application for Android and / or iOS, etc. What can push the author to make a choice in favor of the application for Chrome?
')
Everyone has seen the Search, Gmail, Google Drive icons in the list of Chrome applications installed by default. If you click on one of them, nothing like the application opens. Instead, the user is simply transferred to the page of the corresponding service.
The fact is that there are two fundamentally different types of applications: hosted app and packaged app. Unfortunately, there are no well-established Russian terms for them. Search, Gmail, etc. - refer to hosted. Such an application consists of a manifest.json file with a URL and security settings, and an icon. In fact, hosted app is a special bookmark for an online service.
Unlike hosted, in the case of the packaged app, all the files necessary for the operation of the application are stored on the user's computer. Such applications, as a rule, can work better offline, can manage their windows, and generally have access to more Chrome programming interfaces.
In the future we will talk about packaged apps.
From the user's point of view, extensions and applications perform completely different functions: an extension changes the way it uses the browser, and the application performs a separate task from the browser. The extension changes the content of the pages and, perhaps, adds a couple of buttons, and the application usually works in its own window.
At the same time, extensions and applications from the inside are very similar. Both are installed from the Chrome Web Store , which are .crx files that are zip archives. The extension / application properties are described in the manifest.json file , and the UI in them is written in HTML5. Many Chrome APIs are available to both extensions and applications.
At the same time, there are significant differences. Applications may use features not available for extensions:
I have already mentioned that from the user's point of view, Chrome applications differ little from ordinary programs. At the same time, from the point of view of the programmer, they are arranged quite differently. Some operations are simpler, some - more difficult.
Many interfaces used by applications are generally accepted standards and are well known to all web developers. For UI, HTML and CSS are used, for working with HTTP, XMLHTTPRequest, etc.
In Chrome, the application synchronizes between application instances on different computers with little or no additional effort. Working with files, like all other interfaces that depend on external resources, is organized asynchronously. On the one hand, this somewhat complicates the code for the corresponding operations, on the other hand, it guarantees the responsiveness of the interface and prevents blocking.
Another Chrome feature is security management. In Chrome, it works differently than in classic operating systems and is more like a security system in Android. To add software interfaces, Chrome developers have always conservatively approached. When developing a system, it is easier to relax security restrictions over time than to make them more stringent. As a result, for example, applications have no unrestricted access to the file system. Mostly, they work with files either belonging to the application or explicitly opened by the user.
The main programming language for Chrome is, of course, JavaScript. But this does not mean that all your code needs to be rewritten on it. There are several solutions that allow you to use code in other programming languages in the Chrome application. Among them:
In conclusion, I will give an example of the application that I myself worked on (and
I work). This is a text editor Text . The code editor is available on github . For the actual editing, the CodeMirror library is used . The application implements work with files, windows, saving settings and other necessary functions.
Continued: Creating a simple Chrome application
What for
The same functionality can be implemented using completely different technologies: you can write a program for Windows, create a web service, a mobile application for Android and / or iOS, etc. What can push the author to make a choice in favor of the application for Chrome?
')
- Work on ChromeOS. At the moment, the Chrome app is the main way to get your program across to Chromebook users. Is it worth it? Chromebooks are still smaller than, say, Windows computers, but the trend is changing. Last year 5 times more Chromebooks were sold in the US than Macbooks
- Chrome apps run on Windows, Linux and OS X without any extra effort. Of course, there are many other ways to make the app portable, but most of them turn out to be noticeably more expensive.
- Recently, it has been possible to port Chrome apps on Android and iOS .
- On most systems, Chrome apps look like normal programs to the user. They start from the Start menu, open normal windows without browser controls, can be used as default programs for opening files, and otherwise behave
as full programs.
Packaged apps and hosted apps
Everyone has seen the Search, Gmail, Google Drive icons in the list of Chrome applications installed by default. If you click on one of them, nothing like the application opens. Instead, the user is simply transferred to the page of the corresponding service.
The fact is that there are two fundamentally different types of applications: hosted app and packaged app. Unfortunately, there are no well-established Russian terms for them. Search, Gmail, etc. - refer to hosted. Such an application consists of a manifest.json file with a URL and security settings, and an icon. In fact, hosted app is a special bookmark for an online service.
Unlike hosted, in the case of the packaged app, all the files necessary for the operation of the application are stored on the user's computer. Such applications, as a rule, can work better offline, can manage their windows, and generally have access to more Chrome programming interfaces.
In the future we will talk about packaged apps.
Applications and Extensions
From the user's point of view, extensions and applications perform completely different functions: an extension changes the way it uses the browser, and the application performs a separate task from the browser. The extension changes the content of the pages and, perhaps, adds a couple of buttons, and the application usually works in its own window.
At the same time, extensions and applications from the inside are very similar. Both are installed from the Chrome Web Store , which are .crx files that are zip archives. The extension / application properties are described in the manifest.json file , and the UI in them is written in HTML5. Many Chrome APIs are available to both extensions and applications.
At the same time, there are significant differences. Applications may use features not available for extensions:
- manage your windows
- work directly with files on the user's computer,
- assigned by the program to open the operating system of certain types of files
- open TCP and UDP connections (this, for example, is used by the SSH client for Chrome ),
- work with USB.
Design features
I have already mentioned that from the user's point of view, Chrome applications differ little from ordinary programs. At the same time, from the point of view of the programmer, they are arranged quite differently. Some operations are simpler, some - more difficult.
Many interfaces used by applications are generally accepted standards and are well known to all web developers. For UI, HTML and CSS are used, for working with HTTP, XMLHTTPRequest, etc.
In Chrome, the application synchronizes between application instances on different computers with little or no additional effort. Working with files, like all other interfaces that depend on external resources, is organized asynchronously. On the one hand, this somewhat complicates the code for the corresponding operations, on the other hand, it guarantees the responsiveness of the interface and prevents blocking.
Another Chrome feature is security management. In Chrome, it works differently than in classic operating systems and is more like a security system in Android. To add software interfaces, Chrome developers have always conservatively approached. When developing a system, it is easier to relax security restrictions over time than to make them more stringent. As a result, for example, applications have no unrestricted access to the file system. Mostly, they work with files either belonging to the application or explicitly opened by the user.
What can be used besides HTML + JavaScript
The main programming language for Chrome is, of course, JavaScript. But this does not mean that all your code needs to be rewritten on it. There are several solutions that allow you to use code in other programming languages in the Chrome application. Among them:
- Native Client. The code is compiled in such a way as to allow both its execution by the processor and verification by the browser. The NaCl code uses to communicate with the outside world a fairly rich set of interfaces Pepper API , including, in particular, work with the file system, OpenGL and sound.
- Emscripten If NaCl doesn't suit you, you can compile your code from C ++ directly into JavaScript. On modern browsers, the resulting JavaScript works only a few times slower than if it were compiled into native code. Of the benefits - compatibility with all interfaces accessible from JavaScript.
Example
In conclusion, I will give an example of the application that I myself worked on (and
I work). This is a text editor Text . The code editor is available on github . For the actual editing, the CodeMirror library is used . The application implements work with files, windows, saving settings and other necessary functions.
Poll
Source: https://habr.com/ru/post/211346/
All Articles