Tuesday, August 8, 2017
Javascript Memory Limit and Usage in Chrome
<script>
// Thank you stackoverflow user B. Gruenbaum
console.log('performance.memory.jsHeapSizeLimit='+performance.memory.jsHeapSizeLimit);
// will give you the JS heap size
console.log('performance.memory.usedJSHeapSize='+performance.memory.usedJSHeapSize);
// how much you're currently using
</script>
Slightly off topic from post title, the following may be an issue in the problem set being thought on in regards to memory limits: JSON object sizes.
In my scenario I had static reference data in CSV format. I converted to JSON files ( e.g. materials.json). Here is standalone PHP script you can place in directory of JSON files and get file sizes and javascript memory info all together.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"></meta>
<meta name="format-detection" ></meta>
<title>JS Memory Size</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<?php
foreach(glob('*.json') as $file) {
print "<script type='text/javascript' src='".$file."' ></script>".PHP_EOL;
}
?>
<script>
$(document).ready(function(){
console.log('performance.memory.jsHeapSizeLimit='+performance.memory.jsHeapSizeLimit);
// will give you the JS heap size
console.log('performance.memory.usedJSHeapSize='+performance.memory.usedJSHeapSize);
// how much you're currently using
$('#jsHeapSizeLimit').text(performance.memory.jsHeapSizeLimit);
$('#usedJSHeapSize').text(performance.memory.usedJSHeapSize);
});
</script>
<style>
td {
align:left;
border:1px dotted #000000;
padding:5px;
}
</style>
</head>
<body>
<h1>JS Memory Size</h1>
<table><tr>
<th>Size</th><th>Info</th>
</tr>
<td id='jsHeapSizeLimit'></td><td>Size Limit</td>
</tr><tr>
<td id='usedJSHeapSize'></td><td>Currently Used</td>
</tr>
<?php
foreach(glob('*.json') as $file) {
print "<tr><td>".filesize($file)."</td><td>".$file."</td></tr>".PHP_EOL;
}
?>
</table>
</body>
</html>
<?php
die();
?>
Tuesday, April 4, 2017
Force use of HTTPS with Javascript
location.protocol=='https:' ? console.log(window.location.href) : replace('https:'+location.hostname+location.pathname);
</script>
Friday, March 17, 2017
See inventory of function in javascript files
(and yes I know there is grep -n 'function' *.js but I like things I can see in browser)
<?php
header("Content-Type:text/plain") ;
$files=glob('*.js');
$searchfor = 'function';
foreach($files as $file) {
print $file.PHP_EOL;
$contents=file_get_contents($file);
$pattern = preg_quote($searchfor, '/');
$pattern = "/^.*$pattern.*\$/m";
if(preg_match_all($pattern, $contents, $matches)){
print count($matches[0])." total functions".PHP_EOL;
print implode("\n", $matches[0]);
}
}
?>
Example out:
main.js
37 total functions
function checkExists(myVar) {
function consoleLogTime(input) {
function debugMsg(input) {
function getQuerystring(key, default_)
function selectCustomer(input) {
function listCreate(arrayValues, arrayText, myClass) {
function optionListCreate(arrayValues, arrayText) {
function validateEmail(x) {
function checkEmailExists(email) {
success: function(result) {
error: function(result) {
function passwordReset(email) {
success: function(result) {
error: function(result) {
function listArray(myArray) {
function getJsonTable(url, table, tag) {
$.getJSON(url+'?table='+table, function(data){
$.each(data, function(index,item) {
$(document).ready(function(){
success: function(result) {
error: function(result) {
$('#signin').click(function() {
$('#signup').click(function() {
$("#passwordReset").click(function() {
$("#emailB").blur(function() {
$('.mytype').click(function() {
$("#passwordconfirmB").keyup(function() {
$("#passwordconfirmB").blur(function() {
$("#workorder").ready(function() {
$("select").ready(function() {
$("#bids").change(function() {
$("#about").click(function() {
$('.submit').click(function() {
success: function(result) {
error: function(result) {
$("#selectacustomer").click(function() {
$(".customerSelect").click(function() {
Monday, January 9, 2017
Javascript misterClean string cleaner
function misterClean(x) {
x = x.replace(/^\s+|\s+$/gm,''); // remove end whitespace
x = x.replace(/(\r\n|\n|\r)/gm,""); // remove line breaks
return x;
}
Tuesday, April 5, 2016
Make Sure Element is Visible and Displayed : Javascript
function makeVisible(id) {
if($('#'+id).css('display') == 'none') {
$('#'+id).css('display','block');
}
if($('#'+id).css('visibility') == 'hidden') {
$('#'+id).css('visibility','visible');
}
console.log('makeVisible visibility '+$('#'+id).css('visibility'));
console.log('makeVisible display '+$('#'+id).css('display'));
}
function testPreviewImage() {
makeVisible('Preview_Div');
makeVisible('Preview_Image');
$('#Preview_Div').zIndex(16777261);
$('#Preview_Image').zIndex(16777271);
}
Tuesday, December 22, 2015
Smooth expansion of DIV with jQuery
var bigWidth=800;
$("#map").width() == bigWidth ?
$("#map").fadeOut(300).fadeIn(300).fadeOut(300).fadeIn(300).animate({ height: 400, width: 400 }) :
$("#map").fadeOut(300).fadeIn(300).fadeOut(300).fadeIn(300).animate({ height: 400, width: 800 });
Tuesday, December 15, 2015
Javascript padding
function pad(str, character, max, side, visibility) {
str = str.toString();
console.log('inside pad: '+str);
var pad;
var output;
pad='';
for (var i=str.length;i<max;i++ ) {
pad = pad + character;
}
pad="<span style='visibility:"+ visibility + "'>" + pad + "</span>";
side=='left'? output=pad+str : output=str+pad ;
return output;
}
input=$('#serialnumber').text();
$('#serialnumber').html( pad( input, 'F', 16, 'right', 'hidden') );
Friday, October 30, 2015
Javascript: If undefined or null or string length equals zero return false
function checkExists(myVar) {
if (typeof myVar === 'undefined') { return false; }
if ( myVar === null ) { return false; }
if ( myVar.length == 0) { return false; }
return true;
}
Friday, July 17, 2015
Class.each with ajax for each
$('.routeInfo').each(function(){
//
fid = $(this).attr("fid");
id = $(this).attr("id");
uniqueID = $(this).attr("uniqueID");
$.ajax({
url: '/route.php',
type: 'GET',
data: { fid: fid , user: 'fred' } ,
success: function (response ) {
if(response.length > 5) {
$("#" + id).html('ROUTE STATUS: '+response);
} else {
$("#" + id).html('ROUTE STATUS: Not Routed');
}
},
error: function () { console.log('ajax error'); }
});
});
Thursday, July 16, 2015
Button click animation
$("button").click(function(){
this.animate({ opacity: '0.1'}, "slow" );
this.animate({ opacity: '1.0'}, "fast");
});
Tuesday, February 10, 2015
Javascript Element Diagnostic Function
function elementResearch(elementType, searchVal) {
// e.g. elementType = 'input'
console.log(" elementResearch begin in element type " + elementType);
$('body').find(elementType).each(
function(unusedIndex, child) {
if(child.value==searchVal && searchVal!='') {
console.log("___ELEMENTRESEARCH FOUND THE VALUE YOU ARE TESTING!!!___");
console.log("the child.name you are wanting is: " + child.name);
$(child).each(function() {
$.each(child.attributes, function() {
if(this.value!='hidden') {
console.log( elementType + " || attribute name:" + this.name + " || attribute value:" +this.value);
}
}); // each attr
}); // each child
} // if big match
if(searchVal=='') {
$(child).each(function() {
$.each(child.attributes, function() {
console.log( elementType + " || attribute name:" + this.name + " || attribute value:" +this.value);
}); // each attr
}); // each child
} // if searchVal==""
}); // each input
} // function
elementResearch('input', 'TEST');
Wednesday, December 17, 2014
Javascript jQuery Scroll Event Listener Print Scroll Position to Console Log
$(window).scroll(function (event) {
var scroll = $(window).scrollTop();
console.log(scroll);
});
Save scroll position for reload or ajax call for new content
var scroll = 0; scroll = $(window).scrollTop(); console.log(scroll); location.reload(); $(window).scrollTop(scroll);
Thursday, December 4, 2014
Iterating over all cookies and local storage
console.log('COOKIES LIST BEGIN');
var theCookies = document.cookie.split(';');
for (var i = 1 ; i <= theCookies.length; i++) {
console.log(theCookies[i-1]);
}
console.log('COOKIES LIST END');
console.log('localStorage LIST BEGIN');
for(var i in localStorage) {
console.log(localStorage[i]);
}
for(var i=0, len=localStorage.length; i " + value);
if(key == 'GetSystemStatus') {
var bill = value.search(/ bill=\"8\" /);
console.log(bill);
bill != -1 ? console.log('did NOT find') : console.log('found it'); }
}
}
Wednesday, November 12, 2014
jQuery. Get ID of each element in a class using .each
$('.myClassName').each(function() {
console.log( this.id );
});
Thursday, September 4, 2014
Javascript counter and location.reload
var interval = "";
var incrementVar = 0;
function increment(){
incrementVar++;
console.log(incrementVar);
if(incrementVar>30) {
location.reload();
window.clearInterval(interval);
incrementVar = 0;
}
}
$(document).ready(function(){
interval = setInterval( increment, 1000);
})
Friday, October 18, 2013
Validate email with jQuery and my own hack
// validate email function, after function other code relative to its use
//
function validateEmail(x)
{
var tld="";
console.log(x);
var splitAt = x.split("@");
if(!splitAt[1]) {return false;}
var username = splitAt[0];
var domainTLD = splitAt[1].split(".");
var domain=domainTLD[0];
for(var i=1;i<5;i++) {
if(domainTLD[i]) { console.log(i +" "+ domainTLD[i]); tld=domainTLD[i] ;}
}
var usernameLength = username.length;
var domainLength = domain.length;
var tldLength = tld.length;
msg=username;
console.log(msg);
msg=domain;
console.log(msg);
msg=tld;
console.log(msg);
msg=usernameLength;
console.log(msg);
msg=domainLength;
console.log(msg);
msg=tldLength;
console.log(msg);
if ( tldLength < 3 || tldLength > 3 || domainLength < 2 || usernameLength < 1 || /\d/.test(tld) )
{
console.log(x + " not a valid e-mail address");
return false;
}
else {
return true;
}
}
// just some vars not pertinent to email validation
var timedFade = 1000;
var msg="";
// document ready code block below
$(document).ready(function(){
msg="document.ready"; console.log(msg); msg="";
$( "#email" ).blur(function() {
var email=$( "#email" ).val();
console.log(email);
if (validateEmail(email)) {
console.log("good email");
$("#email-status-message").text("");
$("#email-status-message").fadeOut(timedFade);
}
else {
console.log("bad email");
$("#email-status-message").text("please enter valid email");
$("#email-status-message").fadeIn(timedFade);
}
});
})
Saturday, July 14, 2012
Javascript Object Detection
| Scheme | Detects | ||||||||
|---|---|---|---|---|---|---|---|---|---|
| document.getElementById | Firefox1+, IE5+, Opera7+, Safari, and most modern browsers in general. | ||||||||
| window.getComputedStyle | Firefox1+ and Opera 8+, and Safari 2+ | ||||||||
| window.globalStorage | Firefox2+ | ||||||||
| window.globalStorage && window.postMessage | Firefox3+ | ||||||||
| document.getElementsByClassName | Firefox3+ and Opera 9.5+, and Safari 3+ | ||||||||
| document.querySelector | Firefox3.5+, IE8+ (in standards compliant mode only), Opera9.5+, and Safari 3+ | ||||||||
| document.all | IE4+ | ||||||||
| window.attachEvent | IE5+ | ||||||||
| window.createPopup | IE5.5+ | ||||||||
| document.compatMode && document.all | IE6+ | ||||||||
| window.XMLHttpRequest | IE7+, Firefox1+, and Opera8+ | ||||||||
| window.XMLHttpRequest && document.all or: document.documentElement && typeof document.documentElement.style.maxHeight!="undefined" |
IE7+ Note: First scheme will fail if visitor explicitly disables native xmlHTTPRequest support (under Toolbar-> Internet Options-> Advanced). The second one will not. |
||||||||
| XDomainRequest | IE8+ | ||||||||
| document.documentMode | IE8+ (detects IE8 in a specific document mode,
such as standards complaint). Because IE8 can render a page in various
different modes depending on the page's doctype plus the presence of
certain HTML elements,
This means that even though the user is using IE8 or IE9, for
example, if a webpage is missing a
valid doctype,
|
||||||||
| XDomainRequest && window.msPerformance | IE9+
|
||||||||
| window.opera | Opera (any version) |
* Since Opera by default also identifies itself as IE (apart from Opera), with support for many of IE's proprietary objects, the IE detection schemes above will also return true for Opera. Use "window.opera" in combination to filter out Opera browsers.
if (document.documentElement && typeof document.documentElement.style.maxHeight!="undefined")
alert("You're using IE7")
The following detects a page using IE8 standards compliant mode:
if (document.documentMode==8)
alert("IE8 standards mode")
Sunday, July 1, 2012
Music Frequencies as Javascript Variables
<script type="text/javascript" >
var notes = [
['C' , '16.35'] ,
['C#' , '17.32'] ,
['D' , '18.35'] ,
['Eb' , '19.45'] ,
['E' , '20.60'] ,
['F' , '21.83'] ,
['F#' , '23.12'] ,
['G' , '24.50'] ,
['G#' , '25.96'] ,
['A' , '27.50'] ,
['Bb' , '29.14'] ,
['B' , '30.87'] ,
['C' , '32.70'] ,
['C#' , '34.65'] ,
['D' , '36.71'] ,
['Eb' , '38.89'] ,
['E' , '41.20'] ,
['F' , '43.65'] ,
['F#' , '46.25'] ,
['G' , '49.00'] ,
['G#' , '51.91'] ,
['A' , '55.00'] ,
['Bb' , '58.27'] ,
['B' , '61.74'] ,
['C' , '65.41'] ,
['C#' , '69.30'] ,
['D' , '73.42'] ,
['Eb' , '77.78'] ,
['E' , '82.41'] ,
['F' , '87.31'] ,
['F#' , '92.50'] ,
['G' , '98.00'] ,
['G#' , '103.8'] ,
['A' , '110.0'] ,
['Bb' , '116.5'] ,
['B' , '123.5'] ,
['C' , '130.8'] ,
['C#' , '138.6'] ,
['D' , '146.8'] ,
['Eb' , '155.6'] ,
['E' , '164.8'] ,
['F' , '174.6'] ,
['F#' , '185.0'] ,
['G' , '196.0'] ,
['G#' , '207.7'] ,
['A' , '220.00'] ,
['Bb' , '233.1'] ,
['B' , '246.9'] ,
['C' , '261.6'] ,
['C#' , '277.2'] ,
['D' , '293.7'] ,
['Eb' , '311.1'] ,
['E' , '329.6'] ,
['F' , '349.2'] ,
['F#' , '370.0'] ,
['G' , '392.0'] ,
['G#' , '415.3'] ,
['A' , '440.0'] ,
['Bb' , '466.2'] ,
['B' , '493.9'] ,
['C' , '523.3'] ,
['C#' , '554.4'] ,
['D' , '587.3'] ,
['Eb' , '622.3'] ,
['E' , '659.3'] ,
['F' , '698.5'] ,
['F#' , '740.0'] ,
['G' , '784.0'] ,
['G#' , '830.6'] ,
['A' , '880.0'] ,
['Bb' , '932.3'] ,
['B' , '987.8'] ,
['C' , '1047'] ,
['C#' , '1109'] ,
['D' , '1175'] ,
['Eb' , '1245'] ,
['E' , '1319'] ,
['F' , '1397'] ,
['F#' , '1480'] ,
['G' , '1568'] ,
['G#' , '1661'] ,
['A' , '1760'] ,
['Bb' , '1865'] ,
['B' , '1976'] ,
['C' , '2093'] ,
['C#' , '2217'] ,
['D' , '2349'] ,
['Eb' , '2489'] ,
['E' , '2637'] ,
['F' , '2794'] ,
['F#' , '2960'] ,
['G' , '3136'] ,
['G#' , '3322'] ,
['A' , '3520'] ,
['Bb' , '3729'] ,
['B' , '3951'] ,
['C' , '4186'] ,
['C#' , '4435'] ,
['D' , '4699'] ,
['Eb' , '4978'] ,
['E' , '5274'] ,
['F' , '5588'] ,
['F#' , '5920'] ,
['G' , '6272'] ,
['G#' , '6645'] ,
['A' , '7040'] ,
['Bb' , '7459'] ,
['B' , '7902']
] ;
</script>
Monday, May 14, 2012
Walk DOM and report ID's and Parents
function walkReport() {
$("body").find("*").andSelf().each(function() {
var parent = $(this).parent().attr("id");
console.log(this.nodeName+" "+this.id+" and my parent is "+parent);
});
}
Saturday, November 21, 2009
Javascript Popup
<script type="text/javascript">
var theURL = '/global_files/sending.php'
var width = 200;
var height = 50;
function popWindow() {
newWindow = window.open(theURL,'newWindow','toolbar=no,menubar=no,left=200,top=300,resizable=no,scrollbars=no,status=no,location=no,width='+width+',height='+height);
}
</script>
/global_files/sending.php:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<META NAME="Author" CONTENT="Lance Miller, this.is.lance.miller@gmail.com">
<title>
Sending
</title>
<style type="text/css" media="all">
@import url("<?php echo ${css_remote}; ?>");
</style>
<style type="text/css">
body {
background:#CCCCCC;
color:#000000;
}
</style>
<script type="text/javascript">
var howLong = 3000;
t = null;
function closeMe(){
t = setTimeout("self.close()",howLong);
}
window.onload=function() {
closeMe()
self.focus()
}
</script>
</head>
<body>
sending please wait...
</body>
</html>