I am working on a website which loads AngularJS from a CDN, and along with Angular it loads a 284KB map file (angular.min.js.map), which I understand is for debugging.
I don't want to debug, this is going into production, and 284KB is a lot! How do I stop this file from loading?
I can't edit the file (CDN), and it doesn't matter what my Google Chrome options are, I can't advise others to change their settings to use the website I am working on.
Thanks
According to http://blog.teamtreehouse.com/introduction-source-maps
The developer tools will only load this file if support for source maps is enabled and the developer tools are open.
So any impact will only be felt if someone opens their developers tools, which I suspect is acceptable, as in that case ability to debug it more important than download speed/size.
Within Google Chrome's inspector, have you unticked 'Enable JavaScript source maps' in Settings > General?
I think your dev setup is trying to pull the source map file in regardless, for others without this option ticked in Chrome's inspector it won't be a problem.
Don't worry about the source map files for production.
Only if a user has chrome dev tools or other source map compatible browser tools running will they request and download the source map file/s.
Related
When I run Lighthouse for the project I am working on, I get
chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/react_devtools_backend.js
as no1 causer of unused JS.
How is that making sense from a performance optimization perspective?
I can't control what extensions the user runs in his browser.
I also can't find anything about the React dev tools in the project.
Would highly appreciate if someone could shed some light on that issue.
I found the issue is because the file of the devTools is installed when the page is loading... and it is useless in production mode.
So go to the extension and right click on it.
Then go to the manage extensions.
Then find the "Allow this extension to read and change all your data on websites you visit" change it to "on click".
I'm using react with Rx.js library and I get this error in safari, but not the other browsers. Any idea why? Do I need to specify a setting to not look for map or what? Any clues would greatly help.
Appreciate it!
When you have the developer tools active the browser will request source maps. It is configurable in Chrome or Firefox but not in Safari (I actually went back to look for the setting right now and couldn't find it).
If you are in development mode, just copy the source maps to the folder where the minified file is otherwise don't worry about it as regular clients will not get this 404 (unless they are also using developer tools to explore your project).
Ok, somehow I am serving ads in my NodeJS / AngularJS application, but I haven't include this myself.
There's some package or included link sending ads to the client, but the ads are not visible, and the adserve url changes with every request. (The url that can be seen in the screenshot below)
How do I find out which place in my application serves these ads?
PS: I am sure this doesn't come from my local dev pc, my other collegues have this issue as well.
A quick trick may be to search for the url in every files of your repository. If you use a cdn to load your librairies, try to look inside also (you can do that directly in chrome dev tool with ctrl/cmd f in the sources tab).
Hope it will help !
The "adserver" in my project turns out to be a tracking / analytics beacon included by the Realtime.co framework.
Thankfully, the author responded to my email very quickly, and they also provide a beacon-free version of their framework. So problem solved :)
I have a dotnet Selenium web driver app.
When I'm testing the page one of the things I need to confirm is that a flash object on the page has pulled correct content from a content store on my site. (i.e. the flash object should be loading content from /stuff/info.txt and including that content within the animation.)
As a human looking at this I can use the chrome network tab and see that /stuff/info.txt has been accessed.
How can I make Selenium execute a similar watch and see the network requests made by a web browser?
I did not wrote this, neither tested it however someone did it here: http://www.softwareishard.com/blog/firebug/automate-page-load-performance-testing-with-firebug-and-selenium/
Basically all the requests are exported via netexport and firebug plugins inside a HAR (Http ARchive file)
Please give us your feedback if you give it a try!
Cheers !
I assume you want to automate the process which the developer tools of browsers does. Something like firebug but for verification using Code.
I don't believe Selenium has such features. For now, you will not be able to achieve this.
I have an EXTJS app and when I look at the source by using browser's inspect element I can see my entire app's source code (except for the server-side code ofcourse.).
I have seen some extjs apps that when inspecting theie source code, all I can see is the app.html page and non of their .js files is discover able by the browser.
I was wondering how I should configure my EXTJS app to make them not viewable inside the browsers "Sources" tab (ie. Chrome's Inspect Element > Sources).
Any help is much appreciated,
The best you can do is to obfuscate your code, as there is no way to stop someone looking at it once its got to the browser.
Even if the browser could hide it somehow, there is nothing stopping a user sniffing the packets on the network etc.