Automated page load solution for multiple runs using browser - google-chrome
I need to execute up to 1000 runs of a specific URL (and export these data afterwards) to analyse its page load time trend with different network conditions using 2 different browsers (Chrome, Firefox). What's the best solution to automate this process?
Any help here will be greatly appreciated.
I would suggest going for open-source load testing tools like:
JMeter
Locust
Gatling
Grinder
I would recommend Locust which is an easy to use UI based tool.
Hope this helps
I do not know enough about you and what you are capable of doing your self. Your skill set.
Try GTmetrix and WebpageTest. Do you have the skill set to use an API and then compile the results.I had written an app in PHP to get the Webpage test results and then compile the results into human readable form. It's not simple. They returned a huge CVS file with more data than you could ever possibly need. Now they return a JSON result file. With so many more features than when I used them in 2013.
I think WebPageTest is the most comprehensive (they were in 2013) and has a fair amount of desktop and mobile options plus network bandwidths and server locations.
If you do not have the skill set then you need hire someone that knows how to do this type of stuff.
These were the stats I was most interested in:
firstPaint
render
loadTime
fullyLoaded
VisuallyCompleteDT
bytesIn
requests
domElements
DNS_Loookups
Connections
Redirects
But that's the simple stuff. The CSV result had every detail on every HTTP request the page made. And the waterfall.
Back in 2013 when I wrote a WebpageTest app there were 18 Browsers and 38 server locations (shown below).
The choices I copied from my code:
<option value="IE6">IE 6</option>
<option value="IE7">IE 7</option>
<option value="IE8">IE 8</option>
<option selected="" value="IE9">IE 9</option>
<option value="IE10">IE 10</option>
<option value="Chrome">Chrome</option>
<option value="Canary">Canary</option>
<option value="Firefox">Firefox</option>
<option value="FirefoxNightly">Firefox Nightly</option>
<option value="Safari">Safari (Windows)</option>
<option value="dynaTraceIE 7">dynaTrace IE 7</option>
<option value="dynaTraceIE 8">dynaTrace IE 8</option>
<option value="ChromeFrame IE6">Chrome Frame IE6</option>
<option value="Chrome- Replay">Chrome - Replay</option>
<option value="iPhone4 iOS 5.1">iPhone 4 iOS 5.1</option>
<option value="NexusS Android 2.3">Nexus S Android 2.3</option>
And there were 38 server locations:
<option value="Dulles_Thinkpad_VA">Dulles - Thinkpad T430 (IE 10,Chrome,Firefox,Safari)</option>
<option value="Asheville_NC">Asheville, NC USA (IE8,Chrome,Firefox)</option>
<option value="Miami_FL">Miami, FL USA (IE8, Chrome,Firefox)</option>
<option value="Chicago_IL">Chicago, IL USA (IE9-10, Chrome,Firefox)</option>
<option value="KansasCity_MO">Kansas City, MO USA (IE8, Chrome)</option>
<option value="Denver_CO">Denver, Colorado (IE 8, Chrome, Firefox, Safari)</option>
<option value="Phoenix_AZ">Phoenix, AZ (IE 10, Chrome, Firefox)</option>
<option value="Boardman_OR">Boardman, Oregon (IE 9, Chrome, Firefox, Safari)</option>
<option value="SanJose_CA">San Jose, CA USA (IE 9,Chrome,Firefox)</option>
<option value="LosAngeles_CA">Los Angeles, CA USA (IE 7,8,9, Chrome)</option>
<option value="Montreal_Canada">Montreal, Canada (IE 8,Chrome,Firefox)</option>
<option value="Toronto_Canada">Toronto, Canada (IE 8)</option></optgroup><optgroup label="South America"><option value="Argentina">Buenos Aires, Argentina (IE 8,Firefox,Chrome)</option>
<option value="SaoPaulo_BR">São Paulo, Brasil (IE 8,9,Chrome,Firefox)</option></optgroup><optgroup label="Europe"><option value="Dublin_IL">Dublin, Ireland (IE 9,Chrome,Firefox,Safari)</option>
<option value="London_UK">London, UK (IE 7-8)</option>
<option value="Madrid_Telefonica">Madrid, Spain (IE8)</option>
<option value="Paris_FR">Paris, FR (IE 7,8, Chrome)</option>
<option value="Brussels_BE">Brussels, BE (IE 9,Chrome,Firefox,Safari)</option>
<option value="Amsterdam_NL">Amsterdam, NL (IE 7-9, Chrome, Firefox)</option>
<option value="Amsterdam_Godaddy">Amsterdam, NL - Go Daddy (IE 10, Chrome, Firefox)</option>
<option value="Amsterdam_IISpeed_Loc">Amsterdam, NL - IISpeed (IE 10,Chrome,Firefox,Safari)</option>
<option value="Vianen_NL">Vianen, NL (IE 8, Chrome, Firefox)</option>
<option value="Geneva">Geneva, Switzerland (IE 8)</option>
<option value="Frankfurt_DE">Frankfurt, Germany (IE 7-9,Chrome,Firefox)</option>
<option value="Falkenstein_DE">Falkenstein, Germany (IE 9,Chrome,Firefox,Safari)</option>
<option value="Stockholm_SE">Stockholm, Sweden (IE 8,Chrome,Firefox,Safari)</option>
<option value="Romania_EU">Bucharest, Romania (IE 8,Chrome,Firefox)</option>
<option value="Israel">Israel - Efficens (IE 8, Chrome)</option>
<option value="Israel_Petah">Israel - Interhost (IE 10,Chrome,Firefox,Safari)</option>
<option value="Moscow_Loc">Moscow, Russia (IE 8,Chrome,Firefox)</option>
<option value="StPetersburg_Loc">Saint Petersburg, Russia (IE 8,Chrome,Firefox)</option></optgroup><optgroup label="Asia"><option value="Indore_IN">Indore, M.P., India (IE 9,Chrome,Firefox,Safari)</option>
<option value="Delhi">Delhi, India (IE 8,Chrome,Firefox)</option>
<option value="Singapore">Singapore (IE 8, 10, Chrome, Firefox)</option>
<option value="HongKong_CN">Hong Kong, China (IE 8,Chrome,Firefox)</option>
<option value="China_Loc">Jiangsu, China (IE 7,Chrome,Firefox)</option>
<option value="Seoul_Korea">Seoul, Korea (IE 7-8)</option>
<option value="Tokyo_Loc">Tokyo, Japan (IE 9,Chrome,Firefox)</option></optgroup><optgroup label="Oceania"><option value="Sydney_AU">Sydney, Australia (IE 7,9,Chrome,Firefox)</option>
<option value="Wellington_NZ">Wellington, NZ (IE 9,Chrome,Firefox)</option>
<option value="CAM">Cambridge, MA (Android, iOS)</option>
Related
Bug with google Chrome in select
In the last update of Chrome, some HTML instruction was changed that changed the interpretation of the "select" component. Any idea how to fix this? It only happens in this latest version of Chrome (59.0.3071.115). my combo
Here my Code: <select id="SelectTest"> <option value="A">Item A</option> <option value="B">Item B</option> <option value="C">Item C</option> <option value="D">Item D</option> </select> See the difference between my computer and my DEV environment (accessing through Citrix). The two with the same version. Difference in items
JAWS 17 doesn't read aria-label in Select box option in IE
I'm trying to add more usability to my Select box for screen reader users. Right now they have to remember the options to select the right answer. I am using aria-label to provide additional information in the 'option'. It works fine with Firefox and Chrome but not with IE 11 or less. It seems to be okay with Edge. Is there a work around or another option to get it to work in IE 11? Code: <option id="question1_item0">Select</option> <option id="question1_item1" aria-label="1 an actor" >1</option> <option id="question1_item2" aria-label="2 a country" >2</option> <option id="question1_item3" aria-label="3 a color" >3</option> <option id="question1_item4" aria-label="4 a wesite" >4</option> </select>
Label is the name of an input in a form. Not every option in a select. Can you try it like this? <label for="actor">Actor:</label> <select id="actor"> <option label="Select">Select</option> <option label="1">1</option> <option label="2">2</option> <option label="3">3</option> <option label="4">4</option> </select>
Add space between two text inside an options tag
I need to display the following using select/options tag January (1) February (2) March (3) . . . December (12) How to give space between the month and its number? I tried usng nbsp , emsp, ensp , thinsp but the space differs when I open it in Firefox and chrome. The space needs to be equal in both browsers. How can I achieve it? Thanks.
Here are two ways to have the month names and the month numbers line up in two columns, as though they were table columns. <select> <option>--Choose Month--</option> <option value="1">01 (January)</option> <option value="2">02 (February)</option> <option value="3">03 (March)</option> <option value="4">04 (April)</option> <option value="5">05 (May)</option> <option value="6">06 (June)</option> <option value="7">07 (July)</option> <option value="8">08 (August)</option> <option value="9">09 (September)</option> <option value="10">10 (October)</option> <option value="11">11 (November)</option> <option value="12">12 (December)</option> </select> <select style="font-family: monospace"> <option>--Choose Month--</option> <option value="1">January (1)</option> <option value="2">February (2)</option> <option value="3">March (3)</option> <option value="4">April (4)</option> <option value="5">May (5)</option> <option value="6">June (6)</option> <option value="7">July (7)</option> <option value="8">August (8)</option> <option value="9">September (9)</option> <option value="10">October (10)</option> <option value="11">November (11)</option> <option value="12">December (12)</option> </select> The resulting dropdowns look like this, in Chrome, Firefox, IE, Safari & Opera:
If <option>January (1)</option>, containing a normal space, has different spacing in different situations, this is caused by the use of different fonts. The width of a space varies by font. So you would need to set the font of the option element; it is safest to set that font on the select element too, since some browsers don’t let you style option elements directly, only via select. For maximal compatibility, you would need to use a downloadable font with #font-face.
Use & nbsp ; in the tag between month name and number. You can use as many spaces as you want. Remove space between & and nbsp; in the code.
Use & nbsp, use many of it, until satisfied with the result
Combining option values in dropdown list
I'm trying to populate a searchable dropdown list with specific values, but I would like to combine two of the values and have them return results for either value. For example: <td align="left" valign="top" nowrap> <select name="SPORTS" id="idCustom1" onChange="AddSearchItem(this);" class="StuFindSelect"> <option value=" ">No Attribute selected <option value="BASEBALL">Baseball <option value="BASKETBM">Mens Basketball <option value="BASKETBW">Womens Basketball <option value="CHEERLDS">Cheerleader <option value="FOOTBALL">Football <option value="GOLF">Golf <option value="LACROSSW">Womens Lacrosse <option value="SOCCERM">Mens Soccer <option value="SOCCERW">Womens Soccer <option value="TENNISM">Mens Tennis <option value="TENNISW">Womens Tennis <option value="TRACK">Track <option value="VOLLEYBL">Volleyball <option value="XCOUNTM">Mens Cross Country <option value="XCOUNTW">Womens Cross Country </select> </td> I want to combine the results that return BASKETBM or BASKETBW when a user selects Basketball. After researching I've tried combining them in several different ways, <option value="[BASKETBM,BASKETBW]">Basketball <option value="BASKETBM,BASKETBW">Basketball <option value="BASKETBM|BASKETBW">Basketball and every other permutation I could find, but nothing seems to work. Everytime it returns zero search results when testing it. Any ideas what I'm doing wrong? Thanks.
I do not know what AddSearchItem(this); does, as a function, but I'm guessing the problem is there. Maybe you can detail more this part of your question. You can without problem have an option like this: <option value="BASKETBM,BASKETBW">Basketball and use this.value.split(',') to get values out of it.
Creating drop menu navigation with <select>
I've managed to make myself drop menu navigation with html <select>. I've encountered one problem, though. My external links aren't working. Namely Youtube. Here is the code: <select ONCHANGE="location = this.options[this.selectedIndex].value;"> <option value="" selected="selected">Navigation</option> <option value="index.html">Home</option> <option value="detroitvideoproduction.html">Video Production</option> <option value="locationsounddetroit.html">Location Sound</option> <option value="videoeditingdetroit.html">Video Editing</option> <option value="custommotiongraphicsdetroit.html">Custom Graphics</option> <option value="demoreel.html">Demo Reel</option> <option value="http://www.youtube.com/user/VideoDetroitMI?ob=0">You Tube</option> <option value="http://vimeo.com/liveoutloudproductions">Vimeo</option> <option value="dslrrentalsdetroit.html">Camera Rental</option> <option value="lectrosonicsrentalsdetroit.html">Audio Rental</option> <option value="griprentalsdetroit.html">Grip Rental</option> <option value="camerasupportdetroit.html">Camera Support</option> <option value="about.html">About Us</option> <option value="contact.html">Contact</option> </select> As you can see I have 2 external links. One to Vimeo, the other to Youtube. When you select Vimeo it works perfectly fine and takes you to the appropriate vimeo page, but when you select Youtube, it does nothing at all. I know the URL in the link is correct, I checked it before I posted this. Anybody know why Youtube wont work when Vimeo will?
Well you're not going to want to hear this, but it worked fine for me... i copied and pasted the code and tested it with Chrome and it went to your page just fine.
You might want to change onChange with window.location.href=this.value So, the correct code is: <select onChange="window.location.href=this.value"> <option value="" selected="selected">Navigation</option> <option value="index.html">Home</option> <option value="detroitvideoproduction.html">Video Production</option> <option value="locationsounddetroit.html">Location Sound</option> <option value="videoeditingdetroit.html">Video Editing</option> <option value="custommotiongraphicsdetroit.html">Custom Graphics</option> <option value="demoreel.html">Demo Reel</option> <option value="http://www.youtube.com/user/VideoDetroitMI?ob=0">You Tube</option> <option value="http://vimeo.com/liveoutloudproductions">Vimeo</option> <option value="dslrrentalsdetroit.html">Camera Rental</option> <option value="lectrosonicsrentalsdetroit.html">Audio Rental</option> <option value="griprentalsdetroit.html">Grip Rental</option> <option value="camerasupportdetroit.html">Camera Support</option> <option value="about.html">About Us</option> <option value="contact.html">Contact</option> </select>
Some browsers may be objecting to seeing a ? in the string in a select list. Try converting your YouTube URL using TinyURL. I haven't tested, but I'm guessing that will do the trick.