CoderFunda
  • Home
  • About us
    • Contact Us
    • Disclaimer
    • Privacy Policy
    • About us
  • Home
  • Php
  • HTML
  • CSS
  • JavaScript
    • JavaScript
    • Jquery
    • JqueryUI
    • Stock
  • SQL
  • Vue.Js
  • Python
  • Wordpress
  • C++
    • C++
    • C
  • Laravel
    • Laravel
      • Overview
      • Namespaces
      • Middleware
      • Routing
      • Configuration
      • Application Structure
      • Installation
    • Overview
  • DBMS
    • DBMS
      • PL/SQL
      • SQLite
      • MongoDB
      • Cassandra
      • MySQL
      • Oracle
      • CouchDB
      • Neo4j
      • DB2
      • Quiz
    • Overview
  • Entertainment
    • TV Series Update
    • Movie Review
    • Movie Review
  • More
    • Vue. Js
    • Php Question
    • Php Interview Question
    • Laravel Interview Question
    • SQL Interview Question
    • IAS Interview Question
    • PCS Interview Question
    • Technology
    • Other

11 November, 2023

Optimization dots&line game

 Programing Coderfunda     November 11, 2023     No comments   

i just built dots and line game with minimax algorithm where user could play with AI, but unfortunately it is too slow even in just depth 4. so any optimization technique?


here My code,
class Maze {
constructor(gridX, gridY, sideSize) {
this.board = Array.from({ length: gridY }, (a) => a = Array.from({ length: gridX }, (b) => b = Array.from({ length: 4 }, c => c = 0)));
this.visited = [];
this.gap = Math.floor(sideSize / 8);
this.x = gridX;
this.y = gridY;
this.winPointX = 0;
this.winPointY = 0;
this.row = gridX * this.gap;
this.column = gridY * this.gap;
this.sideSize = sideSize;

};
drawGrid(ctx) {
console.log(this.row, this.column)
ctx.clearRect(0, 0, canv.width, canv.height);
for (let x = 0; x < this.row; x += this.x)
for (let y = 0; y < this.column; y += this.y) {

ctx.fillStyle = 'red';
ctx.fillRect(x * this.gap, y * this.gap, this.gap, this.gap);

}

};
ai(depth, alpha, beta, player, advantage, y, x, tile_Y, tile_X) {
if (y !== undefined && x !== undefined) {
let winPoint = this.boxForm(y, x)
if (tile_X > -1 && tile_X < 8 && tile_Y > -1 && tile_Y < 8) {
winPoint = winPoint || this.boxForm(tile_Y, tile_X)
}

if (winPoint && player == 'O') {
player = 'X';

advantage += 10

}
else if (winPoint && player == 'X') {
player = 'O';

advantage -= 10;

// console.log('Human bonus',y,x)
}
}

if (depth === 0) {

return { score: advantage }
}

var pieceArr = [];

for (var i = 0; i < this.board.length; i++) {
for (var j = 0; j < this.board[0].length; j++) {

for (let b = 0; b < 4; b++) {
if (this.board[i][j][b]) {
continue;
};
let tileX = j;
let tileY = i;
let best = {}
this.change(i, j, b)
best.bestmove = [i, j, b];
let neghdir;
if (b == 2) {
neghdir = 0;
tileX++
} else if (b == 0) {
neghdir = 2;
tileX--
} else if (b == 3) {
neghdir = 1;
tileY--
} else {
neghdir = 3;
tileY++
};
if (tileX > -1 && tileX < 8 && tileY > -1 && tileY < 8) {
this.change(tileY, tileX, neghdir);
}
var g = this.ai(depth - 1, alpha, beta, player == 'X' ? 'O' : 'X', advantage, i, j, tileY, tileX);

/* if (tileX>-1&&tileX-1&&tileY alpha) {
alpha = best.score;
}
} else {

if (best.score < beta) {
beta = best.score
}
};
if (tileX > -1 && tileX < 8 && tileY > -1 && tileY < 8) {
this.board[tileY][tileX][neghdir] = 0;
}
this.board[i][j][b] = 0;
pieceArr.push(best)

if (alpha >= beta) {
break;

}

}

}
};
pieceArr.sort((a,b)=>{
return Math.random()-0.5;
})
var bestMove;
if (player === 'X') {
var bestScore = -10000;
for (var i = 0; i < pieceArr.length; i++) {
if (pieceArr[i].score > bestScore) {
bestScore = pieceArr[i].score;
bestMove = i;
}
}
} else {
var bestScore = 10000;
for (var i = 0; i < pieceArr.length; i++) {
if (pieceArr[i].score < bestScore) {
bestScore = pieceArr[i].score;
bestMove = i;
}
}
}
return pieceArr[bestMove];
};
rmSide(side, dir, col) {
let vertex;
if (dir == 'w') {
vertex = [side[0] * this.x, this.y * side[1]];
} else if (dir == 'e') {
vertex = [(side[0] + 1) * this.x, this.y * side[1]];
}
else if (dir == 'n') {
vertex = [this.x * side[1], (side[0]) * this.y];

} else if (dir == 's') {
vertex = [this.x * (side[1] + 1), (side[0]) * this.y];
}
if (!vertex) {
return null
}

let x = vertex[0];

for (let y = vertex[1] + 1; y < vertex[1] + this.y; y++) {

ctx.fillStyle = col;
if (dir == 'n' || dir == 's') {
ctx.fillRect((y) * this.gap, (x) * this.gap, this.gap, this.gap);
} else {
ctx.fillRect((x) * this.gap, (y) * this.gap, this.gap, this.gap);
}

};

}
change(y, x, dir, player) {

this.board[y][x][dir] = 'X';

}
boxForm(y, x) {

for (let i = 0; i < 4; i++) {
if (!this.board[y][x][i]) {
return false
}

};

return true
}
};
//dots and line
const canv = document.getElementById('canv');
const ctx = canv.getContext('2d');
const size = Math.min(window.innerWidth, window.innerHeight) * 0.7;
canv.width = size;
canv.height = size
const sideSize = size / 8;
console.log(sideSize)
let turn = 'X'

const maze = new Maze(8, 8, sideSize);

maze.drawGrid(ctx);
function mve(tileX, tileY, dir, player) {

if (tileX < 8 && tileY > -1 && tileX > -1 && tileY < 8) {

turn = player == 'O' ? 'X' : 'O'

let n = null;
if (dir == 'n') {
n = 3
} else if (dir == 's') {
n = 1
} else if (dir === 'e') {
n = 2
} else {
n = 0
}

/*
let cordX = e.clientX;
let cordY = e.clientY;
let dirCor = {
'n':[65+tileX*(100+20),75+(tileY)*(100+20)],
's':[65+tileX*(100+20),195+(tileY)*(100+20)],
'w':[45+tileX*(100+20),90+(tileY)*(100+20)],
'e':[165+tileX*(100+20),90+(tileY)*(100+20)]

};
console.log(cordX,cordY,dirCor);

// console.log(dirCor['n'][0]&&(dirCor['n'][0]+100)&&dirCor['n'][1]&&(dirCor['n'][0]+15))
if (cordX>=dirCor['n'][0]&&cordX=dirCor['n'][1]&&cordY=dirCor['s'][0]&&cordX=dirCor['s'][1]&&cordY=dirCor['e'][0]&&cordX=dirCor['e'][1]&&cordY=dirCor['w'][0]&&cordX=dirCor['w'][1]&&cordY -1 && tileX < 8 && tileY > -1 && tileY < 8) {
maze.change(tileY, tileX, neghdir);
if (maze.boxForm(tileY, tileX)) {
turn = player;
}
};
if (turn == "O") {
console.log(maze.board)
playAI()
}

}

}
}

function playAI() {

let aimove = maze.ai(4, -Infinity, Infinity, 'X', 0);
let dir1 = undefined;
if (aimove.bestmove[2] == 0) {
dir1 = 'w'
} else if (aimove.bestmove[2] == 1) {
dir1 = 's'
} else if (aimove.bestmove[2] == 2) {
dir1 = 'e'
} else {
dir1 = 'n'
};
console.log(aimove)
mve(aimove.bestmove[1], aimove.bestmove[0], dir1, 'O')

}

canv.addEventListener('click', (e) => {
const rect = canv.getBoundingClientRect()
let tileX = Math.floor((e.clientX - rect.x) / sideSize);
let tileY = Math.floor((e.clientY - rect.y) / sideSize);
let dir = prompt('direction');

mve(tileX, tileY, dir, 'X');

});
  • Share This:  
  •  Facebook
  •  Twitter
  •  Google+
  •  Stumble
  •  Digg
Email ThisBlogThis!Share to XShare to Facebook
Newer Post Older Post Home

0 comments:

Post a Comment

Thanks

Meta

Popular Posts

  • Sitaare Zameen Par Full Movie Review
     Here’s a  complete Vue.js tutorial for beginners to master level , structured in a progressive and simple way. It covers all essential topi...
  • Tailwindcss best practices for responsive design
    Tailwind CSS provides powerful utilities for responsive design out of the box. To use it effectively and maintain clean, scalable code, here...
  • How to Install Magento 2 on Localhost
      How to Install Magento 2 on Localhost 2.4.2 or 2.4.3 or 2.4.4 Today, we'll show you how to use the XAMPP server to install Magento 2.4...
  • Step-by-step Vue.js Tutorial Beginner to Master
    Here’s a complete Vue.js tutorial for beginners to master level , structured in a progressive and simple way. It covers all essential topics...
  • JqueryUI - Droppable
    jQueryUI provides droppable() method to make any DOM element droppable at a specified target (a target for draggable elements). Syntax ...

Categories

  • Ajax (26)
  • Bootstrap (30)
  • DBMS (42)
  • HTML (12)
  • HTML5 (45)
  • JavaScript (10)
  • Jquery (34)
  • Jquery UI (2)
  • JqueryUI (32)
  • Laravel (1017)
  • Laravel Tutorials (23)
  • Laravel-Question (6)
  • Magento (9)
  • Magento 2 (95)
  • MariaDB (1)
  • MySql Tutorial (2)
  • PHP-Interview-Questions (3)
  • Php Question (13)
  • Python (36)
  • RDBMS (13)
  • SQL Tutorial (79)
  • Vue.js Tutorial (69)
  • Wordpress (150)
  • Wordpress Theme (3)
  • codeigniter (108)
  • oops (4)
  • php (853)

Social Media Links

  • Follow on Twitter
  • Like on Facebook
  • Subscribe on Youtube
  • Follow on Instagram

Pages

  • Home
  • Contact Us
  • Privacy Policy
  • About us

Blog Archive

  • July (4)
  • September (100)
  • August (50)
  • July (56)
  • June (46)
  • May (59)
  • April (50)
  • March (60)
  • February (42)
  • January (53)
  • December (58)
  • November (61)
  • October (39)
  • September (36)
  • August (36)
  • July (34)
  • June (34)
  • May (36)
  • April (29)
  • March (82)
  • February (1)
  • January (8)
  • December (14)
  • November (41)
  • October (13)
  • September (5)
  • August (48)
  • July (9)
  • June (6)
  • May (119)
  • April (259)
  • March (122)
  • February (368)
  • January (33)
  • October (2)
  • July (11)
  • June (29)
  • May (25)
  • April (168)
  • March (93)
  • February (60)
  • January (28)
  • December (195)
  • November (24)
  • October (40)
  • September (55)
  • August (6)
  • July (48)
  • May (2)
  • January (2)
  • July (6)
  • June (6)
  • February (17)
  • January (69)
  • December (122)
  • November (56)
  • October (92)
  • September (76)
  • August (6)

Loading...

Laravel News

Loading...

Copyright © CoderFunda | Powered by Blogger
Design by Coderfunda | Blogger Theme by Coderfunda | Distributed By Coderfunda