When deploying a Polymer app to production, what's the recommended way to avoid requests for Polymer's source map files? The files platform.js.map and polymer.js.map weigh in at ~800K. Even if those downloads are deferred, surely there is some user impact (e.g., on mobile devices) simply spending bandwidth getting those files, isn't there?
Currently, my deployment process simply skips over the .map files, but when looking at the production site, I still see the browser trying to find them. Those requests fail with a 404, since the files aren't deployed. In theory the 404s shouldn't slow anything down, but it's still distracting to see 404s show up. It makes it look like there's a problem when in fact there isn't.
I could write a Grunt task to strip off the //# sourceMappingURL line from the associated .js files, but I was wondering if anyone has experimented with other means by which to drop the source maps. Or have people found that there is literally no impact on user experience when including those files?
I would consider it a browser bug if any browser loaded source maps when the user isn't using debug tools on the site in question. Are you noticing a significant number of requests to your source maps in your logs?
If you're using Google Chrome Devtools and want the source maps to be ignored, you can go to settings and uncheck the corresponding "Enable Javascript source maps" check box.
Related
I've been experimenting with using Chrome DevTools as my primary authoring tool, and am now mostly using them.
As I continue to increase my usage, I'm running into some pain points.
Usually, when I begin working on a project, I now create a dedicated Chrome profile for it. I do this automatically by invoking Chrome with the --user-data-dir flag and storing the browser profile right within the project.
Then I go into the tools, set up my workspace, map my local directories, and so forth. This works great.
What doesn't work so great is that this is a very repetitive process. I'd love to be able to specify the workspace mappings within the project somehow, and then generate the appropriate profile. I'd also love to be able to set other preferences (like indentation, and various other settings on the DevTools "General" page) in a standard way.
I've thought of three ways this might be possible:
There might be an API for this, but I doubt it, as programmatic manipulation of browser preferences obviously is disfavored (but would someone have carved out an exception for DevTools?),
There might be a way to import/export DevTools preferences, and I might be able to generate the import format,
I might be able to figure out where they're stored in the user directory, and manipulate them myself (so far I haven't, though).
There's also one partial solution I've considered:
I might be able to copy a "template" browser profile to get some of the shared settings above. Then I'd still have to do the workspace mapping each time, but I might be able to get away with not doing the rest.
One really elaborate strategy I could try would be to use browser automation, as suggested in Google Chrome - how can i programmatically enable chrome://flags some of the modules from disable mode to enabled mode? ... but that seems like overkill even as I start using the stuff more heavily; I don't think I'm quite ready to invest that kind of up-front effort in it.
Is anyone familiar enough with how the Chrome DevTools preferences work to judge which strategies might be most promising?
There is no way easily sync DevTools settings. They are stored in localstorage scoped to the DevTools. Which means they are in a special sqlite DB which isn't easy to transfer between machines (plus you'd bring all the other stuff with it.)
Sadly, you are left porting this all around by-hand with each new machine.
I appreciate this question may appear broad. But it is because I am looking anywhere and everywhere for a possible solution to do something very simple.
The goal is from a web page opened in Chrome, to scan the DOM, extract specific elements and save them silently in some way that I can then access.
There is no intention for any of this to be published as an app or extension, it is simply me wanting to access my own rendered browser data and extract and store this data on my own computer. For this reason, I am currently finding Chrome's exhaustive sandboxing security frustrating and irrelevant to say the least.
I have a working Chrome Extension which extracts all of the data I want, has a list of 5 strings that I want to save and that's as far as I have gotten.
I have looked into these areas:
Existing NPAPI Plugins (could not get npapi file io to work).
Creating my own NPAPI Plugin - seems like a huge overhead and learning exercise simply to get external access to 5 strings
Every aspect of Chrome extension (and even App) apis (particularly their localstorage which is not accessible from outside the extension)
Any other thoughts?
I realise there is a solution through creating my own NPAPI plugin but I would like to believe that there is another approach that allows me to link a constructed DOM with my local system. I am open to any other option? (I have considered a Linux purely bash approach but I need to generate the DOM as though it was in my browser).
I just want to be able to access specifically extracted parts of a DOM on my local system, not write an entirely new C++ plugin to facilitate this very basic feature.
I have an HTML5/jquery mobile web app at http://app.bluedot.mobi. It is used for long distance races to track competitors via SPOT satellite tracking. The issue I have not yet resolved is that when loading the app when no data connection exists, the browser throws a "no data connection" alert popup as it is attempting to fetch the manifest during the checking event. Even when a data connection is present, loading the app can take a very long time. There are ~ 500 files to check. The fastest way to load the app (from a phone) is to be in airplane mode and dismiss the browser's alert - not so elegant.
Rather than force an update on users who tend to be in the backcountry with a spotty connection, I want to use applicationCache.update() programmatically, giving the user control over the process and speeding up app load whether on or offline.
Is this currently possible with the HTML5 spec and respective browser implementations?
Sounds like you need the abort() method. Unfortunately it is very new, and it will probably be a while before it is implemented by the majority of mobile browsers.
There are ~ 500 files to check.
It sounds like you're implying that the browser checks each file to see if there's any of them which has changed. This is not correct. The browser only checks the manifest file if that has changed, and that is a simple byte check. If the manifest file has not changed, the browser believes nothing has changed.
So if your application is slow to start, it might be your because your application is complex and there's alot of HTML and Javascript to parse. I would advise you to take a look at the application and see if there's anything you can optimize. In that case, you might want to take a look at Yahoo's Best Practices for Speeding Up Your Web Site page.
For example, I noticed you have a lot of Javascript code in the HEAD section. The beforementioned article advices us to move all Javascript (To the extent of what's possible) to the bottom of the page, so that the browser can start rendering the page as soon as possible. And there's a lot of other sound advice in the article. So take a look, I'm sure you'll find it useful. :-)
Is it possible to access Google Chrome's cache from within an extension?
I'd like to write an extension that loads a cached version of a page when the online one can't be accessed (e.g. Internet connectivity issue).
Updated: I know I could write an NPAPI plugin accessible through an extension to accomplish this but I'd rather not suffer writing one... I am after a solution without resorting to NPAPI, please.
Note: as far as I can tell, Google Chrome doesn't support this functionality (at least not out-of-the-box): I just had an episode of "no Internet access" and I was stranded...
Unfortunately, I'm 99% sure that this is impossible without using an NPAPI in your extension.
Chrome extensions are sandboxed to their own process, and can only access files within the extension's folder.
There is some support for things like chrome://favicon/. But that's about it, at least for now.
Source (Google Chrome Extensions Reference)
P.S. I just had a crazy idea. Extensions only have access to files in their folder... but Chrome stores it's cache in the Cache folder. What you might try is, copy (or move) the Cache folder into a subfolder within the extension. The extension should now be able to access the cache.
Whether this is enough to actually enable offline mode... I don't know. I do see some HTML files (and obviously a lot of images) within my Cache folder, though.
In fact, even without using an extension, I can open up the HTML files in Chrome. And because they're stored on your computer, you should be able to access them even without internet.
P.S. the Cache folder is stored at PATH-TO-CHROME/Default/Cache
P.P.S. there is a way to store an entire webpage and archive it for later use. Check out this extension:
https://chrome.google.com/extensions/detail/mpiodijhokgodhhofbcjdecpffjipkle
Just make a simple plugin manifest that calls an AJAX page which loads jQuery from CDN, and then uses it to parse all the <a> elements on the page and alter the href values to have this prefix: http://webcache.googleusercontent.com/search?q=cache:
So <a href="http://stackoverflow.com/questions/blah"> becomes:
<a href="http://webcache.googleusercontent.com/search?q=cache:http://stackoverflow.com/questions/blah">
Voilà, you are cache surfing, but you still need to get to Google. I understand this answer is a bit outside the scope of the question but still solves a lot of web connectivity issues.
I'm tempted to just go write this plugin but I bet it'd be taboo in Google's eyes, so it'd get blocked or removed rather quickly. :)
I have what seems like a typical usage scenario for users downloading, editing and uploading a document from a web page.
User clicks a link to download a document
User edits downloaded file
User saves the file
User goes back to the web page and uploads the new file with the changes
The problem is that downloaded files are typically saved in a temporary directory, so it can be difficult to find the file after it is saved. The application is for very non-technical users, and I can already imagine the problems with saved files being lost or the wrong versions being uploaded.
Is there a better way? Things I've thought about:
Using Google Docs or something similar.
Problems: forcing users to use new
application with less features,
importing legacy content, setting up
accounts for everyone to edit a
file.
Using WebDAV to serve the files. Not sure how this would work exactly, but seems like it should be possible
Some kind of Flash or Java app that manages downloads and uploads. Not sure if these even exist.
User education :)
If it matters, the files will be mostly Word and Powerpoint documents.
Actually, despite the fact that you have more flexibility with AJAX in developing application, the problem of uploading multiple files is not solved yet.
To the thoughts you've mentioned in your question:
Google Docs:
Online apps like Google docs are certainly appealing for certain use cases. However, if you'd like to upload Word and Powerpoint slides, you don't want the content to be changed once you've uploaded the document. The problem is that Google Docs uses its own data format and therefore changes some of the formats. If you go for an online app, I'd go for a Document Management Solution. I'm sure there are plenty (even free ones) out there; however, I didn't use any on them yet.
WebDAV It is possible and seems to me like the best solution. You can embed WebDav like any directory. Documents are locked until a user releases the document. Unfortunately, you don't have a web front end to manage the files or administer access restrictions.
It
Flash or Java app They do exist, for sure. I'd prefer Flash over Java since Flash Apps still run smoother within a browser. I would definitely not use a rich application, even if it is a Java Web Start app that can be downloaded and opens in a separate window. More and more, users seem to accept browser based web applications. Which brings me to point 4:
User education You can educate them, sure. But in the end you want them to want to use the system. Most often, users get easily used to a tool. However, if they don't like the tool, they're not going to use it.
Clear instructions to save to their desktop is a start. Then clear instructions to go to the desktop to re-up it. I've not run across an online MSWord viewer/editor or whatever format the file is, but I'm sure they exist, now that Google Docs and a few other online versions of MSOffice exist.
I would make sure that there are easy to follow instructions, plus a tutorial somewhere else (perhaps with a video too) to guide users through the process.